/* Homepage hero and about: image-led, cinematic motion. */
.cinematic-hero {
  position: relative;
  height: min(820px, calc(100dvh - 96px));
  min-height: 620px;
  overflow: hidden;
  isolation: isolate;
  background: #10243c;
  color: #fff;
}
.cinematic-hero__scenes,
.cinematic-scene,
.cinematic-scene__picture,
.cinematic-scene__picture img,
.cinematic-scene__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.cinematic-scene { opacity: 0; visibility: hidden; transition: opacity 1.15s ease, visibility 1.15s; }
.cinematic-scene.is-active { opacity: 1; visibility: visible; z-index: 1; }
.cinematic-scene__picture { display: block; overflow: hidden; }
.cinematic-scene__picture img { object-fit: cover; object-position: center; transform: scale(1.08) translate3d(-1.5%, 0, 0); }
.cinematic-scene:nth-child(1) .cinematic-scene__picture img { object-position: 42% center; }
.cinematic-scene:nth-child(2) .cinematic-scene__picture img { object-position: 50% center; }
.cinematic-scene.is-active .cinematic-scene__picture img { animation: cinematic-camera 8s cubic-bezier(.22,.61,.36,1) both; }
.cinematic-scene:nth-child(2).is-active .cinematic-scene__picture img { animation-name: cinematic-camera-reverse; }
@keyframes cinematic-camera {
  from { transform: scale(1.17) translate3d(-2.5%, 1%, 0); }
  to { transform: scale(1.05) translate3d(1%, -1%, 0); }
}
@keyframes cinematic-camera-reverse {
  from { transform: scale(1.07) translate3d(1.5%, -1%, 0); }
  to { transform: scale(1.18) translate3d(-2%, 1%, 0); }
}
.cinematic-scene__shade {
  background: linear-gradient(90deg, rgba(5, 19, 37, .17) 0%, rgba(5, 19, 37, .04) 40%, rgba(5, 18, 37, .48) 68%, rgba(5, 18, 37, .78) 100%), linear-gradient(0deg, rgba(4, 15, 30, .32), transparent 32%);
}
.cinematic-scene__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(550px, 42vw);
  height: 100%;
  margin-left: auto;
  margin-right: max(7vw, calc((100vw - 1480px) / 2));
  padding: 40px 0 85px;
  text-align: left;
  color: #fff;
}
.cinematic-scene__eyebrow,
.home-about__eyebrow {
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
}
.cinematic-scene__eyebrow { color: #dcecff; margin-bottom: 27px; }
.cinematic-scene__title {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #fff;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(3.8rem, 6.6vw, 7.5rem);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.055em;
  text-wrap: balance;
  text-shadow: 0 3px 22px rgba(3, 16, 36, .23);
}
.cinematic-scene__title em { font-weight: 400; }
.cinematic-scene__title-glow { position: relative; display: inline-block; }
.cinematic-scene__title-glow::after {
  content: '';
  position: absolute;
  inset: -10% -15%;
  z-index: -1;
  background: radial-gradient(ellipse at 65% 50%, rgba(194, 225, 255, .37), rgba(194, 225, 255, 0) 63%);
  filter: blur(22px);
  opacity: 0;
  pointer-events: none;
}
.cinematic-scene.is-active .cinematic-scene__title-glow { animation: title-reveal 1.25s .22s both, title-splash 1.7s .65s both; }
.cinematic-scene.is-active .cinematic-scene__title-glow::after { animation: title-halo 1.5s .65s both; }
@keyframes title-reveal { from { opacity: 0; filter: blur(14px); transform: translate3d(0, 26px, 0); } to { opacity: 1; filter: blur(0); transform: translate3d(0, 0, 0); } }
@keyframes title-splash { 0%, 100% { text-shadow: 0 3px 22px rgba(3,16,36,.23); } 44% { text-shadow: 0 0 12px rgba(255,255,255,.95), 0 0 32px rgba(205,231,255,.92), 0 0 70px rgba(144,202,255,.7); } }
@keyframes title-halo { 0%, 100% { opacity: 0; transform: scale(.7); } 45% { opacity: 1; transform: scale(1.15); } }
.cinematic-scene__copy { max-width: 420px; margin: 30px 0 0; color: #e7eff8; font-size: clamp(1rem, 1.18vw, 1.18rem); line-height: 1.7; }
.cinematic-scene__actions { display: flex; align-items: center; gap: 29px; flex-wrap: wrap; margin-top: 34px; }
.cinematic-scene__button {
  display: inline-flex; align-items: center; gap: 22px;
  padding: 16px 22px; border: 1px solid #d8e9fa;
  background: #d8e9fa; color: #112d4b; font-size: 13px;
  font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  transition: background .25s, color .25s, transform .25s;
}
.cinematic-scene__button:hover { background: #fff; color: #112d4b; transform: translateY(-2px); }
.cinematic-scene__button:active { transform: translateY(1px); }
.cinematic-scene__text-link { border-bottom: 1px solid rgba(255,255,255,.65); padding-bottom: 5px; color: #fff; font-size: 14px; transition: border-color .25s, color .25s; }
.cinematic-scene__text-link:hover { border-color: #fff; color: #fff; }
.cinematic-hero a:focus-visible, .cinematic-hero button:focus-visible, .home-about a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.cinematic-hero__controls {
  position: absolute; right: max(7vw, calc((100vw - 1480px) / 2)); bottom: 38px; z-index: 3;
  display: flex; align-items: center; gap: 16px; color: #fff;
}
.cinematic-hero__count { min-width: 50px; font-size: 11px; font-weight: 700; letter-spacing: .17em; }
.cinematic-hero__progress { width: 110px; height: 1px; background: rgba(255,255,255,.45); overflow: hidden; }
.cinematic-hero__progress span { display: block; height: 100%; width: 100%; background: #fff; transform-origin: left; transform: scaleX(0); }
.cinematic-hero.is-playing .cinematic-hero__progress span { animation: hero-progress 7.5s linear forwards; }
.cinematic-hero:hover .cinematic-hero__progress span,
.cinematic-hero:focus-within .cinematic-hero__progress span { animation-play-state: paused; }
@keyframes hero-progress { to { transform: scaleX(1); } }
.cinematic-hero__arrow { width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; background: transparent; color: #fff; cursor: pointer; font-size: 18px; line-height: 1; transition: background .25s, transform .25s; }
.cinematic-hero__arrow:hover { background: rgba(255,255,255,.2); transform: scale(1.06); }
.home-about { padding: clamp(90px, 10vw, 155px) 24px; background: #edf4fa; color: #18334f; }
.home-about__inner { max-width: 1360px; margin: auto; display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(65px, 8vw, 145px); align-items: center; }
.home-about__visual { position: relative; padding: 0 0 30px 30px; }
.home-about__visual::before { content: ''; position: absolute; left: 0; bottom: 0; width: 72%; height: 72%; border: 1px solid #8aa9c9; }
.home-about__image-wrap { position: relative; overflow: hidden; aspect-ratio: 1.05; background: #aac9e7; }
.home-about__image-wrap img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.22,.61,.36,1); }
.home-about__visual:hover img { transform: scale(1.055); }
.home-about__image-note { position: absolute; right: -17px; bottom: 3px; padding: 11px 17px; background: #edf4fa; color: #59799c; font-family: 'Playfair Display', Georgia, serif; font-size: 15px; font-style: italic; }
.home-about__eyebrow { color: #5f86af; margin-bottom: 26px; }
.home-about__title { margin: 0; max-width: 560px; color: #173b61; font-family: 'Playfair Display', Georgia, serif; font-size: clamp(3.2rem, 5vw, 6rem); font-weight: 400; letter-spacing: -.055em; line-height: 1.04; text-wrap: balance; }
.home-about__title em { color: #6893bd; font-weight: 400; }
.home-about__lead { max-width: 550px; margin-top: 32px; font-size: clamp(1.2rem, 1.5vw, 1.48rem); line-height: 1.55; color: #244765; }
.home-about__copy { max-width: 520px; margin-top: 23px; font-size: 16px; line-height: 1.85; color: #536b80; }
.home-about__footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; margin-top: 42px; }
.home-about__link { display: inline-flex; align-items: center; gap: 32px; border-bottom: 1px solid #27537a; padding-bottom: 9px; color: #173b61; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; transition: gap .25s, color .25s; }
.home-about__link:hover { gap: 40px; color: #4a82b4; }
.home-about__signature { color: #85a4c0; font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 19px; }
.home-about.is-visible .home-about__content { animation: about-rise .9s both; }
.home-about.is-visible .home-about__image-wrap { animation: about-rise 1s .12s both; }
@keyframes about-rise { from { opacity: 0; transform: translate3d(0, 35px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@media (max-width: 991px) {
  .cinematic-hero { height: min(760px, calc(100dvh - 78px)); min-height: 600px; }
  .cinematic-scene__content { width: min(520px, 55vw); margin-right: 6vw; }
  .home-about__inner { gap: 55px; }
  .home-about__visual { padding-left: 15px; }
}
@media (max-width: 767px) {
  .cinematic-hero { min-height: 620px; height: min(780px, 88dvh); }
  .cinematic-scene__picture img, .cinematic-scene:nth-child(1) .cinematic-scene__picture img, .cinematic-scene:nth-child(2) .cinematic-scene__picture img { object-position: center; }
  .cinematic-scene__shade { background: linear-gradient(0deg, rgba(5,18,37,.88) 0%, rgba(5,18,37,.60) 42%, rgba(5,18,37,.06) 85%); }
  .cinematic-scene__content { justify-content: flex-end; width: auto; margin: 0; padding: 0 24px 115px; }
  .cinematic-scene__eyebrow { margin-bottom: 16px; font-size: 10px; }
  .cinematic-scene__title { font-size: clamp(3.35rem, 12vw, 5.7rem); }
  .cinematic-scene__copy { margin-top: 20px; font-size: 15px; line-height: 1.55; }
  .cinematic-scene__actions { margin-top: 24px; gap: 18px; }
  .cinematic-scene__button { padding: 13px 16px; font-size: 11px; gap: 10px; }
  .cinematic-scene__text-link { font-size: 12px; }
  .cinematic-hero__controls { right: 24px; bottom: 25px; gap: 11px; }
  .cinematic-hero__progress { width: 70px; }
  .home-about { padding: 84px 24px 95px; }
  .home-about__inner { display: flex; flex-direction: column; gap: 53px; }
  .home-about__visual { width: 100%; max-width: 560px; }
  .home-about__image-wrap { aspect-ratio: 1.15; }
  .home-about__content { width: 100%; }
  .home-about__eyebrow { margin-bottom: 19px; }
  .home-about__title { font-size: clamp(3.2rem, 10vw, 5rem); }
  .home-about__lead { margin-top: 24px; }
  .home-about__copy { margin-top: 18px; }
  .home-about__signature { display: none; }
}
@media (max-width: 390px) {
  .cinematic-scene__title { font-size: 3.15rem; }
  .cinematic-scene__actions { gap: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .cinematic-scene, .cinematic-scene__picture img, .cinematic-scene__title-glow, .cinematic-scene__title-glow::after, .cinematic-hero__progress span, .home-about__content, .home-about__image-wrap, .home-about__image-wrap img { animation: none !important; transition: none !important; }
  .cinematic-hero__progress span { transform: scaleX(1); }
}
