/*
  Stylé Model Management — motion layer inspired by the restrained editorial motion
  language of The Hunt Management reference.
  Progressive enhancement: every hidden state only applies while html.motion-ready
  is present. If JS is unavailable, all content remains visible.
*/

:root {
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
  --motion-ease-soft: cubic-bezier(.22, 1, .36, 1);
  --motion-duration: 820ms;
  --motion-delay: 0ms;
}

html { scroll-behavior: smooth; }
html.motion-ready body { overflow-x: hidden; }

/* ---------- Global entrance ---------- */
html.motion-ready body > header,
html.motion-ready [data-purpose="page-header"],
html.motion-ready [data-purpose="site-header"],
html.motion-ready [data-purpose="main-header"] {
  opacity: 0;
  transform: translate3d(0,-14px,0);
  transition:
    opacity 720ms var(--motion-ease) var(--motion-delay),
    transform 820ms var(--motion-ease) var(--motion-delay);
  will-change: opacity, transform;
}

html.motion-ready body > header.motion-in,
html.motion-ready [data-purpose="page-header"].motion-in,
html.motion-ready [data-purpose="site-header"].motion-in,
html.motion-ready [data-purpose="main-header"].motion-in {
  opacity: 1;
  transform: translate3d(0,0,0);
}

/* Shared observed reveal: content stays fully visible without motion-ready. */
html.motion-ready [data-motion-item] {
  opacity: 0;
  transform: translate3d(0,22px,0);
  transition:
    opacity var(--motion-duration) var(--motion-ease-soft) var(--motion-delay),
    transform var(--motion-duration) var(--motion-ease) var(--motion-delay),
    clip-path 980ms var(--motion-ease) var(--motion-delay);
  will-change: opacity, transform, clip-path;
}
html.motion-ready [data-motion-item].motion-in {
  opacity: 1;
  transform: translate3d(0,0,0);
}

/* Editorial mask reveal for large visual blocks. */
html.motion-ready [data-motion="mask"] {
  clip-path: inset(0 0 100% 0);
  transform: translate3d(0,18px,0) scale(.985);
}
html.motion-ready [data-motion="mask"].motion-in {
  clip-path: inset(0 0 0 0);
  transform: translate3d(0,0,0) scale(1);
}

/* Softer text reveal. */
html.motion-ready [data-motion="text"] {
  transform: translate3d(0,18px,0);
}
html.motion-ready [data-motion="text"].motion-in {
  transform: translate3d(0,0,0);
}

/* ---------- Home ---------- */
html.motion-ready body[data-motion-page="home"] main img[src*="logo-white"] {
  opacity: 0;
  filter: blur(7px);
  transform: translate3d(0,10px,0) scale(.94);
  transition:
    opacity 1050ms var(--motion-ease) 160ms,
    transform 1250ms var(--motion-ease) 160ms,
    filter 1050ms var(--motion-ease) 160ms;
  will-change: opacity, transform, filter;
}
html.motion-ready body[data-motion-page="home"] main img[src*="logo-white"].motion-in {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0,0,0) scale(1);
}
body[data-motion-page="home"] > div[aria-hidden="true"] > video {
  transform: scale(1.035);
  animation: huntHeroBreath 14s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes huntHeroBreath {
  from { transform: scale(1.035) translate3d(var(--adema-x,0px), var(--adema-y,0px), 0); }
  to   { transform: scale(1.065) translate3d(var(--adema-x,0px), calc(var(--adema-y,0px) - 0.5%), 0); }
}

/* ---------- Navigation overlays ---------- */
#nav-drawer .nav-item,
#site-nav-overlay nav a {
  transition-property: opacity, transform, color;
  transition-duration: 520ms, 620ms, 200ms;
  transition-timing-function: var(--motion-ease), var(--motion-ease), ease;
}
html.motion-ready #nav-drawer .nav-item,
html.motion-ready #site-nav-overlay nav a {
  opacity: 0;
  transform: translate3d(0,18px,0);
}
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item,
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a {
  opacity: 1;
  transform: translate3d(0,0,0);
}
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(1),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(1) { transition-delay: 70ms; }
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(2),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(2) { transition-delay: 120ms; }
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(3),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(3) { transition-delay: 170ms; }
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(4),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(4) { transition-delay: 220ms; }
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(5),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(5) { transition-delay: 270ms; }
html.motion-ready #nav-drawer[aria-hidden="false"] .nav-item:nth-child(6),
html.motion-ready #site-nav-overlay[aria-hidden="false"] nav a:nth-child(6) { transition-delay: 320ms; }

/* Hamburger lines: understated editorial motion. */
button[data-purpose="navigation-toggle"] span,
button[data-purpose="menu-toggle"] span,
#menu-toggle-btn span {
  transition-timing-function: var(--motion-ease) !important;
}

/* ---------- Agency ---------- */
body[data-motion-page="agency"] [data-purpose="agency-intro"] {
  max-width: 56rem;
}
body[data-motion-page="agency"] [data-purpose="video-presentation"] .video-container {
  transform-origin: center center;
}
body[data-motion-page="agency"] [data-purpose="promotional-video"] {
  transform: translate3d(0,var(--video-parallax,0px),0) scale(1.045);
  transition: transform 180ms linear;
  will-change: transform;
}

/* ---------- Talents ---------- */
html.motion-ready body[data-motion-page="talents"] [data-purpose="model-item"] {
  opacity: 0;
  transform: translate3d(0,24px,0);
  transition:
    opacity 760ms var(--motion-ease-soft) var(--motion-delay),
    transform 900ms var(--motion-ease) var(--motion-delay);
}
html.motion-ready body[data-motion-page="talents"] [data-purpose="model-item"].motion-in {
  opacity: 1;
  transform: translate3d(0,0,0);
}
body[data-motion-page="talents"] [data-purpose="model-item"] img {
  transition: transform 900ms var(--motion-ease), filter 500ms ease;
  will-change: transform;
}
@media (hover:hover) and (pointer:fine) {
  body[data-motion-page="talents"] [data-purpose="model-item"]:hover img {
    transform: scale(1.035);
  }
  body[data-motion-page="talents"] [data-purpose="model-item"]:hover h2,
  body[data-motion-page="talents"] [data-purpose="model-item"]:hover h3,
  body[data-motion-page="talents"] [data-purpose="model-item"]:hover p {
    opacity: .68;
  }
}

/* ---------- Get scouted / form ---------- */
body[data-motion-page="scouted"] input,
body[data-motion-page="scouted"] select,
body[data-motion-page="scouted"] textarea {
  transition: border-color 240ms ease, box-shadow 240ms ease, background-color 240ms ease, transform 240ms var(--motion-ease);
}
body[data-motion-page="scouted"] input:focus,
body[data-motion-page="scouted"] select:focus,
body[data-motion-page="scouted"] textarea:focus {
  transform: translate3d(0,-1px,0);
}
body[data-motion-page="scouted"] [data-purpose="step-3-photos"] img {
  transition: transform 900ms var(--motion-ease), filter 500ms ease;
}
@media (hover:hover) and (pointer:fine) {
  body[data-motion-page="scouted"] [data-purpose="step-3-photos"] img:hover {
    transform: scale(1.025);
  }
}

/* ---------- FAQ ---------- */
body[data-motion-page="faq"] [data-purpose="faq-list"] article h2,
body[data-motion-page="faq"] [data-purpose="faq-list"] article h3 {
  transition: letter-spacing 420ms var(--motion-ease), opacity 260ms ease;
}
@media (hover:hover) and (pointer:fine) {
  body[data-motion-page="faq"] [data-purpose="faq-list"] article:hover h2,
  body[data-motion-page="faq"] [data-purpose="faq-list"] article:hover h3 {
    letter-spacing: .025em;
    opacity: .72;
  }
}

/* ---------- Contact ---------- */
body[data-motion-page="contact"] [data-purpose="contact-content"] a {
  position: relative;
  text-decoration: none;
}
body[data-motion-page="contact"] [data-purpose="contact-content"] a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.2em;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 520ms var(--motion-ease);
}
@media (hover:hover) and (pointer:fine) {
  body[data-motion-page="contact"] [data-purpose="contact-content"] a:hover::after {
    transform: scaleX(1);
    transform-origin: left center;
  }
}

/* ---------- Footer ---------- */
html.motion-ready [data-purpose="site-footer"],
html.motion-ready body > footer {
  opacity: 0;
  transform: translate3d(0,14px,0);
  transition: opacity 760ms var(--motion-ease-soft), transform 900ms var(--motion-ease);
}
html.motion-ready [data-purpose="site-footer"].motion-in,
html.motion-ready body > footer.motion-in {
  opacity: 1;
  transform: translate3d(0,0,0);
}

/* ---------- Mobile & accessibility ---------- */
@media (max-width: 767px) {
  :root { --motion-duration: 620ms; }
  html.motion-ready [data-motion-item] { transform: translate3d(0,12px,0); }
  html.motion-ready [data-motion="mask"] { transform: translate3d(0,10px,0) scale(.994); }
  body[data-motion-page="agency"] [data-purpose="promotional-video"] {
    transform: none !important;
    transition: none;
  }
  body[data-motion-page="home"] > div[aria-hidden="true"] > video {
    animation-duration: 20s;
    transform: scale(1.02);
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  html.motion-ready body > header,
  html.motion-ready [data-purpose="page-header"],
  html.motion-ready [data-purpose="site-header"],
  html.motion-ready [data-purpose="main-header"],
  html.motion-ready [data-motion-item],
  html.motion-ready [data-purpose="site-footer"],
  html.motion-ready body > footer,
  html.motion-ready body[data-motion-page="home"] main img[src*="logo-white"] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }
}