/*
 * iBlogger — Luminae V2.4 Orbit & Motion Final Match
 * Final hero calibration: SVG side-orbits, layered bloom, ticker framing and mobile optical spacing.
 * Loaded after V2.3 and scoped to the homepage only.
 */

.home-page[data-design-pass="v2.4"] .lm-hero {
  min-height: clamp(720px, 100svh, 860px);
  background:
    radial-gradient(ellipse 7.5% 20% at 0% 52%, rgba(255,245,255,.82) 0%, rgba(251,198,255,.68) 25%, rgba(218,125,255,.45) 52%, rgba(137,84,242,.19) 75%, transparent 100%),
    radial-gradient(ellipse 7.5% 20% at 100% 52%, rgba(255,245,255,.82) 0%, rgba(251,198,255,.68) 25%, rgba(218,125,255,.45) 52%, rgba(137,84,242,.19) 75%, transparent 100%),
    radial-gradient(ellipse 25% 59% at -3% 38%, rgba(63,66,255,.67) 0%, rgba(66,58,239,.45) 31%, rgba(76,50,201,.21) 57%, transparent 79%),
    radial-gradient(ellipse 25% 59% at 103% 38%, rgba(63,66,255,.67) 0%, rgba(66,58,239,.45) 31%, rgba(76,50,201,.21) 57%, transparent 79%),
    radial-gradient(ellipse 105% 48% at 50% 91%, rgba(244,161,239,.78) 0%, rgba(204,110,235,.59) 24%, rgba(126,74,220,.40) 48%, rgba(66,57,169,.17) 69%, transparent 84%),
    linear-gradient(180deg, #121a35 0%, #151d3b 25%, #1a2048 42%, #292467 58%, #4a329c 73%, #8d55bd 87%, #d79bda 100%);
}

/* Retire the geometric dotted ellipse used in V2.3. The reference is better
   represented by two independent, asymmetric luminous arcs. */
.home-page[data-design-pass="v2.4"] .lm-hero::before {
  content: none !important;
  display: none !important;
}
.home-page[data-design-pass="v2.4"] .lm-hero::after {
  left: -10%;
  right: -10%;
  bottom: -33%;
  height: 74%;
  background:
    radial-gradient(ellipse 61% 43% at 50% 25%, rgba(255,238,251,.22) 0%, rgba(252,181,242,.31) 18%, rgba(216,118,238,.30) 38%, rgba(137,78,222,.18) 58%, transparent 80%);
  filter: blur(25px);
  opacity: .94;
}

.home-page[data-design-pass="v2.4"] .lm-orbit-svg {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  opacity: 1;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-svg svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-mobile { display: none; }
.home-page[data-design-pass="v2.4"] .lm-orbit-wide {
  fill: none;
  stroke: url(#lmOrbitGradient);
  stroke-width: 72;
  stroke-linecap: round;
  opacity: .35;
  filter: url(#lmOrbitBlurWide);
  vector-effect: non-scaling-stroke;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-mid {
  fill: none;
  stroke: url(#lmOrbitGradient);
  stroke-width: 31;
  stroke-linecap: round;
  opacity: .56;
  filter: url(#lmOrbitBlurMid);
  vector-effect: non-scaling-stroke;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-core {
  fill: none;
  stroke: url(#lmOrbitGradient);
  stroke-width: 8;
  stroke-linecap: round;
  opacity: .72;
  filter: url(#lmOrbitBlurCore);
  vector-effect: non-scaling-stroke;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-dots {
  fill: none;
  stroke: url(#lmOrbitDotGradient);
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-dasharray: 1 7.6;
  opacity: .94;
  filter: url(#lmOrbitDotGlow);
  vector-effect: non-scaling-stroke;
}
.home-page[data-design-pass="v2.4"] .lm-orbit-hot {
  fill: none;
  stroke: rgba(255,229,255,.92);
  stroke-width: 16;
  stroke-linecap: round;
  opacity: .48;
  filter: url(#lmOrbitHotGlow);
  vector-effect: non-scaling-stroke;
}

/* Keep the copy in the exact optical zone while making the type a touch less
   heavy, closer to the reference's elegant serif silhouette. */
.home-page[data-design-pass="v2.4"] .lm-hero-copy {
  width: min(728px, calc(100% - 44px));
  padding-top: 143px;
}
.home-page[data-design-pass="v2.4"] .lm-trust { margin-bottom: 13px; }
.home-page[data-design-pass="v2.4"] .lm-hero h1 {
  max-width: 706px;
  margin-bottom: 13px;
  font-weight: 470;
  line-height: .965;
  letter-spacing: -.047em;
}
.home-page[data-design-pass="v2.4"] .lm-hero h1 span {
  margin-top: .025em;
  font-weight: 380;
  letter-spacing: -.044em;
}
.home-page[data-design-pass="v2.4"] .lm-hero-copy > p { margin-bottom: 20px; }

/* Final reference-frame calibration. All cards bottom-align like Framer, but
   the measured heights recreate the uneven top edge seen in the live hero. */
.home-page[data-design-pass="v2.4"] .lm-hero-marquee {
  bottom: 0;
  padding-top: 8px;
}
.home-page[data-design-pass="v2.4"] .lm-marquee-track,
.home-page[data-design-pass="v2.4"] .lm-marquee-set { gap: 27px; }
.home-page[data-design-pass="v2.4"] .lm-marquee-track {
  margin-left: -123px;
  padding-right: 27px;
  animation-name: lmMarqueeV24;
  animation-duration: 51s;
  animation-timing-function: linear;
  animation-delay: -1.15s;
}
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile {
  border-radius: 25px;
  box-shadow: 0 18px 44px rgba(5,7,30,.11);
}
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-pre      { width:166px; height:414px; transform:rotate(.7deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-face     { width:201px; height:372px; transform:rotate(-.55deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-meditate { width:164px; height:315px; transform:rotate(-1.0deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-flowers  { width:144px; height:306px; transform:rotate(.45deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-yoga     { width:137px; height:274px; transform:rotate(-.25deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-portrait { width:146px; height:302px; transform:rotate(.7deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-group    { width:167px; height:306px; transform:rotate(-.8deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-water    { width:205px; height:376px; transform:rotate(.65deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-breath   { width:154px; height:292px; transform:rotate(-.4deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-waves    { width:148px; height:280px; transform:rotate(.5deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-rose     { width:154px; height:294px; transform:rotate(-.45deg); }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-winter   { width:165px; height:310px; transform:rotate(.55deg); }

.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-face img {
  transform: scale(2.64);
  object-position: 54.5% 60.5%;
}
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-meditate img { object-position:50% 52%; }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-flowers img  { object-position:50% 50%; }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-yoga img     { object-position:50% 49%; }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-portrait img { object-position:50% 43%; }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-group img    { object-position:50% 49%; }
.home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-water img    { object-position:54% 50%; }

@keyframes lmMarqueeV24 {
  from { transform: translate3d(0,0,0); }
  to   { transform: translate3d(calc(-50% - 13.5px),0,0); }
}

@media (max-width: 920px) {
  .home-page[data-design-pass="v2.4"] .lm-hero-copy { padding-top: 129px; }
}

@media (max-width: 560px) {
  .home-page[data-design-pass="v2.4"] .lm-hero {
    min-height: 700px;
    max-height: 820px;
    background:
      radial-gradient(ellipse 13% 19% at 0% 58%, rgba(255,242,255,.60) 0%, rgba(241,174,255,.43) 38%, rgba(159,94,245,.19) 70%, transparent 100%),
      radial-gradient(ellipse 13% 19% at 100% 58%, rgba(255,242,255,.60) 0%, rgba(241,174,255,.43) 38%, rgba(159,94,245,.19) 70%, transparent 100%),
      radial-gradient(ellipse 48% 56% at -5% 39%, rgba(64,66,255,.64) 0%, rgba(69,58,235,.38) 42%, transparent 78%),
      radial-gradient(ellipse 48% 56% at 105% 39%, rgba(64,66,255,.64) 0%, rgba(69,58,235,.38) 42%, transparent 78%),
      radial-gradient(ellipse 140% 46% at 50% 89%, rgba(241,150,239,.71) 0%, rgba(190,99,232,.51) 31%, rgba(106,69,211,.29) 58%, transparent 81%),
      linear-gradient(180deg,#121a35 0%,#161e40 33%,#24205d 55%,#4a32a0 76%,#b875ce 100%);
  }
  .home-page[data-design-pass="v2.4"] .lm-orbit-desktop { display:none; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-mobile { display:block; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-wide { stroke-width:50; opacity:.30; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-mid { stroke-width:22; opacity:.48; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-core { stroke-width:6; opacity:.62; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-dots { stroke-width:1.8; stroke-dasharray:1 6.5; opacity:.78; }
  .home-page[data-design-pass="v2.4"] .lm-orbit-hot { stroke-width:11; opacity:.35; }
  .home-page[data-design-pass="v2.4"] .lm-hero::after {
    bottom:-28%; height:66%; filter:blur(19px); opacity:.9;
  }
  .home-page[data-design-pass="v2.4"] .lm-hero-copy {
    width:calc(100% - 30px);
    padding-top:109px;
  }
  .home-page[data-design-pass="v2.4"] .lm-hero h1 {
    max-width:360px;
    font-size:clamp(2.46rem,10.8vw,3.22rem);
    line-height:1.01;
  }
  .home-page[data-design-pass="v2.4"] .lm-hero-copy > p {
    max-width:330px;
    margin-bottom:17px;
  }
  .home-page[data-design-pass="v2.4"] .lm-hero-marquee { bottom:-1px; padding-top:7px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-track,
  .home-page[data-design-pass="v2.4"] .lm-marquee-set { gap:11px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-track {
    margin-left:-39px;
    padding-right:11px;
    animation-duration:38s;
    animation-delay:-.65s;
  }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile { border-radius:19px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-pre      { width:94px;  height:232px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-face     { width:113px; height:216px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-meditate { width:92px;  height:184px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-flowers  { width:81px;  height:178px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-yoga     { width:77px;  height:160px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-portrait { width:82px;  height:176px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-group    { width:94px;  height:178px; }
  .home-page[data-design-pass="v2.4"] .lm-marquee-set .lm-tile.lm-tile-water    { width:115px; height:220px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-page[data-design-pass="v2.4"] .lm-marquee-track { animation:none; }
}