/* ==========================================================================
   ArrivalDesk — main stylesheet
   1. Tokens
   2. Reset & base
   3. Typography
   4. Layout helpers
   5. Buttons & forms
   6. Header / navigation
   7. Hero + document card (signature element)
   8. Home sections
   9. Footer
   10. Blog & static pages
   11. (removed)
   12. Application form (multi-step)
   13. Motion & accessibility
   14. ArrivalDesk brand layer (the site's own design)
   ========================================================================== */

/* 1. Tokens ---------------------------------------------------------------*/
:root {
  --c-ink: #12181c;
  --c-ink-soft: #4a534f;
  --c-ink-faint: #8a908c;
  --c-primary: #1d6f5a;
  --c-primary-dark: #14503f;
  --c-primary-tint: #e6efea;
  --c-accent: #c2542f;
  --c-gold: #c9a227;
  --c-mist: #f4f1ea;
  --c-paper: #fffdf8;
  --c-line: rgba(18, 24, 28, 0.14);
  --c-line-strong: rgba(18, 24, 28, 0.26);
  --c-header-bg: #fffdf8;
  --c-footer-bg: #12181c;
  --c-button-text: #fffdf8;

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Roboto Mono", ui-monospace, "SFMono-Regular", monospace;

  --step--1: clamp(0.82rem, 0.79rem + 0.15vw, 0.9rem);
  --step-0: clamp(0.98rem, 0.95rem + 0.2vw, 1.06rem);
  --step-1: clamp(1.15rem, 1.08rem + 0.35vw, 1.35rem);
  --step-2: clamp(1.4rem, 1.25rem + 0.7vw, 1.85rem);
  --step-3: clamp(1.75rem, 1.45rem + 1.4vw, 2.6rem);
  --step-4: clamp(2.15rem, 1.6rem + 2.6vw, 3.6rem);

  --radius: 4px;
  --radius-lg: 6px;
  --radius-pill: 3px;
  --shadow-sm: 0 1px 2px rgba(16, 31, 51, 0.06), 0 2px 8px rgba(16, 31, 51, 0.05);
  --shadow-md: 0 8px 28px rgba(16, 31, 51, 0.1);
  --shadow-lg: 0 24px 60px rgba(16, 31, 51, 0.16);

  --wrap: 1200px;
  --wrap-narrow: 760px;
  --gutter: clamp(1.1rem, 4vw, 2.5rem);
  --section-y: clamp(3.5rem, 7vw, 6.5rem);
  --header-h: 72px;
}

/* 2. Reset & base ---------------------------------------------------------*/
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--step-0);
  line-height: 1.65;
  color: var(--c-ink-soft);
  background: var(--c-paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body.nav-open { overflow: hidden; }

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: var(--c-primary); text-decoration: none; }
a:hover { color: var(--c-primary-dark); }

hr { border: 0; border-top: 1px solid var(--c-line); margin: 2rem 0; }

::selection { background: var(--c-primary); color: #fff; }

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

.skip-link {
  position: absolute; left: 50%; top: -100px;
  transform: translateX(-50%);
  background: var(--c-ink); color: #fff;
  padding: 0.75rem 1.25rem; border-radius: 0 0 10px 10px;
  z-index: 999;
}
.skip-link:focus { top: 0; color: #fff; }

/* 3. Typography -----------------------------------------------------------*/
h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  color: var(--c-ink);
  line-height: 1.1;
  margin: 0 0 0.6em;
  font-weight: 600;
  letter-spacing: -0.02em;
}
h1 { font-size: var(--step-4); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-primary);
  margin: 0 0 1rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.eyebrow::before {
  content: "";
  width: 26px; height: 1px;
  background: currentColor;
  flex: none;
}
.eyebrow--center { justify-content: center; }

.lede {
  font-size: var(--step-1);
  color: var(--c-ink-soft);
  line-height: 1.55;
}

.mono { font-family: var(--font-mono); }

/* 4. Layout helpers -------------------------------------------------------*/
.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.wrap--narrow { max-width: var(--wrap-narrow); }

.section { padding-block: var(--section-y); }
.section--mist { background: var(--c-mist); }
.section--ink { background: var(--c-ink); color: rgba(255, 255, 255, 0.75); }
.section--ink h2, .section--ink h3 { color: #fff; }
.section--ink .eyebrow { color: var(--c-gold); }

.section--primary { background: var(--c-primary); color: rgba(255, 255, 255, 0.86); }
.section--primary h2, .section--primary h3 { color: #fff; }
.section--primary .eyebrow { color: rgba(255, 255, 255, 0.75); }
.section--primary .stage,
.section--primary .plan,
.section--primary .review { background: rgba(255, 255, 255, 0.96); }

.section--tint { background: var(--c-primary-tint); }

/* Per-section custom background, set in the builder */
.section[data-bg] { background: var(--section-bg, transparent); }

.section-head { max-width: 680px; margin-bottom: clamp(2rem, 4vw, 3.25rem); }
.section-head--center { margin-inline: auto; text-align: center; }
.section-head p { margin-top: 0.75rem; }

.grid { display: grid; gap: clamp(1rem, 2.2vw, 1.6rem); }
/* Destination cards sit inside a plain wrapper div, so that wrapper is the
   real grid item. Without this, a card whose meta list is one row shorter
   (a destination with no government fee, say) renders visibly shorter than
   the ones beside it. Stretching the wrapper lets .dcard's height:100% do
   what it was always meant to. */
.grid > div { display: flex; }
.grid > div > .dcard { width: 100%; }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* Image + text section ----------------------------------------------------
   Its columns must stack their own contents (heading above body), so they
   opt out of the ".grid > div { display: flex }" rule above, which exists
   for destination cards and would otherwise lay the heading and the body
   text beside each other. */
.imagetext > div,
.imagetext__copy,
.imagetext__media { display: block; }
.imagetext__media img { width: 100%; height: auto; display: block; }
/* No image: one readable column rather than a half-empty row. */
.imagetext--solo { max-width: 760px; }
.imagetext--solo .section-head { margin-bottom: 1.25rem; }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); }

/* 5. Buttons & forms ------------------------------------------------------*/
.btn {
  --btn-bg: var(--c-primary);
  --btn-fg: var(--c-button-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.85rem 1.5rem;
  background: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  font: 600 var(--step-0) / 1 var(--font-body);
  cursor: pointer;
  transition: transform 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
  text-align: center;
}
.btn:hover { --btn-bg: var(--c-primary-dark); color: var(--btn-fg); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn--lg { padding: 1.05rem 1.9rem; font-size: var(--step-1); }
.btn--sm { padding: 0.6rem 1.1rem; font-size: var(--step--1); }
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--c-ink); border-color: var(--c-line-strong); }
.btn--ghost:hover { --btn-bg: var(--c-ink); --btn-fg: #fff; }
/* The Back button reuses the same right-pointing arrow as Continue; only
   the two together (this specific pairing) should have it flipped. */
.btn--pill.btn--ghost svg { transform: scaleX(-1); }
.btn--light { --btn-bg: #fff; --btn-fg: var(--c-ink); }
.btn--light:hover { --btn-bg: var(--c-mist); --btn-fg: var(--c-ink); }
.btn--block { width: 100%; }
.btn[disabled] { opacity: 0.5; pointer-events: none; }

.field { display: block; margin-bottom: 1.1rem; }
.field > label,
.field-label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 0.45rem;
}
.field .req { color: var(--c-accent); }

input[type="text"], input[type="email"], input[type="tel"], input[type="date"],
input[type="number"], input[type="password"], input[type="search"], input[type="url"],
select, textarea {
  width: 100%;
  padding: 0.8rem 0.95rem;
  font: 400 var(--step-0) / 1.4 var(--font-body);
  color: var(--c-ink);
  background: #fff;
  border: 1px solid var(--c-line-strong);
  border-radius: 10px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  appearance: none;
}
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2346586e' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.9rem center;
  background-size: 11px;
  padding-right: 2.4rem;
}
textarea { min-height: 130px; resize: vertical; }

/* Date inputs need their height put back.
   `appearance: none` above is what gives every field the same flat look,
   but on WebKit — iOS Safari especially — it also strips the native date
   control's intrinsic sizing. The field then collapses to shorter than the
   text inputs beside it and its value sits misaligned, which is what makes
   an empty date field look broken rather than empty. Pin the height to
   what a text input computes to (line-height + vertical padding + border)
   and left-align the value like every other field. */
input[type="date"] {
  min-height: calc(var(--step-0) * 1.4 + 1.6rem + 2px);
}
input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
  margin: 0;
}
input[type="date"]::-webkit-datetime-edit {
  line-height: 1.4;
  padding: 0;
}
input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0.5;
  cursor: pointer;
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-tint);
}

:focus-visible {
  outline: 3px solid var(--c-primary);
  outline-offset: 2px;
}

.check {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  font-size: var(--step--1);
  line-height: 1.5;
  cursor: pointer;
  margin-bottom: 0.8rem;
}
.check input { margin-top: 0.2rem; flex: none; width: 18px; height: 18px; accent-color: var(--c-primary); }

.field-error {
  color: var(--c-accent);
  font-size: var(--step--1);
  margin-top: 0.35rem;
  display: none;
}
.has-error input, .has-error select, .has-error textarea { border-color: var(--c-accent); }
.has-error .field-error { display: block; }

/* 6. Header / navigation --------------------------------------------------*/
.topbar {
  background: var(--c-ink);
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
  font-family: var(--font-mono);
  letter-spacing: 0.03em;
}
.topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 38px;
  padding-block: 0.4rem;
}
.topbar__note { display: flex; align-items: center; gap: 0.5rem; }
.topbar__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c-gold); flex: none; }
.topbar__links { display: flex; gap: 1.25rem; }
.topbar a { color: rgba(255, 255, 255, 0.72); }
.topbar a:hover { color: #fff; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--c-header-bg);
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.site-header.is-stuck { border-bottom-color: var(--c-line); box-shadow: var(--shadow-sm); }

.site-header__inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-height: var(--header-h);
}

.brand { display: flex; align-items: center; gap: 0.65rem; flex: none; }
.brand img { max-height: 42px; width: auto; }
.brand__mark {
  width: 38px; height: 38px;
  border-radius: 11px;
  background: var(--c-primary);
  color: #fff;
  display: grid; place-items: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.05rem;
  flex: none;
}
.brand__name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.12rem;
  color: var(--c-ink);
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.brand__name small {
  display: block;
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: 0.62rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}

.nav { margin-left: auto; }
.nav ul { list-style: none; display: flex; align-items: center; gap: 1.6rem; margin: 0; padding: 0; }
.nav li { position: relative; }
.nav a {
  color: var(--c-ink);
  font-size: 0.94rem;
  font-weight: 500;
  padding-block: 0.5rem;
  display: inline-block;
}
.nav a:hover, .nav .current-menu-item > a { color: var(--c-primary); }
.nav .sub-menu {
  position: absolute;
  top: 100%; left: -0.9rem;
  min-width: 220px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  padding: 0.5rem;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  opacity: 0; visibility: hidden;
  transform: translateY(6px);
  transition: all 0.18s ease;
}
.nav li:hover > .sub-menu,
.nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.nav .sub-menu a { padding: 0.55rem 0.8rem; border-radius: 8px; display: block; }
.nav .sub-menu a:hover { background: var(--c-mist); }

.header-actions { display: flex; align-items: center; gap: 0.75rem; flex: none; }

.cart-link {
  position: relative;
  display: grid; place-items: center;
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid var(--c-line-strong);
  color: var(--c-ink);
}
.cart-link:hover { background: var(--c-mist); }
.cart-link__count {
  position: absolute; top: -4px; right: -4px;
  min-width: 19px; height: 19px;
  padding-inline: 4px;
  border-radius: 999px;
  background: var(--c-accent);
  color: #fff;
  font: 600 0.68rem/19px var(--font-mono);
  text-align: center;
}

.nav-toggle {
  display: none;
  width: 44px; height: 44px;
  border: 1px solid var(--c-line-strong);
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
  padding: 0;
  place-items: center;
}
.nav-toggle span {
  display: block;
  width: 18px; height: 2px;
  background: var(--c-ink);
  border-radius: 2px;
  position: relative;
  transition: background 0.15s ease;
}
.nav-toggle span::before,
.nav-toggle span::after {
  content: ""; position: absolute; left: 0;
  width: 18px; height: 2px; background: var(--c-ink); border-radius: 2px;
  transition: transform 0.2s ease, top 0.2s ease;
}
.nav-toggle span::before { top: -6px; }
.nav-toggle span::after { top: 6px; }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { top: 0; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after { top: 0; transform: rotate(-45deg); }

/* 7. Hero + document card -------------------------------------------------*/
.hero {
  position: relative;
  padding-block: clamp(2.75rem, 6vw, 5rem) clamp(3rem, 7vw, 5.5rem);
  background:
    radial-gradient(120% 80% at 88% 0%, var(--c-primary-tint) 0%, rgba(255, 255, 255, 0) 60%),
    radial-gradient(70% 60% at 4% 100%, rgba(216, 160, 61, 0.1) 0%, rgba(255, 255, 255, 0) 65%),
    var(--c-paper);
  overflow: hidden;
}
.hero::after {
  /* faint dotted flight path */
  content: "";
  position: absolute;
  inset: auto 0 -40px 0;
  height: 160px;
  background-image: radial-gradient(var(--c-line) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: 0.6;
  pointer-events: none;
  mask-image: linear-gradient(to top, #000, transparent);
  -webkit-mask-image: linear-gradient(to top, #000, transparent);
}
.hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.hero--no-card .hero__inner { grid-template-columns: 1fr; max-width: 760px; }
.hero h1 { margin-bottom: 1rem; }
.hero h1 em {
  font-style: normal;
  color: var(--c-primary);
  position: relative;
  /* On a phone the emphasised phrase must be allowed to wrap, or the
     headline runs past the right edge and gets cut off. On a wider screen
     keeping it on one line reads better, so nowrap is reinstated there
     via the media query below. */
  white-space: normal;
}
@media (min-width: 700px) {
  .hero h1 em { white-space: nowrap; }
}
/* Drawn as a repeating background rather than an absolutely-positioned
   pseudo-element, so it follows the text correctly when the phrase wraps
   onto a second line on a phone. box-decoration-break makes each line box
   get its own underline instead of one stretched across both. */
.hero h1 em {
  background-image: linear-gradient(var(--c-gold), var(--c-gold));
  background-repeat: no-repeat;
  background-size: 100% 0.09em;
  background-position: 0 calc(100% + 0.06em);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.hero__sub { max-width: 46ch; }

.hero__picker {
  margin-top: 1.9rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: 0.9rem;
  display: flex;
  gap: 0.7rem;
  align-items: stretch;
  max-width: 540px;
  transition: box-shadow 0.2s ease;
}
.hero__picker:focus-within { box-shadow: var(--shadow-lg), 0 0 0 3px var(--c-primary-tint); }
.hero__picker .picker-field { flex: 1 1 auto; min-width: 0; position: relative; }
.hero__picker .picker-field label {
  position: absolute; top: 0.45rem; left: 0.95rem;
  font-family: var(--font-mono); font-size: 0.62rem;
  letter-spacing: 0.13em; text-transform: uppercase; color: var(--c-ink-faint);
  pointer-events: none;
}
.hero__picker select {
  border: 0;
  padding: 1.5rem 2.2rem 0.55rem 0.9rem;
  background-color: transparent;
  font-weight: 600;
  color: var(--c-ink);
  height: 100%;
}
.hero__picker select:focus { box-shadow: none; }
.hero__picker .btn { flex: none; }

.hero__assurances {
  list-style: none;
  margin: 1.9rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  font-size: var(--step--1);
  align-items: flex-start;
}
.hero__assurances li { display: flex; align-items: center; gap: 0.55rem; color: var(--c-ink-soft); }
.hero__assurances svg {
  color: var(--c-primary);
  flex: none;
  background: var(--c-primary-tint);
  border-radius: 50%;
  padding: 4px;
  box-sizing: content-box;
}

.landing-hero .hero__sub { max-width: 52ch; }

/* Focus mode — a distraction-free view of the application form. Site
   header/footer, the pricing sidebar and page copy all hide; only the
   step wizard remains, with a minimal exit bar in their place. ------------ */
.adk-focus-bar {
  display: none;
  position: sticky;
  top: 0;
  z-index: 40;
  align-items: center;
  justify-content: space-between;
  padding: 0.85rem clamp(1rem, 4vw, 2rem);
  background: #fff;
  border-bottom: 1px solid var(--c-line);
  box-shadow: var(--shadow-sm);
}
.adk-focus-bar__brand.brand { pointer-events: none; }
.adk-focus-bar__right { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 0.6rem 1.1rem; }
.adk-focus-bar__secure {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.76rem;
  color: var(--c-primary);
  font-weight: 600;
}
.adk-focus-bar__secure svg { flex: none; }
.adk-focus-bar__track {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--c-ink-soft);
  text-decoration: underline;
  text-decoration-color: var(--c-line-strong);
  text-underline-offset: 3px;
  white-space: nowrap;
}
.adk-focus-bar__track:hover { color: var(--c-primary); text-decoration-color: var(--c-primary); }
.adk-focus-bar__exit {
  border: 1px solid var(--c-line);
  background: #fff;
  border-radius: var(--radius-pill);
  padding: 0.5rem 1.2rem;
  font-size: var(--step--1);
  font-weight: 600;
  color: var(--c-ink-soft);
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.adk-focus-bar__exit:hover { border-color: var(--c-ink); color: var(--c-ink); }
@media (max-width: 560px) {
  .adk-focus-bar__secure { display: none; }
}

/* On a narrow screen the brand block is wide enough to squeeze the right-hand
   group into a column, which stacks "Track status" above "Exit" and leaves the
   bar tall and crooked. Shrink the brand, keep the two controls on one line. */
@media (max-width: 640px) {
  .adk-focus-bar {
    padding: 0.6rem 0.9rem;
    gap: 0.75rem;
  }
  /* .brand is flex:none globally, so on a narrow screen it refuses to give
     up any width and the controls beside it get squeezed instead. Let it
     shrink here — the ellipsis above handles the overflow. */
  .adk-focus-bar__brand.brand { gap: 0.5rem; min-width: 0; flex: 0 1 auto; }
  /* The tagline under the site name is the first thing to go — it is the
     least useful line in the bar and the widest. */
  .adk-focus-bar__brand .brand__name small { display: none; }
  .adk-focus-bar__brand .brand__name {
    font-size: 0.95rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .adk-focus-bar__brand .brand__mark { width: 32px; height: 32px; border-radius: 9px; font-size: 0.9rem; }
  .adk-focus-bar__brand img { max-height: 32px; }
  .adk-focus-bar__right {
    flex-wrap: nowrap;
    flex: none;
    gap: 0.75rem;
  }
  .adk-focus-bar__track { font-size: 0.72rem; }
  .adk-focus-bar__exit { padding: 0.4rem 0.9rem; font-size: 0.8rem; }
}

.adk-focus-foot {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  text-align: center;
  padding: 1.1rem 1.5rem;
  background: var(--c-ink);
  color: rgba(255, 255, 255, 0.62);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.04em;
}
.adk-focus-foot span { display: inline-flex; align-items: center; gap: 0.4rem; }
.adk-focus-foot svg { color: var(--c-gold); flex: none; }
.adk-focus-foot__dot { color: rgba(255, 255, 255, 0.3); }
@media (max-width: 560px) {
  .adk-focus-foot__dot { display: none; }
  .adk-focus-foot { flex-direction: column; gap: 0.35rem; }
}

body.adk-focus .site-header,
body.adk-focus .site-footer,
body.adk-focus .dest-hero,
body.adk-focus .service__facts,
body.adk-focus .entry-content,
body.adk-focus .disclaimer,
body.adk-focus .service__aside {
  display: none !important;
}
body.adk-focus .adk-focus-bar,
body.adk-focus .adk-focus-foot { display: flex; }
body.adk-focus .adk-focus-foot { display: block; }
body.adk-focus .service { display: block; }
body.adk-focus .service__main { max-width: 640px; margin-inline: auto; }
body.adk-focus main#content {
  padding-block: clamp(2rem, 5vw, 3.5rem) clamp(2.5rem, 6vw, 4rem);
  background:
    radial-gradient(70% 60% at 15% 0%, var(--c-primary-tint) 0%, rgba(255, 255, 255, 0) 60%),
    var(--c-mist);
  min-height: calc(100vh - var(--header-h) - 3rem);
}
body.adk-focus .appform { box-shadow: var(--shadow-lg); }

/* Price reveal — only shown on the review step, once the whole form is
   filled in. ----------------------------------------------------------
   Deliberately understated: a quiet summary line, not a callout. No card,
   no heading treatment, no brand color, nothing scaled up — the fee is
   information the traveler needs to see, not the thing the page is
   selling at this point. Everything here sits at one small text size. */
.price-reveal {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 1.4rem;
  font-size: 12px;
  color: var(--c-ink-soft);
}
.price-reveal__fee {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.1rem 0.6rem;
}
.price-reveal__label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--c-ink-faint);
}
/* The fee itself, and the WooCommerce price markup nested inside it, are
   pinned to exactly the same size, weight and color as the label beside
   them — one uniform line, nothing emphasised. Without these the theme's
   own .amount rules and the browser's default <strong> weight scale the
   number back up. */
.price-reveal__fee strong,
.price-reveal__fee strong .amount,
.price-reveal__fee strong bdi,
.price-reveal__fee strong ins,
.price-reveal__fee strong span {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--c-ink-faint);
  text-decoration: none;
}
.price-reveal__delivery { font-size: 12px; font-weight: 400; color: var(--c-ink-faint); width: 100%; margin-top: 0.05rem; }

/* A second, visually lighter line for the government fee — present
   alongside the processing fee, but never mistaken for part of our price. */
.price-reveal__govt {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.1rem 0.6rem;
  margin-top: 0.45rem;
}
.price-reveal__govt strong,
.price-reveal__govt strong .amount,
.price-reveal__govt strong bdi {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--c-ink-faint);
}
.price-reveal__speed { margin-top: 1rem; }
.price-reveal__speed-label {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 0.6rem;
}
.price-reveal__option {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-top: 0.6rem;
  padding: 0.9rem 1rem;
  background: #fff;
  border: 1.5px solid var(--c-line);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.price-reveal__option:has(input:checked) { border-color: var(--c-gold); box-shadow: 0 0 0 3px rgba(216, 160, 61, 0.14); }
.price-reveal__option.is-standard:has(input:checked) { border-color: var(--c-primary); box-shadow: 0 0 0 3px var(--c-primary-tint); }
.price-reveal__option input { width: 1.15rem; height: 1.15rem; flex: none; accent-color: var(--c-gold); }
.price-reveal__option.is-standard input { accent-color: var(--c-primary); }
.price-reveal__option-copy { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.1rem; }
.price-reveal__option-copy strong { font-size: var(--step-0); color: var(--c-ink); }
.price-reveal__option-copy span { font-size: 0.78rem; color: var(--c-ink-soft); }
.price-reveal__option-fee { text-align: right; font-weight: 700; color: var(--c-ink); flex: none; font-size: var(--step--1); }
.price-reveal__option-fee small { display: block; font-weight: 400; font-size: 0.65rem; color: var(--c-ink-faint); text-transform: uppercase; letter-spacing: 0.05em; }
.price-reveal__total { margin-top: 0.55rem; padding-top: 0.55rem; border-top: 1px solid var(--c-line); display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; font-weight: 400; color: var(--c-ink-faint); }
.price-reveal__total strong { font-family: var(--font-body); font-size: 12px; font-weight: 400; color: var(--c-ink-faint); }
.price-reveal__note { margin: 0.5rem 0 0; font-size: 12px; color: var(--c-ink-faint); }
.price-reveal__badge {
  display: inline-block;
  align-self: flex-start;
  font-family: var(--font-mono);
  font-size: 0.6rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--c-gold);
  color: var(--c-ink);
  border-radius: 999px;
  padding: 0.12rem 0.55rem;
  margin-bottom: 0.15rem;
}
.price-reveal__option-icon { flex: none; color: var(--c-ink-faint); display: inline-flex; }
.price-reveal__option.is-standard .price-reveal__option-icon,
.price-reveal__option:has(input:checked) .price-reveal__option-icon { color: var(--c-primary); }
.price-reveal__delivery-note {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.35rem 0 0;
  font-size: 12px;
  color: var(--c-ink-faint);
}
.price-reveal__delivery-note svg { flex: none; color: var(--c-primary); }

/* Destination guide sections ---------------------------------------------
   The blocks that make a country landing page read as a travel guide:
   a quick-answer fact strip, a "where to go" set, and a pre-flight
   checklist. All built from the same tokens as everything else. */

.section--tight { padding-block: clamp(2rem, 4vw, 3rem); }

/* At a glance ------------------------------------------------------------ */
.factbar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1px;
  background: var(--c-line);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.factbar__item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1.15rem 1.25rem;
  background: var(--c-paper, #fff);
}
.factbar__icon { color: var(--c-primary); display: inline-flex; margin-bottom: 0.15rem; }
.factbar__label {
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.factbar__value {
  font-family: var(--font-display);
  font-size: var(--step-1);
  line-height: 1.2;
  color: var(--c-ink);
}
.factbar__note { font-size: 0.78rem; color: var(--c-ink-soft); }
.factbar__foot { margin: 0.9rem 0 0; font-size: 0.78rem; color: var(--c-ink-faint); }

/* Where to go ------------------------------------------------------------ */
.places {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
}
.place {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 1.6rem 1.5rem 1.5rem;
  background: var(--c-paper, #fff);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
.place:hover { border-color: var(--c-primary); transform: translateY(-3px); box-shadow: var(--shadow-lg, 0 18px 40px rgba(16, 31, 51, 0.08)); }
.place__num {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: var(--c-primary);
}
.place__meta {
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.place__title { font-size: var(--step-1); margin: 0; }
.place__text { margin: 0; font-size: var(--step--1); color: var(--c-ink-soft); }
.place__best {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.35rem 0 0;
  padding-top: 0.7rem;
  border-top: 1px dashed var(--c-line);
  font-size: 0.75rem;
  color: var(--c-ink-faint);
}
.place__best svg { flex: none; color: var(--c-primary); }

/* Before you fly --------------------------------------------------------- */
.checklist-layout {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}
.checklist-layout__head .section-head { margin-bottom: 0; }
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.85rem; }
.checklist__item { display: flex; align-items: flex-start; gap: 0.85rem; }
.checklist__tick {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  background: var(--c-primary-tint);
  color: var(--c-primary);
  margin-top: 0.1rem;
}
.checklist__copy { display: flex; flex-direction: column; gap: 0.15rem; }
.checklist__copy strong { font-size: var(--step-0); color: var(--c-ink); }
.checklist__copy span { font-size: var(--step--1); color: var(--c-ink-soft); }
.checklist__foot {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: clamp(1.5rem, 3vw, 2.25rem) 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--c-line);
  font-size: 0.8rem;
  color: var(--c-ink-faint);
}
.checklist__foot svg { flex: none; color: var(--c-primary); }

/* Application tracker ---------------------------------------------------- */
.tracker-card {
  max-width: 460px;
  margin-inline: auto;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: clamp(1.5rem, 4vw, 2.25rem);
}
.tracker-form .field { margin-bottom: 1.1rem; }
.pill {
  display: inline-flex;
  align-items: center;
  padding: 0.3rem 0.85rem;
  border-radius: var(--radius-pill);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
}
.pill--good { background: rgba(46, 125, 96, 0.12); color: #1f6b4d; }
.pill--warn { background: rgba(216, 160, 61, 0.16); color: #92671a; }
.pill--wait { background: var(--c-mist); color: var(--c-ink-soft); }
.pill--plain { background: var(--c-primary-tint); color: var(--c-primary); }
.tracker-error { color: var(--c-accent); font-size: var(--step--1); margin-top: 0.75rem; }
.tracker-result__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.tracker-result__ref { font-family: var(--font-mono); font-size: 0.78rem; color: var(--c-ink-faint); letter-spacing: 0.04em; }
.tracker-stages {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 0;
  display: flex;
  justify-content: space-between;
  counter-reset: stg;
}
.tracker-stages li {
  flex: 1 1 0;
  text-align: center;
  font-size: 0.68rem;
  color: var(--c-ink-faint);
  position: relative;
  padding-top: 2.1rem;
}
.tracker-stages li span {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 1.6rem; height: 1.6rem;
  border-radius: 50%;
  background: var(--c-mist);
  border: 2px solid var(--c-line);
}
.tracker-stages li::after {
  content: "";
  position: absolute; top: 0.75rem; left: calc(50% + 1.1rem); right: calc(-50% + 1.1rem);
  height: 2px;
  background: var(--c-line);
}
.tracker-stages li:last-child::after { display: none; }
.tracker-stages li.is-done span { background: var(--c-primary); border-color: var(--c-primary); }
.tracker-stages li.is-done::after { background: var(--c-primary); }
.tracker-stages li.is-done { color: var(--c-ink); font-weight: 600; }
.tracker-result__note {
  background: var(--c-mist);
  border-radius: var(--radius);
  padding: 0.9rem 1rem;
  font-size: var(--step--1);
  color: var(--c-ink-soft);
}

/* Signature: the boarding-pass / case-file card */
.doccard {
  position: relative;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  max-width: 430px;
  margin-inline: auto;
}
.doccard__head {
  background: var(--c-ink);
  color: #fff;
  padding: 1.1rem 1.4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.doccard__ref {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.62);
}
.doccard__ref strong { display: block; color: #fff; font-size: 0.95rem; letter-spacing: 0.06em; }
.doccard__flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  flex: none;
}
.doccard__body { padding: 1.4rem; }

.doccard__rows { list-style: none; margin: 0 0 1.3rem; padding: 0; }
.doccard__rows li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.55rem 0;
  border-bottom: 1px dashed var(--c-line);
  font-size: var(--step--1);
}
.doccard__rows li:last-child { border-bottom: 0; }
.doccard__rows dt, .doccard__rows .k {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.doccard__rows .v { color: var(--c-ink); font-weight: 600; text-align: right; }

/* perforated tear line */
.doccard__tear {
  position: relative;
  height: 26px;
  border-top: 2px dashed var(--c-line-strong);
  margin-inline: -1.4rem;
}
.doccard__tear::before,
.doccard__tear::after {
  content: "";
  position: absolute;
  top: -13px;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--c-mist);
  border: 1px solid var(--c-line);
}
.doccard__tear::before { left: -13px; }
.doccard__tear::after { right: -13px; }
.hero .doccard__tear::before,
.hero .doccard__tear::after { background: var(--c-paper); }

.tracker { list-style: none; margin: 1.35rem 0 0; padding: 0; }
.tracker li {
  position: relative;
  padding: 0 0 1.15rem 1.85rem;
  font-size: var(--step--1);
  color: var(--c-ink-faint);
}
.tracker li:last-child { padding-bottom: 0; }
.tracker li::before {
  content: "";
  position: absolute; left: 0; top: 4px;
  width: 13px; height: 13px;
  border-radius: 50%;
  border: 2px solid var(--c-line-strong);
  background: #fff;
  transition: border-color 0.4s ease, background 0.4s ease;
}
.tracker li::after {
  content: "";
  position: absolute; left: 6px; top: 17px; bottom: 2px;
  width: 1px;
  background: var(--c-line-strong);
}
.tracker li:last-child::after { display: none; }
.tracker li strong { display: block; color: var(--c-ink); font-weight: 600; }
.tracker li .stamp-time { font-family: var(--font-mono); font-size: 0.7rem; }
.tracker li.is-done::before { border-color: var(--c-primary); background: var(--c-primary); }
.tracker li.is-done { color: var(--c-ink-soft); }
.tracker li.is-active::before {
  border-color: var(--c-primary);
  background: #fff;
  box-shadow: 0 0 0 4px var(--c-primary-tint);
}

.stamp {
  position: absolute;
  right: 1rem; bottom: 1rem;
  width: 104px; height: 104px;
  border: 3px solid var(--c-accent);
  border-radius: 50%;
  color: var(--c-accent);
  display: grid;
  place-items: center;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
  transform: rotate(-14deg);
  opacity: 0.9;
  pointer-events: none;
}
.stamp span { display: block; }
.stamp span.big { font-size: 0.9rem; font-weight: 700; letter-spacing: 0.1em; }

/* 8. Home sections --------------------------------------------------------*/
.logos {
  border-block: 1px solid var(--c-line);
  padding-block: 1.4rem;
}
.logos__inner {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 1rem 2rem;
}
.logos__label {
  font-family: var(--font-mono); font-size: 0.68rem;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-ink-faint);
}
.logos__stat { display: flex; align-items: baseline; gap: 0.5rem; }
.logos__stat b {
  font-family: var(--font-display); font-size: 1.5rem;
  color: var(--c-ink); font-weight: 600; letter-spacing: -0.02em;
}
.logos__stat span { font-size: var(--step--1); }

/* destination cards */
.dest-search {
  display: flex; gap: 0.7rem; flex-wrap: wrap;
  margin-bottom: 1.8rem;
}
.dest-search input { max-width: 340px; }
.dest-filter {
  display: flex; gap: 0.5rem; flex-wrap: wrap;
}
.chip {
  border: 1px solid var(--c-line-strong);
  background: #fff;
  color: var(--c-ink-soft);
  border-radius: var(--radius-pill);
  padding: 0.5rem 1rem;
  font: 500 var(--step--1)/1 var(--font-body);
  cursor: pointer;
  transition: all 0.15s ease;
}
.chip:hover { border-color: var(--c-primary); color: var(--c-primary); }
.chip.is-active { background: var(--c-ink); border-color: var(--c-ink); color: #fff; }

.dcard {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  padding: 1.35rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  height: 100%;
}
.dcard:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: transparent; }
.dcard__flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  background: var(--c-primary-tint);
  color: var(--c-primary);
  margin-bottom: 0.8rem;
}
.dcard__title {
  font-family: var(--font-display);
  font-size: var(--step-1);
  color: var(--c-ink);
  margin: 0 0 0.3rem;
  font-weight: 600;
}
.dcard__type {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--c-primary);
  margin-bottom: 0.9rem;
}
.dcard__meta {
  list-style: none; margin: 0 0 1.1rem; padding: 0;
  font-size: var(--step--1);
}
.dcard__meta li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.3rem 0;
}
.dcard__meta .k { color: var(--c-ink-faint); }
.dcard__meta .v { color: var(--c-ink); font-weight: 500; }
.dcard__govt { border-top: 1px dashed var(--c-line); margin-top: 0.2rem; padding-top: 0.5rem; }
.dcard__govt .v em { font-style: normal; color: var(--c-ink-faint); font-weight: 400; font-size: 0.92em; }
.dcard__foot {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px dashed var(--c-line);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.dcard__price { font-family: var(--font-display); font-size: var(--step-1); color: var(--c-ink); font-weight: 600; }
.dcard__price small { font-family: var(--font-body); font-size: 0.72rem; font-weight: 400; color: var(--c-ink-faint); display: block; letter-spacing: 0; }
.dcard__link { position: absolute; inset: 0; z-index: 2; text-indent: -9999px; overflow: hidden; }
.dcard__cta {
  font-weight: 600; color: var(--c-primary);
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: var(--step--1);
}
.dcard:hover .dcard__cta { gap: 0.6rem; }

.is-hidden { display: none !important; }
.empty-note {
  padding: 2.5rem 1rem; text-align: center; color: var(--c-ink-faint);
  border: 1px dashed var(--c-line-strong); border-radius: var(--radius);
}

/* stages / how it works */
.stages { counter-reset: stage; }
.stage {
  position: relative;
  padding: 1.6rem 1.4rem 1.5rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
}
.stage__code {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  color: var(--c-primary);
  text-transform: uppercase;
  display: block;
  margin-bottom: 0.9rem;
}
.stage h3 { font-size: var(--step-1); margin-bottom: 0.5rem; }
.stage p { font-size: var(--step--1); }
.stage__time {
  margin-top: 1rem;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: var(--c-ink-faint);
  padding-top: 0.8rem;
  border-top: 1px dashed var(--c-line);
}

/* value props */
.vprop {
  padding: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.03);
}
.vprop__icon {
  width: 40px; height: 40px; border-radius: 11px;
  background: rgba(216, 160, 61, 0.16);
  color: var(--c-gold);
  display: grid; place-items: center;
  margin-bottom: 1rem;
}
.vprop h3 { font-size: var(--step-1); margin-bottom: 0.45rem; }
.vprop p { font-size: var(--step--1); margin: 0; }

/* pricing */
.plans { align-items: stretch; }
.plan {
  display: flex; flex-direction: column;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  padding: 1.8rem 1.6rem;
  height: 100%;
}
.plan.is-featured {
  border-color: var(--c-ink);
  box-shadow: var(--shadow-md);
  position: relative;
}
.plan.is-featured::before {
  content: "Most chosen";
  position: absolute; top: -13px; left: 1.6rem;
  background: var(--c-ink); color: #fff;
  font: 600 0.7rem/1 var(--font-body);
  padding: 0.45rem 0.8rem; border-radius: var(--radius-pill);
}
.plan__name { font-family: var(--font-display); font-size: var(--step-1); color: var(--c-ink); font-weight: 600; }
.plan__speed { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-primary); margin-top: 0.3rem; }
.plan__price {
  font-family: var(--font-display);
  font-size: var(--step-3);
  color: var(--c-ink);
  margin: 1.1rem 0 0.2rem;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.plan__note { font-size: 0.78rem; color: var(--c-ink-faint); }
.plan ul { list-style: none; margin: 1.4rem 0; padding: 0; font-size: var(--step--1); }
.plan li { display: flex; gap: 0.6rem; padding: 0.4rem 0; }
.plan li svg { color: var(--c-primary); flex: none; margin-top: 3px; }
.plan .btn { margin-top: auto; }

/* reviews */
.review {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  padding: 1.5rem;
  height: 100%;
  display: flex; flex-direction: column;
}
.review__stars { color: var(--c-gold); letter-spacing: 0.15em; font-size: 0.9rem; margin-bottom: 0.8rem; }
.review p { font-size: var(--step--1); }
.review__who {
  margin-top: auto; padding-top: 1.1rem;
  border-top: 1px dashed var(--c-line);
  display: flex; align-items: center; gap: 0.7rem;
}
.review__avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--c-primary-tint); color: var(--c-primary-dark);
  display: grid; place-items: center;
  font: 600 0.85rem var(--font-display); flex: none;
}
.review__name { font-weight: 600; color: var(--c-ink); font-size: 0.9rem; line-height: 1.3; }
.review__meta { font-family: var(--font-mono); font-size: 0.68rem; color: var(--c-ink-faint); }

/* FAQ */
.faq { max-width: 820px; margin-inline: auto; }
.faq__item { border-bottom: 1px solid var(--c-line); }
.faq__q {
  width: 100%;
  display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem;
  background: none; border: 0; cursor: pointer;
  padding: 1.25rem 0;
  font: 600 var(--step-1) / 1.35 var(--font-display);
  color: var(--c-ink);
  text-align: left;
  letter-spacing: -0.015em;
}
.faq__icon {
  flex: none; width: 26px; height: 26px; border-radius: 50%;
  border: 1px solid var(--c-line-strong);
  display: grid; place-items: center;
  position: relative; margin-top: 3px;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.faq__icon::before, .faq__icon::after {
  content: ""; position: absolute;
  background: var(--c-ink); border-radius: 2px;
  transition: transform 0.25s ease, background 0.2s ease;
}
.faq__icon::before { width: 11px; height: 1.5px; }
.faq__icon::after { width: 1.5px; height: 11px; }
.faq__q[aria-expanded="true"] .faq__icon { background: var(--c-ink); border-color: var(--c-ink); }
.faq__q[aria-expanded="true"] .faq__icon::before,
.faq__q[aria-expanded="true"] .faq__icon::after { background: #fff; }
.faq__q[aria-expanded="true"] .faq__icon::after { transform: scaleY(0); }
.faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.28s ease; }
.faq__a > div { overflow: hidden; }
.faq__item.is-open .faq__a { grid-template-rows: 1fr; }
.faq__a p { padding-bottom: 1.4rem; font-size: var(--step-0); }

/* closing CTA */
.cta-band {
  background: var(--c-primary-dark);
  color: rgba(255, 255, 255, 0.82);
  border-radius: var(--radius-lg);
  padding: clamp(2rem, 5vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.cta-band::before {
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.14) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.5;
}
.cta-band > * { position: relative; }
.cta-band h2 { color: #fff; margin-bottom: 0.5rem; }
.cta-band .btn-row { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* disclaimer block */
.disclaimer {
  border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-accent);
  border-radius: 10px;
  background: var(--c-mist);
  padding: 1.1rem 1.25rem;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--c-ink-soft);
}
.disclaimer strong { color: var(--c-ink); }

/* 9. Footer ---------------------------------------------------------------*/
.site-footer {
  background: var(--c-footer-bg);
  color: rgba(255, 255, 255, 0.62);
  padding-block: clamp(2.75rem, 6vw, 4.5rem) 1.75rem;
  font-size: var(--step--1);
}
.site-footer a { color: rgba(255, 255, 255, 0.62); }
.site-footer a:hover { color: #fff; }
.site-footer h4 {
  color: #fff;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  margin-bottom: 1.1rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: 2rem;
  padding-bottom: 2.5rem;
}
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid li { margin-bottom: 0.55rem; }
.footer-brand .brand__name { color: #fff; }
.footer-brand p { margin-top: 1rem; max-width: 34ch; }
.footer-contact { margin-top: 1.2rem; font-family: var(--font-mono); font-size: 0.78rem; }
.footer-contact a { display: block; margin-bottom: 0.3rem; color: #fff; }

.footer-legal {
  border-top: 1px solid rgba(255, 255, 255, 0.13);
  padding-top: 1.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8rem;
}
.footer-disclaimer {
  background: rgba(255, 255, 255, 0.05);
  border-radius: var(--radius);
  padding: 1.1rem 1.3rem;
  margin-bottom: 2rem;
  font-size: 0.8rem;
  line-height: 1.65;
  border-left: 3px solid var(--c-gold);
}
.footer-disclaimer strong { color: #fff; }
.payment-marks { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.payment-marks span {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
  padding: 0.25rem 0.55rem;
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.06em;
}

/* 10. Blog & static pages -------------------------------------------------*/
.page-hero {
  position: relative;
  background:
    radial-gradient(90% 140% at 100% 0%, var(--c-primary-tint) 0%, rgba(255, 255, 255, 0) 55%),
    var(--c-mist);
  padding-block: clamp(2.5rem, 5vw, 4rem);
  border-bottom: 1px solid var(--c-line);
  overflow: hidden;
}
.page-hero h1 { margin-bottom: 0.4rem; }
.crumbs {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 1rem;
}
.crumbs a { color: var(--c-ink-faint); }
.crumbs a:hover { color: var(--c-primary); }

/* Destination landing hero — punchier variant used on product pages ------ */
.dest-hero {
  position: relative;
  padding-block: clamp(2.25rem, 5vw, 4rem) clamp(2.75rem, 6vw, 4.5rem);
  background:
    radial-gradient(115% 85% at 90% 0%, var(--c-primary-tint) 0%, rgba(255, 255, 255, 0) 58%),
    var(--c-paper);
  border-bottom: 1px solid var(--c-line);
  overflow: hidden;
}
.dest-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.dest-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-pill);
  padding: 0.4rem 0.9rem 0.4rem 0.4rem;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-ink-soft);
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.1rem;
}
.dest-hero__flag { display: inline-flex; align-items: center; justify-content: center; color: var(--c-primary); }
.hero__eyebrow-icon { display: inline-flex; vertical-align: -3px; color: var(--c-primary); margin-right: 0.15rem; }
.dest-hero h1 { margin-bottom: 0.9rem; }
.dest-hero h1 em {
  font-style: normal;
  color: var(--c-primary);
}
.dest-hero__sub { max-width: 48ch; margin-bottom: 1.5rem; }
.dest-hero__trust {
  list-style: none;
  margin: 0 0 1.9rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.dest-hero__trust li { display: flex; align-items: center; gap: 0.6rem; font-size: var(--step--1); color: var(--c-ink-soft); }
.dest-hero__trust svg { color: var(--c-primary); flex: none; }
.dest-hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.dest-hero__note { display: inline-flex; align-items: center; gap: 0.45rem; font-size: var(--step--1); color: var(--c-ink-faint); }
.dest-hero__note svg { color: var(--c-gold); }

.dest-ticket {
  position: relative;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  max-width: 400px;
  margin-inline: auto;
}
.dest-ticket__head {
  background: var(--c-ink);
  color: #fff;
  padding: 1.2rem 1.4rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.dest-ticket__flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  flex: none;
}
.dest-ticket__head strong { display: block; font-size: 1.05rem; letter-spacing: -0.01em; }
.dest-ticket__head span { display: block; font-size: 0.78rem; color: rgba(255, 255, 255, 0.68); margin-top: 0.15rem; }
.dest-ticket__tear {
  position: relative;
  height: 26px;
  border-top: 2px dashed var(--c-line-strong);
  margin-inline: -1.4rem;
}
.dest-ticket__tear::before,
.dest-ticket__tear::after {
  content: "";
  position: absolute;
  top: -13px;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--c-paper);
  border: 1px solid var(--c-line);
}
.dest-ticket__tear::before { left: -13px; }
.dest-ticket__tear::after { right: -13px; }
.dest-ticket__rows { list-style: none; margin: 0; padding: 1.3rem 1.4rem 0.4rem; }
.dest-ticket__rows li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.55rem 0;
  border-bottom: 1px dashed var(--c-line);
  font-size: var(--step--1);
}
.dest-ticket__rows li:last-child { border-bottom: 0; }
.dest-ticket__rows .k {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.dest-ticket__rows .v { color: var(--c-ink); font-weight: 600; text-align: right; }
.dest-ticket__price {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.4rem 1.3rem;
  background: var(--c-mist);
}
.dest-ticket__price span { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-ink-faint); }
.dest-ticket__price .amount, .dest-ticket__price ins, .dest-ticket__price bdi { font-family: var(--font-display); font-size: var(--step-2); color: var(--c-ink); font-weight: 600; }

@media (max-width: 900px) {
  .dest-hero__inner { grid-template-columns: 1fr; }
  .dest-ticket { max-width: 460px; }
}

.entry-content { font-size: var(--step-0); }
.entry-content h2 { margin-top: 2.2rem; }
.entry-content h3 { margin-top: 1.8rem; }
.entry-content ul, .entry-content ol { padding-left: 1.3rem; margin-bottom: 1.2rem; }
.entry-content li { margin-bottom: 0.45rem; }
.entry-content img { border-radius: var(--radius); margin-block: 1.5rem; }
.entry-content blockquote {
  margin: 1.8rem 0;
  padding: 1rem 1.4rem;
  border-left: 3px solid var(--c-primary);
  background: var(--c-mist);
  border-radius: 0 10px 10px 0;
  font-size: var(--step-1);
  color: var(--c-ink);
}
.entry-content table { width: 100%; border-collapse: collapse; margin-block: 1.5rem; font-size: var(--step--1); }
.entry-content th, .entry-content td { padding: 0.7rem 0.9rem; border: 1px solid var(--c-line); text-align: left; }
.entry-content th { background: var(--c-mist); color: var(--c-ink); font-family: var(--font-mono); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; }

.post-card {
  display: flex; flex-direction: column; height: 100%;
  background: #fff; border: 1px solid var(--c-line);
  border-radius: var(--radius); overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.post-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.post-card__thumb { aspect-ratio: 16 / 9; background: var(--c-mist); overflow: hidden; }
.post-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-card__body { padding: 1.2rem 1.3rem 1.4rem; display: flex; flex-direction: column; flex: 1; }
.post-card__date { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-ink-faint); margin-bottom: 0.5rem; }
.post-card h3 { font-size: var(--step-1); margin-bottom: 0.5rem; }
.post-card h3 a { color: inherit; }
.post-card p { font-size: var(--step--1); }

.pagination { display: flex; gap: 0.4rem; justify-content: center; margin-top: 2.5rem; flex-wrap: wrap; }
.pagination .page-numbers {
  display: grid; place-items: center;
  min-width: 40px; height: 40px; padding-inline: 0.6rem;
  border: 1px solid var(--c-line-strong); border-radius: 10px;
  color: var(--c-ink); font-size: var(--step--1);
}
.pagination .page-numbers:hover { border-color: var(--c-primary); }
.pagination .current { background: var(--c-ink); border-color: var(--c-ink); color: #fff; }

.error-404 { text-align: center; padding-block: clamp(4rem, 10vw, 8rem); }
.error-404 .code {
  font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.3em;
  color: var(--c-accent); text-transform: uppercase; margin-bottom: 1rem;
}

/* Destination page price box (kept from the design system) */
.service {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
  padding-block: clamp(2rem, 5vw, 3.5rem);
}
.service__aside { position: sticky; top: calc(var(--header-h) + 1.25rem); }
.service__facts {
  list-style: none; margin: 1.75rem 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px;
  background: var(--c-line); border: 1px solid var(--c-line); border-radius: var(--radius);
  overflow: hidden;
}
.service__facts li { background: #fff; padding: 1rem 1.1rem; }
.service__facts .k {
  display: block; font-family: var(--font-mono); font-size: 0.66rem;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-ink-faint); margin-bottom: 0.3rem;
}
.service__facts .v { color: var(--c-ink); font-weight: 600; font-size: var(--step-0); }

.pricebox {
  background: #fff; border: 1px solid var(--c-line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
  padding: 1.5rem;
}
.pricebox__amount {
  font-family: var(--font-display); font-size: var(--step-3);
  color: var(--c-ink); font-weight: 600; letter-spacing: -0.03em; line-height: 1;
}
.pricebox__label { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-ink-faint); margin-bottom: 0.5rem; }
.pricebox ul { list-style: none; margin: 1.25rem 0; padding: 0; font-size: var(--step--1); }
.pricebox li { display: flex; gap: 0.55rem; padding: 0.32rem 0; }
.pricebox li svg { color: var(--c-primary); flex: none; margin-top: 3px; }
.pricebox__split {
  border-top: 1px dashed var(--c-line);
  margin-top: 1.1rem; padding-top: 1rem;
  font-size: 0.78rem; color: var(--c-ink-faint);
}
.pricebox__split div { display: flex; justify-content: space-between; padding: 0.2rem 0; }
.pricebox__govt-note { font-size: 0.72rem; color: var(--c-ink-faint); margin: 0.3rem 0 0; line-height: 1.4; }
.pricebox__estimate {
  margin-top: 0.9rem;
  padding: 0.85rem 1rem;
  border-radius: var(--radius);
  background: var(--c-primary-tint);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: var(--step--1);
  color: var(--c-primary-dark);
}
.pricebox__estimate strong { font-family: var(--font-display); }
.pricebox__estimate [data-price-estimate-amount] { font-size: var(--step-1); letter-spacing: -0.02em; }
.arrivaldesk-locked-qty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.2em;
  font-weight: 600;
}

/* 12. Application form (multi-step) --------------------------------------*/
.appform {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.appform__head {
  padding: clamp(1.1rem, 3vw, 1.5rem) clamp(1.25rem, 3vw, 2rem);
  border-bottom: 1px solid var(--c-line);
  background: var(--c-mist);
}
/* The real, accessible step list — screen readers still get each step's
   name and current/complete state; sighted users get the counter and bar
   below instead, which reads far better at the narrow widths this runs at. */
.appform__steps[hidden] { display: none; }

.appform__progress-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.6rem;
  font-weight: 700;
  color: var(--c-ink);
}
.appform__count { font-size: 0.92rem; }
.appform__stepname { font-size: 0.92rem; color: var(--c-ink-soft); font-weight: 600; }

.appform__progress {
  height: 8px;
  border-radius: 999px;
  background: var(--c-line);
  overflow: hidden;
}
.appform__progress-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--c-primary);
  transition: width 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* A quiet, centred trust strip — the one thing focus mode had none of
   before, which is exactly when a traveler most wants reassurance. */
.appform__trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem 1.4rem;
  list-style: none;
  margin: 0;
  padding: 0.9rem 1.25rem;
  border-bottom: 1px solid var(--c-line);
  background: #fff;
}
.appform__trust li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.76rem;
  color: var(--c-ink-soft);
  white-space: nowrap;
}
.appform__trust li:not(:last-child) { padding-right: 1.4rem; border-right: 1px solid var(--c-line); }
.appform__trust svg { color: var(--c-primary); flex: none; }
@media (max-width: 560px) {
  .appform__trust li:not(:last-child) { border-right: 0; padding-right: 0; }
  .appform__trust { gap: 0.4rem 0.9rem; }
}

/* Each step's own heading reads as a centred, conversational prompt rather
   than a form-section label — matches how a single-purpose "apply" flow is
   usually written, and draws the eye back to center after a left-aligned
   field grid on the step before. */
.appform__panel > h3 {
  text-align: center;
  font-size: var(--step-2);
}
.appform__panel > p.hint {
  text-align: center;
  max-width: 42ch;
  margin-inline: auto;
  color: var(--c-ink-soft);
}

/* A small icon ahead of a field's own label. Additive only — a field with
   no recognized icon just has a plain label, exactly as before. */
.field-icon {
  display: inline-flex;
  margin-right: 0.35rem;
  color: var(--c-primary);
  vertical-align: -2px;
}

/* Rounder fields, scoped to the application form only, since the
   input/select styling above is shared with the Contact form and elsewhere, and this
   specific pill-like roundness is a choice for the application flow, not a
   site-wide restyle. */
.appform__fields input[type="text"],
.appform__fields input[type="email"],
.appform__fields input[type="tel"],
.appform__fields input[type="date"],
.appform__fields input[type="number"],
.appform__fields select {
  border-radius: 999px;
  padding-inline: 1.1rem;
}
.appform__fields select { padding-right: 2.6rem; }
.appform__fields textarea { border-radius: var(--radius); }

/* Fully rounded, pill-shaped step and submit buttons for the form's own
   navigation specifically, so the site's other buttons keep their usual
   shape; this is scoped to the application flow only. */
.btn--pill {
  border-radius: 999px;
  padding-inline: 1.5rem;
}
.btn--pill span { display: inline-flex; align-items: center; }
.btn--pill svg { flex: none; }
.appform__nav .btn--pill:not(.btn--ghost) { display: inline-flex; align-items: center; gap: 0.5rem; }
.appform__nav .btn--ghost.btn--pill { display: inline-flex; align-items: center; gap: 0.5rem; }

.appform__body { padding: clamp(1.5rem, 4vw, 2.5rem); }
.appform__panel { display: none; }
.appform__panel.is-active { display: block; animation: fadeUp 0.28s ease both; }
/* The hidden attribute ships in the markup so the form is sane without JS;
   the is-active class wins once the script takes over. */
.appform__panel[hidden].is-active { display: block; }
.appform__panel h3 { font-size: var(--step-2); margin-bottom: 0.35rem; letter-spacing: -0.01em; }
.appform__panel > p.hint { font-size: var(--step--1); color: var(--c-ink-faint); margin-bottom: 1.75rem; max-width: 60ch; }

.appform .row-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 1rem; }

.appform__nav {
  display: flex; gap: 0.75rem; justify-content: space-between;
  padding-top: 1.6rem; margin-top: 0.75rem;
  border-top: 1px dashed var(--c-line);
}
/* The submit button's own label is set per form and can run long
   ("Continue to payment"), so it gets the flexible share of the row while
   Back keeps its natural width. Stops a long label wrapping onto three
   lines in a fixed half-width pill at phone widths. */
.appform__nav .btn--lg.btn--pill { flex: 1; font-size: var(--step-0); padding-inline: 1.1rem; white-space: normal; line-height: 1.25; }
.appform__nav .btn--lg.btn--pill span { width: 100%; justify-content: center; text-align: center; }
/* Submit labels are set per form and can run long ("Continue to payment").
   Squeezed into half a row at phone widths that wraps awkwardly no matter
   how the font is tuned, so below 480px the two buttons stack instead,
   full width each, which is also just a normal mobile checkout pattern. */
@media (max-width: 480px) {
  .appform__nav:has(.btn--lg) { flex-direction: column-reverse; }
  .appform__nav:has(.btn--lg) .btn--pill { width: 100%; }
}

.appform__review dl { margin: 0; }
.appform__review .rrow {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.65rem 0; border-bottom: 1px dashed var(--c-line);
  font-size: var(--step--1);
}
.appform__review .rrow dt { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-ink-faint); margin: 0; }
.appform__review .rrow dd { margin: 0; color: var(--c-ink); font-weight: 600; text-align: right; }

.appform__error {
  display: none;
  background: rgba(178, 58, 72, 0.08);
  border-left: 3px solid var(--c-accent);
  color: var(--c-accent);
  padding: 0.85rem 1rem;
  border-radius: 8px;
  font-size: var(--step--1);
  margin-bottom: 1.1rem;
}
.appform__error.is-visible { display: block; }

@media (max-width: 620px) {
  .appform__steps li { font-size: 0; padding-top: 2.3rem; }
  .appform__steps li::before { width: 1.7rem; height: 1.7rem; }
}

.btn.is-loading { position: relative; color: transparent !important; }
.btn.is-loading::after {
  content: ""; position: absolute; inset: 0; margin: auto;
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.4);
  border-top-color: #fff;
  animation: spin 0.7s linear infinite;
}

/* 13. Motion & accessibility ---------------------------------------------*/
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes stampIn {
  0% { opacity: 0; transform: rotate(-40deg) scale(1.6); }
  70% { opacity: 1; transform: rotate(-11deg) scale(0.96); }
  100% { opacity: 0.9; transform: rotate(-14deg) scale(1); }
}

.reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.is-in { opacity: 1; transform: none; }

/* Never hide content on a builder canvas — you have to see what you edit. */
.elementor-editor-active .reveal,
.elementor-editor-active .stamp {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}
.stamp.is-in { animation: stampIn 0.7s cubic-bezier(0.2, 0.9, 0.3, 1.2) both; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* Responsive --------------------------------------------------------------*/
@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; }
  .doccard { margin-top: 1rem; }
  .service { grid-template-columns: 1fr; }
  .service__aside { position: static; }
  .checkout-columns { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; }
}

@media (max-width: 860px) {
  .nav-toggle { display: grid; }
  .nav {
    position: fixed;
    inset: 0 0 0 auto;
    width: min(340px, 86vw);
    background: #fff;
    padding: calc(var(--header-h) + 1.5rem) 1.5rem 2rem;
    box-shadow: var(--shadow-lg);
    transform: translateX(105%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    z-index: 99;
  }
  .nav.is-open { transform: none; }
  .nav ul { flex-direction: column; align-items: stretch; gap: 0; }
  .nav > div > ul > li { border-bottom: 1px solid var(--c-line); }
  .nav a { padding: 0.9rem 0; font-size: 1.05rem; }
  .nav .sub-menu {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; padding: 0 0 0.5rem 0.9rem;
  }
  .nav-scrim {
    position: fixed; inset: 0; background: rgba(16, 31, 51, 0.45);
    opacity: 0; visibility: hidden; transition: all 0.25s ease; z-index: 98;
  }
  body.nav-open .nav-scrim { opacity: 1; visibility: visible; }
  .cta-band { grid-template-columns: 1fr; }
  .topbar__links { display: none; }
}

@media (max-width: 620px) {
  :root { --header-h: 64px; }
  .hero__picker { flex-direction: column; padding: 0.8rem; }
  .hero__picker select { padding-bottom: 0.8rem; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-legal { flex-direction: column; align-items: flex-start; }
  .appform__steps li { font-size: 0.56rem; letter-spacing: 0.05em; }
  .stamp { width: 82px; height: 82px; right: 0.5rem; bottom: 0.5rem; }
  .btn { width: 100%; }
  .header-actions .btn { width: auto; }
  .hero__assurances { gap: 0.5rem 1rem; }
}

/* Misc utilities added late ----------------------------------------------*/
.widget { margin-bottom: 2rem; }
.widget-title {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--c-ink);
}
.widget ul { list-style: none; margin: 0; padding: 0; font-size: var(--step--1); }
.widget li { padding: 0.35rem 0; border-bottom: 1px solid var(--c-line); }

@media (max-width: 860px) {
  .hide-on-mobile { display: none !important; }
}


/* ==========================================================================
   Static-site additions: checkout, confirmation, tracking, contact, tables
   ========================================================================== */

.split {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}
.split__aside { position: sticky; top: calc(var(--header-h) + 1.25rem); }

.panel {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  padding: clamp(1.25rem, 3vw, 1.9rem);
  box-shadow: var(--shadow-sm);
}
.panel + .panel { margin-top: 1.25rem; }
.panel h2 { font-size: var(--step-2); }
.panel h3 { font-size: var(--step-1); }

.summary { list-style: none; margin: 0; padding: 0; font-size: var(--step--1); }
.summary li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.55rem 0; border-bottom: 1px dashed var(--c-line);
}
.summary li:last-child { border-bottom: 0; }
.summary .k {
  font-family: var(--font-mono); font-size: 0.68rem;
  letter-spacing: 0.11em; text-transform: uppercase; color: var(--c-ink-faint);
}
.summary .v { color: var(--c-ink); font-weight: 600; text-align: right; }

.total {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 1rem; margin-top: 1.1rem; padding-top: 1.1rem;
  border-top: 2px solid var(--c-ink);
}
.total__label { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-ink-faint); }
.total__value { font-family: var(--font-display); font-size: var(--step-3); font-weight: 600; color: var(--c-ink); letter-spacing: -0.03em; }

.paybox { margin-top: 1.5rem; }
.paybox__note {
  font-size: 0.78rem; color: var(--c-ink-faint);
  display: flex; align-items: flex-start; gap: 0.5rem; margin-top: 1rem;
}
.paybox__note svg { flex: none; margin-top: 2px; color: var(--c-primary); }
#paypal-buttons { min-height: 52px; }

/* WooCommerce checkout ---------------------------------------------------- */
.woocommerce-checkout .woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-error, .woocommerce-message, .woocommerce-info {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border-radius: var(--radius);
  font-size: var(--step--1);
  background: var(--c-mist);
  border-left: 3px solid var(--c-primary);
  color: var(--c-ink-soft);
}
.woocommerce-error { border-left-color: var(--c-accent); background: rgba(178, 58, 72, 0.06); color: var(--c-accent); }
.woocommerce-error li { list-style: none; }

.woocommerce-checkout #customer_details {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: clamp(1.5rem, 4vw, 2.5rem);
  align-items: start;
  margin-bottom: 2.5rem;
}
.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2 { min-width: 0; }
.woocommerce-checkout h3 {
  font-size: var(--step-1);
  margin-bottom: 1.1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--c-line);
}
.woocommerce-checkout .form-row { margin-bottom: 1.1rem; }
.woocommerce-checkout .form-row label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 0.4rem;
}
.woocommerce-checkout .form-row .required { color: var(--c-accent); text-decoration: none; }
.woocommerce-checkout .form-row.woocommerce-invalid input,
.woocommerce-checkout .form-row.woocommerce-invalid select { border-color: var(--c-accent); }
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last { display: inline-block; width: calc(50% - 0.5rem); }
.woocommerce-checkout .form-row-first { margin-right: 1rem; }
@media (max-width: 480px) {
  .woocommerce-checkout .form-row-first,
  .woocommerce-checkout .form-row-last { width: 100%; margin-right: 0; }
}
.select2-container--default .select2-selection--single {
  height: auto !important;
  padding: 0.8rem 0.95rem !important;
  border: 1px solid var(--c-line-strong) !important;
  border-radius: 10px !important;
}
.select2-container .select2-selection__rendered { padding: 0 !important; line-height: 1.4 !important; color: var(--c-ink) !important; }
.select2-container .select2-selection__arrow { height: 100% !important; }

.woocommerce-checkout #order_review_heading { display: none; }
.woocommerce-checkout #order_review {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: clamp(1.25rem, 3vw, 1.75rem);
  position: sticky;
  top: calc(var(--header-h) + 1.25rem);
}
.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0;
}
.woocommerce-checkout-review-order-table thead { display: none; }
.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
  padding: 0.7rem 0;
  border-bottom: 1px dashed var(--c-line);
  font-size: var(--step--1);
  text-align: left;
}
.woocommerce-checkout-review-order-table .product-name { color: var(--c-ink-soft); }
.woocommerce-checkout-review-order-table .product-name .product-quantity { color: var(--c-ink-faint); font-family: var(--font-mono); font-size: 0.78em; }
.woocommerce-checkout-review-order-table td.product-total,
.woocommerce-checkout-review-order-table th { text-align: right; font-weight: 600; color: var(--c-ink); white-space: nowrap; }
.woocommerce-checkout-review-order-table .cart-subtotal th,
.woocommerce-checkout-review-order-table .fee th,
.woocommerce-checkout-review-order-table .tax-rate th { font-weight: 400; color: var(--c-ink-faint); font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; }
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
  border-bottom: 0;
  border-top: 2px solid var(--c-ink);
  padding-top: 1rem;
  font-size: var(--step-1);
}
.woocommerce-checkout-review-order-table .order-total th { font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.7rem; color: var(--c-ink-faint); }
.woocommerce-checkout-review-order-table .order-total .woocommerce-Price-amount { font-family: var(--font-display); font-size: var(--step-2); color: var(--c-ink); }

.woocommerce-checkout-payment { margin-top: 1.5rem; }
ul.wc_payment_methods { list-style: none; margin: 0; padding: 0; }
li.wc_payment_method {
  border: 1.5px solid var(--c-line);
  border-radius: var(--radius);
  margin-bottom: 0.7rem;
  padding: 0.9rem 1rem;
  transition: border-color 0.15s ease;
}
li.wc_payment_method:has(input:checked) { border-color: var(--c-primary); box-shadow: 0 0 0 3px var(--c-primary-tint); }
li.wc_payment_method label { font-weight: 600; color: var(--c-ink); cursor: pointer; }
li.wc_payment_method input[type="radio"] { accent-color: var(--c-primary); margin-right: 0.6rem; }
li.wc_payment_method img { height: 20px; vertical-align: middle; margin-left: 0.5rem; }
.payment_box {
  margin-top: 0.8rem;
  padding: 0.9rem 1rem 0.2rem;
  background: var(--c-mist);
  border-radius: var(--radius);
  font-size: var(--step--1);
  color: var(--c-ink-soft);
}
.payment_box p:first-child { margin-top: 0; }

.woocommerce-terms-and-conditions-wrapper { margin: 1.25rem 0; font-size: var(--step--1); }
.woocommerce-form__label-for-checkbox { display: flex; align-items: flex-start; gap: 0.6rem; cursor: pointer; }
.woocommerce-form__input-checkbox { margin-top: 0.2rem; accent-color: var(--c-primary); }

.woocommerce-checkout .place-order { margin-top: 1.25rem; }
#place_order {
  width: 100%;
  font-size: var(--step-0);
  padding-block: 1rem;
}

.checkout_coupon {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: flex-end;
  background: var(--c-mist);
  border-radius: var(--radius);
  padding: 1rem;
  margin-bottom: 1.5rem;
}
.checkout_coupon .form-row { flex: 1 1 220px; margin-bottom: 0; }
.checkout_coupon .form-row label { display: none; }

@media (max-width: 900px) {
  .woocommerce-checkout #customer_details { grid-template-columns: 1fr; }
  .woocommerce-checkout #order_review { position: static; }
}

.notice {
  border-radius: 10px;
  padding: 1rem 1.15rem;
  font-size: var(--step--1);
  line-height: 1.6;
  background: var(--c-mist);
  border-left: 3px solid var(--c-primary);
  color: var(--c-ink-soft);
}
.notice--warn { border-left-color: var(--c-gold); background: rgba(216, 160, 61, 0.09); }
.notice--error { border-left-color: var(--c-accent); background: rgba(178, 58, 72, 0.07); color: var(--c-accent); }
.notice strong { color: var(--c-ink); }
.notice--error strong { color: inherit; }

.confirm-mark {
  width: 68px; height: 68px; border-radius: 50%;
  background: var(--c-primary-tint); color: var(--c-primary-dark);
  display: grid; place-items: center; margin: 0 auto 1.25rem;
}
.confirm-ref {
  font-family: var(--font-mono);
  font-size: var(--step-2);
  letter-spacing: 0.12em;
  color: var(--c-ink);
  background: var(--c-mist);
  border: 1px dashed var(--c-line-strong);
  border-radius: 10px;
  padding: 0.9rem 1.2rem;
  display: inline-block;
  margin: 0.5rem 0 1.5rem;
}

.timeline { list-style: none; margin: 0; padding: 0; }
.timeline li {
  position: relative; padding: 0 0 1.4rem 2rem;
  font-size: var(--step--1); color: var(--c-ink-soft);
}
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: ""; position: absolute; left: 0; top: 5px;
  width: 13px; height: 13px; border-radius: 50%;
  border: 2px solid var(--c-line-strong); background: #fff;
}
.timeline li::after {
  content: ""; position: absolute; left: 6px; top: 19px; bottom: 2px;
  width: 1px; background: var(--c-line-strong);
}
.timeline li:last-child::after { display: none; }
.timeline li.is-done::before { border-color: var(--c-primary); background: var(--c-primary); }
.timeline li strong { display: block; color: var(--c-ink); }

.table-wrap { overflow-x: auto; }
table.data {
  width: 100%; border-collapse: collapse; font-size: var(--step--1);
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius);
}
table.data th, table.data td { padding: 0.75rem 0.9rem; border-bottom: 1px solid var(--c-line); text-align: left; }
table.data th {
  font-family: var(--font-mono); font-size: 0.68rem; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--c-ink); background: var(--c-mist);
}
table.data tr:last-child td { border-bottom: 0; }

.prose { max-width: 72ch; }
.prose h2 { margin-top: 2.2rem; font-size: var(--step-2); }
.prose h3 { margin-top: 1.7rem; font-size: var(--step-1); }
.prose ul, .prose ol { padding-left: 1.3rem; margin-bottom: 1.2rem; }
.prose li { margin-bottom: 0.45rem; }
.prose .meta {
  font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-ink-faint);
  margin-bottom: 2rem;
}

.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.contact-card {
  background: #fff; border: 1px solid var(--c-line);
  border-radius: var(--radius); padding: 1.25rem;
}
.contact-card .k {
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.11em;
  text-transform: uppercase; color: var(--c-ink-faint); display: block; margin-bottom: 0.4rem;
}
.contact-card a { font-weight: 600; }

.badge {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: var(--font-mono); font-size: 0.66rem;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 0.3rem 0.65rem; border-radius: var(--radius-pill);
  background: var(--c-primary-tint); color: var(--c-primary-dark);
}

@media (max-width: 1024px) {
  .split { grid-template-columns: 1fr; }
  .split__aside { position: static; }
}

/* Form builder output ------------------------------------------------------*/
.appform__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1rem;
}
.appform__fields .f-full { grid-column: 1 / -1; }
.appform__fields .check { grid-column: 1 / -1; margin-bottom: 1.1rem; }
.appform__fields > .traveler-blocks { grid-column: 1 / -1; }

/* Repeatable traveler blocks -------------------------------------------- */
.traveler-blocks { margin-top: 0.4rem; }
.traveler-block {
  padding-top: 1.4rem;
  margin-top: 1.1rem;
  border-top: 1px dashed var(--c-line);
}
.traveler-block:first-child { padding-top: 0; margin-top: 0; border-top: 0; }
.traveler-block__title {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-primary);
  margin: 0 0 0.9rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.traveler-block__title::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--c-primary);
  flex: none;
}
.traveler-block .appform__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1rem;
}
.field-help {
  display: block;
  font-size: 0.78rem;
  color: var(--c-ink-faint);
  margin-top: 0.35rem;
  line-height: 1.5;
}
@media (max-width: 620px) {
  .appform__fields { grid-template-columns: 1fr; }
}

/* Enquiry-form success panel ----------------------------------------------*/
.appform__done {
  padding: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 4vw, 2.5rem);
  text-align: center;
}
.appform__done::before {
  content: "";
  display: block;
  width: 3.5rem; height: 3.5rem;
  margin: 0 auto 1.25rem;
  border-radius: 50%;
  background: var(--c-primary-tint);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f6b4d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 26px;
}
.appform__done h3 { font-size: var(--step-2); margin-bottom: 0.5rem; }
.appform__done p { color: var(--c-ink-soft); max-width: 46ch; margin-inline: auto; }
.appform__done .confirm-ref {
  margin-top: 1.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1.2rem;
  background: var(--c-mist);
  border-radius: var(--radius-pill);
  font-family: var(--font-mono);
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  color: var(--c-ink);
}

/* Non-sticky header option ------------------------------------------------*/
.site-header.is-static { position: static; }

.agency-credit { color: inherit; opacity: 0.8; }
.agency-credit:hover { opacity: 1; }

/* Honeypot — off-screen rather than display:none, which some bots detect */
.arrivaldesk-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ==========================================================================
   About page
   ========================================================================== */

.compare {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.25rem;
  align-items: start;
}
.compare__col {
  position: relative;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  padding: 1.75rem 1.5rem 1.5rem;
}
.compare__col.is-featured {
  border-color: var(--c-primary);
  box-shadow: 0 24px 54px -30px rgba(16, 31, 51, 0.4);
}
.compare__badge {
  position: absolute;
  top: -0.72rem;
  left: 1.5rem;
  background: var(--c-primary);
  color: var(--c-button-text);
  font-family: var(--font-mono);
  font-size: 0.6rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
}
.compare__head { padding-bottom: 1rem; border-bottom: 1px solid var(--c-line); margin-bottom: 1.1rem; }
.compare__head h3 { margin-bottom: 0.2rem; }
.compare__price {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin: 0;
}
.compare__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.compare__list li {
  position: relative;
  padding-left: 1.9rem;
  font-size: 0.94rem;
  line-height: 1.5;
  color: var(--c-ink-soft);
}
.compare__list li::before {
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.72rem;
  font-weight: 700;
}
.compare__list li.is-yes::before {
  content: "✓";
  background: var(--c-primary-tint);
  color: var(--c-primary);
}
.compare__list li.is-no::before {
  content: "–";
  background: color-mix(in srgb, var(--c-ink-faint) 14%, transparent);
  color: var(--c-ink-faint);
}
.compare__note {
  margin: 1.2rem 0 0;
  padding-top: 1rem;
  border-top: 1px dashed var(--c-line);
  font-size: 0.86rem;
  color: var(--c-ink-faint);
}

/* The one promise worth its own block. */
.pledge {
  display: flex;
  gap: 1.1rem;
  align-items: flex-start;
  margin-top: 2rem;
  padding: 1.5rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-left: 4px solid var(--c-gold);
  border-radius: var(--radius);
}
.pledge__mark {
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: var(--c-primary-tint);
  color: var(--c-primary);
}
.pledge h3 { margin-bottom: 0.35rem; }
.pledge p { margin: 0; color: var(--c-ink-soft); }

/* Coverage chips */
.country-chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 0.6rem;
}
.country-chips a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.75rem 0.9rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.country-chips a:hover {
  border-color: var(--c-primary);
  transform: translateY(-2px);
}
.country-chips__flag { font-size: 1.3rem; flex: none; }
.country-chips a span:not(.country-chips__flag) { font-weight: 600; font-size: 0.92rem; }
.country-chips small {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.6rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-top: 0.1rem;
}

/* ==========================================================================
   Contact page
   ========================================================================== */

.contact-methods {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}
.cmethod {
  display: block;
  padding: 1.4rem 1.25rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: inherit;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}
.cmethod:hover {
  transform: translateY(-3px);
  border-color: var(--c-primary);
  box-shadow: 0 20px 42px -26px rgba(16, 31, 51, 0.45);
}
.cmethod--accent { background: var(--c-primary); border-color: var(--c-primary); }
.cmethod--accent .cmethod__icon { background: rgba(255, 255, 255, 0.18); color: #fff; }
.cmethod--accent .cmethod__label,
.cmethod--accent .cmethod__note { color: rgba(255, 255, 255, 0.75); }
.cmethod--accent .cmethod__value { color: #fff; }
.cmethod--accent:hover { border-color: var(--c-ink); }

.cmethod__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: var(--c-primary-tint);
  color: var(--c-primary);
  margin-bottom: 0.9rem;
}
.cmethod__label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 0.25rem;
}
.cmethod__value { display: block; font-size: 1rem; line-height: 1.3; word-break: break-word; }
.cmethod__note { display: block; font-size: 0.8rem; color: var(--c-ink-faint); margin-top: 0.4rem; }

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 2.5rem);
  align-items: start;
}
.contact-form-card {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  padding: clamp(1.5rem, 3vw, 2.25rem);
  box-shadow: 0 20px 50px -34px rgba(16, 31, 51, 0.4);
}
/* The form is already a card elsewhere; inside this one it should not be. */
.contact-form-card .appform {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
}
.contact-form-card .appform__head { display: none; }

.contact-aside { display: grid; gap: 1rem; position: sticky; top: calc(var(--header-h) + 1.25rem); }
.cbox {
  background: var(--c-mist);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  padding: 1.25rem;
}
.cbox h3 { font-size: 1rem; margin-bottom: 0.85rem; }
.cbox__times { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; }
.cbox__times li { display: grid; gap: 0.25rem; }
.cbox__tag {
  justify-self: start;
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  color: var(--c-ink-faint);
}
.cbox__tag--urgent {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-button-text);
}
.cbox__times strong { font-size: 0.92rem; }
.cbox__list { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.4rem; font-size: 0.9rem; color: var(--c-ink-soft); }
.cbox__note { font-size: 0.82rem; color: var(--c-ink-faint); margin: 0.9rem 0 0; line-height: 1.5; }
.cbox__note--warn {
  background: #fff;
  border-left: 3px solid var(--c-gold);
  border-radius: 0 6px 6px 0;
  padding: 0.65rem 0.8rem;
  color: var(--c-ink-soft);
}
.cbox__address { font-style: normal; font-size: 0.92rem; color: var(--c-ink-soft); line-height: 1.6; }

@media (max-width: 880px) {
  .contact-layout { grid-template-columns: 1fr; }
  .contact-aside { position: static; }
}

/* Order confirmation ------------------------------------------------------
   Replaces WooCommerce's default definition list. The page a traveler sees
   straight after paying, so it leads with reassurance and the reference
   they need, not an order-number table. -------------------------------- */
.adk-confirm { max-width: 980px; margin-inline: auto; }

.adk-confirm__head { text-align: center; margin-bottom: 2.25rem; }
.adk-confirm__tick {
  display: inline-grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: var(--c-primary-tint);
  color: var(--c-primary);
  margin-bottom: 1.1rem;
}
.adk-confirm__head h1 { margin-bottom: 0.5rem; }
.adk-confirm__head .lede { max-width: 46ch; margin-inline: auto; }

/* The reference is the single most useful thing on this page, so it gets
   its own block rather than sitting in a row of order metadata. */
.adk-confirm__ref {
  text-align: center;
  background: var(--c-mist);
  border: 1px dashed var(--c-line-strong);
  border-radius: var(--radius-lg);
  padding: 1.25rem 1.5rem;
  margin-bottom: 2.25rem;
}
.adk-confirm__ref-label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-bottom: 0.35rem;
}
.adk-confirm__ref-code {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(1.3rem, 1.1rem + 1vw, 1.75rem);
  letter-spacing: 0.06em;
  color: var(--c-ink);
}
.adk-confirm__ref-note {
  display: block;
  font-size: 0.8rem;
  color: var(--c-ink-faint);
  margin-top: 0.45rem;
}

.adk-confirm__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 2.5rem);
  align-items: start;
}
@media (max-width: 880px) {
  .adk-confirm__grid { grid-template-columns: 1fr; }
}

.adk-confirm__panel h2 { font-size: var(--step-1); margin-bottom: 1.25rem; }

.adk-confirm__steps { list-style: none; margin: 0; padding: 0; position: relative; }
.adk-confirm__steps li {
  position: relative;
  padding: 0 0 1.5rem 2.25rem;
}
.adk-confirm__steps li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 2px solid var(--c-line-strong);
  background: #fff;
}
/* The connecting rail, drawn behind the dots. */
.adk-confirm__steps li::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 1.4rem;
  bottom: -0.1rem;
  width: 2px;
  background: var(--c-line);
}
.adk-confirm__steps li:last-child::after { display: none; }
.adk-confirm__steps li.is-done::before { background: var(--c-primary); border-color: var(--c-primary); }
.adk-confirm__steps li.is-done::after { background: var(--c-primary); }
.adk-confirm__steps li.is-active::before {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 4px var(--c-primary-tint);
}
.adk-confirm__steps strong { display: block; margin-bottom: 0.2rem; }
.adk-confirm__steps span { color: var(--c-ink-soft); font-size: var(--step--1); line-height: 1.55; }

.adk-confirm__card {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: clamp(1.25rem, 3vw, 1.6rem);
  position: sticky;
  top: calc(var(--header-h) + 1.25rem);
}
@media (max-width: 880px) { .adk-confirm__card { position: static; } }
.adk-confirm__card h3 {
  font-size: var(--step-0);
  padding-bottom: 0.85rem;
  margin-bottom: 0.85rem;
  border-bottom: 1px solid var(--c-line);
}
.adk-confirm__meta { margin: 0 0 1.25rem; }
.adk-confirm__meta > div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px dashed var(--c-line);
  font-size: var(--step--1);
}
.adk-confirm__meta > div:last-child { border-bottom: 0; }
.adk-confirm__meta dt {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.adk-confirm__meta dd { margin: 0; font-weight: 600; text-align: right; color: var(--c-ink); }

/* The icon sits beside a single run of text. Using flex directly on the
   paragraph made every text node and inline link its own flex item, which
   scattered the sentence into columns; the icon is absolutely placed
   instead so the text stays one continuous paragraph. */
.adk-confirm__support {
  position: relative;
  margin: 1.1rem 0 0;
  padding-left: 1.5rem;
  font-size: 0.8rem;
  color: var(--c-ink-faint);
  line-height: 1.5;
}
.adk-confirm__support svg {
  position: absolute;
  left: 0;
  top: 0.15rem;
  color: var(--c-primary);
}

.adk-confirm__disclaimer { margin-top: 2.5rem; }

/* A quiet, destructive-action link. Deliberately not a button: it should be
   reachable but never compete with the primary action beside it. */
.adk-linkbtn {
  display: inline-block;
  margin-top: 0.75rem;
  font-size: 12px;
  color: #b32d2e;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.adk-linkbtn:hover { color: #8a2322; }

/* A custom uploaded destination icon sits in the same round tile the
   built-in line icons use, so a mixture of the two still lines up. */
.arrivaldesk-custom-icon {
  display: block;
  object-fit: contain;
  border-radius: 4px;
}

/* 14. ArrivalDesk brand layer ---------------------------------------------
   The structural CSS above is shared plumbing. Everything below is this
   site's own design: a flat, editorial, print-led look — serif headlines,
   hairline rules, square corners, no drop shadows, a dark hero and a light
   top bar. It deliberately inverts the light-hero / dark-band rhythm and
   the soft rounded-card language that other builds on this engine use, so
   the two sites do not read as the same template with new colors.

   It still resolves entirely through the CSS variables, so the palettes
   under ArrivalDesk → Brand & colors keep working untouched.
   ------------------------------------------------------------------------ */

:root {
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
  --rule: 1px solid var(--c-line);
  --rule-strong: 1px solid var(--c-ink);
  --header-h: 84px;
}

body { letter-spacing: 0; }

h1, h2, h3 { letter-spacing: -0.01em; font-weight: 600; }
h1 { line-height: 1.08; }
h2 { line-height: 1.15; }

/* --- Top bar: light, ruled, not a dark strip --------------------------- */
.topbar {
  background: var(--c-paper);
  color: var(--c-ink-faint);
  border-bottom: var(--rule);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.topbar a { color: var(--c-ink-soft); }
.topbar a:hover { color: var(--c-primary); }
.topbar__dot { border-radius: 0; width: 5px; height: 5px; background: var(--c-primary); }

/* --- Header: taller, hairline, monospace nav --------------------------- */
.site-header {
  border-bottom: var(--rule);
  backdrop-filter: none;
}
.site-header.is-stuck { box-shadow: none; border-bottom: var(--rule-strong); }
.site-header__inner { min-height: var(--header-h); }
.brand__mark {
  border-radius: 3px;
  background: var(--c-ink);
  box-shadow: none;
  width: 40px;
  height: 40px;
}
.brand__name { font-family: var(--font-display); letter-spacing: -0.02em; }
.nav a {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.nav ul { gap: 1.35rem; }
.nav .sub-menu { border-radius: 3px; }
.nav .sub-menu a { border-radius: 0; text-transform: none; letter-spacing: 0; font-family: var(--font-body); }

/* --- Buttons: square, small caps, no lift ------------------------------ */
.btn {
  border-radius: 3px;
  padding: 1rem 1.7rem;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: none;
  transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease;
}
.btn:hover { transform: none; box-shadow: none; }
.btn--lg { padding: 1.15rem 2.1rem; font-size: 0.78rem; }
.btn--sm { padding: 0.7rem 1.1rem; font-size: 0.66rem; }
.btn--ghost { border-color: var(--c-ink); border-width: 1px; }
.btn--pill { border-radius: 3px; }

/* --- Hero: dark block, centred, no gradients --------------------------- */
.hero {
  background: var(--c-ink);
  color: rgba(255, 255, 255, 0.72);
  padding-block: clamp(3.5rem, 8vw, 6.5rem);
  border-bottom: 0;
}
.hero::after {
  inset: auto 0 28px 0;
  width: auto;
  height: 0;
  border-radius: 0;
  border-top: 1px dashed rgba(255, 255, 255, 0.16);
  background: none;
  background-image: none;
  mask-image: none;
  -webkit-mask-image: none;
  opacity: 1;
}
.hero__inner {
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  max-width: 940px;
  margin-inline: auto;
  gap: clamp(2.25rem, 4vw, 3.25rem);
}
.hero--no-card .hero__inner { max-width: 820px; }
.hero .eyebrow {
  background: rgba(255, 255, 255, 0.07);
  color: var(--c-gold);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
.hero .eyebrow::before { background: var(--c-gold); }
.hero h1 { color: #fff; font-size: clamp(2.35rem, 1.6rem + 3vw, 4rem); margin-bottom: 1.15rem; }
.hero h1 em {
  font-style: italic;
  color: var(--c-gold);
  background-image: none;
  white-space: normal;
}
/* Base CSS pins the emphasised phrase to one line above 700px, which runs it
   under the status card. This layer always lets it wrap. */
.hero h1 em, .hero h1 em { white-space: normal !important; }
@media (min-width: 700px) { .hero h1 em { white-space: normal !important; } }
.hero__sub { color: rgba(255, 255, 255, 0.7); max-width: 58ch; margin-inline: auto; }
.hero__picker {
  margin-inline: auto;
  max-width: 640px;
  width: 100%;
  border-radius: 4px;
  border-color: transparent;
  box-shadow: none;
  padding: 0.75rem;
}
.hero__picker:focus-within { box-shadow: none; outline: 2px solid var(--c-gold); outline-offset: 2px; }
.hero__assurances {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.75rem 1.75rem;
  margin-top: 2.1rem;
}
.hero__assurances li { color: rgba(255, 255, 255, 0.72); }
.hero__assurances svg {
  color: var(--c-gold);
  background: rgba(255, 255, 255, 0.1);
  border-radius: 2px;
}
.hero__visual { width: 100%; }
.hero .doccard {
  max-width: 620px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: none;
}

/* --- Section heads: centred, hairline drop, no underline bar ------------ */
.section-head {
  position: relative;
  max-width: 660px;
  margin-inline: auto;
  text-align: center;
  padding-top: 3rem;
}
.section-head::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 44px;
  background: var(--c-line-strong);
}
.section-head h2 { padding-bottom: 0; }
.section-head h2::after { display: none; }
.section-head p { margin-inline: auto; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0;
  background: none;
  border-radius: 0;
  color: var(--c-ink-faint);
  font-size: 0.66rem;
  letter-spacing: 0.2em;
  margin-bottom: 1rem;
}
.eyebrow::before {
  display: block;
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 0;
  background: var(--c-primary);
}
.section-head--center .eyebrow, .eyebrow--center { display: inline-flex; }
.section--ink .eyebrow, .section--primary .eyebrow {
  background: none;
  color: rgba(255, 255, 255, 0.72);
}
.section--ink .eyebrow::before, .section--primary .eyebrow::before { background: var(--c-gold); }

/* --- Stat strip: dark counterweight to the light bands ----------------- */
.logos {
  background: var(--c-ink);
  border-block: 0;
  padding-block: 2.35rem;
}
.logos__label { color: rgba(255, 255, 255, 0.45); }
.logos__stat b { font-size: 2.3rem; color: var(--c-gold); font-weight: 600; }
.logos__stat span { color: rgba(255, 255, 255, 0.6); }

/* --- Destination cards: ruled boxes, not floating cards ---------------- */
.dcard {
  border-radius: 4px;
  border: var(--rule-strong);
  background: var(--c-paper);
  padding: 1.8rem 1.6rem;
  transition: background-color 0.18s ease, color 0.18s ease;
}
.dcard::before { display: none; }
.dcard:hover {
  transform: none;
  box-shadow: none;
  background: var(--c-mist);
  border-color: var(--c-ink);
}
.dcard__flag {
  width: 2.9rem;
  height: 2.9rem;
  border-radius: 3px;
  background: var(--c-mist);
  border: var(--rule);
  margin-bottom: 1.1rem;
}
.dcard__title { font-weight: 600; }
.dcard__meta { border-top: 1px dashed var(--c-line); padding-top: 0.9rem; margin-top: 0.9rem; }
.dcard__price { font-family: var(--font-display); }

/* --- Steps: a ruled timeline, not four cards --------------------------- */
.stage {
  background: transparent;
  border: 0;
  border-top: 2px solid var(--c-ink);
  border-radius: 0;
  padding: 1.4rem 1.25rem 0 0;
  overflow: visible;
}
.stage__code {
  position: static;
  margin: 0 0 0.85rem;
  padding: 0;
  background: none;
  color: var(--c-primary);
  border-radius: 0;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
}
.stage__time {
  border-top: 1px dashed var(--c-line);
  color: var(--c-ink-faint);
}

/* --- Value props: outlined boxes that work on light or dark ----------- */
.vprop {
  border-radius: 4px;
  background: var(--c-paper);
  border: var(--rule);
}
.vprop__icon {
  border-radius: 3px;
  background: var(--c-mist);
  color: var(--c-primary);
  border: var(--rule);
}
.section--ink .vprop, .section--primary .vprop {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.16);
}
.section--ink .vprop__icon, .section--primary .vprop__icon {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--c-gold);
}

/* --- Pricing: the featured plan inverts to ink ------------------------- */
.plan { border-radius: 4px; border: var(--rule-strong); }
.plan.is-featured {
  background: var(--c-ink);
  color: rgba(255, 255, 255, 0.72);
  border-color: var(--c-ink);
  outline: 0;
  box-shadow: none;
}
.plan.is-featured::before {
  background: var(--c-gold);
  color: var(--c-ink);
  border-radius: 2px;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.42rem 0.75rem;
}
.plan.is-featured h3,
.plan.is-featured .plan__name,
.plan.is-featured .plan__price { color: #fff; }
.plan.is-featured .plan__speed,
.plan.is-featured .plan__note { color: rgba(255, 255, 255, 0.55); }
.plan.is-featured li, .plan.is-featured p { color: rgba(255, 255, 255, 0.75); }
.plan.is-featured .checklist__tick, .plan.is-featured .check { color: var(--c-gold); }
.plan.is-featured .btn { --btn-bg: var(--c-gold); --btn-fg: var(--c-ink); }
.plan.is-featured .btn:hover { --btn-bg: #fff; }
.plan__price { font-family: var(--font-display); }

/* --- Reviews: pull quotes under a rule, not boxes ---------------------- */
.review {
  background: transparent;
  border: 0;
  border-top: 2px solid var(--c-ink);
  border-radius: 0;
  padding: 1.5rem 1rem 0 0;
}
.review::before { display: none; }
.review p {
  font-family: var(--font-display);
  font-size: var(--step-1);
  line-height: 1.45;
  color: var(--c-ink);
}
.review__who { border-top: 1px dashed var(--c-line); }
.review__avatar { border-radius: 3px; }

/* --- FAQ: back to a ruled index --------------------------------------- */
.faq__item {
  border: 0;
  border-bottom: var(--rule);
  border-radius: 0;
  background: transparent;
  margin-bottom: 0;
  padding-inline: 0;
  box-shadow: none;
}
.faq__item:first-child { border-top: var(--rule-strong); }
.faq__item:last-child { border-bottom: var(--rule-strong); }
.faq__item.is-open { border-color: var(--c-line); box-shadow: none; }
.faq__q { font-size: var(--step-1); padding: 1.4rem 0; }
.faq__icon { border-radius: 2px; }

/* --- CTA band: flat ink slab ------------------------------------------ */
.cta-band {
  background: var(--c-ink);
  border-radius: 4px;
  border-left: 4px solid var(--c-gold);
}
.cta-band::before { display: none; }

/* --- Disclaimer ------------------------------------------------------- */
.disclaimer {
  border-radius: 2px;
  background: var(--c-paper);
  border: var(--rule);
  border-left: 3px solid var(--c-ink);
}

/* --- Footer ----------------------------------------------------------- */
.site-footer { position: relative; }
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: var(--c-gold);
}
.site-footer h4 { letter-spacing: 0.2em; }

/* --- Application form ------------------------------------------------- */
.appform { border-radius: 4px; }
.appform__progress-fill { background: var(--c-primary); }
.appform__panel, .appform__body { border-radius: 4px; }

/* --- Ticket / document cards elsewhere on the site --------------------- */
.doccard, .dest-ticket, .contact-card, .contact-form-card, .cbox, .compare__col {
  border-radius: 4px;
  box-shadow: none;
}

/* --- Inputs ------------------------------------------------------------ */
input, select, textarea { border-radius: 3px; }

/* --- 14b. Rebuilt components ------------------------------------------
   The hero, the destination list and the stages use their own markup in
   this theme rather than the shared card grid, so their styles live here.
   ---------------------------------------------------------------------- */

/* Hero: one centred column, destinations as tiles underneath ------------ */
.hero--stack .hero__inner {
  display: block;
  max-width: 1000px;
  margin-inline: auto;
  text-align: center;
}
.hero--stack .hero__copy { max-width: 780px; margin-inline: auto; }
.hero__cta { margin-top: 2rem; }

.hero__tiles { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.hero__tiles-label {
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 1rem;
}
.htiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
  text-align: left;
}
.htile {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1.05rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
.htile:hover, .htile:focus-visible {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--c-gold);
}
.htile__flag {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.09);
}
.htile__body { display: grid; gap: 0.15rem; min-width: 0; }
.htile__country { font-family: var(--font-display); font-size: 1.02rem; font-weight: 600; }
.htile__doc {
  font-size: 0.74rem;
  color: rgba(255, 255, 255, 0.6);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.htile__go {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--c-gold);
  font-family: var(--font-mono);
  font-size: 0.8rem;
  white-space: nowrap;
}
.htile__price .amount, .htile__price bdi { color: var(--c-gold); }

/* Destination ledger ---------------------------------------------------- */
.ledger { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--c-ink); }
.lrow {
  position: relative;
  display: grid;
  grid-template-columns: 2.6rem 2.9rem minmax(190px, 1.5fr) repeat(4, minmax(0, 1fr)) auto;
  align-items: center;
  gap: 1rem;
  padding: 1.4rem 0.75rem;
  border-bottom: 1px solid var(--c-line);
  transition: background-color 0.18s ease;
}
.lrow:hover { background: var(--c-paper); }
.lrow__num {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--c-ink-faint);
}
.lrow__flag {
  display: grid;
  place-items: center;
  width: 2.9rem;
  height: 2.9rem;
  border: 1px solid var(--c-line);
  border-radius: 3px;
  background: var(--c-paper);
}
.lrow__id { display: grid; gap: 0.2rem; min-width: 0; }
.lrow__country { font-family: var(--font-display); font-size: 1.18rem; font-weight: 600; color: var(--c-ink); }
.lrow__doc { font-size: 0.82rem; color: var(--c-ink-faint); }
.lrow__cell { display: grid; gap: 0.25rem; min-width: 0; }
.lrow__cell .k {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
}
.lrow__cell .v { font-size: 0.9rem; color: var(--c-ink-soft); }
.lrow__cell .v em { font-style: normal; color: var(--c-ink-faint); font-size: 0.8rem; }
.lrow__price, .lrow__price .amount, .lrow__price bdi {
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--c-ink);
}
.lrow__go {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-primary);
  white-space: nowrap;
}
.lrow:hover .lrow__go { color: var(--c-primary-dark); }
.lrow__link {
  position: absolute;
  inset: 0;
  font-size: 0;
  text-indent: -9999px;
  border-radius: 3px;
}
.lrow__link:focus-visible { outline: 2px solid var(--c-primary); outline-offset: -3px; }

/* Stage rail + example card --------------------------------------------- */
.stages {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.85fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.stages--full { grid-template-columns: minmax(0, 1fr); }
.stages__rail { list-style: none; margin: 0; padding: 0; }
.stages__rail .stage {
  display: grid;
  grid-template-columns: 3.25rem minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
  padding: 1.6rem 0;
  border: 0;
  border-top: 1px solid var(--c-line);
  background: transparent;
}
.stages__rail .stage:first-child { border-top: 2px solid var(--c-ink); }
.stages__rail .stage:last-child { border-bottom: 1px solid var(--c-line); }
.stage__num {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1;
  color: var(--c-primary);
}
.stage__body { min-width: 0; }
.stage__body h3 { font-size: var(--step-1); margin-bottom: 0.4rem; }
.stages__rail .stage__code {
  display: block;
  margin: 0 0 0.45rem;
  padding: 0;
  background: none;
  color: var(--c-ink-faint);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
}
.stages__rail .stage__time {
  margin-top: 0.75rem;
  padding-top: 0.65rem;
  border-top: 1px dashed var(--c-line);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--c-ink-faint);
}
.stages__aside { position: sticky; top: calc(var(--header-h) + 24px); }
.stages__aside .doccard { border: 1px solid var(--c-line); box-shadow: none; }

/* --- Responsive -------------------------------------------------------- */
@media (max-width: 1080px) {
  .lrow { grid-template-columns: 2.4rem 2.7rem minmax(170px, 1.4fr) repeat(3, minmax(0, 1fr)) auto; }
  .lrow .lrow__cell:nth-of-type(3) { display: none; } /* government fee */
}

@media (max-width: 940px) {
  .stages { grid-template-columns: minmax(0, 1fr); }
  .stages__aside { position: static; max-width: 480px; }
}

@media (max-width: 860px) {
  .htiles { grid-template-columns: minmax(0, 1fr); }
  .hero--stack .hero__inner { text-align: left; }
  .hero--stack .hero__copy { margin-inline: 0; }
  .hero__assurances { justify-content: flex-start; }
  .section-head { text-align: left; padding-top: 2.25rem; }
  .section-head::before { left: 0; height: 32px; }
  .section-head p { margin-inline: 0; }
}

@media (max-width: 780px) {
  /* Grid columns stop being useful here: the row becomes a wrapping block
     with the meta cells in pairs underneath the country. */
  .ledger { border-top-width: 2px; }
  .lrow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem 1rem;
    padding: 1.35rem 0.5rem;
  }
  .lrow__num { display: none; }
  .lrow__flag { flex: 0 0 auto; width: 2.6rem; height: 2.6rem; }
  .lrow__id { flex: 1 1 auto; }
  .lrow__cell { flex: 1 1 calc(50% - 1rem); min-width: 130px; }
  .lrow__go { flex: 1 1 100%; justify-self: start; }
}

@media (max-width: 620px) {
  .hero__tiles-label { font-size: 0.6rem; }
  .htile { padding: 0.9rem; gap: 0.75rem; }
  .htile__go .htile__price { display: none; }
  .stages__rail .stage { grid-template-columns: 2.5rem minmax(0, 1fr); gap: 0.9rem; }
  .stage__num { font-size: 1.3rem; }
  .btn { padding: 0.9rem 1.35rem; font-size: 0.68rem; }
  .site-header__inner { min-height: 68px; }
}

@media (max-width: 480px) {
  .lrow__flag { display: none; }
  .lrow__cell { flex: 1 1 100%; }
  .topbar { font-size: 0.62rem; }
}

/* Touch targets: every tappable row and tile clears 44px --------------- */
@media (pointer: coarse) {
  .htile, .lrow, .faq__q, .nav a, .btn { min-height: 44px; }
}