/* ── Svencelė Boat · design tokens ────────────────────────────────────────
   Deep water, not drab water. The palette runs from near-black teal up to a
   bright sky-cyan, with white text throughout and no warm tones — built so
   photographs of the boat sit inside it rather than fight it.
   ------------------------------------------------------------------------ */

:root {
  /* ── colour ─────────────────────────────────────────────────────────── */
  --abyss:   #06212E;   /* deepest ground — hero scrim, footer            */
  --navy:    #0D3247;   /* primary dark surface                           */
  --navy-2:  #10405A;   /* raised dark surface                            */
  --sea:     #14536F;   /* mid tone, hovers                               */
  --sea-2:   #1C6B8C;
  --cyan:    #3FA9D6;   /* the accent — CTA, active route, links          */
  --cyan-2:  #5FBEE4;   /* hover                                          */
  --cyan-3:  #2A8CB8;   /* pressed                                        */

  --foam:    #E8F1F5;   /* text on dark                                   */
  --foam-2:  #A8C2CE;   /* secondary text on dark                         */
  --foam-3:  #7A97A5;   /* tertiary / captions on dark                    */
  /* Secondary text set over a photograph. --foam-2 measures 4.48:1 against a
     scrimmed hero — just under AA — so anything on an image uses this. */
  --foam-photo: #D8E6EC;

  --paper:   #F4F8FA;   /* light section ground                           */
  --paper-2: #E7EFF3;   /* light section, one step down                   */
  --ink:     #0B2A3A;   /* text on light                                  */
  --ink-2:   #3C5C6D;   /* secondary text on light                        */
  --ink-3:   #6B8593;   /* tertiary text on light                         */

  /* rules */
  --rule-dark:  rgba(232, 241, 245, 0.14);
  --rule-dark-2:rgba(232, 241, 245, 0.08);
  --rule-light: rgba(11, 42, 58, 0.14);
  --rule-light-2: rgba(11, 42, 58, 0.07);

  /* ── glass ──────────────────────────────────────────────────────────── */
  /* Used for the hero frame, the booking bar, the proof strip. Nowhere else,
     or it stops reading as a material and starts reading as a filter. */
  --glass-bg:     rgba(255, 255, 255, 0.09);
  --glass-bg-2:   rgba(255, 255, 255, 0.14);
  --glass-line:   rgba(255, 255, 255, 0.18);
  --glass-blur:   blur(18px) saturate(1.3);
  --glass-solid:  rgba(13, 50, 71, 0.82);  /* fallback where blur is unsupported */

  /* ── type ───────────────────────────────────────────────────────────── */
  --display: "Outfit", "Helvetica Neue", -apple-system, BlinkMacSystemFont, sans-serif;
  --body:    "Manrope", "Helvetica Neue", -apple-system, BlinkMacSystemFont, sans-serif;
  --mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

  --t-xxs:  0.6875rem;
  --t-xs:   0.75rem;
  --t-sm:   0.8125rem;
  --t-base: clamp(1rem, 0.97rem + 0.14vw, 1.0625rem);
  --t-lede: clamp(1.0625rem, 1rem + 0.36vw, 1.25rem);
  --t-h3:   clamp(1.25rem, 1.16rem + 0.42vw, 1.5rem);
  --t-h2:   clamp(1.75rem, 1.28rem + 2.05vw, 3.1rem);
  --t-h1:   clamp(1.6rem, 1rem + 3.4vw, 3.85rem);
  --t-num:  clamp(1.9rem, 1.4rem + 2.1vw, 3rem);

  --lh-tight: 1.06;
  --lh-head:  1.16;
  --lh-body:  1.65;

  /* The wide-tracked uppercase setting is the signature of the type system —
     used on the hero, section heads and every eyebrow. */
  --track-hero:    0.11em;
  --track-caps:    0.16em;
  --track-mono:    0.05em;

  /* ── space ──────────────────────────────────────────────────────────── */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-5:  1.5rem;
  --s-6:  2rem;
  --s-7:  2.75rem;
  --s-8:  4rem;
  --s-9:  6rem;
  --s-10: clamp(4.5rem, 3rem + 6vw, 9rem);

  /* ── layout ─────────────────────────────────────────────────────────── */
  --wrap:   80rem;
  --gutter: clamp(1.25rem, 0.6rem + 2.6vw, 3.5rem);
  --head-h: 4.5rem;
  --frame:  clamp(0.75rem, 0.3rem + 1.4vw, 1.25rem);  /* hero frame inset —
              capped so it never rises into the brand / language row above it */

  /* ── shape ──────────────────────────────────────────────────────────── */
  --r-card:  18px;
  --r-frame: 26px;
  --r-pill:  999px;
  --r-sm:    10px;

  /* ── shadow ─────────────────────────────────────────────────────────── */
  --lift:    0 1px 2px rgba(6, 33, 46, 0.06), 0 8px 24px rgba(6, 33, 46, 0.08);
  --lift-2:  0 2px 4px rgba(6, 33, 46, 0.08), 0 18px 48px rgba(6, 33, 46, 0.14);

  /* ── motion ─────────────────────────────────────────────────────────── */
  --ease:     cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur:      0.42s;
  --dur-slow: 0.9s;
}