/* =========================================================
   V60 — Väikeveeb homepage decoration + motion layer
   Lightweight, transform/opacity based, no canvas.
   ========================================================= */

.v60-home{
  --v60-blue:#3562ff;
  --v60-blue-soft:#8ea7ff;
  --v60-ink:#070b14;
  --v60-light:#f5f7fb;
  --v60-pointer-x:50%;
  --v60-pointer-y:35%;
}

.v60-home main{
  overflow:clip;
}

.v60-home .section,
.v60-home .hero,
.v60-home .marquee-strip,
.v60-home footer{
  position:relative;
  isolation:isolate;
}

/* ---------- global scroll progress ---------- */
.v60-scroll-progress{
  position:fixed;
  z-index:9999;
  top:0;
  left:0;
  width:100%;
  height:2px;
  pointer-events:none;
}
.v60-scroll-progress span{
  display:block;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,#3562ff,#84a0ff);
  transform-origin:left center;
  transform:scaleX(var(--v60-scroll,0));
  box-shadow:0 0 18px rgba(53,98,255,.45);
}

/* ---------- header ---------- */
.v60-home .site-header{
  transition:background .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.v60-home.v60-scrolled .site-header{
  box-shadow:0 12px 38px rgba(0,0,0,.12);
}
.v60-home .desktop-nav a,
.v60-home .header-right a{
  position:relative;
}
.v60-home .desktop-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-7px;
  height:1px;
  background:currentColor;
  opacity:.65;
  transition:right .26s cubic-bezier(.2,.7,.2,1);
}
.v60-home .desktop-nav a:hover::after{
  right:0;
}

/* ---------- section headings ---------- */
.v60-home .section-heading,
.v60-home .pricing-title-block{
  position:relative;
}
.v60-home .section-heading::after,
.v60-home .pricing-title-block::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-25px;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,currentColor 0 12%,rgba(127,142,169,.16) 12% 100%);
  opacity:.32;
  transform:scaleX(.3);
  transform-origin:left;
  transition:transform .9s cubic-bezier(.16,1,.3,1);
}
.v60-home .v60-in.section-heading::after,
.v60-home .v60-in.pricing-title-block::after{
  transform:scaleX(1);
}
.v60-home .section-label{
  position:relative;
  padding-left:19px;
}
.v60-home .section-label::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:7px;
  height:7px;
  border:1px solid currentColor;
  transform:translateY(-50%) rotate(45deg);
  opacity:.75;
  animation:v60-label-pulse 3.4s ease-in-out infinite;
}
@keyframes v60-label-pulse{
  0%,100%{transform:translateY(-50%) rotate(45deg) scale(.82);opacity:.4}
  50%{transform:translateY(-50%) rotate(45deg) scale(1.12);opacity:1}
}

/* ---------- HERO: precision / studio grid ---------- */
.v60-home .hero::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at var(--v60-pointer-x) var(--v60-pointer-y),
      rgba(76,111,255,.12),transparent 26%);
  transition:background .08s linear;
}
.v60-home .hero::after{
  content:"01 / VÄIKEVEEB";
  position:absolute;
  z-index:2;
  right:28px;
  bottom:27px;
  color:rgba(183,196,231,.38);
  font:600 9px/1 Inter,sans-serif;
  letter-spacing:.18em;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  pointer-events:none;
}
.v60-home .hero-panel{
  position:relative;
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease-out,box-shadow .25s ease;
}
.v60-home .hero-panel::before,
.v60-home .hero-panel::after{
  content:"";
  position:absolute;
  width:19px;
  height:19px;
  pointer-events:none;
  opacity:.75;
}
.v60-home .hero-panel::before{
  top:-7px;
  left:-7px;
  border-top:1px solid rgba(108,139,255,.9);
  border-left:1px solid rgba(108,139,255,.9);
}
.v60-home .hero-panel::after{
  right:-7px;
  bottom:-7px;
  border-right:1px solid rgba(108,139,255,.9);
  border-bottom:1px solid rgba(108,139,255,.9);
}
.v60-home .hero-panel:hover{
  box-shadow:0 35px 90px rgba(0,0,0,.25),0 0 0 1px rgba(94,127,255,.13);
}
.v60-home .hero-title .line > span{
  transition:letter-spacing .55s cubic-bezier(.16,1,.3,1);
}
.v60-home .hero-title:hover .line > span{
  letter-spacing:-.028em;
}
.v60-home .hero-tags span{
  transition:transform .22s ease,border-color .22s ease,background .22s ease;
}
.v60-home .hero-tags span:hover{
  transform:translateY(-3px);
  border-color:rgba(112,141,255,.5);
  background:rgba(70,101,220,.09);
}

/* ---------- MARQUEE: scan rail ---------- */
.v60-home .marquee-strip{
  overflow:hidden;
}
.v60-home .marquee-strip::before,
.v60-home .marquee-strip::after{
  content:"";
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  width:12vw;
  pointer-events:none;
}
.v60-home .marquee-strip::before{
  left:0;
  background:linear-gradient(90deg,currentColor 0%,transparent 100%);
  opacity:.06;
}
.v60-home .marquee-strip::after{
  right:0;
  background:linear-gradient(270deg,currentColor 0%,transparent 100%);
  opacity:.06;
}
.v60-home .marquee-track{
  position:relative;
}
.v60-home .marquee-track::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:110px;
  left:-140px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);
  transform:skewX(-18deg);
  animation:v60-marquee-scan 8s linear infinite;
  pointer-events:none;
}
@keyframes v60-marquee-scan{
  to{left:calc(100% + 140px)}
}

/* ---------- SERVICES: technical blueprint ---------- */
.v60-home #teenused{
  overflow:hidden;
}
.v60-home #teenused::before{
  content:"";
  position:absolute;
  z-index:0;
  width:520px;
  height:520px;
  right:-235px;
  top:40px;
  border:1px solid rgba(114,139,215,.10);
  border-radius:50%;
  box-shadow:
    0 0 0 72px rgba(114,139,215,.025),
    0 0 0 145px rgba(114,139,215,.018);
  animation:v60-orbit-breathe 8s ease-in-out infinite;
}
.v60-home #teenused::after{
  content:"02 / TEENUSED";
  position:absolute;
  z-index:0;
  left:22px;
  bottom:25px;
  font:600 9px/1 Inter,sans-serif;
  letter-spacing:.18em;
  color:rgba(178,192,229,.25);
}
@keyframes v60-orbit-breathe{
  0%,100%{transform:scale(.96);opacity:.55}
  50%{transform:scale(1.035);opacity:1}
}
.v60-home #teenused > .container,
.v60-home #tood > .container,
.v60-home #hinnad > .container,
.v60-home #kontakt > .container{
  position:relative;
  z-index:2;
}
.v60-home .service-card{
  position:relative;
  overflow:hidden;
  transition:transform .32s cubic-bezier(.16,1,.3,1),
             border-color .32s ease,
             box-shadow .32s ease;
}
.v60-home .service-card::before{
  position:absolute;
  top:18px;
  right:18px;
  font:700 10px/1 Manrope,sans-serif;
  letter-spacing:.15em;
  opacity:.28;
}
.v60-home .service-card:nth-child(1)::before{content:"01"}
.v60-home .service-card:nth-child(2)::before{content:"02"}
.v60-home .service-card:nth-child(3)::before{content:"03"}
.v60-home .service-card::after{
  content:"";
  position:absolute;
  left:-35%;
  bottom:-2px;
  width:35%;
  height:1px;
  background:linear-gradient(90deg,transparent,#6c8cff,transparent);
  transition:left .75s cubic-bezier(.16,1,.3,1);
}
.v60-home .service-card:hover{
  transform:translateY(-8px);
  box-shadow:0 24px 70px rgba(0,0,0,.20);
}
.v60-home .service-card:hover::after{
  left:100%;
}
.v60-home .services-grid .service-card:nth-child(2){
  transition-delay:.04s;
}
.v60-home .services-grid .service-card:nth-child(3){
  transition-delay:.08s;
}

/* ---------- PORTFOLIO: editorial light / drafting marks ---------- */
.v60-home #tood{
  overflow:hidden;
}
.v60-home #tood::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(28,42,75,.12) .65px,transparent .65px);
  background-size:22px 22px;
  mask-image:linear-gradient(90deg,transparent 0%,#000 20%,#000 80%,transparent 100%);
  opacity:.32;
}
.v60-home #tood::after{
  content:"03 / TEHTUD TÖÖD";
  position:absolute;
  right:24px;
  top:92px;
  color:rgba(15,26,48,.18);
  font:700 9px/1 Inter,sans-serif;
  letter-spacing:.18em;
  writing-mode:vertical-rl;
}
.v60-home .project-visual{
  position:relative;
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease-out,box-shadow .35s ease;
}
.v60-home .project-visual::before{
  content:"LIVE";
  position:absolute;
  z-index:5;
  top:14px;
  left:14px;
  padding:6px 8px;
  background:rgba(6,10,18,.82);
  border:1px solid rgba(255,255,255,.13);
  color:#f3f6ff;
  font:700 8px/1 Inter,sans-serif;
  letter-spacing:.13em;
  backdrop-filter:blur(8px);
}
.v60-home .project-visual::after{
  content:"";
  position:absolute;
  z-index:4;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.13) 46%,transparent 62%);
  transform:translateX(-120%);
  transition:transform .9s cubic-bezier(.16,1,.3,1);
}
.v60-home .project-visual:hover::after{
  transform:translateX(120%);
}
.v60-home .project-visual:hover{
  box-shadow:0 30px 75px rgba(24,35,62,.18);
}
.v60-home .project-copy dl > div{
  transition:transform .25s ease,border-color .25s ease;
}
.v60-home .project-copy dl > div:hover{
  transform:translateX(6px);
  border-color:rgba(53,98,255,.36);
}

/* ---------- PRICING: circular measuring system ---------- */
.v60-home #hinnad{
  overflow:hidden;
}
.v60-home #hinnad::before{
  content:"";
  position:absolute;
  z-index:0;
  width:660px;
  height:660px;
  left:-315px;
  top:120px;
  border-radius:50%;
  background:
    radial-gradient(circle at center,
      transparent 0 34%,
      rgba(109,137,221,.075) 34.15% 34.35%,
      transparent 34.5% 50%,
      rgba(109,137,221,.055) 50.15% 50.35%,
      transparent 50.5% 66%,
      rgba(109,137,221,.035) 66.15% 66.35%,
      transparent 66.5%);
  animation:v60-pricing-rotate 32s linear infinite;
}
.v60-home #hinnad::after{
  content:"04 / HINNAD";
  position:absolute;
  right:24px;
  bottom:27px;
  color:rgba(178,192,229,.25);
  font:600 9px/1 Inter,sans-serif;
  letter-spacing:.18em;
}
@keyframes v60-pricing-rotate{
  to{transform:rotate(360deg)}
}
.v60-home .matrix-plan{
  position:relative;
  overflow:hidden;
  transition:transform .3s cubic-bezier(.16,1,.3,1),
             box-shadow .3s ease,
             border-color .3s ease;
}
.v60-home .matrix-plan::after{
  content:"";
  position:absolute;
  pointer-events:none;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:
    linear-gradient(135deg,rgba(96,126,255,.08),transparent 28%);
  opacity:0;
  transition:opacity .3s ease;
}
.v60-home .matrix-plan:hover{
  transform:translateY(-7px);
  box-shadow:0 26px 80px rgba(0,0,0,.22);
}
.v60-home .matrix-plan:hover::after{
  opacity:1;
}
.v60-home .matrix-plan.recommended{
  box-shadow:0 0 0 1px rgba(89,121,255,.12);
}
.v60-home .matrix-plan.recommended::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-65px;
  right:-65px;
  width:145px;
  height:145px;
  border:1px solid rgba(106,136,255,.18);
  border-radius:50%;
  box-shadow:0 0 0 26px rgba(106,136,255,.025);
  animation:v60-orbit-breathe 5.5s ease-in-out infinite;
}
.v60-home .matrix-plan > *{
  position:relative;
  z-index:1;
}
.v60-home .hosting-matrix{
  position:relative;
  overflow:hidden;
  transition:transform .3s ease,border-color .3s ease;
}
.v60-home .hosting-matrix::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(85,116,255,.08),transparent);
  transform:translateX(-105%);
  transition:transform .8s cubic-bezier(.16,1,.3,1);
}
.v60-home .hosting-matrix:hover{
  transform:translateY(-4px);
}
.v60-home .hosting-matrix:hover::before{
  transform:translateX(105%);
}

/* ---------- CONTACT: portal / connection motif ---------- */
.v60-home #kontakt{
  overflow:hidden;
}
.v60-home #kontakt::before{
  content:"";
  position:absolute;
  z-index:0;
  width:510px;
  height:510px;
  right:-160px;
  bottom:-250px;
  border-radius:50%;
  background:
    radial-gradient(circle at center,rgba(53,98,255,.14),transparent 38%),
    repeating-radial-gradient(circle at center,
      rgba(53,98,255,.13) 0 1px,
      transparent 1px 38px);
  opacity:.65;
  animation:v60-contact-float 11s ease-in-out infinite;
}
.v60-home #kontakt::after{
  content:"05 / KONTAKT";
  position:absolute;
  left:24px;
  bottom:24px;
  color:rgba(15,26,48,.20);
  font:700 9px/1 Inter,sans-serif;
  letter-spacing:.18em;
}
@keyframes v60-contact-float{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-14px,-18px,0) scale(1.025)}
}
.v60-home #contactForm{
  position:relative;
  overflow:hidden;
  transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .3s ease;
}
.v60-home #contactForm::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg,#3562ff 0 22%,rgba(53,98,255,.12) 22% 100%);
  transform:scaleX(.65);
  transform-origin:left;
  transition:transform .8s cubic-bezier(.16,1,.3,1);
}
.v60-home #contactForm:hover{
  transform:translateY(-5px);
  box-shadow:0 30px 70px rgba(31,45,76,.13);
}
.v60-home #contactForm:hover::before{
  transform:scaleX(1);
}
.v60-home #contactForm a{
  position:relative;
  overflow:hidden;
}
.v60-home #contactForm a::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.20),transparent 55%);
  transform:translateX(-130%);
  transition:transform .65s ease;
}
.v60-home #contactForm a:hover::after{
  transform:translateX(130%);
}

/* ---------- FOOTER ---------- */
.v60-home footer::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:min(1180px,calc(100% - 40px));
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(93,120,195,.24),transparent);
  transform:translateX(-50%);
}
.v60-home .footer-inner img{
  transition:transform .28s ease,filter .28s ease;
}
.v60-home .footer-inner img:hover{
  transform:translateY(-3px) rotate(-1deg);
  filter:contrast(1.08);
}

/* ---------- V60 observer motion ---------- */
.v60-home .v60-watch{
  opacity:0;
  transform:translateY(22px);
  transition:
    opacity .72s cubic-bezier(.16,1,.3,1),
    transform .72s cubic-bezier(.16,1,.3,1);
}
.v60-home .v60-watch.v60-in{
  opacity:1;
  transform:none;
}
.v60-home .services-grid .v60-watch:nth-child(2),
.v60-home .price-matrix .v60-watch:nth-child(2){
  transition-delay:.07s;
}
.v60-home .services-grid .v60-watch:nth-child(3),
.v60-home .price-matrix .v60-watch:nth-child(3){
  transition-delay:.14s;
}
.v60-home .price-matrix .v60-watch:nth-child(4){
  transition-delay:.21s;
}

/* ---------- pointer decor ---------- */
.v60-pointer{
  position:fixed;
  z-index:9998;
  width:260px;
  height:260px;
  margin:-130px 0 0 -130px;
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(circle,rgba(79,111,255,.07),rgba(79,111,255,0) 68%);
  transform:translate3d(var(--v60-x,-400px),var(--v60-y,-400px),0);
  transition:opacity .3s ease;
  mix-blend-mode:screen;
}
.v60-home.v60-pointer-active .v60-pointer{
  opacity:1;
}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .v60-home .hero::after,
  .v60-home #teenused::after,
  .v60-home #tood::after,
  .v60-home #hinnad::after,
  .v60-home #kontakt::after{
    display:none;
  }
  .v60-home #teenused::before{
    right:-360px;
  }
  .v60-home #hinnad::before{
    left:-480px;
  }
}
@media (max-width:700px){
  .v60-pointer{display:none}
  .v60-home .service-card:hover,
  .v60-home .matrix-plan:hover,
  .v60-home #contactForm:hover,
  .v60-home .hosting-matrix:hover{
    transform:none;
  }
  .v60-home #kontakt::before{
    right:-330px;
  }
}

/* ---------- accessibility / performance ---------- */
@media (prefers-reduced-motion:reduce){
  .v60-home *,
  .v60-home *::before,
  .v60-home *::after{
    scroll-behavior:auto !important;
    animation:none !important;
    transition-duration:.01ms !important;
  }
  .v60-home .v60-watch{
    opacity:1 !important;
    transform:none !important;
  }
  .v60-pointer{display:none !important}
}