:root {
  --sb-motion-ease: cubic-bezier(.22, 1, .36, 1);
}

@media (prefers-reduced-motion: no-preference) {
  html.js .home-hero .hero-title,
  html.js .home-hero .hero-subtitle,
  html.js .home-hero .hero-photo-card,
  html.js .home-hero .hero-analysis-card,
  html.js .home-hero .hero-side-trust,
  html.js .home-hero .hero-cta-zone,
  html.js .subpage-hero-grid > div:first-child > .section-label,
  html.js .subpage-hero-grid .subpage-title,
  html.js .subpage-hero-grid .subpage-subtitle,
  html.js .subpage-hero-grid .btn-hero,
  html.js .subpage-hero-grid > :last-child {
    animation: sb-hero-in 550ms var(--sb-motion-ease) both;
  }

  html.js .home-hero .hero-title { animation-delay: 40ms; }
  html.js .home-hero .hero-subtitle { animation-delay: 110ms; }
  html.js .home-hero .hero-photo-card { animation-delay: 170ms; }
  html.js .home-hero .hero-analysis-card { animation-name: sb-hero-card-in; animation-delay: 220ms; }
  html.js .home-hero .hero-side-left { animation-delay: 270ms; }
  html.js .home-hero .hero-side-right { animation-delay: 320ms; }
  html.js .home-hero .hero-cta-zone { animation-delay: 350ms; }
  html.js .subpage-hero-grid > div:first-child > .section-label { animation-delay: 20ms; }
  html.js .subpage-hero-grid .subpage-title { animation-delay: 70ms; }
  html.js .subpage-hero-grid .subpage-subtitle { animation-delay: 130ms; }
  html.js .subpage-hero-grid .btn-hero { animation-delay: 220ms; }
  html.js .subpage-hero-grid > :last-child { animation-delay: 170ms; }
  html.js .home-hero .analysis-row,
  html.js .subpage-hero-grid .energy-report-list > *,
  html.js .subpage-hero-grid .warmwater-hero-report li,
  html.js .subpage-hero-grid .facade-hero-report li {
    animation: sb-hero-in 300ms var(--sb-motion-ease) both;
  }
  html.js .home-hero .analysis-row:nth-child(1),
  html.js .subpage-hero-grid .energy-report-list > :nth-child(1),
  html.js .subpage-hero-grid .warmwater-hero-report li:nth-child(1),
  html.js .subpage-hero-grid .facade-hero-report li:nth-child(1) { animation-delay: 300ms; }
  html.js .home-hero .analysis-row:nth-child(2),
  html.js .subpage-hero-grid .energy-report-list > :nth-child(2),
  html.js .subpage-hero-grid .warmwater-hero-report li:nth-child(2),
  html.js .subpage-hero-grid .facade-hero-report li:nth-child(2) { animation-delay: 350ms; }
  html.js .home-hero .analysis-row:nth-child(3),
  html.js .subpage-hero-grid .energy-report-list > :nth-child(3),
  html.js .subpage-hero-grid .warmwater-hero-report li:nth-child(3),
  html.js .subpage-hero-grid .facade-hero-report li:nth-child(3) { animation-delay: 400ms; }
  html.js .home-hero .analysis-row:nth-child(4),
  html.js .subpage-hero-grid .energy-report-list > :nth-child(4),
  html.js .subpage-hero-grid .warmwater-hero-report li:nth-child(4),
  html.js .subpage-hero-grid .facade-hero-report li:nth-child(4) { animation-delay: 450ms; }
  html.js .subpage-hero-grid .energy-report-list > :nth-child(5),
  html.js .subpage-hero-grid .warmwater-hero-report li:nth-child(5) { animation-delay: 480ms; }

  @keyframes sb-hero-in {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
  }

  @keyframes sb-hero-card-in {
    from { opacity: 0; transform: translateY(10px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
  }

  html.js [data-reveal] {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 600ms var(--sb-motion-ease), transform 600ms var(--sb-motion-ease);
    transition-delay: var(--sb-reveal-delay, 0ms);
  }

  html.js [data-reveal="left"] { transform: translateX(-22px); }
  html.js [data-reveal="right"] { transform: translateX(22px); }
  html.js [data-reveal="scale"] { transform: translateY(10px) scale(.975); }
  html.js [data-reveal="image"] {
    opacity: .85;
    transform: scale(1.035);
    transition-duration: 850ms;
  }
  html.js [data-reveal].is-visible { opacity: 1; transform: none; }

  html.js .motion-report .analysis-row,
  html.js .motion-report .energy-report-list > *,
  html.js .motion-report .solutions-report-list > *,
  html.js .motion-report .warmwater-analysis-list > *,
  html.js .motion-report .home-epc-benefits > * {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 400ms var(--sb-motion-ease), transform 400ms var(--sb-motion-ease);
    transition-delay: calc(170ms + var(--sb-row-delay, 0ms));
  }

  html.js .motion-report.is-visible .analysis-row,
  html.js .motion-report.is-visible .energy-report-list > *,
  html.js .motion-report.is-visible .solutions-report-list > *,
  html.js .motion-report.is-visible .warmwater-analysis-list > *,
  html.js .motion-report.is-visible .home-epc-benefits > * {
    opacity: 1;
    transform: none;
  }

  html.js .motion-report .analysis-line > span,
  html.js .motion-report .home-savings-track > span {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 650ms var(--sb-motion-ease);
    transition-delay: calc(280ms + var(--sb-row-delay, 0ms));
  }
  html.js .motion-report.is-visible .analysis-line > span,
  html.js .motion-report.is-visible .home-savings-track > span { transform: scaleX(1); }

  html.js .motion-report .home-epc-scale-bar > span {
    opacity: 0;
    transition: opacity 400ms ease;
    transition-delay: calc(230ms + var(--sb-row-delay, 0ms));
  }
  html.js .motion-report.is-visible .home-epc-scale-bar > span { opacity: 1; }

  html.js .home-hero .analysis-line > span {
    transform-origin: left center;
    animation: sb-bar-in 320ms var(--sb-motion-ease) both;
  }
  html.js .home-hero .analysis-row:nth-child(1) .analysis-line > span { animation-delay: 420ms; }
  html.js .home-hero .analysis-row:nth-child(2) .analysis-line > span { animation-delay: 460ms; }
  html.js .home-hero .analysis-row:nth-child(3) .analysis-line > span { animation-delay: 500ms; }
  html.js .home-hero .analysis-row:nth-child(4) .analysis-line > span { animation-delay: 540ms; }
  @keyframes sb-bar-in {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }

  .btn-primary-brand {
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
  }
  .btn-primary-brand:active { transform: translateY(0); }
  .btn-primary-brand [aria-hidden="true"] { display: inline-block; transition: transform 200ms ease; }
  .btn-primary-brand:hover [aria-hidden="true"] { transform: translateX(3px); }

  .service-row { transition-duration: 200ms; }
  .service-row .service-title,
  .service-row .service-arrow,
  .service-row .row-arrow,
  .service-row img { transition-duration: 200ms; }
  .service-row:hover img { transform: scale(1.03); }
  .service-row:hover .service-arrow,
  .service-row:hover .row-arrow { transform: translateX(4px); }

  .review-card { transition: transform 200ms ease, box-shadow 200ms ease; }
  @media (hover: hover) and (min-width: 992px) {
    html.js .review-card[data-reveal].is-visible:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(0, 0, 0, .09); }
    html.js .benefit-card[data-reveal].is-visible:hover,
    html.js .process-card[data-reveal].is-visible:hover,
    html.js .formula-card[data-reveal].is-visible:hover { transform: translateY(-6px); }
  }

  .navbar .nav-link { transition: color 180ms ease; }
  .faq-accordion .accordion-button::after { transition: transform 200ms ease; }
  .faq-accordion .accordion-button:not(.collapsed)::after { transform: rotate(-180deg); }
}

@media (max-width: 767.98px) and (prefers-reduced-motion: no-preference) {
  html.js [data-reveal],
  html.js [data-reveal="left"],
  html.js [data-reveal="right"] { transform: translateY(16px); }
  html.js [data-reveal="scale"] { transform: translateY(8px) scale(.985); }
  html.js [data-reveal="image"] { transform: scale(1.025); }
  html.js [data-reveal].is-visible { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html.js [data-reveal],
  html.js .motion-report .analysis-row,
  html.js .motion-report .energy-report-list > *,
  html.js .motion-report .solutions-report-list > *,
  html.js .motion-report .warmwater-analysis-list > *,
  html.js .motion-report .home-epc-benefits > * {
    opacity: 1 !important;
    transform: none !important;
  }
  html.js .motion-report .analysis-line > span,
  html.js .motion-report .home-savings-track > span { transform: none !important; }
}