/* Shared typography contract. Page palettes and illustrated lettering stay local. */
:root {
  /* Primitive tokens: one variable Jost face and one Russo One face. */
  --qh-family-jost: 'Jost', Arial, sans-serif;
  --qh-family-russo: 'Russo One', 'Jost', Arial, sans-serif;
  --qh-weight-regular: 400;
  --qh-weight-body: 300;
  --qh-weight-medium: 500;
  --qh-weight-bold: 600;
  --qh-size-caption: 12px;
  --qh-size-label: 14px;
  --qh-size-body: 16px;
  --qh-size-lead: 16px;
  /* Semantic roles. Russo One has one natural weight; never synthesize bold. */
  --qh-font-body: var(--qh-family-jost);
  --qh-font-ui: var(--qh-family-jost);
  --qh-font-heading: var(--qh-family-jost);
  --qh-font-display: var(--qh-family-russo);
  --qh-text-title: #f5f7fa;
  --qh-text-body: #adb7c4;
  --qh-text-muted: #9ca8b7;
  --qh-line-body: 1.65;
  --qh-line-ui: 1.35;
  --qh-line-title: 1.12;
  --qh-line-section: 1.2;
  /* Component scales, including compact titles laid over the home illustration. */
  --qh-title-hero: clamp(36px, 5vw, 64px);
  --qh-title-section: clamp(30px, 2.6vw, 32px);
  --qh-title-card: 20px;
  --qh-title-overlay: clamp(24px, 2.5vw, 32px);
  --qh-title-small: 20px;
  --qh-size-button: 14px;
  --qh-size-price: 34px;
  --qh-section-gap: 28px;
  --qh-card-title-gap: 10px;
  --qh-card-action-gap: 22px;
  --qh-text-measure: 65ch;
}

html { font-synthesis: none; }
body { font-family: var(--qh-font-body); font-weight: var(--qh-weight-body); font-size: var(--qh-size-body); line-height: var(--qh-line-body); }
button, input, select, textarea { font-family: var(--qh-font-ui); font-weight: var(--qh-weight-regular); }
strong, b { font-weight: var(--qh-weight-bold); }
h1, h2 { font-family: var(--qh-font-heading); font-weight: var(--qh-weight-medium); line-height: var(--qh-line-section); overflow-wrap: break-word; }
h3, h4 { font-family: var(--qh-font-body); font-weight: var(--qh-weight-medium); }

.hero-title, .gl-title, .cinematic-title {
  font-family: var(--qh-font-display); font-weight: var(--qh-weight-regular);
  font-size: var(--qh-title-hero); line-height: var(--qh-line-title);
}
.quest-title, .full-logo-container, .huge-fire-title {
  font-family: var(--qh-font-display); font-weight: var(--qh-weight-regular);
}
.section-title, .section-gl-title, .details-title, .menu-title, .final-gallery-section h2, .seo-section__title {
  font-family: var(--qh-font-heading); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-title-section); line-height: var(--qh-line-section); letter-spacing: 0;
  text-transform: none; text-shadow: none; margin-bottom: var(--qh-section-gap);
}
.hero-banner__title { font-family: var(--qh-font-display); font-weight: var(--qh-weight-regular); font-size: var(--qh-title-overlay); line-height: var(--qh-line-title); }
.section-title > span { flex-shrink: 0; white-space: nowrap; }
body[data-page="home"] .section-title > span { font-size: .8em; }
.card__title {
  font-family: var(--qh-font-heading); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-title-card); line-height: var(--qh-line-section);
  text-transform: none; letter-spacing: 0; text-shadow: none;
}
.fact-title, .price-title, .detail-heading, .char-name, .p-card h3, .tl-content h4, .org-col-title,
.seo-highlight h3, .seo-columns h3, .bp-title, .quick-fact-title, .m-info h3, .t-name, .id-name,
.modal-title, .modal-text h3, .hud-title, .bp-tl-title, .bp-safety-title {
  font-family: var(--qh-font-body); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-title-small); line-height: var(--qh-line-ui);
  text-transform: none; letter-spacing: 0; text-shadow: none;
}
.recovery-page h1 { font-family: var(--qh-font-heading); font-weight: var(--qh-weight-bold); font-size: var(--qh-title-hero); line-height: var(--qh-line-section); }
.m-number, .hud-num, .bp-num { font-family: var(--qh-font-heading); font-weight: var(--qh-weight-bold); }

.hero-desc, .hero-description, .description, .bp-desc, .m-desc, .gl-desc, .recovery-page p {
  font-size: var(--qh-size-lead); line-height: var(--qh-line-body); font-weight: var(--qh-weight-body);
}
.hero-banner__subtitle, .card__desc, .fact-text, .price-desc, .feed-card__text, .faq-content, .faq-answer,
.seo-section__intro, .seo-highlight p, .seo-columns p, .seo-grid__item, .hero__meta-list li,
.detail-text, .detail-list li, .org-list li, .boss-desc, .t-desc, .fu-desc, .quick-fact-text,
.p-card p, .tl-content p, .modal-text p, .modal-desc, .id-quote, .hud-desc, .timeline-seo-desc,
.bp-tl-text, .bp-safety-text, .bp-desc-primary, .seo-text-intro, .transfer-price, .t-features li {
  font-family: var(--qh-font-body); font-size: var(--qh-size-body);
  line-height: var(--qh-line-body); font-weight: var(--qh-weight-body);
}
.hero-desc, .hero-description, .description, .bp-desc, .m-desc, .gl-desc,
.seo-section__intro, .seo-highlight p, .seo-columns p, .faq-content, .faq-answer { max-width: var(--qh-text-measure); }
.qh-nav-link, .btn-main, .btn-primary, .btn-secondary, .hero-banner__btn, .card__cta,
.price-card .card__cta, .recovery-button, .btn-trailer-text, .bp-details-btn, .fu-btn {
  font-family: var(--qh-font-ui); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-size-button); line-height: var(--qh-line-ui); letter-spacing: .02em;
}
.faq-item summary, .faq-list summary, .faq-summary {
  font-family: var(--qh-font-heading); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-title-small); line-height: var(--qh-line-ui);
  text-transform: none; letter-spacing: 0; color: var(--qh-text-title); gap: 16px;
}
.faq-icon { flex-shrink: 0; }
.hero-subtitle, .hero-banner__eyebrow, .hero-supra-title, .gl-badge, .fact-label, .quick-fact-label,
.spec-badge, .time-badge, .status-badge, .hud-header, .id-role, .char-role, .feed-card__header,
.feed-card__footer, .fu-title, .fu-bottom, .bp-mb-label, .badge, .badge--ghost, .card__new, .hud-soc-btn.text-icon {
  font-family: var(--qh-font-ui); font-weight: var(--qh-weight-medium);
  font-size: var(--qh-size-caption); line-height: var(--qh-line-ui);
}
.price-amount, .price-amount span, .t-price, .res-val, .radio-price, .stat-num, .hud-clock,
.hud-system-info, .hud-link, .bp-flap, .spectrum-freq, .mission-number, .t-value, .t-radio-price {
  font-family: var(--qh-font-ui); font-weight: var(--qh-weight-bold); font-variant-numeric: tabular-nums;
}
.price-amount, .t-price { font-size: var(--qh-size-price); line-height: 1.15; }
.price-amount span, .t-price span { font-size: var(--qh-size-label); line-height: var(--qh-line-ui); font-weight: var(--qh-weight-regular); }
.hud-system-info { font-size: var(--qh-size-caption); }
.hud-clock { line-height: var(--qh-line-ui); }
.h1-seo { font-family: var(--qh-font-body); font-weight: var(--qh-weight-medium); }
.ft-status, .bp-mobile-toggle-icon { font-family: var(--qh-font-ui); font-weight: var(--qh-weight-medium); }
.card__badges { flex-wrap: wrap; }

/* Readable content uses three contrast levels; programme accents stay local. */
.hero-banner__subtitle, .card__desc, .fact-text, .price-desc, .feed-card__text,
.faq-content, .faq-answer, .seo-section__intro, .seo-highlight p, .seo-columns p,
.seo-grid__item, .hero-desc, .hero-description, .description, .bp-desc, .m-desc, .gl-desc,
.recovery-page p, .detail-text, .detail-list li, .org-list li, .boss-desc, .t-desc, .fu-desc,
.quick-fact-text, .p-card p, .tl-content p, .modal-text p, .modal-desc, .id-quote, .hud-desc,
.timeline-seo-desc, .bp-tl-text, .bp-safety-text, .bp-desc-primary, .seo-text-intro,
.transfer-price, .t-features li { color: var(--qh-text-body); }
.fact-label, .price-amount span, .quick-fact-label, .feed-card__footer { color: var(--qh-text-muted); }
.card__title, .fact-title, .price-title { color: var(--qh-text-title); }
.card__title { margin-bottom: var(--qh-card-title-gap); }
.card__desc { margin-bottom: var(--qh-card-action-gap); }
/* Carousel padding is part of the section-to-content gap, not extra space. */
body[data-page="home"] .category-section .section-title { margin-bottom: calc(var(--qh-section-gap) - 12px); }
body[data-page="home"] .category-section .carousel-track { padding-top: 12px; }
.price-card { gap: 12px; }
.price-desc { margin: 0; }
.price-card .card__cta { margin-top: 10px; min-height: 44px; }
.seo-grid__item strong { font-size: var(--qh-size-label); font-weight: var(--qh-weight-medium); text-transform: none; }
.seo-section__title, .seo-section__intro { text-align: left; }
.seo-section__intro { margin-inline: 0; }

/* The brand uses the recovered glyph outlines rather than a fourth font face. */
.qh-main-logo { width: 270px; padding: 0; color: var(--header-color); -webkit-text-stroke: 0; text-shadow: none; line-height: 0; }
.qh-main-logo svg, .hud-logo svg, .fu-logo svg { display: block; width: 100%; height: auto; overflow: visible; }
.qh-main-logo svg { filter: drop-shadow(0 0 7px rgba(var(--header-rgb), .4)); }
.qh-sub-logo { font-family: var(--qh-font-ui); font-weight: var(--qh-weight-medium); font-size: 10px; letter-spacing: 4px; padding-left: 4px; }
.hud-logo { display: block; flex-shrink: 0; width: 145px; line-height: 0; text-shadow: none !important; }
.hud-logo svg { filter: drop-shadow(0 0 4px var(--hud-primary, #00e5ff)); }
.fu-logo { width: min(280px, 100%); line-height: 0; }

@media (max-width: 768px) {
  :root {
    --qh-title-hero: clamp(28px, 7vw, 36px);
    --qh-title-section: clamp(24px, 5vw, 26px);
    --qh-title-card: 20px;
    --qh-title-overlay: 28px;
    --qh-size-lead: 16px;
    --qh-size-body: 16px;
    --qh-size-price: 30px;
    --qh-section-gap: 24px;
  }
  .qh-main-logo { width: 170px; }
  .qh-sub-logo { font-size: 8px; letter-spacing: 1.8px; padding: 0; }
  .hud-logo { width: 100px; }
  .hud-system-info { font-size: var(--qh-size-caption); }
  body[data-page="privacy"] { --qh-title-hero: clamp(24px, 6vw, 36px); }
  /* Long destination text must shrink inside the ticket grid, then wrap. */
  .bp-mini-board { grid-template-columns: 55px minmax(0, 1fr) 75px; }
  .bp-mb-col { min-width: 0; }
  .bp-flap, .bp-flap.accent, .bp-flap.status { font-size: var(--qh-size-caption); line-height: var(--qh-line-ui); }
  .bp-flap.accent { white-space: normal; overflow-wrap: anywhere; }
  .pricing-cards-wrapper { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  .qh-main-logo { width: 165px; }
  .hud-logo { width: 80px; }
}