/* Marartes - base.css: tokens, reset, tipografia e estrutura do palco horizontal */
:root{
  /* Paleta oficial */
  --azul:#1A90CE; --preto:#000000; --branco:#FFFFFF;
  /* Tons derivados (apenas para legibilidade de textos pequenos) */
  --azul-claro:#7CCBF3; --azul-escuro:#0B6FA4; --azul-suave:#E3F2FB;
  --cinza-claro:#D9D9D9; --cinza-escuro:#2E2E2E; --erro:#B3261E;

  --fonte-titulo:'Pacifico','Brush Script MT','Segoe Script',cursive;
  --fonte-montserrat:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --fonte-texto:'Nunito',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;

  --raio:1.5rem; --raio-pq:.75rem;
  --sombra:0 1.5rem 3rem rgba(0,0,0,.35);
  --gutter:max(16px,env(safe-area-inset-left,0px));

  /* Estrutura horizontal */
  --header-h:4.75rem; --controles-h:5.4rem;
  --gap-painel:3.5rem; --gap-cards:1.75rem; --card-max-h:42rem;
  --larg-secao:min(73.5rem,calc(100vw - 3rem)); --larg-rodape:20rem;
  --pad-card:2.25rem;             /* margem interna igual nos quatro lados */
  --cta-bottom:max(1rem,env(safe-area-inset-bottom,0px));
}
@media (min-width:768px){:root{--cta-bottom:3.75rem}}   /* centro do botão na borda inferior dos cards */
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (min-width:1024px){html{font-size:112.5%}}
@media (min-width:1700px){html{font-size:118.75%}}
body{margin:0;font-family:var(--fonte-texto);font-size:1rem;line-height:1.6;color:var(--branco);background:var(--cinza-escuro);overflow-x:hidden;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,figure,blockquote,ul{margin:0}
ul{padding:0;list-style:none}
img,svg{max-width:100%;display:block}
h1,h2,h3{font-family:var(--fonte-titulo);font-weight:400;line-height:1.25;text-wrap:balance}
h1,h3{font-family:var(--fonte-montserrat);font-weight:400;line-height:1.3}
p{max-width:65ch}
a{color:inherit}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus,#7CCBF3);outline-offset:3px}
.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:fixed;left:1rem;top:-4rem;z-index:100;background:var(--preto);color:var(--branco);padding:.6rem 1rem;border-radius:var(--raio-pq);transition:top .2s}
.skip:focus{top:1rem}

/* Fundo fixo (foto) + película glass */
.bg{position:fixed;inset:0;z-index:-2;background:var(--cinza-escuro) url('../assets/fundo/poster.jpg') center/cover no-repeat}
.bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.veil{display:none}   /* película removida: o fundo não escurece nem desfoca */

/* Estrutura: mobile = rolagem vertical convencional */
.stage{position:relative}
.track{display:flex;flex-direction:column;gap:var(--gap-cards)}
.panel{padding-inline:var(--gutter)}
.panel:not(.panel--hero){scroll-margin-top:calc(var(--header-h) + .5rem)}
.panel--hero{min-height:100svh;display:flex;align-items:center;justify-content:center;padding-top:calc(var(--header-h) + 1rem);padding-bottom:2rem}
.panel:last-child{padding-bottom:2rem}

/* Desktop e tablet: rolagem lateral */
@media (min-width:768px){
  body{height:100svh;overflow:hidden}
  .stage{position:fixed;inset:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .stage::-webkit-scrollbar{display:none}
  .track{flex-direction:row;align-items:stretch;gap:var(--gap-painel);height:100%;width:max-content;padding-right:var(--gap-painel)}
  .panel{flex:0 0 auto;height:100%;display:flex;align-items:center;padding:calc(var(--header-h) + .75rem + env(safe-area-inset-top,0px)) 0 var(--controles-h)}
  .panel:not(.panel--hero){scroll-margin-top:0}
  .panel--hero{width:100vw;min-height:0;padding-inline:0;justify-content:center}
  .panel:last-child{padding-bottom:var(--controles-h)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}