/* Abertura em tela cheia: foto da Dra. Luana a direita, esmaecendo no fundo, com cabelo em movimento */
.hero { padding: 112px 0 48px; min-height: 100svh; display: flex; align-items: center; }
.hero-grade { display: block; min-height: 0; width: 100%; position: relative; z-index: 3; }
.hero-texto { max-width: min(660px, 54%); padding-bottom: 0; }
.hero h1 { font-size: clamp(2.4rem, 4.4vw, 4.2rem); }
.beneficios { max-width: 40rem; }

.hero .hero-foto {
  position: absolute; top: 0; right: 0; bottom: 0; left: auto;
  width: 66%; max-width: none; margin: 0; z-index: 0;
  transform: none !important; transition: opacity 1s var(--ease);
}
.hero .hero-foto::before { display: none; }
.palco-slides {
  position: absolute; inset: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 6%, rgba(0, 0, 0, 0.5) 24%, #000 46%);
  mask-image: linear-gradient(90deg, transparent 0, transparent 6%, rgba(0, 0, 0, 0.5) 24%, #000 46%);
}
.hero .slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s var(--ease); }
.hero .slide.ativo { opacity: 1; }

.hr-img { position: absolute; bottom: 0; right: 0; height: 100%; transform-origin: 70% 100%; animation: respira-leve 24s ease-in-out infinite alternate; }
@keyframes respira-leve { from { transform: scale(1); } to { transform: scale(1.035); } }
.hero .slide .hr-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; animation: none; display: block; }
.hr-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 214, 160, 0), rgba(255, 196, 128, 0.14)); mix-blend-mode: soft-light; pointer-events: none; }

/* regioes do cabelo (fracoes da foto) */
.r1 { --m: radial-gradient(ellipse 5.500% 15% at 49% 63%, #000 30%, transparent 100%), radial-gradient(ellipse 5.500% 13% at 63.500% 64%, #000 30%, transparent 100%); --cx: 0.56; }
.r2 { --m: radial-gradient(ellipse 10% 15% at 28% 54%, #000 30%, transparent 100%), radial-gradient(ellipse 5.500% 9% at 46% 50%, #000 30%, transparent 100%); --cx: 0.38; }
.r3 { --m: radial-gradient(ellipse 11% 15% at 30% 52%, #000 30%, transparent 100%), radial-gradient(ellipse 5.500% 8% at 50% 46%, #000 30%, transparent 100%); --cx: 0.4; }

/* efeito no cabelo: ondulacao suave + luz que desliza pelos fios */
.hr-cabelo {
  filter: url(#vento);
  -webkit-mask-image: var(--m); mask-image: var(--m);
  transform-origin: 55% 40%;
  animation: vaivem-cabelo 7s ease-in-out infinite alternate !important;
  will-change: transform;
}
@keyframes vaivem-cabelo {
  from { transform: rotate(-0.15deg) translateX(-0.8px); }
  to { transform: rotate(0.2deg) translateX(1px); }
}
.hr-brilho {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen;
  -webkit-mask-image: var(--m); mask-image: var(--m);
  background: linear-gradient(112deg, transparent 28%, rgba(255, 246, 222, 0.28) 48%, rgba(241, 223, 176, 0.14) 56%, transparent 70%);
  background-size: 280% 100%; background-position: 130% 0;
  animation: brilho-cabelo 10s ease-in-out infinite;
}
@keyframes brilho-cabelo { 0%, 12% { background-position: 130% 0; } 70%, 100% { background-position: -30% 0; } }

/* cartao de citacao e controles */
.hero .citacao { position: absolute; right: 0; left: auto; top: 25%; bottom: auto; width: 170px; z-index: 6; border-radius: 2px 0 0 2px; padding: 18px 16px 14px; border-right: 0; font-size: 1.02rem; background: rgba(251, 247, 239, 0.9); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hero .hero-nav { position: absolute; left: auto; right: 34px; bottom: 30px; z-index: 6; gap: 16px; justify-content: flex-end; }
.hero .pontos button { border-color: var(--verde); }
.hero .pontos button.ativo { background: var(--ouro); border-color: var(--ouro); }

@media (max-width: 1000px) { .hero-texto { max-width: min(560px, 58%); } }
@media (max-width: 900px) {
  .hero { flex-direction: column; align-items: stretch; padding: 104px 0 0; min-height: 0; }
  .hero-grade { order: 1; }
  .hero-texto { max-width: none; padding-bottom: 12px; }
  .hero .hero-foto { order: 2; position: relative; width: 100%; height: min(560px, 125vw); margin-top: 8px; }
  .palco-slides { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16%), linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 16%), linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%); -webkit-mask-composite: source-in; mask-composite: intersect; }
  .hr-img { right: auto; left: 50%; translate: calc(var(--cx, 0.5) * -100%) 0; }
  .hero .citacao { top: 44px; bottom: auto; width: 142px; font-size: 0.88rem; padding: 12px 12px 10px; }
  .hero .hero-nav { right: 16px; bottom: 16px; }
}
@media (max-width: 700px) { .hr-cabelo { filter: none; } }
@media (prefers-reduced-motion: reduce) { .hr-cabelo, .hr-brilho { display: none; } .hr-img { animation: none; } }

.hero .hero-foto { align-self: stretch; }