@charset "UTF-8";
/* ==========================================================================
   AVAVA TRAVEL — Americas page
   Loaded after style.css and destination.css: tokens, top bar, footer and the
   shared destination blocks (breadcrumb, header, season rail, season map,
   letter-home voices, planner) come from those two. Here live the blocks
   unique to this page.
   --------------------------------------------------------------------------
   01. Page tokens
   02. Filter rail — chips on a deep plate
   03. Country grid — passport pages
   04. Why the Americas — three reasons
   05. Responsive — 1400 / 1100 / 900 / 640 / 420
   --------------------------------------------------------------------------
   Sizes follow the reference: --u is 1% of the section's content box at a
   1920 px design width, so padded sections carry a smaller unit.
   ========================================================================== */

/* ==========================================================================
   01. Page tokens
   ========================================================================== */

.page-americas {
  --am-panel: #17435A;
  --am-panel-ink: #FBF6EC;
  --am-panel-rgb: 251, 246, 236;
  --am-panel-accent: #F0B48A;
  --am-chip-ink: #17435A;
  --am-count-ink: #FBF6EC;
  --am-count-rgb: 251, 246, 236;

  --pg-card-bg: #FBF6EC;
  --pg-card-border: #17435A;
  --pg-head-rule: rgba(23, 67, 90, 0.2);
  --pg-tick-off: rgba(23, 67, 90, 0.14);
  --pg-strip-rule: #17435A;
  --pg-flag: #F0B48A;
  --pgblank-ink: #FFFFFF;

  --pgi-bg: #17435A;
  --pgi-border: #17435A;
  --pgi-ink: #FBF6EC;
  --pgi-accent: #F0B48A;
  --pgi-rule: rgba(240, 180, 138, 0.4);
  --pgi-tick-off: rgba(251, 246, 236, 0.22);

  --w3-bg: #17435A;
  --w3-ink: #FBF6EC;
  --w3-rgb: 251, 246, 236;
  --w3-accent: #F0B48A;
  --w3-cta-ink: #17435A;
}

[data-theme="dark"] .page-americas {
  --am-panel: transparent;
  --am-panel-ink: #EDE3D3;
  --am-panel-rgb: 237, 227, 211;
  --am-panel-accent: #E2661F;
  --am-chip-ink: #1A1A1A;
  --am-count-ink: #1A1A1A;
  --am-count-rgb: 26, 26, 26;

  --pg-card-bg: rgba(237, 227, 211, 0.05);
  --pg-card-border: rgba(237, 227, 211, 0.35);
  --pg-head-rule: rgba(237, 227, 211, 0.25);
  --pg-tick-off: rgba(237, 227, 211, 0.18);
  --pg-strip-rule: rgba(237, 227, 211, 0.5);
  --pg-flag: #E2661F;
  --pgblank-ink: #1A1A1A;

  --pgi-bg: rgba(226, 102, 31, 0.14);
  --pgi-border: #E2661F;
  --pgi-ink: #EDE3D3;
  --pgi-accent: #E2661F;
  --pgi-rule: rgba(226, 102, 31, 0.45);
  --pgi-tick-off: rgba(237, 227, 211, 0.18);

  --w3-bg: transparent;
  --w3-ink: #EDE3D3;
  --w3-rgb: 237, 227, 211;
  --w3-accent: #E2661F;
  --w3-cta-ink: #1A1A1A;
}

/* ==========================================================================
   02. Filter rail — chips on a deep plate
   ========================================================================== */

.amrail-sec { --u: 0.9583333vw; }

.amrail {
  margin: 0 var(--gutter);
  background: var(--am-panel);
  color: var(--am-panel-ink);
  border-top: max(3px, calc(var(--u) * 0.208)) solid var(--am-panel-accent);
}

.amrail__strip {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.146);
  flex-wrap: wrap;
  margin: 0;
  padding: calc(var(--u) * 0.625) calc(var(--u) * 1.25) calc(var(--u) * 0.573);
  border-bottom: max(1px, calc(var(--u) * 0.052)) solid rgba(var(--am-panel-rgb), 0.22);
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(12px, calc(var(--u) * 0.885), 17px);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.amrail__live {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.521);
  color: var(--am-panel-accent);
}

.amrail__dot {
  width: max(7px, calc(var(--u) * 0.469));
  height: max(7px, calc(var(--u) * 0.469));
  border-radius: 50%;
  background: var(--am-panel-accent);
}

.amrail__dim {
  opacity: 0.55;
  white-space: nowrap;
}

.amrail__dim--push { margin-left: auto; }

.amrail__body {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}

.amrail__groups {
  flex: 1 1 60%;
  min-width: min(640px, 100%);
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: calc(var(--u) * 1.354) calc(var(--u) * 1.771);
  padding: calc(var(--u) * 1.042) calc(var(--u) * 1.354) calc(var(--u) * 1.146) calc(var(--u) * 1.25);
}

.amgroup {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.469);
}

.amgroup__label {
  font-size: clamp(12px, calc(var(--u) * 0.781), 15px);
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  opacity: 0.5;
}

.amgroup__chips {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.417);
  flex-wrap: wrap;
}

.amchip {
  border: max(1.5px, calc(var(--u) * 0.078)) solid rgba(var(--am-panel-rgb), 0.4);
  padding: calc(var(--u) * 0.417) calc(var(--u) * 0.938);
  color: inherit;
  font-family: inherit;
  font-size: clamp(13px, calc(var(--u) * 0.99), 19px);
  font-weight: 600;
  white-space: nowrap;
  transition: border-color 0.16s ease-out, background-color 0.16s ease-out, color 0.16s ease-out;
}

.amchip:hover {
  border-color: var(--am-panel-accent);
  color: var(--am-panel-accent);
}

.amchip.is-on {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--u) * 0.521);
  border-color: transparent;
  background: var(--am-panel-accent);
  color: var(--am-chip-ink);
  padding: calc(var(--u) * 0.469) calc(var(--u) * 0.729) calc(var(--u) * 0.469) calc(var(--u) * 1.042);
  font-weight: 700;
}

.amchip.is-on:hover { color: var(--am-chip-ink); }

.amchip__x {
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(20px, calc(var(--u) * 1.146));
  height: max(20px, calc(var(--u) * 1.146));
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.16);
  font-size: clamp(11px, calc(var(--u) * 0.729), 14px);
  font-weight: 700;
}

.amgroup__more {
  color: var(--am-panel-accent);
  font-size: clamp(13px, calc(var(--u) * 0.99), 19px);
  font-weight: 700;
  white-space: nowrap;
}

/* dashed vertical divider between the filter groups */
.amgroup__sep {
  width: max(1px, calc(var(--u) * 0.052));
  background: repeating-linear-gradient(to bottom,
    rgba(var(--am-panel-rgb), 0.4) 0 calc(var(--u) * 0.313),
    transparent calc(var(--u) * 0.313) calc(var(--u) * 0.625));
}

.amrail__applied {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.938);
  flex-wrap: wrap;
  margin: 0;
  padding-top: calc(var(--u) * 0.208);
  border-top: max(1px, calc(var(--u) * 0.052)) solid rgba(var(--am-panel-rgb), 0.22);
}

.amrail__applied-label {
  font-size: clamp(12px, calc(var(--u) * 0.833), 16px);
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  opacity: 0.5;
}

.amrail__applied-value {
  font-size: clamp(15px, calc(var(--u) * 1.094), 21px);
  font-weight: 600;
}

.amrail__applied-note {
  font-family: "Caramel", "Segoe Script", cursive;
  font-size: clamp(26px, calc(var(--u) * 2.083), 40px);
  line-height: 0.5;
  color: var(--am-panel-accent);
  transform: rotate(-6deg);
  transform-origin: left center;
  white-space: nowrap;
}

.amrail__reset {
  margin-left: auto;
  border-bottom: max(1.5px, calc(var(--u) * 0.078)) solid rgba(var(--am-panel-rgb), 0.4);
  color: inherit;
  font-family: inherit;
  font-size: clamp(13px, calc(var(--u) * 0.938), 18px);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0.7;
}

.amrail__reset:hover { opacity: 1; }

.amrail__count {
  flex: none;
  width: max(260px, calc(var(--u) * 15.625));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: calc(var(--u) * 0.625);
  background: var(--accent);
  color: var(--am-count-ink);
  padding: calc(var(--u) * 1.042) calc(var(--u) * 1.563) calc(var(--u) * 1.146);
}

.amrail__count-head {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 0.625);
  margin: 0;
}

.amrail__count-value {
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(44px, calc(var(--u) * 3.542), 68px);
  font-weight: 600;
  line-height: 0.82;
}

.amrail__count-label {
  padding-bottom: calc(var(--u) * 0.417);
  font-size: clamp(14px, calc(var(--u) * 0.99), 19px);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.amrail__meter {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.365);
  margin: 0;
}

.amrail__meter-track {
  display: block;
  height: max(5px, calc(var(--u) * 0.313));
  background: rgba(var(--am-count-rgb), 0.3);
}

.amrail__meter-fill {
  display: block;
  width: 25%;
  height: 100%;
  background: var(--am-count-ink);
}

.amrail__meter-label {
  font-size: clamp(12px, calc(var(--u) * 0.833), 16px);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.85;
}

.amrail__link {
  align-self: flex-start;
  border-bottom: max(2px, calc(var(--u) * 0.104)) solid var(--am-count-ink);
  color: var(--am-count-ink);
  font-size: clamp(13px, calc(var(--u) * 0.99), 19px);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* ==========================================================================
   03. Country grid — passport pages
   ========================================================================== */

.pgrid-sec {
  --u: 1vw;
  padding: 3.125vw 0 3.958vw;
}

.pgstrip {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.938);
  flex-wrap: wrap;
  margin: 0 var(--gutter) calc(var(--u) * 1.354);
  padding-bottom: calc(var(--u) * 0.625);
  border-bottom: max(2px, calc(var(--u) * 0.104)) solid var(--pg-strip-rule);
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(12px, calc(var(--u) * 0.885), 17px);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.pgstrip__live {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.521);
  color: var(--accent);
}

.pgstrip__dot {
  width: max(8px, calc(var(--u) * 0.521));
  height: max(8px, calc(var(--u) * 0.521));
  border-radius: 50%;
  background: var(--accent);
}

.pgstrip__dim { opacity: 0.55; }

.pgstrip__dim--push { margin-left: auto; }

.pgstrip__valid {
  border: max(2px, calc(var(--u) * 0.104)) solid var(--pg-strip-rule);
  padding: calc(var(--u) * 0.26) calc(var(--u) * 0.625);
  letter-spacing: 0.16em;
  white-space: nowrap;
}

.pgrid__head {
  gap: calc(var(--u) * 1.563);
  flex-wrap: wrap;
  padding: 0 var(--gutter) calc(var(--u) * 1.563);
}

.pgrid__head .kicker { gap: calc(var(--u) * 0.729); }

.display--pgrid {
  font-size: clamp(44px, calc(var(--u) * 5), 96px);
  line-height: 0.9;
  letter-spacing: -0.015em;
}

.script--pgrid {
  font-size: clamp(40px, calc(var(--u) * 4.583), 88px);
  padding-bottom: calc(var(--u) * 0.938);
  white-space: nowrap;
}

.pgrid__note {
  margin-left: auto;
  max-width: calc(var(--u) * 15.625);
  min-width: 220px;
  padding-bottom: calc(var(--u) * 0.625);
  font-size: clamp(15px, calc(var(--u) * 0.99), 19px);
}

.pgrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: calc(var(--u) * 0.938);
  margin: 0 var(--gutter);
}

.pgcard {
  display: flex;
  flex-direction: column;
  border: max(2px, calc(var(--u) * 0.104)) solid var(--pg-card-border);
  background: var(--pg-card-bg);
  color: inherit;
}

.pgcard--hero {
  position: relative;
  grid-column: span 3;
}

.pgcard--wide { grid-column: span 2; }

.pgcard--invert {
  background: var(--pgi-bg);
  border-color: var(--pgi-border);
  color: var(--pgi-ink);
}

/* perforated card header */
.pgcard__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(var(--u) * 0.521) calc(var(--u) * 0.729);
  border-bottom: max(1px, calc(var(--u) * 0.052)) dashed var(--pg-head-rule);
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(12px, calc(var(--u) * 0.781), 15px);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.pgcard--invert .pgcard__head { border-bottom-color: var(--pgi-rule); }

.pgcard__code { opacity: 0.72; }

.pgcard__no { color: var(--accent); }

.pgcard--invert .pgcard__no { color: var(--pgi-accent); }

.pgcard__photo {
  position: relative;
  display: block;
  height: calc(var(--u) * 15.625);
  min-height: 240px;
  overflow: hidden;
}

.pgcard__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pgcard__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10, 10, 10, 0.8) 0%, transparent 62%);
  pointer-events: none;
}

.pgcard__caption {
  position: absolute;
  left: calc(var(--u) * 1.25);
  bottom: calc(var(--u) * 1.042);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.104);
  color: #FFFFFF;
  pointer-events: none;
}

.pgcard__flag {
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(12px, calc(var(--u) * 0.781), 15px);
  letter-spacing: 0.22em;
  color: var(--pg-flag);
}

.pgcard__country {
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(34px, calc(var(--u) * 3.021), 58px);
  font-weight: 500;
  line-height: 0.95;
}

.pgcard__hint {
  font-size: clamp(15px, calc(var(--u) * 0.99), 19px);
  font-weight: 500;
  opacity: 0.88;
}

/* passport stamp: two rings and stacked type */
.pstamp {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pstamp__ring {
  position: absolute;
  width: max(110px, calc(var(--u) * 6.146));
  height: max(110px, calc(var(--u) * 6.146));
  border: max(2px, calc(var(--u) * 0.104)) solid currentcolor;
  border-radius: 50%;
  opacity: 0.5;
}

.pstamp__ring--dotted {
  width: calc(max(110px, calc(var(--u) * 6.146)) - calc(var(--u) * 0.833));
  height: calc(max(110px, calc(var(--u) * 6.146)) - calc(var(--u) * 0.833));
  border-style: dotted;
  opacity: 0.35;
}

.pstamp--md .pstamp__ring {
  width: max(120px, calc(var(--u) * 6.771));
  height: max(120px, calc(var(--u) * 6.771));
}

.pstamp--md .pstamp__ring--dotted {
  width: calc(max(120px, calc(var(--u) * 6.771)) - calc(var(--u) * 0.833));
  height: calc(max(120px, calc(var(--u) * 6.771)) - calc(var(--u) * 0.833));
}

.pstamp__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 0.156);
  padding: calc(var(--u) * 1.146) 0;
}

.pstamp__entry {
  font-size: clamp(10px, calc(var(--u) * 0.573), 11px);
  font-weight: 700;
  letter-spacing: 0.3em;
}

.pstamp__country {
  border-top: max(2px, calc(var(--u) * 0.104)) solid currentcolor;
  border-bottom: max(2px, calc(var(--u) * 0.104)) solid currentcolor;
  padding: calc(var(--u) * 0.156) calc(var(--u) * 0.417);
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(17px, calc(var(--u) * 1.198), 23px);
  font-weight: 600;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.pstamp__season {
  font-size: clamp(10px, calc(var(--u) * 0.573), 11px);
  font-weight: 700;
  letter-spacing: 0.24em;
  opacity: 0.85;
}

.pgcard__stampwrap {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--u) * 0.625) 0 calc(var(--u) * 0.313);
  color: var(--accent);
}

.pgcard--invert .pgcard__stampwrap { color: var(--pgi-accent); }

.pstamp--photo {
  position: absolute;
  right: calc(var(--u) * 1.146);
  top: calc(var(--u) * 1.042);
  color: #FBF6EC;
  pointer-events: none;
}

.pstamp--photo .pstamp__ring {
  width: max(120px, calc(var(--u) * 6.875));
  height: max(120px, calc(var(--u) * 6.875));
}

.pstamp--photo .pstamp__ring--dotted {
  width: calc(max(120px, calc(var(--u) * 6.875)) - calc(var(--u) * 0.833));
  height: calc(max(120px, calc(var(--u) * 6.875)) - calc(var(--u) * 0.833));
}

.pstamp--photo { transform: rotate(-8deg); }
.pstamp--r5 { transform: rotate(5deg); }
.pstamp--r6 { transform: rotate(6deg); }
.pstamp--r-3 { transform: rotate(-3deg); }
.pstamp--r-4 { transform: rotate(-4deg); }
.pstamp--r-6 { transform: rotate(-6deg); }

.pgcard__body {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.469);
  padding: 0 calc(var(--u) * 0.729) calc(var(--u) * 0.729);
}

.pgcard__body--hero {
  flex-direction: row;
  align-items: center;
  gap: calc(var(--u) * 1.25);
  flex-wrap: wrap;
  padding: calc(var(--u) * 0.833) calc(var(--u) * 1.042) calc(var(--u) * 0.938);
}

.pgcard__facts {
  flex: 1 1 calc(var(--u) * 16.667);
  min-width: min(300px, 100%);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.521);
}

.pgcard__line {
  display: flex;
  align-items: baseline;
  gap: calc(var(--u) * 0.833);
}

.pgcard__line--split {
  justify-content: space-between;
  gap: calc(var(--u) * 0.417);
}

.pgcard__line--wrap {
  gap: calc(var(--u) * 0.729);
  flex-wrap: wrap;
}

.pgcard__routes {
  font-size: clamp(16px, calc(var(--u) * 1.094), 21px);
  font-weight: 600;
}

.pgcard__routes--sm { font-size: clamp(15px, calc(var(--u) * 0.99), 19px); }

.pgcard__price {
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(17px, calc(var(--u) * 1.198), 23px);
  font-weight: 500;
  color: var(--accent);
  white-space: nowrap;
}

.pgcard__price--lg { font-size: clamp(21px, calc(var(--u) * 1.51), 29px); }

.pgcard__price--md {
  margin-left: auto;
  font-size: clamp(20px, calc(var(--u) * 1.406), 27px);
}

.pgcard--invert .pgcard__price { color: var(--pgi-accent); }

.pgcard__note {
  font-size: clamp(14px, calc(var(--u) * 0.833), 16px);
  font-weight: 500;
  opacity: 0.75;
}

.pgcard__note--wide {
  font-size: clamp(14px, calc(var(--u) * 0.885), 17px);
  text-wrap: pretty;
}

.pgcard__seatblock {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.313);
}

/* tick meter for seats left */
.ticks {
  display: flex;
  gap: calc(var(--u) * 0.156);
}

.tick {
  flex: 1;
  height: max(6px, calc(var(--u) * 0.417));
  background: var(--pg-tick-off);
}

.tick.is-on { background: var(--accent); }

.pgcard--invert .tick { background: var(--pgi-tick-off); }

.pgcard--invert .tick.is-on { background: var(--pgi-accent); }

.pgcard__seats {
  font-size: clamp(12px, calc(var(--u) * 0.729), 14px);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.62;
}

.pgcard__cta {
  flex: none;
  border: max(2px, calc(var(--u) * 0.104)) solid var(--accent);
  padding: calc(var(--u) * 0.729) calc(var(--u) * 1.354);
  color: var(--accent);
  font-size: clamp(14px, calc(var(--u) * 0.938), 18px);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background-color 0.16s ease-out, color 0.16s ease-out;
}

.pgcard:hover .pgcard__cta {
  background: var(--accent);
  color: var(--cta-label);
}

.pgcard__split {
  display: flex;
  align-items: stretch;
  gap: calc(var(--u) * 1.042);
  flex-wrap: wrap;
  padding: calc(var(--u) * 0.729) calc(var(--u) * 0.938) calc(var(--u) * 0.833);
}

.pgcard__stampcol {
  flex: none;
  width: max(150px, calc(var(--u) * 8.854));
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent);
}

.pgcard__rule {
  width: max(1px, calc(var(--u) * 0.052));
  background: repeating-linear-gradient(to bottom,
    var(--pg-head-rule) 0 calc(var(--u) * 0.313),
    transparent calc(var(--u) * 0.313) calc(var(--u) * 0.625));
}

.pgcard__col {
  flex: 1 1 auto;
  min-width: min(240px, 100%);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.521);
}

.pgblank {
  grid-column: span 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: calc(var(--u) * 0.729);
  border: max(2px, calc(var(--u) * 0.104)) dashed rgba(var(--ink-rgb), 0.35);
  padding: calc(var(--u) * 1.042) calc(var(--u) * 1.146);
}

.pgblank__text {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.313);
}

.pgblank__label {
  margin: 0;
  color: var(--accent);
  font-size: clamp(13px, calc(var(--u) * 0.833), 16px);
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.pgblank__list {
  margin: 0;
  font-size: clamp(15px, calc(var(--u) * 1.042), 20px);
  font-weight: 500;
  text-wrap: pretty;
}

.pgblank__cta {
  align-self: flex-start;
  background: var(--accent);
  color: var(--pgblank-ink);
  padding: calc(var(--u) * 0.729) calc(var(--u) * 1.563);
  font-size: clamp(15px, calc(var(--u) * 0.99), 19px);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background-color 0.16s ease-out;
}

.pgblank__cta:hover { background: var(--ink); }

/* ==========================================================================
   04. Why the Americas — three reasons
   ========================================================================== */

.why3 {
  --u: 0.9270833vw;
  position: relative;
  margin: 0 var(--gutter);
  padding: 2.917vw 1.563vw 3.229vw;
  background: var(--w3-bg);
  color: var(--w3-ink);
}

.why3__strip {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.938);
  flex-wrap: wrap;
  margin: 0;
  padding-bottom: calc(var(--u) * 1.354);
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(12px, calc(var(--u) * 0.885), 17px);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.why3__live {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.521);
  color: var(--w3-accent);
}

.why3__dot {
  width: max(8px, calc(var(--u) * 0.521));
  height: max(8px, calc(var(--u) * 0.521));
  border-radius: 50%;
  background: var(--w3-accent);
}

.why3__rule {
  flex: 1 1 calc(var(--u) * 6.25);
  height: max(1px, calc(var(--u) * 0.052));
  background: rgba(var(--w3-rgb), 0.3);
}

.why3__dim {
  opacity: 0.55;
  white-space: nowrap;
}

.why3__head {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 1.875);
  flex-wrap: wrap;
  padding-bottom: calc(var(--u) * 2.292);
}

.display--why3 {
  font-size: clamp(46px, calc(var(--u) * 5.208), 100px);
  line-height: 0.88;
}

.display--why3 .display__outline {
  -webkit-text-stroke: max(2px, calc(var(--u) * 0.104)) var(--w3-ink);
}

.script--why3 {
  font-size: clamp(42px, calc(var(--u) * 4.688), 90px);
  padding-bottom: calc(var(--u) * 1.354);
  color: var(--w3-accent);
  white-space: nowrap;
}

.why3__note {
  margin: 0 0 0 auto;
  max-width: calc(var(--u) * 19.792);
  min-width: 240px;
  padding-bottom: calc(var(--u) * 0.729);
  font-size: clamp(15px, calc(var(--u) * 1.094), 21px);
  font-weight: 500;
  text-align: right;
  opacity: 0.8;
  text-wrap: pretty;
}

.why3__cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: max(3px, calc(var(--u) * 0.156)) solid rgba(var(--w3-rgb), 0.55);
  border-bottom: max(3px, calc(var(--u) * 0.156)) solid rgba(var(--w3-rgb), 0.55);
}

.why3col {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.729);
  border-left: max(1.5px, calc(var(--u) * 0.078)) solid rgba(var(--w3-rgb), 0.3);
  padding: calc(var(--u) * 1.771);
}

.why3col--first {
  border-left: 0;
  padding: calc(var(--u) * 1.771) calc(var(--u) * 1.771) calc(var(--u) * 1.563) 0;
}

.why3col--last { padding: calc(var(--u) * 1.771) 0 calc(var(--u) * 1.563) calc(var(--u) * 1.771); }

.why3col__head {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.625);
  margin: 0;
}

.why3col__no {
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(13px, calc(var(--u) * 0.833), 16px);
  letter-spacing: 0.18em;
  color: var(--w3-accent);
}

.why3col__rule {
  flex: 1;
  height: max(1px, calc(var(--u) * 0.052));
  background: rgba(var(--w3-rgb), 0.3);
}

.why3col__cat {
  font-size: clamp(12px, calc(var(--u) * 0.729), 14px);
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.45;
}

.why3col__figure {
  margin: 0;
  font-family: "Oswald", "Helvetica Neue", sans-serif;
  font-size: clamp(58px, calc(var(--u) * 6.875), 132px);
  font-weight: 600;
  line-height: 0.82;
  letter-spacing: -0.02em;
}

.why3col__text {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.417);
}

.why3col__title {
  margin: 0;
  color: var(--w3-accent);
  font-size: clamp(17px, calc(var(--u) * 1.25), 24px);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.why3col__body {
  margin: 0;
  max-width: calc(var(--u) * 25);
  font-size: clamp(15px, calc(var(--u) * 1.094), 21px);
  font-weight: 500;
  opacity: 0.82;
  text-wrap: pretty;
}

.why3col__graph {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 0.417);
  padding-top: calc(var(--u) * 1.146);
}

.bars {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 0.208);
  height: max(20px, calc(var(--u) * 1.354));
}

.bar3 {
  flex: 1;
  height: 100%;
  background: rgba(var(--w3-rgb), 0.22);
}

.bar3--low { height: 55%; }

.bar3.is-on { background: var(--w3-accent); }

.week {
  display: flex;
  gap: calc(var(--u) * 0.208);
}

.week__day {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 0.26);
}

.week__bar {
  width: 100%;
  height: max(20px, calc(var(--u) * 1.354));
  background: rgba(var(--w3-rgb), 0.22);
}

.week__bar.is-on { background: var(--w3-accent); }

.week__label {
  font-size: clamp(11px, calc(var(--u) * 0.677), 13px);
  font-weight: 700;
  letter-spacing: 0.1em;
  opacity: 0.55;
}

.why3col__caption {
  margin: 0;
  font-size: clamp(13px, calc(var(--u) * 0.781), 15px);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.5;
}

.why3col__proof {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.625);
  flex-wrap: wrap;
  margin: 0;
  padding-top: calc(var(--u) * 0.938);
  border-top: max(1px, calc(var(--u) * 0.052)) dashed rgba(var(--w3-rgb), 0.35);
}

.why3col__badge {
  border: max(1.5px, calc(var(--u) * 0.078)) solid var(--w3-accent);
  padding: calc(var(--u) * 0.26) calc(var(--u) * 0.521);
  color: var(--w3-accent);
  font-size: clamp(11px, calc(var(--u) * 0.677), 13px);
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.why3col__claim {
  font-size: clamp(14px, calc(var(--u) * 0.938), 18px);
  font-weight: 600;
}

.why3__foot {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.146);
  flex-wrap: wrap;
  margin: 0;
  padding-top: calc(var(--u) * 1.146);
}

.why3__foot-text {
  font-size: clamp(15px, calc(var(--u) * 1.042), 20px);
  font-weight: 500;
  opacity: 0.75;
}

.why3__cta {
  margin-left: auto;
  border: max(2px, calc(var(--u) * 0.104)) solid var(--night-accent);
  background: var(--night-accent);
  color: var(--w3-cta-ink);
  padding: calc(var(--u) * 0.729) calc(var(--u) * 1.563);
  font-size: clamp(15px, calc(var(--u) * 0.99), 19px);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background-color 0.16s ease-out, color 0.16s ease-out;
}

.why3__cta:hover {
  background: transparent;
  color: var(--night-accent);
}

/* the dark panel sits on the page texture, so its rules are a touch softer */
[data-theme="dark"] .why3__cols {
  border-top-color: rgba(var(--w3-rgb), 0.5);
  border-bottom-color: rgba(var(--w3-rgb), 0.5);
}

[data-theme="dark"] .why3col { border-left-color: rgba(var(--w3-rgb), 0.28); }

[data-theme="dark"] .why3__rule,
[data-theme="dark"] .why3col__rule { background: rgba(var(--w3-rgb), 0.28); }

[data-theme="dark"] .why3col__proof { border-top-color: rgba(var(--w3-rgb), 0.32); }

[data-theme="dark"] .bar3,
[data-theme="dark"] .week__bar { background: rgba(var(--w3-rgb), 0.18); }

[data-theme="dark"] .bar3.is-on,
[data-theme="dark"] .week__bar.is-on { background: var(--w3-accent); }

/* ==========================================================================
   05. Responsive
   ========================================================================== */

@media (max-width: 1400px) {
  .pgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pgcard--hero { grid-column: span 3; }
  .pgcard--wide,
  .pgblank { grid-column: span 3; }
}

@media (max-width: 1100px) {
  .amrail__groups { min-width: 100%; }
  .amrail__count { width: 100%; }
  .why3__cols { grid-template-columns: 1fr; }
  .why3col,
  .why3col--first,
  .why3col--last { border-left: 0; padding: calc(var(--u) * 1.563) 0; }
  .why3col + .why3col { border-top: max(1.5px, calc(var(--u) * 0.078)) solid rgba(var(--w3-rgb), 0.3); }
}

@media (max-width: 900px) {
  .amrail { margin: 0 var(--gutter); }
  .amrail__strip { gap: 10px; padding: 12px 16px; font-size: 12px; }
  .amrail__groups { gap: 18px 22px; padding: 18px 16px 20px; }
  .amgroup__sep { display: none; }
  .amchip,
  .amchip.is-on { padding: 8px 14px; font-size: 15px; }
  .amrail__applied { gap: 10px; }
  .amrail__applied-note { font-size: 30px; }
  .amrail__reset { margin-left: 0; }
  .amrail__count { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 12px; padding: 16px; }
  .amrail__count-value { font-size: 42px; }
  .amrail__meter { flex: 1 1 140px; }
  .amrail__link { margin-left: auto; }

  .pgrid-sec { padding: 34px 0 44px; }
  .pgstrip { gap: 8px 14px; font-size: 12px; }
  .pgrid__head { padding: 0 var(--gutter) 22px; gap: 14px; }
  .display--pgrid { font-size: clamp(34px, 8vw, 54px); }
  .script--pgrid { font-size: clamp(34px, 9vw, 56px); padding-bottom: 6px; }
  .pgrid__note { min-width: 0; max-width: none; text-align: left; padding-bottom: 0; }
  .pgrid { grid-template-columns: 1fr; gap: 16px; }
  .pgcard--hero,
  .pgcard--wide,
  .pgblank { grid-column: auto; }
  .pgcard__photo { height: 220px; min-height: 0; }
  /* the stamp rings overhang their text box, so keep them off the card edge */
  .pstamp--photo { right: 26px; top: 18px; }
  .pgcard__country { font-size: 34px; }
  .pgcard__body--hero { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px 18px 18px; }
  .pgcard__facts { min-width: 0; }
  .pgcard__cta { text-align: center; }
  .pgcard__rule { display: none; }

  .why3 { padding: 30px 18px 34px; }
  .why3__strip { gap: 10px; padding-bottom: 18px; font-size: 12px; }
  .why3__head { gap: 14px; padding-bottom: 22px; }
  .display--why3 { font-size: clamp(32px, 8vw, 54px); }
  .script--why3 { font-size: clamp(34px, 9vw, 56px); padding-bottom: 6px; white-space: normal; }
  .why3__note { min-width: 0; max-width: none; margin-left: 0; text-align: left; padding-bottom: 0; }
  .why3col__figure { font-size: 58px; }
  .why3__foot { gap: 12px; }
  .why3__cta { margin-left: 0; padding: 14px 22px; font-size: 15px; }
}

@media (max-width: 640px) {
  .amrail__strip { flex-wrap: wrap; }
  .amrail__dim--push { margin-left: 0; }
  .pgstrip__dim--push { margin-left: 0; }
  .pgcard__split { padding: 14px 16px 16px; }
  .pgcard__stampcol { width: 100%; }
}

@media (max-width: 420px) {
  .amchip,
  .amchip.is-on { font-size: 14px; padding: 7px 12px; }
  .pgcard__photo { height: 190px; }
  .pgcard__country { font-size: 28px; }
  .pgcard__cta { padding: 12px 14px; font-size: 13px; }
  .why3col__figure { font-size: 48px; }
}