/* ════════════════════════════════════════════════════
   ENTRE RUMBOS — TYPOGRAPHY SYSTEM
   Version 8 — Canela / Suisse Int'l

   REQUIRED FONT FILES — place in /fonts/:
     Canela-Light.woff2          (Canela Light, weight 300)
     CanelaDeck-Regular.woff2    (Canela Deck Regular, weight 400)
     CanelaText-Regular.woff2    (Canela Text Regular, weight 400)
     CanelaText-Italic.woff2     (Canela Text Italic, weight 400)
     SuisseIntl-Book.woff2       (Suisse Int'l Book, weight 400)

   Until font files are added, fallback to:
     Display / Deck / Text → Georgia, 'Times New Roman', serif
     UI                    → Helvetica, Arial, sans-serif
════════════════════════════════════════════════════ */

/* ── @FONT-FACE ── */

@font-face {
  font-family: 'Canela';
  src: url('/fonts/Canela-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Canela Deck';
  src: url('/fonts/CanelaDeck-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Canela Text';
  src: url('/fonts/CanelaText-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Canela Text';
  src: url('/fonts/CanelaText-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Suisse Intl';
  src: url('/fonts/SuisseIntl-Book.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ── VARIABLES ── */

:root {
  --font-display: 'Canela', Georgia, 'Times New Roman', serif;
  --font-deck:    'Canela Deck', Georgia, 'Times New Roman', serif;
  --font-text:    'Canela Text', Georgia, 'Times New Roman', serif;
  --font-ui:      'Suisse Intl', Helvetica, Arial, sans-serif;

  --text-primary:   #F4EFE6;
  --text-secondary: rgba(244, 239, 230, 0.80);
  --text-muted:     rgba(200, 183, 154, 0.68);
}

/* ── GLOBAL BODY ── */

body {
  font-family: var(--font-text);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.65;
  letter-spacing: 0;
}

/* ── ELEMENT DEFAULTS ── */

h1 {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
}

h2 {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

h3 {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

/* ── DESKTOP NAVIGATION ── */

.nav-list a {
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0.15em;
}

/* ── MOBILE NAVIGATION ── */

#mob a {
  font-family: var(--font-deck);
  font-size: clamp(30px, 9vw, 42px);
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

/* ── LANGUAGE TOGGLE ── */

.lang-toggle {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.14em;
}

/* ── DISPLAY TITLES (Canela Light) ── */
/* Homepage hero, major product titles, article titles */

.t-xl {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
}

#ed-hero h2 {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
}

.art-title {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
  font-size: clamp(48px, 5.5vw, 74px);
  line-height: 1.02;
  margin-bottom: 24px;
}

@media (max-width: 768px) {
  .art-title {
    font-size: clamp(38px, 11vw, 54px);
    line-height: 1.04;
  }
}

/* ── DECK TITLES (Canela Deck) ── */
/* Section titles, strip names, card titles */

.ed-strip-name {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

.j-strip-title {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

.feat-title {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

.jtit {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
  font-size: clamp(24px, 2vw, 30px);
  line-height: 1.15;
}

.res-l h3 {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

#nl h3 {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

/* ── READING TEXT (Canela Text) ── */

.italic {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

.small-i {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

.note {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

/* Article body ── most important upgrade */
.art-body p {
  font-family: var(--font-text);
  font-weight: 400;
  font-size: clamp(21px, 1.55vw, 23px);
  line-height: 1.68;
  letter-spacing: 0;
  color: rgba(244, 239, 230, 0.84);
  margin-bottom: 1.2em;
}

.art-body p.drop {
  font-family: var(--font-text);
  font-size: clamp(25px, 2vw, 30px);
  font-style: italic;
  font-weight: 400;
  line-height: 1.55;
  color: rgba(244, 239, 230, 0.92);
  margin-bottom: 1.6em;
}

.art-body em {
  font-family: var(--font-text);
  font-style: italic;
}

@media (max-width: 600px) {
  .art-body p {
    font-size: 19px;
    line-height: 1.65;
  }
  .art-body p.drop {
    font-size: 23px;
  }
}

/* Form inputs */
.fg input,
.fg select,
.fg textarea {
  font-family: var(--font-text);
  font-weight: 400;
}

.nl-i {
  font-family: var(--font-text);
}

/* OE form inputs (in original-edition.html) */
#oe-form input,
#oe-form select,
#oe-form textarea {
  font-family: var(--font-text);
}

/* ── UI ELEMENTS (Suisse Intl) ── */

.lbl,
.cta,
.cta-border,
.ed-strip-label,
.ed-strip-cta,
.j-strip-cta,
.res-label,
.feat-cat,
.jcat,
.j-read,
.back-link,
.art-cat,
.f-btn,
.f-foot,
.nl-b,
.ft-brand,
.ft-copy,
.mob-x,
.logo {
  font-family: var(--font-ui);
  font-weight: 400;
}

/* ── LETTER-SPACING REDUCTIONS ── */

.lbl,
.cta,
.cta-border {
  letter-spacing: 0.15em;
}

.ed-strip-label,
.res-label,
.feat-cat,
.jcat,
.art-cat {
  letter-spacing: 0.18em;
}

.ed-strip-cta,
.j-strip-cta,
.back-link,
.f-btn,
.nl-b {
  letter-spacing: 0.15em;
}

.j-read {
  letter-spacing: 0.15em;
}

.ft-brand {
  letter-spacing: 0.16em;
}

.ft-copy {
  letter-spacing: 0.08em;
}

.fg label {
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0.16em;
}

/* ── FOOTER ── */

footer .ft-brand {
  font-family: var(--font-ui);
  letter-spacing: 0.16em;
}

/* ── ARTICLE CATEGORY ── */

.art-cat {
  letter-spacing: 0.17em;
  font-size: 10px;
}

/* ── ARTICLE WIDTH ── */

.article-wrap {
  max-width: 720px;
}

/* ── THANK-YOU PAGE ── */

.ty-title {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

.ty-body {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

.journal-btn,
.back-link {
  font-family: var(--font-ui);
  font-weight: 400;
  letter-spacing: 0.15em;
  font-size: 10px;
}

/* ── OE PAGE SPECIFIC ── */

.oe-hero-title,
#oe-hero h1,
#oe-hero h2 {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
}

.mat-title,
.oe-section h3,
.oe-split h3,
.ed-h,
#oe-numbered h3 {
  font-family: var(--font-deck);
  font-weight: 400;
  letter-spacing: -0.005em;
}

.mat-desc,
.oe-copy,
.split .small-i,
.num-copy {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

/* ── JOURNAL PAGE HERO ── */

#jh h1 {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.015em;
}

.jh-sub {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

/* ── JOURNAL FEATURED ── */

.feat-body .feat-excerpt {
  font-family: var(--font-text);
  font-weight: 400;
  letter-spacing: 0;
}

.feat-read,
.feat-cat {
  font-family: var(--font-ui);
  font-weight: 400;
}

/* ── NEWSLETTER STRIP ── */

.nl-left h3,
#nl h3,
.nl-right h3 {
  font-family: var(--font-deck);
  font-weight: 400;
}

#nl p {
  font-family: var(--font-text);
}

/* ── RESERVE COPY ── */

.res-l p {
  font-family: var(--font-text);
  letter-spacing: 0;
}

/* ── REMOVE ARTIFICIAL BOLD ── */

.f-btn,
.nl-b,
.back-link,
.art-cat,
.ed-strip-label,
.ed-strip-cta,
.j-strip-cta,
.feat-cat,
.jcat,
.j-read,
.res-label,
.fg label {
  font-weight: 400;
}

