/* ══════════════════════════════════════
   HERO
══════════════════════════════════════ */
.hero {
  min-height: 100svh;
  padding: calc(var(--nav-h) + 60px) 24px 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  overflow: hidden;
  background: var(--brown-deep);
}

/*.hero-content {*/
/*    opacity: 1;*/
/*    transition: opacity .8s ease;*/
/*}*/

/*.hero-content.hide {*/
/*    opacity: 0;*/
/*}*/

/*.hero-content{*/
/*    opacity:0;*/
/*    transition:.8s;*/
/*}*/

/*.hero-content.show{*/
/*    opacity:1;*/
/*}*/

.hero-video-wrap {
  position: absolute; inset: 0;
  z-index: 0; pointer-events: none; overflow: hidden;
}
.hero-video-wrap iframe {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw; height: 56.25vw;
  min-height: 100%; min-width: 177.78vh;
  border: none;
}
.hero-video-overlay {
  position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, rgba(15,8,0,0.6) 0%, rgba(15,8,0,0.38) 40%, rgba(15,8,0,0.75) 100%),
    radial-gradient(ellipse 80% 60% at 50% 30%, rgba(42,20,0,0.55) 0%, transparent 70%);
  z-index: 1;
}

.hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;

  opacity: 1;
  transition: opacity .8s ease;
}

.hero-content.hide {
  opacity: 0;
  pointer-events: none;
}

/* Decorative diamond rings */
.hero-diamond {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  pointer-events: none; z-index: 1;
}
.hero-diamond span {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid var(--amber);
  display: block;
  animation: diamondPulse 5s ease-in-out infinite;
}
.hero-diamond span:nth-child(1) { width: 180px; height: 180px; opacity: 0.1; }
.hero-diamond span:nth-child(2) { width: 300px; height: 300px; opacity: 0.06; animation-delay: 0.8s; }
.hero-diamond span:nth-child(3) { width: 440px; height: 440px; opacity: 0.035; animation-delay: 1.6s; }

@keyframes diamondPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: inherit; }
  50% { transform: translate(-50%, -50%) scale(1.05); }
}

.hero-eyebrow {
  font-size: 0.58rem;
  letter-spacing: 0.38em;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: 22px;
  animation: fadeUp 1s ease 0.2s both;
}
.hero-eyebrow::before, .hero-eyebrow::after {
  content: '◆';
  font-size: 0.38rem;
  margin: 0 12px;
  vertical-align: middle;
  color: var(--amber-dark);
}

.hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.8rem, 9vw, 6rem);
  font-weight: 300;
  line-height: 1.05;
  color: var(--cream);
  margin-bottom: 20px;
  animation: fadeUp 1s ease 0.4s both;
}
.hero h1 em {
  font-style: italic;
  color: var(--amber);
  font-weight: 300;
}

.hero-tagline {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1rem, 2.5vw, 1.35rem);
  font-weight: 300;
  font-style: italic;
  color: var(--text-muted);
  max-width: 480px;
  margin-bottom: 44px;
  animation: fadeUp 1s ease 0.6s both;
}

.hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
  animation: fadeUp 1s ease 0.8s both;
}

.btn-primary {
  padding: 14px 36px;
  background: var(--amber);
  color: #000;
  font-family: 'Jost', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border: none;
  border-radius: 2px;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--transition), transform 0.2s;
  display: inline-block;
}
.btn-primary:hover { background: var(--amber-light); transform: translateY(-2px); }

.btn-outline {
  padding: 14px 36px;
  background: transparent;
  color: var(--cream);
  font-family: 'Jost', sans-serif;
  font-size: 0.62rem;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border: 1px solid rgba(255,248,238,0.25);
  border-radius: 2px;
  cursor: pointer;
  text-decoration: none;
  transition: border-color var(--transition), color var(--transition);
  display: inline-block;
}
.btn-outline:hover { border-color: var(--amber); color: var(--amber); }

.hero-scroll {
  position: absolute;
  bottom: 32px; left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: 2;
  animation: fadeUp 1s ease 1.2s both;
}
.hero-scroll span {
  font-size: 0.52rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--text-dim);
}
.scroll-line {
  width: 1px; height: 40px;
  background: linear-gradient(to bottom, var(--amber), transparent);
  animation: scrollDrop 2s ease-in-out infinite;
}
@keyframes scrollDrop {
  0%   { transform: scaleY(0); transform-origin: top; opacity: 1; }
  50%  { transform: scaleY(1); transform-origin: top; opacity: 1; }
  100% { transform: scaleY(1); transform-origin: bottom; opacity: 0; }
}