/* Carlisle Glass Repairs — v1.8.0 motion system
   - Header + hero animate immediately on page load.
   - The same soft fade-up motion is used across the rest of the website.
   - Content already in the viewport reveals immediately; lower content reveals
     as it enters the viewport so the animation is actually visible to visitors.
   - Hover polish remains subtle and site-wide on pointer devices. */

:root{
  --cgr-load-duration:640ms;
  --cgr-load-ease:cubic-bezier(.22,.8,.24,1);
  --cgr-hover-duration:230ms;
  --cgr-hover-ease:cubic-bezier(.22,.61,.36,1);
  --cgr-section-duration:650ms;
}

@keyframes cgrLoadDown{
  from{opacity:0;transform:translate3d(0,-10px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes cgrLoadUp{
  from{opacity:0;transform:translate3d(0,18px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes cgrLoadRight{
  from{opacity:0;transform:translate3d(18px,0,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes cgrLoadImage{
  from{opacity:.25;transform:scale(1.025)}
  to{opacity:1;transform:scale(1)}
}

/* Header: subtle load-in, once, immediately. */
.cgr-topbar{
  opacity:0;
  animation:cgrLoadDown 430ms ease-out 20ms both;
}
.cgr-header__inner{
  opacity:0;
  animation:cgrLoadDown 520ms var(--cgr-load-ease) 80ms both;
}

/* Homepage hero — all visible copy enters in a simple stagger. */
.home-page .hero__bg{
  animation:cgrLoadImage 900ms ease-out both;
  transform-origin:center center;
}
.home-page .hero__copy > *{
  opacity:0;
  animation:cgrLoadUp var(--cgr-load-duration) var(--cgr-load-ease) both !important;
}
.home-page .hero__copy > *:nth-child(1){animation-delay:120ms !important}
.home-page .hero__copy > *:nth-child(2){animation-delay:190ms !important}
.home-page .hero__copy > *:nth-child(3){animation-delay:260ms !important}
.home-page .hero__copy > *:nth-child(4){animation-delay:330ms !important}
.home-page .hero__copy > *:nth-child(5){animation-delay:400ms !important}
.home-page .emergency-card{
  opacity:0;
  animation:cgrLoadRight 720ms var(--cgr-load-ease) 300ms both !important;
}

/* Services hero. */
.services-page .services-hero__copy > *{
  opacity:0;
  animation:cgrLoadUp var(--cgr-load-duration) var(--cgr-load-ease) both;
}
.services-page .services-hero__copy > *:nth-child(1){animation-delay:120ms}
.services-page .services-hero__copy > *:nth-child(2){animation-delay:190ms}
.services-page .services-hero__copy > *:nth-child(3){animation-delay:260ms}
.services-page .services-hero__copy > *:nth-child(4){animation-delay:330ms}
.services-page .services-hero__image{
  opacity:0;
  animation:cgrLoadRight 720ms var(--cgr-load-ease) 280ms both;
}

/* About / FAQ / Blog / standard subpage hero. */
.subpage .sp-hero-inner > *{
  opacity:0;
  animation:cgrLoadUp var(--cgr-load-duration) var(--cgr-load-ease) both;
}
.subpage .sp-hero-inner > *:nth-child(1){animation-delay:120ms}
.subpage .sp-hero-inner > *:nth-child(2){animation-delay:190ms}
.subpage .sp-hero-inner > *:nth-child(3){animation-delay:260ms}
.subpage .sp-hero-inner > *:nth-child(4){animation-delay:330ms}

/* Contact has its own hero naming. */
.contact-layout .contact-hero__inner > *{
  opacity:0;
  animation:cgrLoadUp var(--cgr-load-duration) var(--cgr-load-ease) both;
}
.contact-layout .contact-hero__inner > *:nth-child(1){animation-delay:120ms}
.contact-layout .contact-hero__inner > *:nth-child(2){animation-delay:190ms}
.contact-layout .contact-hero__inner > *:nth-child(3){animation-delay:260ms}

/* Site-wide section reveal. global.js adds these classes only to content blocks,
   never decorative hero backgrounds. This keeps the motion simple and consistent. */
.cgr-site-reveal{
  opacity:0;
  transform:translate3d(0,18px,0);
  will-change:opacity,transform;
  transition:
    opacity var(--cgr-section-duration) var(--cgr-load-ease),
    transform var(--cgr-section-duration) var(--cgr-load-ease);
}
.cgr-site-reveal.cgr-in{
  opacity:1;
  transform:translate3d(0,0,0);
  transition-delay:var(--cgr-reveal-delay,0ms);
}
.cgr-site-reveal.cgr-reveal-done{
  transition-delay:0ms;
  will-change:auto;
}

/* Site-wide hover polish. */
.btn,
.carousel-btn,
.link-arrow,
.cgr-header__quote,
.cgr-header__phone,
.cgr-primary-menu a,
.service-card,
.why-card,
.testimonial-card,
.split-card,
.step,
.blog-card,
.trust-card,
.contact-card,
.contact-info-card,
.quote-card,
.faq-item__q,
.faq-q{
  transition-property:transform,box-shadow,background-color,border-color,color,opacity;
  transition-duration:var(--cgr-hover-duration);
  transition-timing-function:var(--cgr-hover-ease);
}

@media (hover:hover) and (pointer:fine){
  .btn:hover,
  .cgr-header__quote:hover{transform:translateY(-2px)}
  .carousel-btn:hover{transform:translateY(-2px) scale(1.045)}
  .link-arrow:hover{transform:translateX(4px)}
  .cgr-header__phone:hover{transform:translateY(-1px)}
  .cgr-primary-menu a:hover{transform:translateY(-1px)}

  .service-card:hover,
  .why-card:hover,
  .testimonial-card:hover,
  .blog-card:hover,
  .trust-card:hover,
  .contact-card:hover,
  .contact-info-card:hover,
  .quote-card:hover{
    transform:translateY(-4px);
    box-shadow:0 16px 34px rgba(7,31,70,.10);
  }
  .split-card:hover,
  .step:hover{transform:translateY(-3px)}
}

@media (max-width:680px){
  :root{
    --cgr-load-duration:540ms;
    --cgr-section-duration:560ms;
  }
  .home-page .hero__copy > *,
  .services-page .services-hero__copy > *,
  .subpage .sp-hero-inner > *,
  .contact-layout .contact-hero__inner > *{
    animation-name:cgrLoadUp;
  }
  .home-page .emergency-card,
  .services-page .services-hero__image{
    animation-name:cgrLoadUp !important;
  }
  .cgr-site-reveal{transform:translate3d(0,14px,0)}
}

@media (prefers-reduced-motion:reduce){
  .cgr-topbar,
  .cgr-header__inner,
  .home-page .hero__bg,
  .home-page .hero__copy > *,
  .home-page .emergency-card,
  .services-page .services-hero__copy > *,
  .services-page .services-hero__image,
  .subpage .sp-hero-inner > *,
  .contact-layout .contact-hero__inner > *,
  .cgr-site-reveal,
  .cgr-site-reveal.cgr-in{
    opacity:1 !important;
    transform:none !important;
    animation:none !important;
    transition:none !important;
  }
  .btn,.carousel-btn,.link-arrow,.cgr-header__quote,.cgr-header__phone,.cgr-primary-menu a,
  .service-card,.why-card,.testimonial-card,.split-card,.step,.blog-card,.trust-card,
  .contact-card,.contact-info-card,.quote-card,.faq-item__q,.faq-q{
    transition:none !important;
  }
}