/* ============================================================
   STAGE 6 — MOTION SYSTEM CSS
   Global motion-related styles for TECH Enterprises
   ============================================================ */

/* H1 — Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* H2 — Scroll progress bar */
.tech-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-accent);
  transform-origin: left center;
  transform: scaleX(0);
  z-index: 9999;
  pointer-events: none;
}

/* B3 — Story section transition line */
.tech-story__transition-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-accent);
  transform-origin: left center;
}
.tech-story {
  position: relative;
}

/* C2 — Products card accent line */
.tech-products__card-accent-line {
  display: block;
  width: 100%;
  height: 1.5px;
  background-color: var(--color-accent);
  transform-origin: left center;
  margin-top: 4px;
}

/* C2 — Products card arrow */
.tech-products__card-arrow {
  display: inline-block;
  font-family: 'Inter', sans-serif;
  color: var(--color-accent);
}

/* C2 — Products card hover: image zoom + title color + shadow */
@media (hover: hover) {
  .tech-products__card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .tech-products__card:hover {
    box-shadow: 0 8px 24px rgba(28, 43, 45, 0.08);
  }
  .tech-products__card-image {
    overflow: hidden;
  }
  .tech-products__card-image-label,
  .tech-products__card-image {
    transition: transform 0.4s ease;
  }
  .tech-products__card:hover .tech-products__card-title {
    color: var(--color-accent);
    transition: color 0.2s ease;
  }
}

/* D1 — Clean Answers card image overflow for Ken Burns */
.tech-clean-answers__card-image {
  overflow: hidden;
}
.tech-clean-answers__card-img {
  transition: transform 0.6s ease;
  will-change: transform;
}

/* G1 — Product card hover enhancements */
.tech-product-card__image {
  overflow: hidden;
}
.tech-product-card__img {
  transition: transform 0.4s ease;
  will-change: transform;
}
.tech-product-card__shop-underline {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--color-accent);
  transform-origin: left center;
}

@media (hover: hover) {
  .tech-product-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .tech-product-card:hover {
    box-shadow: 0 8px 24px rgba(28, 43, 45, 0.08);
  }
}

/* F1 — Drop cap styling for Our Story */
.os-drop-cap {
  float: left;
  font-family: 'Fraunces', serif;
  font-size: 72px;
  font-weight: 500;
  line-height: 0.8;
  color: var(--color-accent);
  padding: 4px 12px 0 0;
  display: inline-block;
}

/* F2 — Timeline dash glow */
.os-timeline__dash {
  transform-origin: left center;
}

/* H3 — Page transition: prevent FOUC during fade */
body {
  opacity: 1;
}