/* ARCO PASS · tokens v2
   Voz: resort de praia com herança italiana. Bodoni Moda (títulos, eixo óptico) + Rubik (a fonte do site oficial do resort).
   Cores oficiais do site: #E86624 (laranja), #FDC110 (amarelo), #24CFDE (ciano). Pétalas do logo na assinatura.
   Contraste: texto secundário 8,6:1 sobre a superfície (AAA). */
@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..800;1,6..96,400..600&family=Rubik:wght@400;500;600&display=swap");

:root {
  /* paleta base */
  --papel: #F4EEE3;
  --papel-2: #EAE1D2;
  --superficie: #FFFCF6;
  --tinta: #102A33;
  --tinta-2: #3D4D52;
  --linha: #DDD2BF;
  --linha-forte: #C9BBA3;
  --mar: #0E4A5E;
  --mar-fundo: #0C2730;
  --laranja: #E86624;
  --acao: #B3400D;
  --acao-hover: #963408;
  --sol: #FDC110;
  --sol-tinta: #7A4B00;
  --sol-fundo: #FFF1C9;
  --reserva: #2F6B4C;
  --ciano: #24CFDE;
  --positivo: #2F6B4C;
  --negativo: #A3360B;

  /* pétalas do logo, usadas só na assinatura */
  --p1: #F01A26; --p2: #F2661A; --p3: #F5D400; --p4: #008A3A; --p5: #0075C5; --p6: #962A96; --p7: #F0098F;
  --petalas: linear-gradient(90deg, var(--p1) 0 14.28%, var(--p2) 0 28.57%, var(--p3) 0 42.85%, var(--p4) 0 57.14%, var(--p5) 0 71.42%, var(--p6) 0 85.71%, var(--p7) 0);

  /* papéis semânticos */
  --bg: var(--papel);
  --bg-2: var(--papel-2);
  --sup: var(--superficie);
  --texto: var(--tinta);
  --texto-2: var(--tinta-2);
  --borda: var(--linha);
  --primaria: var(--mar);
  --foco: #F7C813;
  --ac: var(--laranja); /* acento dos ícones Becker Line */

  /* tipografia */
  --f-display: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --f-texto: "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --t-xs: .78rem;
  --t-sm: .9rem;
  --t-md: clamp(1rem, .97rem + .15vw, 1.08rem);
  --t-lg: clamp(1.15rem, 1.08rem + .35vw, 1.35rem);
  --t-xl: clamp(1.5rem, 1.25rem + 1.1vw, 2.1rem);
  --t-2xl: clamp(2rem, 1.5rem + 2.4vw, 3.3rem);
  --t-3xl: clamp(2.5rem, 1.6rem + 4.4vw, 5.2rem);

  /* espaço (base 4) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px;
  --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px; --s-20: 80px; --s-24: 96px;

  /* raio: discreto, quase editorial */
  --r-sm: 6px; --r-md: 12px; --r-lg: 20px; --r-pill: 999px;

  --sombra-1: 0 1px 0 rgba(16, 42, 51, .06), 0 1px 3px rgba(16, 42, 51, .06);
  --sombra-2: 0 2px 4px rgba(16, 42, 51, .06), 0 12px 32px rgba(16, 42, 51, .10);
  --sombra-3: 0 30px 80px rgba(12, 39, 48, .28);

  --max: 1160px;
  --texto-max: 64ch;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0F1E24; --bg-2: #142830; --sup: #172830;
    --texto: #EFE8DC; --texto-2: #B8C3C6; --borda: #2A3F47; --linha-forte: #3A525B;
    --primaria: #7FC3D6; --acao: #E8712F; --acao-hover: #F08245;
    --sol-fundo: #3A2E10; --sol-tinta: #FFD866; --positivo: #7CC79C; --negativo: #F08A66;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0F1E24; --bg-2: #142830; --sup: #172830;
  --texto: #EFE8DC; --texto-2: #B8C3C6; --borda: #2A3F47; --linha-forte: #3A525B;
  --primaria: #7FC3D6; --acao: #E8712F; --acao-hover: #F08245;
  --sol-fundo: #3A2E10; --sol-tinta: #FFD866; --positivo: #7CC79C; --negativo: #F08A66;
  color-scheme: dark;
}

/* base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { max-width: 100%; overflow-x: clip; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--texto);
  font-family: var(--f-texto);
  font-size: var(--t-md);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg, video, canvas, iframe { max-width: 100%; display: block; }
h1, h2, h3 {
  font-family: var(--f-display);
  font-optical-sizing: auto;
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -.025em;
  margin: 0 0 var(--s-4);
  overflow-wrap: anywhere;
  text-wrap: balance;
}
h1 { font-size: var(--t-3xl); font-weight: 700; }
h2 { font-size: var(--t-2xl); }
h3 { font-size: var(--t-lg); letter-spacing: -.015em; line-height: 1.15; }
h4 { font-size: var(--t-md); font-weight: 600; margin: 0 0 var(--s-2); }
p { margin: 0 0 var(--s-4); text-wrap: pretty; }
a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1px; }
button, input, select { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; border-radius: 4px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
::selection { background: var(--sol); color: var(--tinta); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}