/* ═══════════════════════════════════════════════════════════════════════════
   PrimaveraTravels — Design Tokens v2
   "Lakeside Light": lake teal · clay terracotta · gold · warm stone
   Type: Fraunces (display) + Inter (UI)
   Rule: terracotta is ACTION ONLY — never decoration.
═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* Palette */
  --ink:          #15233B;
  --horizon:      #0E4F6B;
  --horizon-d:    #0A3B50;
  --horizon-l:    #2D7A9E;
  --terracotta:   #C4622D;
  --terracotta-d: #A34F22;
  --terracotta-l: #E0834F;
  --stone:        #F6F3EC;
  --stone-d:      #ECE6D8;
  --mist:         #E5DFD0;
  --gold:         #D9A441;
  --gold-soft:    #F0DDB8;
  --white:        #FFFFFF;
  --gray-500:     #7A7468;
  --gray-300:     #C9C2B2;
  --success:      #4A7A5E;
  --success-bg:   #EDF5F0;
  --error:        #B5482F;
  --error-bg:     #F7E5DF;

  /* Type */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;

  /* Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;

  /* Shadows */
  --shadow-card:  0 2px 8px rgba(21,35,59,.06), 0 12px 32px rgba(21,35,59,.10);
  --shadow-float: 0 8px 24px rgba(21,35,59,.12), 0 24px 56px rgba(21,35,59,.14);

  /* Motion */
  --transition: .18s cubic-bezier(.4,0,.2,1);

  /* Layout */
  --nav-h: 56px;
  --container: 1080px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body);
  background: var(--stone);
  color: var(--ink);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

main { flex: 1 0 auto; }
footer { flex-shrink: 0; }

img { max-width: 100%; display: block; }

/* Utility */
.hidden  { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

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