/* =========================================================
   One Pacific Airways — Global Design System
   ========================================================= */
:root {
  /* Brand */
  --color-red: #c30f23;
  --color-gold: #c9a35a;
  --color-ink: #171717;
  --color-deep: #06232e;
  --color-text: #292826;
  --color-muted: #74706b;
  --color-soft: #f6f4f0;
  --color-line: #e4e0da;
  --color-white: #fff;

  /* Fonts */
  --font-body: "DM Sans", Arial, sans-serif;
  --font-heading: "Manrope", "DM Sans", Arial, sans-serif;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  /* Type scale */
  --text-xs: 12px;
  --text-sm: 14px;
  --text-md: 16px;
  --text-lg: 18px;
  --eyebrow-size: 24px;
  --number-size: 32px;
  --h1-size: clamp(58px, 6.2vw, 94px);
  --h2-size: clamp(36px, 3.6vw, 54px);
  --h3-size: clamp(24px, 2vw, 32px);
  --title-xl: var(--h1-size);
  --title-lg: var(--h2-size);

  /* Layout */
  --content-width: 1380px;
  --reading-width: 960px;
  --text-width: 700px;
  --max: var(--content-width);
  --page-pad: clamp(20px, 3vw, 42px);
  --section-space: clamp(82px, 8vw, 118px);
  --header-height: 82px;

  /* Media ratios */
  --ratio-card: 4 / 3;
  --ratio-card-mobile: 16 / 10;
  --ratio-banner: 16 / 9;

  /* Brand sizing */
  --logo-width: 130px;
  --logo-width-mobile: clamp(96px, 28vw, 118px);
  --nav-pad-y: 16px;
  --nav-pad-y-mobile: 12px;

  /* UI */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius: 10px;
  --shadow-modal: 0 28px 80px rgba(0, 0, 0, .25);
}

html {
  scroll-behavior: smooth
}

body {
  font-family: var(--font-body);
  font-size: var(--text-md);
  line-height: 1.65;
  color: var(--color-text);
  background: var(--color-white)
}

.container {
  width: min(calc(100% - (var(--page-pad) * 2)), var(--content-width));
  margin-inline: auto
}

.section {
  padding: var(--section-space) 0
}

.eyebrow {
  margin: 0 0 16px;
  color: var(--color-gold);
  font-size: var(--eyebrow-size);
  line-height: 1.2;
  letter-spacing: .14em;
  font-weight: var(--weight-semibold)
}

.eyebrow.light {
  color: var(--color-gold);
  opacity: 1
}

/* Standard centered section heading */
.section-title,
.section-heading {
  display: block !important;
  text-align: center;
  max-width: 900px;
  margin: 0 auto 52px !important
}

.section-title>div,
.section-heading>div {
  display: block
}

.section-title h2,
.section-heading h2,
.section-heading-title {
  margin: 0 auto 16px;
  font: var(--weight-medium) var(--h2-size)/1.08 var(--font-heading);
  letter-spacing: -.035em;
  max-width: 860px
}

.section-title>p,
.section-heading-intro {
  max-width: 680px;
  margin: 22px auto 0;
  color: var(--color-muted);
  font-size: var(--text-md);
  line-height: 1.75;
  text-align: center
}

/* Common numbers */
.section-number,
.item-number,
.destination-no,
.contact-topics>div>span {
  font-size: var(--number-size);
  line-height: 1.2;
  letter-spacing: .04em;
  font-weight: var(--weight-medium);
  color: var(--color-gold)
}


/* =========================================================
   BUTTON SYSTEM — single source of truth
   ========================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 3px;
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  letter-spacing: .02em;
  line-height: 1;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.btn--outline {
  background: transparent;
  border-color: var(--color-deep);
  color: var(--color-deep);
}

.btn--outline:hover {
  background: var(--color-deep);
  color: #fff;
}


.btn--book {
  min-height: 40px;
  padding: 0 18px;
  border-width: 1px;
  background: var(--color-red);
  border-color: var(--color-red);
  color: #fff;
  font-size: var(--text-xs);
  letter-spacing: .09em;
}

.btn--book::after {
  content: none
}