/* A short typographic opening; the storefront photograph never moves. */
.hero.hero-cinematic { height: auto; min-height: 600px; }
.hero-cinematic .hero-content { z-index: 2; }
.hero-cinematic h1 { perspective: 1000px; }
.hero-cinematic .title-word { white-space: nowrap; }
.hero-cinematic .title-letter {
  display: inline-block;
  transform-origin: 50% 85%;
  text-shadow: 0 1px 0 #fff2, 0 3px 0 #161a1680, 0 10px 18px #0009;
}
.hero-cinematic .title-florian .title-letter {
  color: #dbb879;
  text-shadow: 0 1px 0 #f3d7a070, 0 3px 1px #624719a0, 0 10px 18px #0009;
}
.hero-cinematic .hero-subtitle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 21px;
  letter-spacing: .22em;
  margin: 18px 0 17px;
}
.hero-trade-group { display: inline-flex; flex-wrap: wrap; max-width: 100%; align-items: center; justify-content: center; gap: 8px 21px; }
.hero-trade { display: inline-block; position: relative; white-space: nowrap; }
.hero-trades-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.hero-trade + .hero-trade::before,
.hero-trade-group + .hero-trade-group::before {
  content: '';
  width: 2px;
  height: 2px;
  background: #d3b274;
  flex: none;
  transform: rotate(45deg);
}
.hero-trade + .hero-trade::before { position: absolute; left: -12px; top: 50%; }
.hero-cinema-aura,
.hero-cinema-beam { position: absolute; pointer-events: none; z-index: 1; opacity: 0; }
.hero-cinema-aura {
  inset: 15% 0 18%;
  background: radial-gradient(ellipse at 50% 50%, #ddbb763b, #bea06210 35%, transparent 67%);
}
.hero-cinema-beam {
  inset: 25% -60% 16%;
  background: linear-gradient(108deg, transparent 43%, #f3d6a00c 47%, #f8e7c052 50%, #f5ddb415 52%, transparent 57%);
  mix-blend-mode: screen;
}
@media (prefers-reduced-motion: no-preference) {
  .hero-cinematic.has-motion .hero-cinema-aura { animation: mf-cinema-aura 2800ms 120ms both; }
  .hero-cinematic.has-motion .hero-cinema-beam { animation: mf-cinema-beam 1900ms 700ms both; }
  .hero-cinematic.has-motion .eyebrow::before,
  .hero-cinematic.has-motion .eyebrow::after { animation: mf-cinema-rule 1200ms 120ms both; }
  .hero-cinematic.has-motion .eyebrow::before { transform-origin: right; }
  .hero-cinematic.has-motion .eyebrow::after { transform-origin: left; }
  .hero-cinematic.has-motion h1 em { animation: none; background: none; color: #dbb879; }
  .hero-cinematic.has-motion .hero-scroll span { animation: none; }
  @supports (background-clip: text) {
    .hero-cinematic.has-motion .title-florian .title-letter {
      color: transparent;
      background-image: linear-gradient(110deg, #c39b56 30%, #e9c98e 42%, #fff5d8 50%, #e8c78b 58%, #c7a15e 70%);
      background-size: 320% 100%;
      background-position: 100% 50%;
      background-clip: text;
      -webkit-background-clip: text;
      text-shadow: 0 3px 1px #7a58221f, 0 10px 18px #0005;
      animation: mf-cinema-gold 1400ms calc(1050ms + var(--letter-order, 0) * 55ms) both;
    }
  }
}
@keyframes mf-cinema-aura {
  0% { opacity: 0; transform: scale(.8); }
  40% { opacity: .85; }
  100% { opacity: 0; transform: scale(1.1); }
}
@keyframes mf-cinema-beam {
  0% { opacity: 0; transform: translateX(-28%); }
  22% { opacity: .75; }
  75% { opacity: .38; }
  100% { opacity: 0; transform: translateX(28%); }
}
@keyframes mf-cinema-rule { from { transform: scaleX(0); opacity: 0; } to { transform: scaleX(1); opacity: .7; } }
@keyframes mf-cinema-gold { from { background-position: 100% 50%; } to { background-position: 0% 50%; } }
@media (max-width: 760px) {
  .hero.hero-cinematic { height: auto; min-height: 674px; }
  .hero-cinematic .hero-content { padding-bottom: 67px; }
  .hero-cinematic .hero-subtitle { flex-direction: column; gap: 9px; font-size: .61rem; letter-spacing: .17em; margin: 21px 0 17px; }
  .hero-cinematic .hero-trade-group { gap: 20px; }
  .hero-trade-group + .hero-trade-group::before { display: none; }
  .hero-cinematic .hero-cinema-aura { inset: 27% -25% 24%; }
  .hero-cinematic .hero-cinema-beam { inset: 29% -70% 34%; }
}
@media (max-width: 375px) {
  .hero-cinematic .hero-subtitle { font-size: .56rem; letter-spacing: .13em; }
  .hero-cinematic .hero-trade-group { gap: 17px; }
  .hero-cinematic .hero-trade + .hero-trade::before { left: -10px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-cinema-aura, .hero-cinema-beam { display: none; }
  .hero-cinematic .title-letter { animation: none !important; transform: none !important; }
}