/* ==========================================================================
   SLEDEXT — NIGHT CHART v2.0 skin for the main site (site41 + this file, 10.09.2026)
   Loaded after site.css. Tokens of NIGHT CHART; type with Igor's amendment:
   - Manrope (display) only as the architecture – expedition names and numbers, base 300 + one word 800;
   - Onest carries everything that reads in sentences, hierarchy by weight, colour and opacity, not by a second face;
   - JetBrains Mono only for the small indices and counters;
   - Playfair Display Italic – the founder's quote, one voice on the page.
   ========================================================================== */

@font-face { font-family: "Manrope"; src: url("../fonts/Manrope-latin-wght.woff2") format("woff2"); font-weight: 200 800; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; src: url("../fonts/Manrope-cyrillic-wght.woff2") format("woff2"); font-weight: 200 800; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Onest"; src: url("../fonts/Onest-latin-wght.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Onest"; src: url("../fonts/Onest-cyrillic-wght.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-latin-wght.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("../fonts/PlayfairDisplay-latin-wght-italic.woff2") format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; }

:root {
  /* palette – NIGHT CHART */
  --bg: #08090a;                               /* Ink */
  --bg-2: #12161a;                             /* 900 – cards */
  --bg-3: #252c31;                             /* 700 – surfaces */
  --ink: #f5f8f9;                              /* White */
  --ink-2: rgba(245, 248, 249, 0.70);          /* White α70 – secondary text */
  --ink-3: #5b666d;                            /* 500 – muted */
  --line: rgba(245, 248, 249, 0.12);           /* White α12 – hairlines */
  --line-strong: rgba(245, 248, 249, 0.45);    /* White α45 – outlines */
  --ice: #4fc4e4;                              /* Ice Cyan – kickers, secondary actions */
  --soft-ice: #a9d4e2;
  --lime: #c5f500;                             /* one accent per screen */
  --aqua: linear-gradient(115deg, #cbff1a 0%, #2fe0c8 55%, #39b8e8 100%);   /* Electric Aqua – the CTA only */

  /* type */
  --font-display: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Onest", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --font-quote: "Playfair Display", Georgia, serif;
  --fs-h1: clamp(40px, 5vw, 72px);
  --fs-h2: clamp(34px, 3.8vw, 56px);
  --fs-h3: clamp(24px, 2.4vw, 32px);
  --fs-lead: clamp(19px, 1.5vw, 22px);
  --fs-body: 17px;
}

body { font-weight: 400; }

/* ---- Onest voices: the headings that speak in sentences – light, sentence case, one weight per line ---- */
.display { font-family: var(--font-body); font-weight: 300; line-height: 1.04; letter-spacing: -0.015em; text-transform: none; }
.h2 { font-size: var(--fs-h2); }
.lead, .about__lead, .choose__sub, .own__text, .book__note, .scard p, .feature__text, .next__head p, .social__head p { font-weight: 300; }
.kicker { font-family: var(--font-body); font-weight: 500; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ice); }
.nav__link { font-weight: 500; }
.own__h { font-size: clamp(40px, 5.4vw, 80px); }

/* ---- Manrope: the architecture – the intro, the numbers, the country names, the expedition names ---- */
.intro__title .display {
  font-family: var(--font-display); font-weight: 300; text-transform: uppercase;
  font-size: clamp(40px, 7.4vw, 108px); line-height: 0.98; letter-spacing: -0.01em;
  color: rgba(237, 242, 244, 0.87); max-width: 11em;
}
.intro__title .display em { font-style: normal; font-weight: 800; color: inherit; -webkit-text-stroke: 0; white-space: nowrap; }
.intro__word { font-family: var(--font-display); font-weight: 800; font-size: clamp(44px, 9vw, 150px); letter-spacing: -0.02em; line-height: 0.96; color: rgba(237, 242, 244, 0.87); }
.intro__meta { font-weight: 400; }

.num__v { font-family: var(--font-display); font-weight: 800; font-size: clamp(40px, 4.4vw, 72px); letter-spacing: -0.02em; line-height: 0.95; }
.num__v em { color: var(--ink-2); font-style: normal; font-weight: 300; }
.num__l { font-family: var(--font-body); font-weight: 500; font-size: 12px; letter-spacing: 0.14em; color: var(--ice); }
.num__s { font-weight: 300; }
.about__lead { font-size: clamp(22px, 2vw, 30px); line-height: 1.3; }

.choose__h { font-family: var(--font-display); font-weight: 300; text-transform: uppercase; font-size: clamp(36px, 6vw, 96px); line-height: 0.96; letter-spacing: -0.015em; }
.choose__h em { font-style: normal; font-weight: 800; }

.globe__item b { font-family: var(--font-display); font-weight: 300; text-transform: uppercase; font-size: clamp(28px, 2.7vw, 42px); letter-spacing: -0.01em; line-height: 1.02; }
.globe__item.is-on b { font-weight: 800; }
.globe__item small, .globe__lbl small, .gslide__num small, .scard__idx, .ncard__idx, .vfan__idx { font-family: var(--font-mono); font-weight: 500; letter-spacing: 0.06em; }
.globe__item.is-on small, .globe__lbl.is-on small { color: var(--lime); }
.globe__lbl { font-family: var(--font-body); font-weight: 500; font-size: 12px; letter-spacing: 0.1em; }
.globe__head, .globe__hint { font-family: var(--font-body); font-weight: 500; }
.globe__hint { font-size: 11px; letter-spacing: 0.12em; }

/* the route card: Manrope for the number, the name and the figures; Onest for the rest */
.gcard { border-radius: 24px; }
.gslide__num { text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5); line-height: 0.9; }
.gslide__num b { font-family: var(--font-display); font-weight: 800; font-size: 104px; letter-spacing: -0.04em; }
.gslide__num small { font-size: 13px; color: var(--ink); opacity: 0.8; }
.gslide__name { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 30px; line-height: 1; letter-spacing: -0.01em; }
.gslide__sub { font-weight: 400; }
.gslide p { font-weight: 300; }
.gslide__stats b { font-family: var(--font-display); font-weight: 800; font-size: 26px; letter-spacing: -0.02em; }
.gslide__stats span, .gslide__note { font-family: var(--font-body); font-weight: 500; letter-spacing: 0.1em; }
.gslide__note { border-radius: 16px; }
.gmenu__open { font-weight: 500; border-color: var(--line-strong); }
.gmenu__in { border-radius: 16px; }
.gnav .arrow, .gcard__close { border-color: var(--line-strong); }

/* the two photo-card families share one voice: expedition names in Manrope 800 caps, indices in mono, lime */
.ncard__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 2.4vw, 40px); letter-spacing: -0.01em; text-transform: uppercase; }
.ncard__body p { font-weight: 300; color: var(--ink-2); }
.ncard, .rcard, .rmodal__frame { border-radius: 24px; }
.rcard__title, .rmodal__name { font-family: var(--font-display); font-weight: 800; letter-spacing: -0.01em; text-transform: uppercase; }
.rcard__title { font-size: clamp(26px, 2.2vw, 38px); }
.rmodal__name { font-size: clamp(32px, 3.4vw, 48px); }
.rstats b { font-family: var(--font-display); font-weight: 800; font-size: 28px; letter-spacing: -0.02em; }
.rstats span, .rcard__idx, .rmodal__idx { font-family: var(--font-body); font-weight: 500; letter-spacing: 0.1em; }
.rcard__idx, .rmodal__idx { font-family: var(--font-mono); }
.cfact__k, .rmodal__h { font-family: var(--font-body); font-weight: 500; letter-spacing: 0.14em; color: var(--ice); }
.rmodal__text p, .cabout__text p, .rprog li span, .rinc li { font-weight: 300; }
@media (max-width: 900px) and (orientation: portrait) { .stage__layer.next .ncard { border-radius: 16px; } }
.scard { border-radius: 24px; }
.scard__media { border-radius: 16px; }
.scard__title { font-size: clamp(32px, 3.4vw, 56px); }
.scard p { font-size: clamp(16px, 1.25vw, 19px); }
.feature__title { font-weight: 500; }
/* captions and labels that are not expedition names: Onest, tracked caps, not the display face */
.vfan__place { font-family: var(--font-body); font-weight: 500; font-size: 14px; letter-spacing: 0.14em; line-height: 1.2; }
.social__tile b { font-family: var(--font-body); font-weight: 500; font-size: clamp(16px, 1.25vw, 18px); letter-spacing: 0.12em; line-height: 1.2; }
.social__tile span { font-weight: 300; }

/* ---- buttons: the CTA is Electric Aqua with a glow (one per screen – the header CTA stays flat), the rest outlined ---- */
.btn { font-family: var(--font-body); font-weight: 600; }
.btn--solid { background: var(--aqua); color: var(--bg); box-shadow: 0 0 28px rgba(47, 224, 200, 0.28); }
.btn--solid:hover { background: var(--aqua); filter: brightness(1.06); }
.header__cta { box-shadow: none; }
.gslide__acts a.is-primary { background: var(--aqua); border-color: transparent; color: var(--bg); box-shadow: 0 0 22px rgba(47, 224, 200, 0.28); }
.gslide__acts a.is-primary svg { color: var(--bg); }

/* ---- the quote: Playfair Italic on a tick line ---- */
.quote__text { font-family: var(--font-quote); font-style: italic; font-weight: 400; font-size: clamp(26px, 2.7vw, 42px); line-height: 1.4; letter-spacing: 0; max-width: 26em; }
.quote__by b { font-family: var(--font-mono); font-weight: 500; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; }
.quote__by span { font-weight: 300; }

/* ---- forms, footer, loader ---- */
.field label { font-weight: 400; }
.field input, .field select { font-weight: 300; }
.check { font-weight: 300; }
.check input:checked + .check__box { background: var(--ice); border-color: var(--ice); }
.loader__quote { font-family: var(--font-body); font-weight: 300; text-transform: none; font-size: clamp(22px, 2.6vw, 32px); letter-spacing: -0.01em; }
.menu__list a { font-family: var(--font-display); font-weight: 300; text-transform: uppercase; letter-spacing: -0.01em; font-size: clamp(30px, 8.6vw, 44px); }
.menu__list a.is-sub { font-family: var(--font-body); font-weight: 300; text-transform: none; letter-spacing: 0; font-size: 19px; }
.menu__list li.menu__cta a { font-family: var(--font-body); font-weight: 600; font-size: 15px; text-transform: none; }
.dropdown a b { font-weight: 600; }
.footer { font-weight: 300; }

/* ---- phones ---- */
@media (max-width: 720px) {
  .intro__title .display { font-size: clamp(36px, 10.5vw, 48px); }
  .intro__word { font-size: clamp(40px, 12vw, 56px); }
  .choose__h { font-size: clamp(34px, 9.6vw, 44px); }
  .gcard { border-radius: 24px; }
  .gslide__num b { font-size: 60px; }
  .gslide__name { font-size: 22px; }
  .gslide__stats b { font-size: 20px; }
  .gcard .globe__item b { font-size: 16px; }
  .own__h, .h2 { font-size: clamp(30px, 8.4vw, 40px); }
  .about__lead { font-size: 17px; }                                   /* the phone size of site.css, as in the other builds */
  .numbers__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 8px; }    /* three columns, two rows, as in site.css: the video fan must fit below */
  .num__v { font-size: 24px; letter-spacing: -0.04em; }
  .num__v em { font-size: 0.5em; margin-left: 0.06em; }
}
@media (max-width: 900px) and (orientation: portrait) and (max-height: 700px) {
  .gslide__num b { font-size: 50px; }
}

/* ---- the hero (chosen 10.09.2026): the title all 800, the accent word hollow – 2 px stroke, empty inside; the film words solid ---- */
.intro__title .display { font-weight: 800; font-size: clamp(44px, 8vw, 118px); line-height: 0.92; letter-spacing: -0.02em; max-width: 10.5em; color: rgba(237, 242, 244, 0.87); }
.intro__title .display em { font-weight: 800; color: transparent; -webkit-text-stroke: 2px rgba(237, 242, 244, 0.87); letter-spacing: -0.01em; }
.intro__word { font-weight: 800; color: rgba(237, 242, 244, 0.87); -webkit-text-stroke: 0; }
@media (max-width: 720px) { .intro__title .display { font-size: clamp(38px, 11.4vw, 52px); } .intro__title .display em { -webkit-text-stroke-width: 1.5px; } }