/* ============================================================
   Laguna Magnólia — Passe de Visita
   Fundação: fontes reais da marca + tokens + primitivas
   ============================================================ */

@font-face{
  font-family:'Vogun'; src:url('../assets/fonts/vogun-medium.woff2') format('woff2');
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Averta'; src:url('../assets/fonts/averta-regular.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Averta'; src:url('../assets/fonts/averta-semibold.woff2') format('woff2');
  font-weight:600; font-style:normal; font-display:swap;
}

:root{
  /* Paleta oficial do manual de marca */
  --mata:#454F34;
  --mata-deep:#2F3623;
  --mata-night:#1A2014;
  --grama:#8EA556;
  --grama-lift:#A8BE6E;
  --areia:#E1D3B7;
  --areia-pale:#F3EBDA;
  --sunset:#EF7733;

  --ink:#1A2014;
  --ink-soft:rgba(26,32,20,.62);
  --paper:#FAF8F2;

  --on-dark:#F6F3E9;
  --on-dark-soft:rgba(246,243,233,.72);
  --on-dark-faint:rgba(246,243,233,.46);

  --ease:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.32,.72,0,1);

  --z-bg:0; --z-scrim:10; --z-content:20; --z-ui:40; --z-modal:100;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  font-family:'Averta','Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px; line-height:1.6;
  color:var(--ink); background:var(--paper);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

h1,h2,h3,h4{margin:0; font-weight:500; text-wrap:balance}
p{margin:0}
img,video{display:block; max-width:100%}

/* Foco visível sempre — nunca remover */
:focus-visible{
  outline:2px solid var(--grama-lift);
  outline-offset:3px;
  border-radius:2px;
}

/* Tipografia de marca ------------------------------------------------- */
.vogun{font-family:'Vogun',Georgia,serif; font-weight:500; letter-spacing:-.015em}

.display{
  font-family:'Vogun',Georgia,serif; font-weight:500;
  font-size:clamp(2.3rem,7.5vw,4.1rem); line-height:1.02; letter-spacing:-.025em;
}
.display-sm{
  font-family:'Vogun',Georgia,serif; font-weight:500;
  font-size:clamp(1.7rem,4.6vw,2.5rem); line-height:1.08; letter-spacing:-.02em;
}

/* Segunda linha em caixa-alta — assinatura do Modelo B */
.caps{
  font-family:'Vogun',Georgia,serif; text-transform:uppercase;
  font-size:clamp(1.05rem,3vw,1.5rem); letter-spacing:.055em; line-height:1.2;
}

.eyebrow{
  font-size:.66rem; text-transform:uppercase; letter-spacing:.22em;
  font-weight:600; color:var(--on-dark-faint);
}

/* Régua verde — assinatura visual obrigatória da marca */
.regua{height:4px; width:56px; background:var(--grama); border:0; margin:0; flex:none}
.regua-sm{height:3px; width:40px}

.tabular{font-variant-numeric:tabular-nums}

/* Botões -------------------------------------------------------------- */
.btn{
  font-family:inherit; font-size:.95rem; font-weight:600;
  padding:1.05rem 2rem; min-height:52px;
  border-radius:999px; border:0; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  transition:transform .3s var(--ease), background-color .3s var(--ease),
             color .3s var(--ease), border-color .3s var(--ease), opacity .3s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.btn:active:not(:disabled){transform:scale(.977)}
.btn:disabled{opacity:.34; cursor:not-allowed}

.btn-primary{background:var(--areia-pale); color:var(--mata-deep)}
.btn-primary:hover:not(:disabled){background:#fff}

.btn-ghost{
  background:transparent; color:var(--on-dark);
  border:1.5px solid rgba(246,243,233,.34);
}
.btn-ghost:hover:not(:disabled){border-color:rgba(246,243,233,.7); background:rgba(246,243,233,.06)}

.btn-solid{background:var(--mata); color:var(--areia-pale)}
.btn-solid:hover:not(:disabled){background:var(--mata-deep)}

/* Camada de vídeo ----------------------------------------------------- */
.vlayer{position:fixed; inset:0; z-index:var(--z-bg); overflow:hidden; background:var(--mata-night)}
.vlayer video,.vlayer .vposter{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0;
  transition:opacity 1.15s var(--ease);
}
.vlayer video.on,.vlayer .vposter.on{opacity:1}
/* Leve deriva de escala: dá vida sem custar reflow */
@media (prefers-reduced-motion:no-preference){
  .vlayer video.on{animation:drift 26s ease-in-out infinite alternate}
}
@keyframes drift{from{transform:scale(1.04)} to{transform:scale(1.12)}}

/* Scrim: topo e base mais escuros, centro respira */
.scrim{
  position:fixed; inset:0; z-index:var(--z-scrim); pointer-events:none;
  background:
    linear-gradient(180deg, rgba(20,25,14,.80) 0%, rgba(20,25,14,.34) 26%,
                            rgba(20,25,14,.30) 58%, rgba(20,25,14,.86) 100%);
}

/* Grão sutil — textura de filme, nunca ruído visível */
.grain{
  position:fixed; inset:0; z-index:var(--z-scrim); pointer-events:none; opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Utilitários --------------------------------------------------------- */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip{
  position:absolute; left:-999px; top:0; z-index:var(--z-modal);
  background:var(--areia-pale); color:var(--mata-deep);
  padding:.9rem 1.4rem; border-radius:0 0 4px 0; font-weight:600;
}
.skip:focus{left:0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}
