/* EyeballMonitor homepage placement for the reusable Orbit core. */
.hero--orbit{
  padding:34px 0 30px;
  overflow:clip;
}

.hero-orbit-container{
  max-width:1680px;
  padding-inline:clamp(18px,3vw,54px);
}

.hero-orbit-grid{
  display:grid;
  grid-template-columns:minmax(350px,1.02fr) minmax(500px,1.18fr) minmax(330px,.9fr);
  grid-template-areas:
    "copy menu panel"
    "earth earth earth";
  gap:clamp(12px,1.5vw,24px);
  align-items:center;
}

.hero-orbit-copy,
.hero-orbit-menu,
.hero-orbit-panel{ min-width:0; }

.hero-orbit-copy{ grid-area:copy;position:relative;z-index:2; }
.hero-orbit-menu{ grid-area:menu;position:relative;z-index:3; }
.hero-orbit-panel{ grid-area:panel;position:relative;z-index:2; }

.hero-orbit-copy h1{
  font-size:clamp(40px,3.35vw,58px);
  line-height:1.01;
}

.hero-orbit-copy .lead{
  font-size:clamp(14px,1.05vw,16px);
  max-width:56ch;
}

.hero-orbit-copy .chip-row{
  flex-direction:column;
  align-items:flex-start;
}

.hero-orbit-menu{
  display:grid;
  place-items:center;
  align-self:center;
}

.hero-orbit-earth{
  grid-area:earth;
  position:relative;
  z-index:1;
  width:min(100%,1180px);
  margin:-300px auto 0;
  justify-self:center;
  pointer-events:none;
  user-select:none;
}

.hero-orbit-earth::before{
  content:"";
  position:absolute;
  inset:16% 10% 7%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(23,241,134,.07),rgba(12,115,91,.025) 48%,transparent 72%);
  filter:blur(40px);
}

.hero-orbit-earth img{
  position:relative;
  display:block;
  width:100%;
  height:auto;
  opacity:.48;
  filter:saturate(.72) brightness(.64) contrast(1.04) drop-shadow(0 0 26px rgba(20,240,142,.06));
  transform:translateZ(0);
  animation:hero-earth-drift 14s ease-in-out infinite alternate;
}

@keyframes hero-earth-drift{
  from{ transform:translate3d(0,0,0) scale(.995); }
  to{ transform:translate3d(0,-8px,0) scale(1); }
}

.hero-orbit-menu .fs-orbit--variant-home{
  --orbit-size:560px;
  --orbit-radius:208px;
  --orbit-button-size:102px;
  --orbit-core-size:172px;
  width:min(100%,590px);
}

.hero-orbit-menu .fs-orbit--variant-home .fs-orbit__copy strong{ font-size:12px; }
.hero-orbit-menu .fs-orbit--variant-home .fs-orbit__copy small{ font-size:8px;max-width:86px; }
.hero-orbit-menu .fs-orbit--variant-home .fs-orbit__icon{ width:29px;height:29px; }

.hero-orbit-menu .fs-orbit--variant-home .fs-orbit__hint{ display:none; }

.hero-orbit-menu .fs-orbit--variant-home.fs-orbit--enhanced .fs-orbit__stage::before{
  content:"Click the eye to open the menu";
  position:absolute;
  left:50%;
  top:calc(50% + (var(--orbit-core-size) / 2) + 12px);
  z-index:7;
  width:max-content;
  max-width:calc(100% - 20px);
  color:var(--orbit-accent-bright);
  font:600 11px/1 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.55px;
  white-space:nowrap;
  opacity:.28;
  pointer-events:none;
  transform:translateX(-50%);
  filter:drop-shadow(0 0 6px color-mix(in srgb,var(--orbit-glow) 40%,transparent));
  transition:opacity 160ms ease,transform 220ms ease;
}

html[lang^="bg"] .hero-orbit-menu .fs-orbit--variant-home.fs-orbit--enhanced .fs-orbit__stage::before{
  content:"Кликнете върху окото за менюто";
}

.hero-orbit-menu .fs-orbit--variant-home.fs-orbit--enhanced.is-open .fs-orbit__stage::before{
  opacity:0;
  transform:translate(-50%,4px);
}

.hero-card.hero-orbit-panel{ padding:14px; }
.hero-card.hero-orbit-panel .hero-card-inner{ padding:13px; }

@media (max-width:1399px) and (min-width:1241px){
  .hero-orbit-grid{
    grid-template-columns:minmax(335px,1fr) minmax(455px,1.08fr) minmax(310px,.86fr);
  }
  .hero-orbit-menu .fs-orbit--variant-home{
    --orbit-size:510px;
    --orbit-radius:188px;
    --orbit-button-size:94px;
    --orbit-core-size:158px;
    width:min(100%,530px);
  }
}

@media (max-width:1240px) and (min-width:981px){
  .hero-orbit-grid{
    grid-template-columns:minmax(0,1fr) minmax(460px,1.08fr);
    grid-template-areas:
      "copy menu"
      "earth earth"
      "panel panel";
    align-items:center;
  }
  .hero-orbit-panel{
    width:min(100%,860px);
    margin:2px auto 0;
  }
  .hero-orbit-earth{ width:min(100%,960px);margin-top:-142px; }
  .hero-orbit-menu .fs-orbit--variant-home{
    --orbit-size:500px;
    --orbit-radius:184px;
    --orbit-button-size:92px;
    --orbit-core-size:156px;
    width:min(100%,520px);
  }
}

@media (max-width:980px){
  .hero--orbit{ padding-top:28px; }
  .hero-orbit-grid{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "copy"
      "menu"
      "earth"
      "panel";
    gap:24px;
    width:100%;
    min-width:0;
  }
  .hero-orbit-copy{
    width:100%;
    max-width:min(760px,100%);
    margin-inline:auto;
    text-align:center;
  }
  .hero-orbit-copy h1,
  .hero-orbit-copy .lead,
  .hero-orbit-copy .tiny{
    max-width:100%;
    overflow-wrap:anywhere;
  }
  .hero-orbit-copy .lead{ margin-inline:auto; }
  .hero-orbit-copy .chip-row{
    width:100%;
    min-width:0;
    align-items:center;
  }
  .hero-orbit-copy .chip{
    min-width:0;
    max-width:100%;
    white-space:normal;
  }
  .hero-orbit-copy .chip > span:last-child{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .hero-orbit-copy .cta-row{
    width:100%;
    min-width:0;
    justify-content:center;
  }
  .hero-orbit-copy .pill{ justify-content:center; }
  .hero-orbit-menu{ width:100%; }
  .hero-orbit-menu .fs-orbit--variant-home{
    --orbit-size:600px;
    --orbit-radius:218px;
    --orbit-button-size:102px;
    --orbit-core-size:168px;
    width:min(100%,620px);
  }
  .hero-orbit-earth{ width:min(100%,760px);margin-top:-112px; }
  .hero-orbit-panel{ width:min(100%,760px);margin-inline:auto; }
}

@media (max-width:640px){
  .hero-orbit-container{ padding-inline:12px; }
  .hero-orbit-copy h1{ font-size:clamp(35px,11vw,46px); }
  .hero-orbit-copy .chip{ text-align:left; }
  .hero-orbit-copy .cta-row > .btn{
    max-width:100%;
    white-space:normal;
    text-align:center;
  }
  .hero-orbit-copy .tiny{ line-height:1.55; }
  .hero-orbit-menu .fs-orbit--variant-home{
    --orbit-core-size:158px;
    width:100%;
  }
  .hero-orbit-menu .fs-orbit--variant-home.fs-orbit--enhanced .fs-orbit__stage::before{
    top:calc(94px + (var(--orbit-core-size) / 2) + 10px);
    font-size:9px;
    letter-spacing:.3px;
  }
  .hero-orbit-earth{ width:100%;margin-top:-70px; }
}

@media (prefers-reduced-motion:reduce){
  .hero--orbit{ scroll-behavior:auto; }
  .hero-orbit-earth img{ animation:none; }
}
