/* ============ THE VIP DECK — brand foundation ============ */
@font-face{
  font-family:'Koman';
  src:url('fonts/Koman.otf') format('opentype');
  font-weight:400;font-display:swap;
}
@font-face{
  font-family:'MyriadPro';
  src:url('fonts/MyriadPro-Regular.otf') format('opentype');
  font-weight:400;font-display:swap;
}

:root{
  /* deep-ocean navy ramp */
  --ink:#03202f;          /* deepest, near-black ocean */
  --navy-900:#052f48;
  --navy-800:#084b7e;     /* secondary brand */
  --blue:#1765ac;         /* primary brand */
  --blue-soft:#3d83c0;
  --aqua:#74b6e0;         /* restrained cool highlight */
  --mist:#e4e6e7;         /* light brand grey */
  --mist-dim:#aebcc7;
  --white:#ffffff;
  --line:rgba(255,255,255,.16);
  --line-soft:rgba(255,255,255,.09);

  --maxw:1280px;
  --ease:cubic-bezier(.22,.61,.36,1);

  --f-display:'Koman',sans-serif;
  --f-body:'MyriadPro','Segoe UI',system-ui,sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--f-body);color:var(--mist);background:var(--ink);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.55;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{margin:0;font-weight:400;line-height:1.05;}
p{margin:0;}

/* display type helpers */
.koman{font-family:var(--f-display);text-transform:uppercase;}
.eyebrow{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.42em;
  font-size:12px;color:var(--aqua);display:inline-block;}

/* photo wrapper with graceful navy fallback */
.media{position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--navy-800),var(--ink));}
.media>img{width:100%;height:100%;object-fit:cover;}

/* primary button */
.btn{display:inline-flex;align-items:center;gap:.7em;cursor:pointer;border:none;
  font-family:var(--f-body);font-size:15px;letter-spacing:.04em;
  padding:16px 30px;border-radius:2px;transition:.4s var(--ease);}
.btn-solid{background:var(--white);color:var(--ink);}
.btn-solid:hover{background:var(--aqua);color:var(--ink);}
.btn-ghost{background:transparent;color:var(--white);border:1px solid var(--line);}
.btn-ghost:hover{border-color:var(--white);background:rgba(255,255,255,.06);}

.container{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,64px);}

/* thin hairline divider */
.rule{height:1px;background:var(--line-soft);border:none;}

::selection{background:var(--blue);color:#fff;}