/* ===== Innovity v1.1 upgrades (loaded after custom.css) ===== */
::selection { background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); }

/* Hero: content above orbs, second orb, film grain, parallax via --mx/--my (set in main.js) */
.iv-hero > .wp-block-group { position: relative; z-index: 2; }
.iv-hero::after { z-index: 0; opacity: .55; transform: translate(calc(var(--mx, 0) * -40px), calc(var(--my, 0) * -40px)); }
.iv-hero::before { content: ""; position: absolute; left: -10vw; bottom: -18vh; width: 34vw; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 60% 40%, var(--wp--preset--color--coral), transparent 65%); opacity: .45; filter: blur(14px);
  transform: translate(calc(var(--mx, 0) * 30px), calc(var(--my, 0) * 30px)); z-index: 0; pointer-events: none; }
.iv-grain { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }

/* Headline word-by-word reveal (words wrapped by main.js) */
.iv-word { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; }
.iv-word > span { display: inline-block; transform: translateY(110%); animation: iv-rise .9s var(--iv-ease) forwards; animation-delay: calc(var(--i) * 70ms + 150ms); }
@keyframes iv-rise { to { transform: none; } }

.iv-marquee:hover p { animation-play-state: paused; }

/* Service cards: big ghost number + arrow on hover */
.iv-card { position: relative; overflow: hidden; }
.iv-card .iv-num { font-size: clamp(3rem, 6vw, 5rem); line-height: 1; opacity: .18; transition: opacity .3s, transform .4s var(--iv-ease); }
.iv-card:hover .iv-num { opacity: 1; transform: translateX(6px); }
.iv-card::after { content: "\2197"; position: absolute; top: 1.25rem; right: 1.5rem; font-size: 1.6rem; font-family: var(--wp--preset--font-family--display);
  transform: translate(-6px, 6px); opacity: 0; transition: all .35s var(--iv-ease); color: var(--wp--preset--color--blue); }
.iv-card:hover::after { opacity: 1; transform: none; }

/* Process: steps with draw-in line */
.iv-step { position: relative; border-top: 0; }
.iv-step::before { content: ""; position: absolute; top: 0; left: 0; height: 3px; width: 100%; background: var(--wp--preset--color--ink); transform-origin: left; transform: scaleX(1); transition: transform 1s var(--iv-ease) .2s; }
.js .iv-step:not(.is-in)::before { transform: scaleX(0); }
.iv-step .iv-num { font-size: 2.6rem; opacity: 1; padding-top: 1rem; }

/* Portfolio tiles: generated art so placeholders already look designed */
.iv-tile { isolation: isolate; min-height: 420px; }
.iv-tile::before { content: ""; position: absolute; inset: 0; z-index: -1; transition: transform .8s var(--iv-ease); }
.iv-tile:hover::before { transform: scale(1.12) rotate(3deg); }
.iv-tile:nth-child(3n+1)::before { background: repeating-conic-gradient(from 0deg at 70% 30%, rgba(10,10,18,.18) 0 10deg, transparent 10deg 20deg); }
.iv-tile:nth-child(3n+2)::before { background: radial-gradient(circle at 75% 25%, rgba(10,10,18,.9) 0 18%, transparent 18.5%), repeating-radial-gradient(circle at 75% 25%, transparent 0 22px, rgba(10,10,18,.12) 22px 24px); }
.iv-tile:nth-child(3n)::before { background: linear-gradient(135deg, transparent 0 40%, rgba(10,10,18,.9) 40% 55%, transparent 55%), repeating-linear-gradient(45deg, rgba(10,10,18,.1) 0 2px, transparent 2px 18px); }
.iv-tile h3 { font-size: clamp(1.8rem, 3vw, 2.6rem); }

.iv-stat-num { text-shadow: 0 0 60px rgba(212,255,58,.25); }

/* Animated underline links */
.wp-block-post-content p a, .iv-footer a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size .3s var(--iv-ease); text-decoration: none; }
.wp-block-post-content p a:hover, .iv-footer a:hover { background-size: 100% 2px; text-decoration: none; }

.iv-footer-big { transition: color .4s; }
.iv-footer-big:hover { color: var(--wp--preset--color--lime); }

/* Scroll progress bar (injected by main.js) */
.iv-progress { position: fixed; top: 0; left: 0; height: 4px; width: 100%; z-index: 100; background: linear-gradient(90deg, var(--wp--preset--color--blue), var(--wp--preset--color--lime)); transform-origin: left; transform: scaleX(var(--p, 0)); }

@media (max-width: 600px) {
  .iv-hero { min-height: 82vh; }
  .iv-hero::after { width: 90vw; right: -40vw; }
  .iv-tile { min-height: 300px; }
}
@media (prefers-reduced-motion: reduce) {
  .iv-word > span { transform: none; animation: none; }
  .iv-step::before, .js .iv-step:not(.is-in)::before { transform: none; transition: none; }
  .iv-progress { display: none; }
}
