/* ASSR Solutions: additions on top of main.css (the original design stylesheet).
   Covers the motion that the old React build handled, plus form states. */

/* Smooth scroll (Lenis) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* Scroll progress bar */
.progress-bar { transform: scaleX(0); }

/* Hero entrance */
@keyframes assr-line-up { from { transform: translateY(105%); } to { transform: translateY(0); } }
@keyframes assr-fade-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes assr-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes assr-clip { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0% 0 0 0); } }

.js .hero .h-line > span { display: block; animation: assr-line-up 1s var(--ease) both; }
.js .hero .h-line:nth-child(2) > span { animation-delay: .1s; }
.js .hero .h-line:nth-child(3) > span { animation-delay: .2s; }
.js .hero .eyebrow { animation: assr-fade-up .8s var(--ease) both; }
.js .hero .hero-lead { animation: assr-fade-up .9s var(--ease) .35s both; }
.js .hero .hero-actions { animation: assr-fade-up .9s var(--ease) .45s both; }
.js .hero .hero-proof { animation: assr-fade .9s ease .6s both; }
.js .hero .hero-frame { animation: assr-clip 1.3s var(--ease) .15s both; }
.js .hero .hero-card { animation: assr-fade-up .9s var(--ease) .8s both; }
.hero-frame img[data-parallax] { will-change: transform; }

/* Scroll reveals: only items below the fold on load are hidden first */
[data-reveal].is-pending { opacity: 0; transform: translateY(32px); }
[data-reveal].is-shown { opacity: 1; transform: none; transition: opacity .8s var(--ease), transform .8s var(--ease); }

/* Contact form */
.hp-field { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--navy-2); box-shadow: 0 0 0 3px #0d13381f; }
.form-status { margin: 0; padding: 12px 14px; border-radius: 4px; font-size: 13px; font-weight: 600; line-height: 1.5; }
.form-status.is-ok { background: #e8f4ee; color: #12623f; }
.form-status.is-error { background: #fbecec; color: var(--red); }
.form-submit[disabled] { opacity: .7; cursor: progress; transform: none; }

/* Keyboard focus */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--red-2); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .js .hero *, .js .hero .hero-frame { animation: none !important; }
  [data-reveal].is-pending { opacity: 1; transform: none; }
  .progress-bar { display: none; }
}

/* Fill the holes the original gallery grid left between large and small photos */
.space-gallery-grid { grid-auto-flow: dense; }
@media (min-width: 901px) {
  .space-gallery-item:nth-child(14), .space-gallery-item:nth-child(18) { grid-column: span 2; }
}
