/* Chillex Pty Ltd - Animations and hover states */

/* Page transitions */
body {
  opacity: 0;
}

body.page-ready {
  opacity: 1;
  transition: opacity 200ms var(--anim-ease);
}

body.page-exit {
  opacity: 0;
  transition: opacity 200ms var(--anim-ease);
}

.motion-reduced body,
html.motion-reduced body {
  opacity: 1;
  transition: none;
}

html.motion-reduced .anim-fade-up,
html.motion-reduced .anim-fade-in,
html.motion-reduced .anim-line-expand,
html.motion-reduced [data-anim] {
  opacity: 1;
  transform: none;
  width: auto;
}

/* Entry animations — initial state only before reveal */
.motion-ok .anim-fade-up,
.motion-ok [data-anim="fade-up"] {
  transition: opacity var(--anim-duration-slow) var(--anim-ease),
              transform var(--anim-duration-slow) var(--anim-ease);
}

.motion-ok .anim-fade-up:not(.is-visible),
.motion-ok [data-anim="fade-up"]:not(.is-visible) {
  opacity: 0;
  transform: translateY(var(--anim-distance));
}

.motion-ok .anim-fade-up.is-visible,
.motion-ok [data-anim="fade-up"].is-visible {
  opacity: 1;
  transform: translateY(0);
}

.motion-ok .anim-fade-in,
.motion-ok [data-anim="fade-in"] {
  transition: opacity var(--anim-duration-slow) var(--anim-ease);
}

.motion-ok .anim-fade-in:not(.is-visible),
.motion-ok [data-anim="fade-in"]:not(.is-visible) {
  opacity: 0;
}

.motion-ok .anim-fade-in.is-visible,
.motion-ok [data-anim="fade-in"].is-visible {
  opacity: 1;
}

.motion-ok .anim-line-expand,
.motion-ok [data-anim="line-expand"] {
  transition: width var(--anim-duration-slow) var(--anim-ease),
              opacity var(--anim-duration-base) var(--anim-ease);
}

.motion-ok .anim-line-expand:not(.is-visible),
.motion-ok [data-anim="line-expand"]:not(.is-visible) {
  width: 0;
  opacity: 0;
}

.motion-ok .anim-line-expand.is-visible,
.motion-ok [data-anim="line-expand"].is-visible {
  width: 100%;
  opacity: 1;
}

/* Hero overlay reveal */
.motion-ok .hero__overlay:not(.is-visible) {
  opacity: 0;
  transition: opacity 1000ms var(--anim-ease);
}

.motion-ok .hero__overlay.is-visible {
  opacity: 1;
}

/* Buttons */
.motion-ok .btn--primary {
  transition: background var(--anim-duration-fast) var(--anim-ease),
              transform var(--anim-duration-fast) var(--anim-ease),
              box-shadow var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .btn--primary:hover {
  background: #162d4a;
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(30, 58, 95, 0.18);
}

.motion-ok .btn--white {
  transition: background var(--anim-duration-fast) var(--anim-ease),
              transform var(--anim-duration-fast) var(--anim-ease),
              box-shadow var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .btn--white:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* Nav links */
.motion-ok .site-header__nav-link {
  color: var(--color-text-muted);
  text-decoration: none;
  transition: color var(--anim-duration-fast) var(--anim-ease),
              border-color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .site-header__nav-link:hover {
  color: var(--color-primary);
  text-decoration: none;
}

.motion-ok .site-header__dropdown-toggle {
  color: var(--color-text-muted);
  transition: color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .site-header__dropdown-toggle:hover {
  color: var(--color-primary);
}

@media (min-width: 769px) {
  .motion-ok .site-header__dropdown-menu {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    visibility: hidden;
    transition: opacity var(--anim-duration-fast) var(--anim-ease),
                transform var(--anim-duration-fast) var(--anim-ease),
                visibility var(--anim-duration-fast) var(--anim-ease);
  }

  .motion-ok .site-header__dropdown:hover .site-header__dropdown-menu,
  .motion-ok .site-header__dropdown--open .site-header__dropdown-menu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    visibility: visible;
  }
}

/* Service cards */
.motion-ok .card,
.motion-ok .service-card {
  transition: border-color var(--anim-duration-fast) var(--anim-ease),
              transform var(--anim-duration-fast) var(--anim-ease),
              box-shadow var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .card__icon,
.motion-ok .service-card .card__icon {
  color: var(--color-secondary);
  transition: color var(--anim-duration-fast) var(--anim-ease),
              border-color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .service-card:hover {
  border-color: var(--color-secondary);
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(30, 58, 95, 0.10);
}

.motion-ok .card:hover .card__icon,
.motion-ok .service-card:hover .card__icon {
  color: var(--color-primary);
  border-color: var(--color-secondary);
}

.motion-ok .service-card:hover .service-card__cta {
  color: var(--color-secondary);
}

/* Text links */
.motion-ok .card__link,
.motion-ok .service-back a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .card__link::after,
.motion-ok .service-back a::after {
  content: '\2192';
  display: inline-block;
  transition: transform var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .card__link:hover,
.motion-ok .service-back a:hover {
  color: var(--color-secondary);
  text-decoration: none;
}

.motion-ok .card__link:hover::after,
.motion-ok .service-back a:hover::after {
  transform: translateX(4px);
}

/* Footer links */
.motion-ok .site-footer__nav-link,
.motion-ok .site-footer__contact-item a,
.motion-ok .site-footer__credit a {
  transition: color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .site-footer__nav-link {
  color: rgba(255, 255, 255, 0.7);
}

.motion-ok .site-footer__nav-link:hover {
  color: #FFFFFF;
}

/* Form inputs */
.motion-ok .form-group input,
.motion-ok .form-group textarea,
.motion-ok .admin-form-group input {
  transition: border-color var(--anim-duration-fast) var(--anim-ease),
              box-shadow var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .form-group input:focus,
.motion-ok .form-group textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(30, 58, 95, 0.10);
  outline: none;
}

/* Media tiles */
.motion-ok .media-tile {
  transition: transform var(--anim-duration-base) var(--anim-ease),
              border-color var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .media-tile:hover {
  transform: scale(1.02);
  border-color: var(--color-secondary);
}

.motion-ok .media-tile img {
  transition: opacity var(--anim-duration-fast) var(--anim-ease);
}

.motion-ok .media-tile:hover img {
  opacity: 0.92;
}

/* Hamburger */
.motion-ok .site-header__toggle span {
  transition: transform var(--anim-duration-fast) var(--anim-ease),
              opacity var(--anim-duration-fast) var(--anim-ease);
}

/* Mobile nav panel */
@media (max-width: 768px) {
  .motion-ok .site-header__nav {
    opacity: 0;
    transition: max-height var(--anim-duration-base) var(--anim-ease),
                opacity var(--anim-duration-fast) var(--anim-ease);
  }

  .motion-ok .site-header__nav--open {
    opacity: 1;
  }
}

/* Header scroll transition */
.motion-ok .site-header {
  transition: background var(--anim-duration-base) var(--anim-ease),
              box-shadow var(--anim-duration-base) var(--anim-ease),
              padding var(--anim-duration-base) var(--anim-ease);
}

.motion-ok .site-header--scrolled {
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.12);
}