/* Ahir Hospitality — Design Tokens v1
   Modern operator / Investment-grade
   Reference: DESIGN_SYSTEM.md */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');

:root {
  /* Color */
  --navy:        #0b1f3a;
  --navy-2:      #162d4e;
  --blue:        #1d4ed8;
  --blue-soft:   #3b82f6;
  --bg:          #f4f6f9;
  --surface:     #ffffff;
  --border:      #e2e8f0;
  --text:        #0f172a;
  --muted:       #64748b;
  --faint:       #6b7a8e;
  --faint-deco:  #94a3b8;

  /* Typography */
  --serif: "DM Serif Display", Georgia, serif;
  --sans:  "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Type scale */
  --fs-display:  56px;
  --fs-h1:       40px;
  --fs-h2:       28px;
  --fs-h3:       20px;
  --fs-body-lg:  17px;
  --fs-body:     15px;
  --fs-body-sm:  13px;
  --fs-eyebrow:  11px;
  --fs-caption:  12px;

  /* Line heights */
  --lh-tight:    1.05;
  --lh-snug:     1.2;
  --lh-normal:   1.5;
  --lh-relaxed:  1.6;

  /* Letter spacing */
  --ls-eyebrow:  1.5px;
  --ls-tight:    -0.02em;

  /* Spacing scale (8px base) */
  --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;
  --s-32:  128px;

  /* Layout */
  --max-w-narrow:  720px;
  --max-w-content: 1080px;
  --max-w-wide:    1320px;
  --gutter:        24px;
  --pad-x:         48px;

  /* Radius */
  --r-sm: 6px;
  --r:    12px;
  --r-lg: 20px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(11, 31, 58, .06);
  --shadow-md: 0 4px 16px rgba(11, 31, 58, .08);
  --shadow-lg: 0 12px 40px rgba(11, 31, 58, .12);

  /* Transitions */
  --t-fast:   .15s ease;
  --t-normal: .25s ease;
}

@media (max-width: 768px) {
  :root {
    --fs-display: 36px;
    --fs-h1:      28px;
    --fs-h2:      22px;
    --fs-h3:      18px;
    --pad-x:      24px;
    --gutter:     16px;
  }
}

/* Base reset */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: var(--lh-relaxed);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
main { display: block; margin: 0; padding: 0; }
section { margin: 0; }

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

a {
  color: var(--blue);
  text-decoration: none;
  transition: color var(--t-fast);
}
a:hover { color: var(--navy); }

button { font-family: inherit; cursor: pointer; }