/* =========================================================
   GHP Decor — Site-wide motion & interaction (all pages)
   ========================================================= */

:root {
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
}

/* Page enter */
body {
  opacity: 1;
}

body.is-entering {
  overflow: hidden;
}

.page-enter {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: var(--primary-deep);
  transform-origin: top;
  pointer-events: none;
  transform: scaleY(0);
}

body.is-entering .page-enter {
  animation: page-wipe 0.85s var(--ease-out-expo) forwards;
}

@keyframes page-wipe {
  0% { transform: scaleY(1); }
  100% { transform: scaleY(0); }
}

/* Scroll progress */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: linear-gradient(90deg, var(--primary), var(--primary-light));
  z-index: 200;
  pointer-events: none;
}

/* Reveals */
[data-reveal] {
  opacity: 0;
  transform: translateY(32px);
  filter: blur(3px);
  transition:
    opacity 1.05s var(--ease-out-expo),
    transform 1.05s var(--ease-out-expo),
    filter 1.05s var(--ease-out-expo);
}

[data-reveal].is-in {
  opacity: 1;
  transform: none;
  filter: none;
}

[data-reveal-delay="1"] { transition-delay: 0.08s; }
[data-reveal-delay="2"] { transition-delay: 0.16s; }
[data-reveal-delay="3"] { transition-delay: 0.24s; }
[data-reveal-delay="4"] { transition-delay: 0.32s; }

[data-clip] {
  clip-path: inset(6% 6% 6% 6%);
  transition: clip-path 1.25s var(--ease-out-expo);
}

[data-clip].is-in {
  clip-path: inset(0 0 0 0);
}

/* Custom cursor */
@media (hover: hover) and (pointer: fine) {
  body.cursor-ready {
    cursor: none;
  }

  body.cursor-ready a,
  body.cursor-ready button {
    cursor: none;
  }

  .cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    margin: -5px 0 0 -5px;
    border-radius: 50%;
    background: var(--primary);
    pointer-events: none;
    z-index: 10000;
    mix-blend-mode: multiply;
    opacity: 0;
    transition: transform 0.25s var(--ease-out-expo), opacity 0.25s ease;
  }

  .cursor-ring {
    position: fixed;
    top: 0;
    left: 0;
    width: 38px;
    height: 38px;
    margin: -19px 0 0 -19px;
    border: 1px solid rgba(58, 90, 64, 0.45);
    border-radius: 50%;
    pointer-events: none;
    z-index: 10000;
    opacity: 0;
    transition:
      transform 0.4s var(--ease-out-expo),
      width 0.3s ease,
      height 0.3s ease,
      margin 0.3s ease,
      border-color 0.3s ease,
      opacity 0.3s ease;
  }

  body.cursor-on .cursor,
  body.cursor-on .cursor-ring {
    opacity: 1;
  }

  body.cursor-hover .cursor {
    transform: scale(0.45);
  }

  body.cursor-hover .cursor-ring {
    width: 64px;
    height: 64px;
    margin: -32px 0 0 -32px;
    border-color: rgba(58, 90, 64, 0.8);
  }

  body.cursor-view .cursor {
    opacity: 0;
  }

  body.cursor-view .cursor-ring::after {
    content: "View";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-family: var(--font-sans);
    font-size: 0.55rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--primary);
  }
}

/* Inner page hero polish */
.page-hero {
  position: relative;
  overflow: hidden;
}

.page-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--primary-light), transparent);
  opacity: 0.35;
}

body.is-ready .page-hero .eyebrow {
  animation: rise-in 0.85s var(--ease-out-expo) 0.1s both;
}

body.is-ready .page-hero h1 {
  animation: rise-in 0.95s var(--ease-out-expo) 0.22s both;
}

body.is-ready .page-hero .lead {
  animation: rise-in 0.95s var(--ease-out-expo) 0.36s both;
}

@keyframes rise-in {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Soft image hover site-wide */
.work-card img,
.split-media img,
.journal-card img,
.project-gallery img {
  transition: transform 1.1s var(--ease-out-expo), filter 0.8s ease;
}

.work-card:hover img,
.split:hover .split-media img {
  transform: scale(1.05);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-clip],
  body.is-ready .page-hero .eyebrow,
  body.is-ready .page-hero h1,
  body.is-ready .page-hero .lead,
  body.is-entering .page-enter {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }

  .cursor,
  .cursor-ring {
    display: none !important;
  }

  body.cursor-ready {
    cursor: auto;
  }
}