.p-hero { position: relative; min-height: min(820px, calc(100svh - var(--cb-header))); overflow: hidden; background: #020302; isolation: isolate; perspective: 1500px; }
.p-hero__interior, .p-hero__left, .p-hero__door, .p-hero__shade { position: absolute; inset: 0; }
.p-hero__interior { background: #050504 url("../../../assets/img/hero-interior.webp") center / cover no-repeat; transform: scale(1.04); }
.p-hero__left, .p-hero__door { background: #000 url("../../../assets/img/hero-door.webp") center / cover no-repeat; will-change: transform, opacity; }
.p-hero__left { z-index: 2; clip-path: polygon(0 0, 41% 0, 41% 100%, 0 100%); }
.p-hero__door { z-index: 3; clip-path: polygon(40% 0, 100% 0, 100% 100%, 40% 100%); transform-origin: 100% 50%; }
.p-hero__shade { z-index: 4; background: linear-gradient(90deg, rgba(0,0,0,.90) 0%, rgba(0,0,0,.62) 36%, rgba(0,0,0,.18) 68%, rgba(0,0,0,.48) 100%), linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.20) 65%, rgba(0,0,0,.64)); pointer-events: none; }
.p-hero__content { position: relative; z-index: 5; display: flex; min-height: inherit; width: min(calc(100% - 96px), 1360px); margin-inline: auto; flex-direction: column; justify-content: center; align-items: flex-start; padding: 70px 0 50px; }
.p-hero__eyebrow { margin-bottom: 18px; font-family: var(--cb-serif); font-size: 12px; letter-spacing: .16em; color: var(--cb-gold); text-transform: uppercase; }
.p-hero__title { max-width: 580px; font-family: var(--cb-serif); font-size: clamp(38px, 5.2vw, 72px); font-weight: 400; line-height: 1.34; letter-spacing: .09em; text-shadow: 0 4px 32px #000; }
.p-hero__en { margin-top: 20px; font-family: var(--cb-serif); font-size: clamp(17px, 2vw, 24px); line-height: 1.5; letter-spacing: .035em; color: var(--cb-gold-bright); }
.p-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 36px; }
.p-hero__hint { position: absolute; right: 28px; bottom: 22px; z-index: 5; font-family: var(--cb-serif); font-size: 9px; letter-spacing: .2em; color: rgba(238,229,209,.62); writing-mode: vertical-rl; }
html:not(.casablanca-hero-seen) .p-hero.is-opening .p-hero__door { animation: cb-door-open 1.7s cubic-bezier(.32,.05,.24,1) forwards; }
html:not(.casablanca-hero-seen) .p-hero.is-opening .p-hero__left { animation: cb-left-fade 1.8s ease .2s forwards; }
html:not(.casablanca-hero-seen) .p-hero.is-opening .p-hero__content { animation: cb-copy-in 1s ease .8s both; }
html.casablanca-hero-seen .p-hero__door, .p-hero.is-open .p-hero__door { transform: translateX(11%) rotateY(-10deg); opacity: .34; }
html.casablanca-hero-seen .p-hero__left, .p-hero.is-open .p-hero__left { opacity: .52; }
@keyframes cb-door-open { 0% { transform: translateX(0) rotateY(0); opacity: 1; } 100% { transform: translateX(11%) rotateY(-10deg); opacity: .34; } }
@keyframes cb-left-fade { to { opacity: .52; } }
@keyframes cb-copy-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .p-hero__door { transform: translateX(11%) rotateY(-10deg); opacity: .34; } .p-hero__left { opacity: .52; } }
@media (max-width: 767px) {
  .p-hero { min-height: calc(100svh - var(--cb-header)); }
  .p-hero__interior, .p-hero__left, .p-hero__door { background-position: 58% center; }
  .p-hero__left { clip-path: polygon(0 0, 32% 0, 32% 100%, 0 100%); }
  .p-hero__door { clip-path: polygon(31% 0, 100% 0, 100% 100%, 31% 100%); }
  .p-hero__shade { background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.32) 38%, rgba(0,0,0,.90) 88%); }
  .p-hero__content { width: calc(100% - 28px); justify-content: flex-end; padding: 100px 0 56px; }
  .p-hero__eyebrow { margin-bottom: 10px; font-size: 9px; }
  .p-hero__title { font-size: clamp(31px, 10vw, 48px); line-height: 1.32; }
  .p-hero__en { margin-top: 12px; font-size: 15px; }
  .p-hero__actions { gap: 8px; margin-top: 24px; }
  .p-hero__hint { display: none; }
}
