.cinematic-hero {
  --cinematic-ease: cubic-bezier(.76, 0, .24, 1);
  --cinematic-gold: #e5bd70;
  background: #260910;
  color: #fff;
  height: calc(var(--hero-viewport-height, 100svh) - var(--hero-header-offset, 150px));
  isolation: isolate;
  min-height: 0;
  overflow: hidden;
  position: relative;
}
.cinematic-hero-track,
.cinematic-hero-slide,
.cinematic-hero-media,
.cinematic-hero-shade { inset: 0; position: absolute; }
.cinematic-hero-slide {
  --image-start: 50% 50%;
  --image-end: 53% 50%;
  clip-path: inset(0 100% 0 0);
  pointer-events: none;
  visibility: hidden;
  z-index: 0;
}
.cinematic-hero-slide.is-active {
  clip-path: inset(0);
  pointer-events: auto;
  visibility: visible;
  z-index: 2;
}
.cinematic-hero-slide[data-position="center-top"] { --image-start: 50% 24%; --image-end: 53% 27%; }
.cinematic-hero-slide[data-position="center-bottom"] { --image-start: 50% 76%; --image-end: 53% 73%; }
.cinematic-hero-slide[data-position="left-center"] { --image-start: 28% 50%; --image-end: 31% 50%; }
.cinematic-hero-slide[data-position="right-center"] { --image-start: 72% 50%; --image-end: 75% 50%; }
.cinematic-hero-media { overflow: hidden; }
.cinematic-hero-media img {
  height: 100%;
  object-fit: cover;
  object-position: var(--image-start);
  width: 100%;
}
.cinematic-hero-slide.is-active .cinematic-hero-media img {
  animation: cinematic-image-drift 6.6s ease-out both;
}
.cinematic-hero-shade {
  background:
    linear-gradient(90deg, rgba(28, 5, 12, .97) 0%, rgba(40, 8, 16, .9) 28%, rgba(49, 11, 20, .68) 51%, rgba(35, 7, 14, .28) 76%, rgba(20, 4, 8, .18) 100%),
    linear-gradient(0deg, rgba(18, 3, 7, .52), transparent 42%);
  overflow: hidden;
  z-index: 1;
}
.cinematic-hero-shade::after {
  background: linear-gradient(110deg, transparent 30%, rgba(255, 239, 208, .13) 49%, transparent 67%);
  content: "";
  inset: -25% -45%;
  opacity: 0;
  position: absolute;
  transform: translateX(-45%);
}
.cinematic-hero-slide.is-entering .cinematic-hero-shade::after {
  animation: cinematic-sheen 1.15s var(--cinematic-ease) both;
}
.cinematic-hero-content {
  align-items: center;
  display: flex;
  height: 100%;
  padding-bottom: 104px;
  padding-top: 34px;
  position: relative;
  z-index: 2;
}
.cinematic-hero-copy {
  background: linear-gradient(90deg, rgba(29, 6, 13, .54), rgba(29, 6, 13, .2) 78%, transparent);
  border-left: 1px solid rgba(229, 189, 112, .55);
  max-width: 790px;
  padding: 28px 40px 27px 31px;
  width: 68%;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
.cinematic-kicker {
  align-items: center;
  color: #f0dfc5;
  display: flex;
  font-size: 10px;
  font-weight: 700;
  gap: 15px;
  letter-spacing: .23em;
  line-height: 1.5;
  text-transform: uppercase;
}
.cinematic-kicker::before {
  background: var(--cinematic-gold);
  content: "";
  height: 1px;
  width: 22px;
}
.cinematic-name {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  font-weight: 600;
  margin-top: 12px;
}
.cinematic-hero-copy h1 {
  color: #fff;
  font: 400 clamp(48px, 5.05vw, 76px)/.94 Georgia, "Times New Roman", serif;
  letter-spacing: -.045em;
  margin: 12px 0 18px;
  max-width: 770px;
  text-wrap: balance;
}
.cinematic-hero-copy h1 span { display: block; }
.cinematic-description {
  color: rgba(255,255,255,.89);
  font-size: clamp(14px, 1.18vw, 17px);
  line-height: 1.55;
  margin: 0;
  max-width: 650px;
}
.cinematic-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}
.cinematic-button {
  align-items: center;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  justify-content: center;
  min-height: 47px;
  padding: 0 22px;
  transition: background .25s ease, border-color .25s ease, color .25s ease, transform .25s ease;
}
.cinematic-button.primary {
  background: linear-gradient(135deg, #f0c67b, #d99a51);
  border-color: transparent;
  color: #2b1115;
}
.cinematic-button.primary span { font-size: 17px; margin-left: 7px; }
.cinematic-button:hover { transform: translateY(-2px); }
.cinematic-button.primary:hover { background: linear-gradient(135deg, #f7d594, #e6ab63); }
.cinematic-button.phone:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.cinematic-facts {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
}
.cinematic-facts li {
  align-items: center;
  color: rgba(255,255,255,.82);
  display: flex;
  font-size: 10px;
  font-weight: 650;
  gap: 8px;
}
.cinematic-facts li::before {
  background: var(--cinematic-gold);
  border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(229,189,112,.16);
  content: "";
  height: 5px;
  width: 5px;
}
.cinematic-controls {
  align-items: center;
  background: rgba(28, 8, 14, .67);
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px;
  bottom: 22px;
  display: flex;
  gap: 9px;
  padding: 5px;
  position: absolute;
  right: max(24px, calc((100vw - 1200px) / 2));
  z-index: 8;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.cinematic-controls > button {
  align-items: center;
  background: transparent;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 50%;
  color: #fff;
  display: flex;
  font-size: 17px;
  height: 40px;
  justify-content: center;
  padding: 0;
  transition: background .2s ease, border-color .2s ease;
  width: 40px;
}
.cinematic-controls > button:hover { background: rgba(255,255,255,.12); border-color: var(--cinematic-gold); }
.cinematic-dots { align-items: center; display: flex; gap: 6px; }
.cinematic-dots button {
  background: transparent;
  border: 0;
  height: 18px;
  padding: 6px 0;
  width: 7px;
}
.cinematic-dots button span {
  background: rgba(255,255,255,.58);
  border-radius: 99px;
  display: block;
  height: 5px;
  transition: width .3s ease, background .3s ease;
  width: 5px;
}
.cinematic-dots button[aria-current="true"] { width: 29px; }
.cinematic-dots button[aria-current="true"] span { background: var(--cinematic-gold); width: 27px; }
.cinematic-counter {
  align-items: center;
  display: flex;
  font-size: 9px;
  gap: 5px;
  letter-spacing: .08em;
  min-width: 46px;
}
.cinematic-counter strong { font-size: 11px; }
.cinematic-counter i { color: rgba(255,255,255,.46); font-style: normal; }
.cinematic-explore {
  align-items: center;
  bottom: 25px;
  display: flex;
  gap: 12px;
  left: max(24px, calc((100vw - 1200px) / 2));
  position: absolute;
  z-index: 8;
}
.cinematic-explore span { font-size: 9px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.cinematic-explore i {
  align-items: center;
  border: 1px solid rgba(255,255,255,.4);
  border-radius: 50%;
  display: flex;
  font-size: 13px;
  font-style: normal;
  height: 30px;
  justify-content: center;
  width: 30px;
  animation: cinematic-down 1.8s ease-in-out infinite;
}
.cinematic-progress {
  background: rgba(255,255,255,.16);
  bottom: 0;
  height: 3px;
  left: 0;
  position: absolute;
  right: 0;
  z-index: 9;
}
.cinematic-progress span {
  background: linear-gradient(90deg, var(--cinematic-gold), #f5dbac);
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
}
.cinematic-hero:focus-visible { outline: 2px solid var(--cinematic-gold); outline-offset: -4px; }
.cinematic-hero-slide.is-entering.from-right { animation: cinematic-in-right 1.15s var(--cinematic-ease) both; visibility: visible; z-index: 3; }
.cinematic-hero-slide.is-entering.from-left { animation: cinematic-in-left 1.15s var(--cinematic-ease) both; visibility: visible; z-index: 3; }
.cinematic-hero-slide.is-leaving.to-left { animation: cinematic-out-left 1.15s var(--cinematic-ease) both; visibility: visible; z-index: 2; }
.cinematic-hero-slide.is-leaving.to-right { animation: cinematic-out-right 1.15s var(--cinematic-ease) both; visibility: visible; z-index: 2; }
.cinematic-hero-slide.is-first-load .cinematic-hero-copy > * { opacity: 0; transform: translateY(28px); filter: blur(7px); }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load .cinematic-kicker { animation: cinematic-copy-in .8s cubic-bezier(.22,1,.36,1) .08s both; }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load .cinematic-name { animation: cinematic-copy-in .8s cubic-bezier(.22,1,.36,1) .17s both; }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load h1 { animation: cinematic-copy-in .9s cubic-bezier(.22,1,.36,1) .25s both; clip-path: inset(100% 0 0); }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load .cinematic-description { animation: cinematic-copy-in .8s cubic-bezier(.22,1,.36,1) .38s both; }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load .cinematic-actions { animation: cinematic-copy-in .8s cubic-bezier(.22,1,.36,1) .5s both; }
.cinematic-hero.is-ready .cinematic-hero-slide.is-first-load .cinematic-facts { animation: cinematic-copy-in .8s cubic-bezier(.22,1,.36,1) .62s both; }
.cinematic-hero-slide.is-entering .cinematic-kicker { animation: cinematic-short-in .62s cubic-bezier(.22,1,.36,1) .22s both; }
.cinematic-hero-slide.is-entering h1 span { animation: cinematic-headline-in .72s cubic-bezier(.22,1,.36,1) .27s both; }
@keyframes cinematic-in-right { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0); } }
@keyframes cinematic-in-left { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes cinematic-out-left { from { clip-path: inset(0); } to { clip-path: inset(0 100% 0 0); } }
@keyframes cinematic-out-right { from { clip-path: inset(0); } to { clip-path: inset(0 0 0 100%); } }
@keyframes cinematic-image-drift { from { object-position: var(--image-start); transform: scale(1.055); } to { object-position: var(--image-end); transform: scale(1); } }
@keyframes cinematic-sheen { 0% { opacity: 0; transform: translateX(-45%); } 35% { opacity: 1; } 100% { opacity: 0; transform: translateX(45%); } }
@keyframes cinematic-copy-in { from { clip-path: inset(100% 0 0); filter: blur(7px); opacity: 0; transform: translateY(28px); } to { clip-path: inset(0); filter: blur(0); opacity: 1; transform: translateY(0); } }
@keyframes cinematic-short-in { from { filter: blur(5px); opacity: 0; transform: translateY(16px); } to { filter: blur(0); opacity: 1; transform: translateY(0); } }
@keyframes cinematic-headline-in { from { clip-path: inset(100% 0 0); opacity: 0; transform: translateY(22px); } to { clip-path: inset(0); opacity: 1; transform: translateY(0); } }
@keyframes cinematic-down { 0%,100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
@media (max-width: 900px) {
  .cinematic-hero-shade {
    background: linear-gradient(90deg, rgba(27,5,12,.96), rgba(38,8,17,.86) 60%, rgba(25,5,11,.55)), linear-gradient(0deg, rgba(18,3,7,.62), transparent 52%);
  }
  .cinematic-hero-content { padding-bottom: 132px; padding-top: 24px; }
  .cinematic-hero-copy { max-width: 700px; padding: 24px 28px 24px 25px; width: 100%; }
  .cinematic-hero-copy h1 { font-size: clamp(41px, 8vw, 61px); max-width: 650px; }
  .cinematic-description { max-width: 590px; }
  .cinematic-controls { right: 20px; }
  .cinematic-explore { left: 20px; }
}
@media (max-width: 600px) {
  .cinematic-hero-content { align-items: center; padding: 22px 18px 138px; }
  .cinematic-hero-copy { background: linear-gradient(90deg, rgba(25,5,12,.57), rgba(25,5,12,.16)); padding: 20px 15px 20px 19px; }
  .cinematic-kicker { font-size: 8px; gap: 10px; letter-spacing: .18em; }
  .cinematic-name { font-size: 14px; margin-top: 9px; }
  .cinematic-hero-copy h1 { font-size: clamp(41px, 11.4vw, 55px); line-height: .98; margin: 10px 0 14px; }
  .cinematic-description { font-size: 13px; line-height: 1.48; }
  .cinematic-actions { gap: 8px; margin-top: 17px; }
  .cinematic-button { font-size: 10px; min-height: 42px; padding: 0 15px; }
  .cinematic-facts { gap: 8px 14px; margin-top: 15px; }
  .cinematic-facts li { font-size: 8px; }
  .cinematic-dots { display: none; }
  .cinematic-controls { bottom: 18px; gap: 7px; right: 14px; }
  .cinematic-controls > button { height: 36px; width: 36px; }
  .cinematic-counter { min-width: 43px; }
  .cinematic-explore { bottom: 21px; left: 14px; gap: 8px; }
  .cinematic-explore span { font-size: 8px; }
  .cinematic-explore i { height: 27px; width: 27px; }
}
@media (min-width: 901px) and (max-height: 780px) {
  .cinematic-hero-content { padding-bottom: 78px; padding-top: 18px; }
  .cinematic-hero-copy { padding: 20px 34px 20px 28px; }
  .cinematic-name { margin-top: 8px; }
  .cinematic-hero-copy h1 { font-size: clamp(42px, 4.55vw, 64px); margin: 8px 0 12px; }
  .cinematic-description { font-size: 14px; line-height: 1.45; }
  .cinematic-actions { margin-top: 14px; }
  .cinematic-button { min-height: 42px; padding-inline: 19px; }
  .cinematic-facts { margin-top: 11px; }
  .cinematic-controls { bottom: 15px; }
  .cinematic-explore { bottom: 18px; }
}
@media (max-width: 600px) and (max-height: 740px) {
  .cinematic-hero-content { padding: 12px 14px 94px; }
  .cinematic-hero-copy { padding: 14px 13px 14px 15px; }
  .cinematic-kicker { font-size: 7px; }
  .cinematic-name { font-size: 12px; margin-top: 7px; }
  .cinematic-hero-copy h1 { font-size: clamp(34px, 10vw, 42px); margin: 7px 0 10px; }
  .cinematic-description { font-size: 11.5px; line-height: 1.4; }
  .cinematic-actions { margin-top: 12px; }
  .cinematic-button { min-height: 38px; padding-inline: 12px; }
  .cinematic-facts { margin-top: 9px; }
  .cinematic-controls { bottom: 13px; }
  .cinematic-explore { bottom: 16px; }
}
@media (max-width: 390px) {
  .cinematic-hero-copy h1 { font-size: 41px; }
  .cinematic-description { font-size: 12px; }
  .cinematic-facts li:nth-child(3) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .cinematic-hero *, .cinematic-hero *::before, .cinematic-hero *::after { animation: none!important; transition: none!important; }
  .cinematic-hero-slide.is-entering,
  .cinematic-hero-slide.is-leaving { clip-path: inset(0); }
  .cinematic-hero-slide.is-first-load .cinematic-hero-copy > * { clip-path: none; filter: none; opacity: 1; transform: none; }
  .cinematic-hero-media img { object-position: var(--image-start)!important; transform: none!important; }
  .cinematic-progress { display: none; }
}