:root {
  --page-bg: #04060a;
  --gold: #C39D4E;
  --gold-soft: rgba(239,155,50,.78);
  --sun-glint: rgba(255, 248, 210, .98);
  --panel-bg: rgba(5, 8, 13, .84);
}
* { box-sizing: border-box; }
html, body {
  margin: 0;
  min-height: 100vh;
  background: var(--page-bg);
  overflow: hidden;
}
body {
  display: grid;
  place-items: center;
  font-family: Montserrat, Arial, sans-serif;
}
.hero {
  width: 100vw;
  min-height: 100vh;
  display: grid;
  place-items: center;
  opacity: 0;
  transition: opacity 700ms ease;
}
body.is-loaded .hero { opacity: 1; }
.scene-frame {
  position: relative;
  width: max(100vw, calc(100vh * 2.0982));
  height: max(100vh, calc(100vw / 2.0982));
  overflow: hidden;
  background: #04060a;
}
.parallax-scene,
.ui-layer,
.static-logo-zone {
  position: absolute;
  inset: 0;
}
.parallax-scene { z-index: 2; pointer-events: none; }
.ui-layer { z-index: 3; }
.parallax-scene.is-active { opacity: 1; }
.base-layer,
.parallax-layer,
.logo-layer,
.logo-glint,
.headline-layer,
.message-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;
}
.base-layer { transform: scale(1.014); }
.parallax-layer {
  will-change: transform;
  transition: transform 170ms ease-out;
}
.depth-back { transform: scale(1.024); }
.depth-mid { transform: scale(1.032); }
.depth-cypress { transform: scale(1.048); }
.depth-front { transform: scale(1.072); }
.static-logo-zone {
  z-index: 4;
  pointer-events: none;
}
.logo-layer {
  z-index: 1;
  pointer-events: none;
  transform: translate3d(0,0,0);
}

.headline-layer {
  z-index: 4;
  pointer-events: none;
}
.message-stack {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}
.message-card {
  position: absolute;
  inset: 0;
  display: none;
  pointer-events: none;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: default;
}
.message-card.is-active {
  display: block;
  pointer-events: none;
}
.message-card img { display: block; }
.card-hit {
  position: absolute;
  left: 26.58%;
  top: 85.22%;
  width: 46.84%;
  height: 9.18%;
  z-index: 3;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  appearance: none;
  pointer-events: auto;
  cursor: pointer;
}
.card-hit:focus-visible,
.social-hit:focus-visible {
  outline: 2px solid rgba(255,244,194,.9);
  outline-offset: 3px;
}

.social-hit {
  position: absolute;
  top: 85.2%;
  height: 4.1%;
  z-index: 3;
  pointer-events: auto;
  cursor: pointer;
}
.social-instagram { left: 52.1%; width: 9.2%; }
.social-youtube { left: 63.1%; width: 10.7%; }

.page-loader {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  gap: 18px;
  align-content: center;
  background:
    radial-gradient(circle at center, rgba(14,23,35,.84), rgba(4,6,10,.98) 58%, #020306 100%);
  transition: opacity 620ms ease, visibility 620ms ease;
}
body.is-loaded .page-loader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.loader-logo-wrap {
  position: relative;
  width: min(520px, 72vw);
  aspect-ratio: 2659 / 733;
  overflow: hidden;
  filter: drop-shadow(0 0 24px rgba(195,157,78,.18));
}
.loader-logo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
}
.loader-logo-base {
  opacity: .18;
  filter: grayscale(1) brightness(.8);
}
.loader-logo-reveal {
  opacity: .96;
  clip-path: inset(0 100% 0 0);
  animation: logoReveal 1800ms cubic-bezier(.2,.9,.2,1) forwards;
}
.loader-logo-sheen {
  opacity: 0;
  filter: brightness(3.1) saturate(1.05) drop-shadow(0 0 10px rgba(255,248,210,.82));
  -webkit-mask-image: linear-gradient(105deg, transparent 0%, transparent 43%, #000 49%, #000 52%, transparent 59%, transparent 100%);
  mask-image: linear-gradient(105deg, transparent 0%, transparent 43%, #000 49%, #000 52%, transparent 59%, transparent 100%);
  -webkit-mask-size: 260% 100%;
  mask-size: 260% 100%;
  -webkit-mask-position: 130% 0;
  mask-position: 130% 0;
  animation: logoSheen 1700ms ease-in-out 260ms forwards;
}
@keyframes logoReveal {
  0% { clip-path: inset(0 100% 0 0); filter: blur(2px) brightness(.78); }
  72% { clip-path: inset(0 0 0 0); filter: blur(.35px) brightness(1.12); }
  100% { clip-path: inset(0 0 0 0); filter: blur(0) brightness(1); }
}
@keyframes logoSheen {
  0% { -webkit-mask-position: 130% 0; mask-position: 130% 0; opacity: 0; }
  15% { opacity: .95; }
  86% { opacity: .95; }
  100% { -webkit-mask-position: -90% 0; mask-position: -90% 0; opacity: 0; }
}

.contact-modal {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 220ms ease, visibility 220ms ease;
}
.contact-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.contact-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 5, 10, .48);
  backdrop-filter: blur(12px) saturate(1.18);
}
.contact-panel {
  position: relative;
  width: min(560px, 100%);
  max-height: min(88vh, 720px);
  overflow: auto;
  padding: 32px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)),
    linear-gradient(145deg, rgba(14,23,35,.30), rgba(5,8,13,.20));
  backdrop-filter: blur(30px) saturate(1.34);
  -webkit-backdrop-filter: blur(30px) saturate(1.34);
  box-shadow: 0 24px 80px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.22), 0 0 70px rgba(195,157,78,.10);
  color: #fff;
}
.modal-close {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: rgba(236, 238, 242, .64);
  color: #0E1723;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.modal-kicker {
  margin: 0 0 8px;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 12px;
}
.contact-panel h2 {
  margin: 0 0 10px;
  font-size: clamp(26px, 4vw, 38px);
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 500;
}
.modal-copy {
  margin: 0 0 22px;
  color: rgba(255,255,255,.72);
  line-height: 1.5;
}
.contact-form {
  display: grid;
  gap: 14px;
}
.contact-form label {
  display: grid;
  gap: 7px;
  color: rgba(255,255,255,.82);
  font-size: 13px;
}
.contact-form input,
.contact-form textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  padding: 13px 14px;
  background: rgba(236, 238, 242, .64);
  color: #0E1723;
  outline: none;
  font: inherit;
}
.contact-form input:focus,
.contact-form textarea:focus {
  border-color: rgba(195,157,78,.78);
  box-shadow: 0 0 0 3px rgba(195,157,78,.16);
}
.submit-contact {
  margin-top: 6px;
  border: 0;
  border-radius: 999px;
  padding: 14px 18px;
  background: linear-gradient(90deg, #C39D4E, #E8C16A, #C39D4E);
  color: #0E1723;
  font-weight: 700;
  cursor: pointer;
}
@media (max-width: 900px) {
  .scene-frame { width: 100vw; }
  .social-hit { top: 84.7%; height: 4.6%; }
}
@media (max-width: 520px) {
  .social-hit { top: 84.4%; height: 4.9%; }
  .contact-panel { padding: 26px 20px; border-radius: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  * , *::before, *::after {
    transition: none !important;
    animation: none !important;
  }
  .loader-logo-reveal { clip-path: inset(0 0 0 0); }
}

.website-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}
.form-status {
  min-height: 1.25em;
  margin: 2px 0 0;
  color: rgba(255,255,255,.82);
  font-size: 13px;
}
.form-status.is-success { color: #f6e3a6; }
.form-status.is-error { color: #ffd0d0; }


/* V7.5: JS limpo, parallax e cards rotativos restaurados. */

/* V7.6:
   - cena em modo cover para eliminar faixa preta inferior;
   - brilho da logo menor e mais intenso;
   - sem preloader.
*/

/* V7.7:
   - Mantém ajustes visuais da v7.6.
   - Formulário passa a usar SMTP autenticado via Gmail no contact.php.
*/

/* V7.8:
   - brilho da logo ainda menor e mais intenso;
   - mantém cena sem preloader e em modo cover;
   - formulário em modo diagnóstico SMTP temporário.
*/

/* V7.9:
   - brilho redesenhado como specular highlight/lens glint;
   - removido aspecto de círculo branco simples;
   - mantém SMTP Gmail da v7.8, exigindo colar novamente a senha de aplicativo no contact.php.
*/


/* Preloader v8: voltou com segurança. Não bloqueia a página se algum asset falhar. */
.page-loader {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  gap: 18px;
  align-content: center;
  background:
    radial-gradient(circle at center, rgba(14,23,35,.84), rgba(4,6,10,.98) 58%, #020306 100%);
  transition: opacity 620ms ease, visibility 620ms ease;
  animation: loaderFailsafeHide 420ms ease 3.4s forwards;
}
body.is-loaded .page-loader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes loaderFailsafeHide {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}
.loader-logo-wrap {
  position: relative;
  width: min(520px, 72vw);
  aspect-ratio: 2659 / 733;
  overflow: visible;
  filter: drop-shadow(0 0 24px rgba(195,157,78,.18));
}
.loader-logo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
}
.loader-logo-base {
  opacity: .18;
  filter: grayscale(1) brightness(.8);
}
.loader-logo-reveal {
  opacity: .96;
  clip-path: inset(0 100% 0 0);
  animation: logoReveal 1800ms cubic-bezier(.2,.9,.2,1) forwards;
}
.loader-logo-sheen {
  opacity: 0;
  filter: brightness(3.1) saturate(1.05) drop-shadow(0 0 10px rgba(255,248,210,.82));
  -webkit-mask-image: linear-gradient(105deg, transparent 0%, transparent 43%, #000 49%, #000 52%, transparent 59%, transparent 100%);
  mask-image: linear-gradient(105deg, transparent 0%, transparent 43%, #000 49%, #000 52%, transparent 59%, transparent 100%);
  -webkit-mask-size: 260% 100%;
  mask-size: 260% 100%;
  -webkit-mask-position: 130% 0;
  mask-position: 130% 0;
  animation: logoSheen 1700ms ease-in-out 260ms forwards;
}
@keyframes logoReveal {
  0% { clip-path: inset(0 100% 0 0); filter: blur(2px) brightness(.78); }
  72% { clip-path: inset(0 0 0 0); filter: blur(.35px) brightness(1.12); }
  100% { clip-path: inset(0 0 0 0); filter: blur(0) brightness(1); }
}
@keyframes logoSheen {
  0% { -webkit-mask-position: 130% 0; mask-position: 130% 0; opacity: 0; }
  15% { opacity: .95; }
  86% { opacity: .95; }
  100% { -webkit-mask-position: -90% 0; mask-position: -90% 0; opacity: 0; }
}

/* V8:
   - preloader restaurado com failsafe;
   - brilho dividido em reflexo na logo + reflexo ambiental curto;
   - raios reduzidos para não parecerem artificiais.
*/

/* V8.1:
   - mantém preloader e SMTP funcionando;
   - raios ambientais voltam a aparecer;
   - raios em múltiplas direções, curtos e menos artificiais.
*/

/* V8.2:
   - bolinha reduzida ao mínimo;
   - raios solares mais pronunciados;
   - múltiplas direções, sem voltar a parecer cruz artificial.
*/

/* V8.3:
   - última tentativa do brilho:
   - hotspot mantido pequeno;
   - raios curtos e visíveis em múltiplas direções;
   - removido atraso/transition do brilho.
*/


/* V8.4:
   - correção real dos raios: flare local com position absolute;
   - hotspot mínimo;
   - raios curtos e visíveis;
   - otimização para reduzir lag.
*/


/* V8.5 — flare profissional:
   - núcleo mínimo;
   - raios individuais com comprimentos e opacidades diferentes;
   - rotação sutil baseada no movimento do mouse;
   - halo curto para integrar a luz ao ambiente sem virar mancha branca. */
.glint-flare {
  position: absolute;
  left: 0;
  top: 0;
  width: 156px;
  height: 156px;
  z-index: 7;
  pointer-events: none;
  opacity: 0;
  transform:
    translate3d(
      calc(var(--glint-left, -999px) - 78px),
      calc(var(--glint-top, -999px) - 78px),
      0
    )
    rotate(var(--flare-angle, 0deg))
    scale(var(--flare-scale, 1));
  transform-origin: 50% 50%;
  mix-blend-mode: screen;
  will-change: transform, opacity;
  transition: opacity 16ms linear;
  contain: layout paint style;
}

.static-logo-zone.is-glint .glint-flare {
  opacity: 1;
}

.flare-layer,
.flare-ray {
  position: absolute;
  pointer-events: none;
  display: block;
}

.flare-layer {
  inset: 0;
  border-radius: 50%;
}

/* Halo curto e sofisticado: visível só o suficiente para criar profundidade. */
.flare-bloom {
  background:
    radial-gradient(circle at 50% 50%,
      rgba(255,255,245,.30) 0 3px,
      rgba(255,235,165,.16) 4px 11px,
      rgba(255,205,95,.055) 12px 25px,
      transparent 36px);
  filter: blur(.55px) brightness(1.35);
  opacity: .78;
}

/* Prisma/variação angular muito sutil, para fugir da cruz artificial. */
.flare-prism {
  background:
    conic-gradient(from 12deg at 50% 50%,
      transparent 0deg,
      rgba(255,255,255,.18) 14deg,
      transparent 24deg,
      rgba(255,228,142,.14) 46deg,
      transparent 61deg,
      rgba(255,255,255,.12) 93deg,
      transparent 112deg,
      rgba(255,220,118,.11) 151deg,
      transparent 168deg,
      rgba(255,255,255,.10) 209deg,
      transparent 233deg,
      rgba(255,233,158,.13) 284deg,
      transparent 306deg,
      rgba(255,255,255,.14) 337deg,
      transparent 360deg);
  -webkit-mask-image:
    radial-gradient(circle at 50% 50%,
      transparent 0 5px,
      rgba(0,0,0,.88) 6px 20px,
      rgba(0,0,0,.38) 21px 38px,
      transparent 48px);
  mask-image:
    radial-gradient(circle at 50% 50%,
      transparent 0 5px,
      rgba(0,0,0,.88) 6px 20px,
      rgba(0,0,0,.38) 21px 38px,
      transparent 48px);
  filter: brightness(2.55) contrast(1.4);
  opacity: .74;
}

/* Raios reais: linhas independentes. Não são só 4 pontas. */
.flare-ray {
  left: 50%;
  top: 50%;
  width: var(--ray-length, 46px);
  height: var(--ray-weight, 1.1px);
  transform-origin: 0 50%;
  transform:
    rotate(var(--ray-angle))
    translateX(2px)
    scaleX(var(--ray-scale, 1));
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.96) 0,
      rgba(255,246,205,.72) 12%,
      rgba(255,224,132,.44) 38%,
      rgba(255,214,112,.18) 64%,
      transparent 100%);
  border-radius: 999px;
  filter:
    brightness(var(--ray-bright, 1.8))
    contrast(1.35)
    drop-shadow(0 0 1.4px rgba(255,242,190,.48));
  opacity: var(--ray-opacity, .70);
}

/* Comprimentos irregulares: parece luz refletida, não ícone de estrela. */
.ray-01 { --ray-angle: 0deg;   --ray-length: 48px; --ray-weight: 1.25px; --ray-opacity: .82; --ray-bright: 2.1; }
.ray-02 { --ray-angle: 31deg;  --ray-length: 32px; --ray-weight: .75px; --ray-opacity: .46; --ray-bright: 1.65; }
.ray-03 { --ray-angle: 63deg;  --ray-length: 43px; --ray-weight: .95px; --ray-opacity: .68; --ray-bright: 1.9; }
.ray-04 { --ray-angle: 104deg; --ray-length: 27px; --ray-weight: .65px; --ray-opacity: .38; --ray-bright: 1.55; }
.ray-05 { --ray-angle: 137deg; --ray-length: 39px; --ray-weight: .9px;  --ray-opacity: .54; --ray-bright: 1.75; }
.ray-06 { --ray-angle: 181deg; --ray-length: 44px; --ray-weight: 1.05px; --ray-opacity: .74; --ray-bright: 2.0; }
.ray-07 { --ray-angle: 222deg; --ray-length: 30px; --ray-weight: .72px; --ray-opacity: .44; --ray-bright: 1.6; }
.ray-08 { --ray-angle: 256deg; --ray-length: 36px; --ray-weight: .82px; --ray-opacity: .58; --ray-bright: 1.8; }
.ray-09 { --ray-angle: 294deg; --ray-length: 25px; --ray-weight: .62px; --ray-opacity: .34; --ray-bright: 1.5; }
.ray-10 { --ray-angle: 326deg; --ray-length: 41px; --ray-weight: .9px;  --ray-opacity: .62; --ray-bright: 1.85; }

/* Estrela central curta: apenas pontua o reflexo, não domina. */
.flare-star {
  background:
    radial-gradient(ellipse 20px .65px at 50% 50%,
      rgba(255,255,255,.74) 0,
      rgba(255,238,168,.36) 46%,
      transparent 75%),
    radial-gradient(ellipse .65px 18px at 50% 50%,
      rgba(255,255,255,.54) 0,
      rgba(255,238,168,.24) 46%,
      transparent 75%);
  filter:
    brightness(3.4)
    contrast(1.5)
    drop-shadow(0 0 2px rgba(255,242,190,.36));
  transform: rotate(calc(var(--flare-angle, 0deg) * -1 + 18deg));
  opacity: .82;
}

/* Núcleo quase da ponta do cursor: branco-amarelado, bem intenso. */
.flare-core {
  background:
    radial-gradient(circle at 50% 50%,
      rgba(255,255,255,1) 0 1.35px,
      rgba(255,252,225,1) 1.45px 2.35px,
      rgba(255,222,108,1) 2.45px 3.7px,
      rgba(255,203,75,.42) 3.8px 5.2px,
      transparent 5.6px);
  filter:
    brightness(2.15)
    contrast(1.45)
    drop-shadow(0 0 2px rgba(255,255,255,1))
    drop-shadow(0 0 5px rgba(255,228,142,.95));
  opacity: 1;
}

/* V8.5:
   - flare com raios individuais;
   - movimento mais orgânico;
   - acabamento mais próximo de efeito premium.
*/
