/* Confidante design tokens. Every value mirrors clients/confidante/DESIGN.md. A soft white page (Josh, 2026-10-12);
   the bar, the menu, the films and the closing bands stay crest navy; the footer is light (2026-10-13). */
@font-face { font-family: "Zodiak"; src: url("../assets/fonts/zodiak-300.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Zodiak"; src: url("../assets/fonts/zodiak-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Zodiak"; src: url("../assets/fonts/zodiak-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Geist"; src: url("../assets/fonts/geist-variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
/* metric-matched fallbacks so the swap does not reflow */
@font-face { font-family: "Zodiak Fallback"; src: local("Times New Roman"), local("Georgia"); size-adjust: 104%; ascent-override: 92%; descent-override: 24%; }
@font-face { font-family: "Geist Fallback"; src: local("Helvetica Neue"), local("Arial"); size-adjust: 98%; ascent-override: 94%; descent-override: 24%; }

:root {
  /* navy constants, sampled from the logo: the bar, the menu, the footer, the films' beds and every veil */
  --deep: #0B1726;      /* navy night: the hero and group bed, the closing bands, the plate over the approach photograph; base of every veil */
  --ground: #0F2033;    /* the menu's edge strip while the group sheet is open. 1.09:1 against deep */
  --overlay: #1B3049;   /* dialog media placeholder */
  --navy: #1D3A59;      /* the leadership cards and the portrait plate in the bio dialog */
  --brand: #102C4C;     /* crest navy: the solid bar, the slide-out menu, the footer */
  --brand-2: #16385F;   /* lighter crest navy: the menu's group sheet */
  --brand-rgb: 16 44 76; /* the crest navy as channels: a closing band's foot dissolves into the footer */
  --veil: 11 23 38;     /* deep as channels: every scrim and veil is rgb(var(--veil) / a) */
  --gold: #FCCC7C;      /* crest gold, sampled from the logo: the crest, the action on navy, the map and marks on navy */
  --gold-line: rgb(252 204 124 / 0.6);  /* the action's hairline on navy: 4.31:1 on the crest navy */
  --on-gold: #FFFFFF;   /* the action's label on its gold hover fill (Josh, 2026-10-09). 1.49:1, hover only */

  /* the page: a warm soft white (Josh, 2026-10-12: "make the page backgrounds white, but nice, easier-on-the-eyes
     white instead of this blue"). The type is the crest navy; ratios read paper / card / sand */
  --paper: #F7F4EF;     /* the page ground */
  --paper-rgb: 247 244 239; /* the slider's foot and the ecosystem's foot dissolve into it */
  --page: var(--paper); /* the ground of the surface in hand; the dark surfaces below set the crest navy */
  --card: #FFFFFF;      /* notices, form cards, diagram plates, dialog panels */
  --raised: #EEE9E1;    /* sand: image placeholders */
  --field-bg: #FFFFFF;  /* form fields and choice boxes */
  --text-1: #102C4C;    /* headings, names, statements, links, field values: 12.88 / 14.13 / 11.69 */
  --text-2: #2E4258;    /* ledes and long reading text: 9.40 / 10.31 / 8.53 */
  --text-3: #4A5868;    /* body, labels, roles, form labels, captions: 6.63 / 7.27 / 6.02 */
  --text-4: #7A848F;    /* large text only (28px and up): 3.46 / 3.80 */
  --accent: #A67C34;    /* the crest gold deepened for strokes, icons, marks and focus on the page: 3.45 / 3.78 */
  --accent-line: rgb(166 124 52 / 0.6);        /* gold hairline frames on the page */
  --action: #102C4C;    /* the action on the page: a crest-navy hairline, the navy rises on hover (Josh: "brand blue or brand gold") */
  --action-line: rgb(16 44 76 / 0.62);         /* its hairline at rest: 4.12 on paper */
  --on-action: #FFFFFF; /* its label on the navy fill: 14.13 */
  --danger: #A63A2E;    /* form errors: 5.86 / 6.43 */
  --line: rgb(16 44 76 / 0.12);                /* decorative hairline */
  --line-2: rgb(16 44 76 / 0.24);              /* rules between rows, control outlines */
  --line-3: rgb(16 44 76 / 0.4);               /* underlines and the divider's diamonds */
  --field-line: rgb(16 44 76 / 0.55);          /* field border: 3.39 on paper, 3.48 on white */
  --field-line-hover: rgb(16 44 76 / 0.75);
  --map-land: rgb(16 44 76 / 0.03);
  --map-coast: rgb(16 44 76 / 0.26);
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%234A5868' stroke-width='1.25'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");

  /* type: Zodiak (display) + Geist (text), self-hosted. px at 390 / 1440 */
  --font-display: "Zodiak", "Zodiak Fallback", "Times New Roman", serif;
  --font-text: "Geist", "Geist Fallback", "Helvetica Neue", sans-serif;
  --fs-label: 0.75rem;                                   /* 12 / 12   Geist 500 caps +0.06em */
  --fs-small: 0.875rem;                                  /* 14 / 14   Geist 400 */
  --fs-body: clamp(1rem, 0.9625rem + 0.15vw, 1.0625rem); /* 16 / 17   Geist 400 */
  --fs-lede: clamp(1.25rem, 1.175rem + 0.3vw, 1.375rem);  /* 20 / 22   Zodiak 400 */
  --fs-subtitle: clamp(1.5625rem, 1.38rem + 0.75vw, 2rem); /* 25 / 32   Zodiak 400, 300 from 992px */
  --fs-statement: clamp(1.5rem, 1.15rem + 1.3vw, 2.25rem); /* 24 / 36   Zodiak 400 */
  --fs-title: clamp(2rem, 1.55rem + 1.5vw, 2.75rem);      /* 32 / 44   Zodiak 300 */
  --fs-display: clamp(2.25rem, 1.6rem + 2.4vw, 3.75rem);  /* 36 / 60   Zodiak 300 */
  --fs-hero: clamp(1.375rem, 0.95rem + 1.5vw, 2.25rem);   /* 22 / 36   Zodiak 400 caps +0.05em */
  --measure: 44ch;

  /* space and grid: one margin, one frame, one edge */
  --margin: clamp(1rem, 4.2vw, 4rem);                     /* 16 / 60: page margin, matching the bar's (after pacaso.com) */
  --frame: 1600px;
  --edge: max(var(--margin), (100% - var(--frame)) / 2);  /* inline padding of full-bleed rows; % resolves against their own width */
  --col-gap: clamp(1rem, 1.7vw, 1.5rem);                  /* 16 / 24 */
  --section: clamp(6.5rem, 4rem + 9vw, 12.5rem);          /* 104 / 194: more intentional air (Josh, after pacaso.com) */
  --space-open: clamp(3.5rem, 2.3rem + 4.2vw, 6.5rem);    /* 56 / 98: opening block to content */
  --space-head: clamp(1.5rem, 1.25rem + 0.6vw, 2rem);     /* 24 / 32: heading to lede */
  --space-action: clamp(2rem, 1.5rem + 1.4vw, 3rem);      /* 32 / 46: last text to a link or button */
  --nav-h: 68px;               /* 68 phones, 85 from 768px (pacaso.com's bar) */

  /* motion */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-hero: cubic-bezier(0.77, 0, 0.18, 1);
  --ease-lux: cubic-bezier(0.45, 0, 0.15, 1);  /* a slow, even rise: the gold fill of the action and the action hairline */
  --dur-1: 120ms; --dur-2: 200ms; --dur-3: 320ms; --dur-4: 600ms; --dur-lux: 700ms;

  --z-nav: 50; --z-overlay: 100; --z-dialog: 200;
}
@media (min-width: 768px) { :root { --nav-h: 85px; } }

/* dark surfaces keep the limestone-on-navy palette: the bar and the menu (unchanged, Josh 2026-10-12), the films and the
   group slider, the photographs words sit on (the difference's statements only while they ride the photograph; without
   motion they sit on the page under it), the closing bands and the leadership cards. The sub-page heroes and the footer
   joined the light page after pacaso.com (Josh, 2026-10-13); destinations and leadership sit on the navy with a clean edge (Josh, 2026-10-13). Ratios as before:
   text-1 10.18:1 or more, text-2 7.37, text-3 4.71 on every navy ground */
.nav, .drawer, .hero, .eco, .hscroll, .team, .zoom:not(.is-static) .zoom__text, .connect, .cta-band, .cascade__inner,
.co__media, .panel__media, .door, .about-approach__plate, .about-dest__band, [data-tone="dark"] {
  color-scheme: dark;
  --page: var(--brand);
  --card: var(--deep);
  --raised: #15283D;
  --field-bg: #15283D;
  --text-1: #F4EFE6;
  --text-2: #D2CDC4;
  --text-3: #A9A49C;
  --text-4: #7E7A72;
  --accent: var(--gold);
  --accent-line: var(--gold-line);
  --action: var(--gold);
  --action-line: var(--gold-line);
  --on-action: var(--on-gold);
  --danger: #EF958A;
  --line: rgb(244 239 230 / 0.1);
  --line-2: rgb(244 239 230 / 0.24);
  --line-3: rgb(244 239 230 / 0.4);
  --field-line: rgb(244 239 230 / 0.4);
  --field-line-hover: rgb(244 239 230 / 0.6);
  --map-land: rgb(244 239 230 / 0.02);
  --map-coast: rgb(244 239 230 / 0.22);
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A9A49C' stroke-width='1.25'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
}