/* Homepage experience v2 — real platform marks + premium service carousel. */

/* Platform expertise strip */
body[data-page="index"] .platforms{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:clamp(62px,7vw,96px);
  min-height:94px;
  padding:14px 18px;
  border:1px solid color-mix(in srgb,var(--border) 72%,transparent);
  border-radius:22px;
  background:color-mix(in srgb,var(--surface) 30%,transparent);
  box-shadow:0 18px 62px rgba(0,0,0,.08);
  backdrop-filter:blur(18px) saturate(1.16);
  overflow:hidden;
}
body[data-page="index"] .platforms::before{
  content:"";
  position:absolute;
  width:260px;
  height:180px;
  right:-90px;
  top:-110px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(16,200,232,.12),transparent 68%);
  pointer-events:none;
}
body[data-page="index"] .platforms > span{
  position:relative;
  z-index:1;
  flex:none;
  color:color-mix(in srgb,var(--text) 74%,var(--muted));
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
body[data-page="index"] .platform-list{
  width:min(900px,76vw);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
body[data-page="index"] .platform-track{
  gap:12px;
  align-items:center;
  animation-duration:30s;
}
body[data-page="index"] .platform-track > b{
  min-width:146px;
  min-height:58px;
  padding:9px 15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid color-mix(in srgb,var(--border) 76%,transparent);
  border-radius:15px;
  background:color-mix(in srgb,var(--surface) 58%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  color:var(--text);
  font-size:12px;
  font-weight:900;
}
body[data-page="index"] .platform-logo-card__icon{
  width:34px;
  height:34px;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:color-mix(in srgb,var(--surface) 78%,transparent);
}
body[data-page="index"] .platform-logo-card__icon img{
  display:block;
  width:28px;
  height:28px;
  object-fit:contain;
}
body[data-page="index"] .platform-track > b[data-platform="zid"] .platform-logo-card__icon img{width:34px}
body[data-page="index"] .platform-track > b[data-platform="woocommerce"] .platform-logo-card__icon img{width:31px}

/* Services: turn the preserved visual cards into the primary carousel. */
body[data-page="index"] .services-cinema.home-services-slider{
  height:auto!important;
  min-height:0!important;
  padding:clamp(92px,9vw,138px) 0 clamp(96px,9vw,142px)!important;
  background:transparent!important;
  overflow:hidden!important;
  contain:none!important;
  isolation:isolate;
}
body[data-page="index"] .services-cinema.home-services-slider::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:4% -8%;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 72% 18%,rgba(34,211,238,.10),transparent 34%),
    radial-gradient(ellipse at 18% 78%,rgba(139,92,246,.12),transparent 38%),
    radial-gradient(ellipse at 88% 84%,rgba(241,91,181,.075),transparent 35%);
  filter:blur(8px);
}
body[data-page="index"] .services-cinema.home-services-slider .services-cinema__stage{display:none!important}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck{
  display:block!important;
  width:min(calc(100% - 40px),1240px);
  margin-inline:auto;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:24px 40px;
  margin:0 0 34px;
  padding:0;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading .section-kicker,
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading h2,
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading p{grid-column:1}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading h2{
  max-width:760px;
  margin:7px 0 0;
  color:#fff;
  font-size:clamp(34px,4.5vw,64px);
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading p{
  max-width:680px;
  margin:10px 0 0;
  color:#aab5d3;
  font-size:clamp(14px,1.25vw,17px);
}
.home-services-slider__toolbar{
  grid-column:2;
  grid-row:1 / span 3;
  align-self:end;
  display:flex;
  align-items:center;
  gap:14px;
  direction:ltr;
}
.home-services-slider__counter{
  min-width:76px;
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:5px;
  color:#68769a;
  font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.1em;
}
.home-services-slider__counter strong{color:#fff;font-size:18px;font-weight:900}
.home-services-slider__buttons{display:flex;gap:8px}
.home-services-slider__button{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:15px;
  background:rgba(255,255,255,.055);
  color:#fff;
  font-size:20px;
  transition:transform .2s,border-color .2s,background .2s,opacity .2s;
}
.home-services-slider__button:hover{transform:translateY(-2px);border-color:rgba(124,226,248,.46);background:rgba(34,211,238,.085)}
.home-services-slider__button:focus-visible{outline:3px solid rgba(34,211,238,.34);outline-offset:3px}
.home-services-slider__button:disabled{opacity:.35;cursor:not-allowed;transform:none}

body[data-page="index"] .services-cinema.home-services-slider .services-mobile-track{
  position:relative;
  display:flex!important;
  gap:18px;
  width:100%;
  padding:8px max(2px,calc((100vw - min(calc(100vw - 40px),1240px))/2)) 30px 2px;
  margin:0;
  overflow-x:auto;
  overflow-y:visible;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:2px;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
  direction:ltr!important;
  cursor:grab;
  touch-action:pan-x pan-y;
  -webkit-overflow-scrolling:touch;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-track::-webkit-scrollbar{display:none}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card{
  direction:rtl;
  flex:0 0 clamp(330px,37vw,470px);
  min-width:0!important;
  scroll-snap-align:start;
  position:relative;
  padding:20px;
  border:1px solid rgba(255,255,255,.095);
  border-radius:28px;
  background:linear-gradient(155deg,rgba(18,27,63,.76),rgba(7,13,35,.72));
  color:#fff;
  box-shadow:0 24px 70px rgba(0,0,0,.18);
  opacity:.72;
  transform:scale(.975);
  transform-origin:center;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s,border-color .35s,box-shadow .35s;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card.is-active{
  opacity:1;
  transform:scale(1);
  border-color:rgba(34,211,238,.26);
  box-shadow:0 32px 88px rgba(0,0,0,.28),0 0 0 1px rgba(139,92,246,.055);
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card:hover{border-color:rgba(255,255,255,.19)}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card:focus-visible{outline:3px solid rgba(34,211,238,.34);outline-offset:4px}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card__scene{
  height:clamp(220px,25vw,310px);
  margin-bottom:22px;
  border-radius:21px;
  background:radial-gradient(circle at 70% 25%,var(--scene-glow,rgba(91,140,255,.32)),transparent 38%),#07102a;
}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card h3{font-size:clamp(24px,2.4vw,34px);line-height:1.2;margin:9px 0 8px}
body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card p{color:#aeb8d2;line-height:1.85}
body[data-page="index"] .services-cinema.home-services-slider .home-service-mobile-action{display:block;margin-top:18px;color:#8deeff;font-size:12px;font-weight:900}

@media(max-width:820px){
  body[data-page="index"] .platforms{margin-top:54px;display:block;padding:12px 0;border-inline:0;border-radius:0;background:transparent;box-shadow:none}
  body[data-page="index"] .platforms > span{display:block;padding-inline:18px;margin-bottom:10px}
  body[data-page="index"] .platform-list{width:100%;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  body[data-page="index"] .platform-track > b{min-width:134px;min-height:54px}
  body[data-page="index"] .services-cinema.home-services-slider{padding:78px 0 88px!important}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck{width:100%}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-deck .section-heading{display:block;padding-inline:20px;margin-bottom:24px}
  .home-services-slider__toolbar{margin-top:20px;justify-content:space-between}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-track{gap:14px;padding:6px 20px 24px}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card{flex-basis:min(82vw,390px);padding:18px;border-radius:25px}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card__scene{height:220px}

  /* The Journey owns the primary action while it is on-screen. Temporarily
     retire the persistent mobile dock so the story remains immersive and the
     final cinematic CTA is never visually or interactively duplicated. */
  body.home-cinema-active .quick-dock{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(calc(100% + max(20px,env(safe-area-inset-bottom))))!important;
    transition:opacity .18s ease,transform .22s ease,visibility .22s step-end!important;
  }
}

@media(max-width:520px){
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card{flex-basis:min(88vw,365px)}
  .home-services-slider__button{width:44px;height:44px}
}

@media(prefers-reduced-motion:reduce){
  body[data-page="index"] .platform-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
  body[data-page="index"] .platform-list{overflow:visible;white-space:normal;mask-image:none}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-track{scroll-behavior:auto}
  body[data-page="index"] .services-cinema.home-services-slider .services-mobile-card,.home-services-slider__button{transition:none}
  body.home-cinema-active .quick-dock{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
}