/* ============================================================================
   Aura Suci Liveaboard — Page Design System
   Loaded after tailwind.min.css. Powers page.php and every page-{slug}.php.
   Palette derives from the theme brand (gold #C4A265, ink #1A1612, cream #FAF8F5)
   with a layout rhythm modelled on premium phinisi charter sites.
   ========================================================================== */

:root {
  --as-gold-300: #E4D2AE;
  --as-gold-400: #D6BB83;
  --as-gold-500: #C4A265;
  --as-gold-600: #A68A50;
  --as-gold-700: #8B7355;
  --as-gold-800: #6E5A3C;

  --as-ink-900: #1A1612;
  --as-ink-800: #2B2520;
  --as-ink-700: #453D34;
  --as-ink-600: #5E554A;
  --as-ink-500: #7A7065;
  --as-ink-300: #A9A199;

  --as-cream-50: #FAF8F5;
  --as-cream-100: #F3EDE2;
  --as-cream-200: #EAE1D2;
  --as-paper: #FFFFFF;

  --as-line: rgba(26, 22, 18, 0.16);
  --as-line-strong: rgba(26, 22, 18, 0.28);
  --as-line-soft: rgba(26, 22, 18, 0.07);
  --as-line-light: rgba(255, 255, 255, 0.18);

  --as-serif: "Philosopher", Georgia, serif;
  --as-sans: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --as-measure: 46rem;   /* running text — about 72 characters */
  --as-mid: 58rem;       /* callouts, CTA ribbons, short FAQ lists */
  --as-figure: 68rem;    /* inline photography, so it never gets gigantic */

  --as-r-sm: 6px;
  --as-r-md: 12px;
  --as-r-lg: 18px;
  --as-r-xl: 26px;

  --as-shadow-sm: 0 2px 10px rgba(26, 22, 18, 0.06);
  --as-shadow-md: 0 14px 36px rgba(26, 22, 18, 0.10);
  --as-shadow-lg: 0 26px 64px rgba(26, 22, 18, 0.18);

  --as-t-fast: 0.2s ease;
  --as-t-base: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------------------------------------------------------------- shell -- */

.as-page {
  background: var(--as-paper);
  font-family: var(--as-sans);
  color: var(--as-ink-700);
  overflow-x: clip;
}

/* Mirrors the Tailwind .container + px-4 md:px-8 lg:px-12 that front-page.php
   uses, so sections line up edge to edge across every template. */
.as-container {
  width: 100%;
  margin-inline: auto;
  padding-inline: 1rem;
}
@media (min-width: 640px)  { .as-container { max-width: 640px; } }
@media (min-width: 768px)  { .as-container { max-width: 768px; padding-inline: 2rem; } }
@media (min-width: 1024px) { .as-container { max-width: 1024px; padding-inline: 3rem; } }
@media (min-width: 1280px) { .as-container { max-width: 1280px; } }
@media (min-width: 1536px) { .as-container { max-width: 1536px; } }

.as-section { padding-block: clamp(2.75rem, 6vw, 5.5rem); }
.as-section--tight { padding-block: clamp(2rem, 4vw, 3.5rem); }
.as-section--cream { background: var(--as-cream-50); }
.as-section--sand  { background: var(--as-cream-100); }
.as-section--ink   { background: var(--as-ink-900); color: rgba(255, 255, 255, 0.82); }

/* ------------------------------------------------------------- headings -- */

.as-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  font-family: var(--as-sans);
  font-size: 0.7rem;
  font-weight: 600 !important;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--as-gold-600) !important;
  margin: 0 0 0.9rem;
}
.as-eyebrow::before {
  content: "";
  width: 1.75rem;
  height: 1px;
  background: var(--as-gold-500);
  flex: none;
}
.as-section-head--center .as-eyebrow { justify-content: center; }
.as-section-head--center .as-eyebrow::before { display: none; }
.as-eyebrow--light { color: var(--as-gold-400) !important; }
.as-eyebrow--light::before { background: var(--as-gold-400); }

.as-h2 {
  font-family: var(--as-serif);
  font-size: clamp(1.65rem, 1.1rem + 2.1vw, 2.6rem);
  font-weight: 700 !important;
  line-height: 1.18;
  color: var(--as-ink-900) !important;
  margin: 0 0 1rem;
  letter-spacing: -0.01em;
}
.as-h3 {
  font-family: var(--as-serif);
  font-size: clamp(1.2rem, 1rem + 0.7vw, 1.5rem);
  font-weight: 700 !important;
  line-height: 1.3;
  color: var(--as-ink-900) !important;
  margin: 0 0 0.6rem;
}
.as-h2--light, .as-h3--light { color: #fff !important; }

.as-section-head { max-width: 56rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.as-section-head--center { margin-inline: auto; text-align: center; }
.as-section-head p {
  font-size: 1rem;
  line-height: 1.75;
  color: var(--as-ink-600) !important;
  margin: 0;
}
.as-section-head--light p { color: rgba(255, 255, 255, 0.72) !important; }

.as-rule { width: 3.5rem; height: 2px; background: var(--as-gold-500); border: 0; margin: 1.15rem 0 0; }
.as-section-head--center .as-rule { margin-inline: auto; }

/* --------------------------------------------------------------- buttons -- */

.as-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 0.9rem 1.7rem;
  font-family: var(--as-sans);
  font-size: 0.82rem;
  font-weight: 600 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 999px;
  border: 1px solid transparent;
  text-decoration: none !important;
  cursor: pointer;
  transition: all var(--as-t-base);
  white-space: nowrap;
  line-height: 1.2;
}
.as-btn i { color: inherit !important; font-size: 1.05rem; }

.as-btn--gold { background: var(--as-gold-500); color: #fff !important; }
.as-btn--gold:hover { background: var(--as-gold-600); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(196, 162, 101, 0.38); }

.as-btn--ink { background: var(--as-ink-900); color: #fff !important; }
.as-btn--ink:hover { background: var(--as-ink-800); transform: translateY(-2px); box-shadow: var(--as-shadow-md); }

.as-btn--outline { background: transparent; color: var(--as-gold-700) !important; border-color: var(--as-gold-500); }
.as-btn--outline:hover { background: var(--as-gold-500); color: #fff !important; }

.as-btn--ghost {
  background: rgba(255, 255, 255, 0.08);
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.34);
  backdrop-filter: blur(10px);
}
.as-btn--ghost:hover { background: rgba(255, 255, 255, 0.18); border-color: rgba(255, 255, 255, 0.6); }

@media (max-width: 480px) {
  .as-btn { padding: 0.8rem 1.25rem; font-size: 0.76rem; }
}

/* ------------------------------------------------------------------ hero -- */

.as-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: clamp(26rem, 62vh, 40rem);
  padding-top: 7rem;
  padding-bottom: clamp(2.5rem, 5vw, 4.5rem);
  overflow: hidden;
  background: var(--as-ink-900);
  isolation: isolate;
}
.as-hero__media { position: absolute; inset: 0; z-index: -2; }
.as-hero__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.as-hero__scrim {
  position: absolute; inset: 0; z-index: -1;
  background:
    /* keeps the transparent site header and white logo readable */
    linear-gradient(to bottom, rgba(26,22,18,0.55) 0%, rgba(26,22,18,0) 22%),
    linear-gradient(to top, rgba(26,22,18,0.94) 0%, rgba(26,22,18,0.62) 42%, rgba(26,22,18,0.34) 100%),
    linear-gradient(to right, rgba(26,22,18,0.5) 0%, rgba(26,22,18,0) 62%);
}
.as-hero__inner { width: 100%; max-width: 900px; }

.as-crumbs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  list-style: none; margin: 0 0 1.15rem; padding: 0;
  font-size: 0.76rem; letter-spacing: 0.04em;
}
.as-crumbs li { color: rgba(255, 255, 255, 0.62) !important; }
.as-crumbs a { color: rgba(255, 255, 255, 0.82) !important; text-decoration: none; transition: color var(--as-t-fast); }
.as-crumbs a:hover { color: var(--as-gold-400) !important; }
.as-crumbs .sep { color: rgba(255, 255, 255, 0.32) !important; }
.as-crumbs li[aria-current] { color: var(--as-gold-400) !important; }

.as-hero__title {
  font-family: var(--as-serif);
  font-size: clamp(1.95rem, 1.1rem + 3.4vw, 3.6rem);
  font-weight: 700 !important;
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #fff !important;
  margin: 0 0 1rem;
  text-wrap: balance;
}
.as-hero__standfirst {
  font-size: clamp(0.98rem, 0.9rem + 0.35vw, 1.18rem);
  line-height: 1.68;
  color: rgba(255, 255, 255, 0.85) !important;
  max-width: 62ch;
  margin: 0 0 1.6rem;
}
.as-hero__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }

.as-hero__facts {
  display: flex; flex-wrap: wrap; gap: 0 clamp(1.5rem, 4vw, 3rem);
  margin: 1.75rem 0 0; padding: 1.35rem 0 0;
  border-top: 1px solid var(--as-line-light);
  list-style: none;
}
.as-hero__facts li { color: #fff !important; }
.as-hero__facts .k {
  display: block; font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--as-gold-400) !important; margin-bottom: 0.3rem; font-weight: 600 !important;
}
.as-hero__facts .v {
  display: block; font-family: var(--as-serif); font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.4rem);
  font-weight: 700 !important; color: #fff !important; line-height: 1.2;
}
@media (max-width: 640px) {
  .as-hero__facts { gap: 1.1rem 1.75rem; }
  .as-hero__facts li { min-width: calc(50% - 1.75rem); }
}

/* ------------------------------------------------------- article layout -- */

/* One centred column. Text sits on a readable measure while media, data and
   accordions break out wider — that width contrast is what gives a long page
   its rhythm without needing a sidebar. */

.as-article { padding-block: clamp(2.75rem, 6vw, 5.5rem); }
.as-article__inner { width: 100%; margin-inline: auto; }
.as-article__inner > .as-meta { max-width: var(--as-measure); margin-inline: auto; }

/* -------------------------------------------------------- prose content -- */

.as-prose {
  max-width: 100%;
  font-size: 1.05rem;
  line-height: 1.8;
  color: var(--as-ink-700);
}

/* tier 1 — running text */
.as-prose > * { max-width: var(--as-measure); margin-inline: auto; }

/* tier 2 — asides and calls to action sit a little proud of the text */
.as-prose > .as-callout,
.as-prose > .as-inline-cta,
.as-prose > .as-faq { max-width: min(100%, var(--as-mid)); }

/* tier 3 — media, data and long question lists use the full column */
.as-prose > .as-figrow,
.as-prose > .as-tablewrap,
.as-prose > .as-faq--split,
.as-prose > section,
.as-prose > .as-wide { max-width: 100%; }

/* Photography is capped so a wide monitor does not turn a 16:9 frame into a
   half-screen-tall block. */
.as-prose > figure,
.as-prose > .as-figure { max-width: min(100%, var(--as-figure)); }

.as-prose p { font-size: inherit; line-height: inherit; color: var(--as-ink-700) !important; margin: 0 0 1.15rem; }
.as-prose > p:first-child,
.as-prose .x-aeo p,
.as-prose p.x-aeo {
  font-size: clamp(1.06rem, 1rem + 0.35vw, 1.22rem);
  line-height: 1.65;
  color: var(--as-ink-800) !important;
}
.as-prose .x-aeo {
  background: var(--as-cream-50);
  border-left: 3px solid var(--as-gold-500);
  border-radius: 0 var(--as-r-md) var(--as-r-md) 0;
  padding: 1.15rem 1.4rem;
  margin: 0 0 1.75rem;
}
.as-prose .x-aeo p:last-child { margin-bottom: 0; }
.as-prose .x-aeo strong { color: var(--as-ink-900) !important; font-weight: 600; }

.as-prose h2 {
  font-family: var(--as-serif);
  font-size: clamp(1.45rem, 1.1rem + 1.35vw, 2.05rem);
  font-weight: 700 !important;
  line-height: 1.22;
  color: var(--as-ink-900) !important;
  margin: 2.9rem 0 0.95rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--as-line);
  letter-spacing: -0.01em;
  scroll-margin-top: 6.5rem;
}
.as-prose > h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.as-prose h3 {
  font-family: var(--as-serif);
  font-size: clamp(1.14rem, 1rem + 0.55vw, 1.4rem);
  font-weight: 700 !important;
  line-height: 1.34;
  color: var(--as-ink-900) !important;
  margin: 2rem 0 0.65rem;
  scroll-margin-top: 6.5rem;
}
.as-prose h4 {
  font-family: var(--as-sans);
  font-size: 0.78rem; font-weight: 700 !important; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--as-gold-700) !important;
  margin: 1.75rem 0 0.5rem;
}

.as-prose strong, .as-prose b { color: var(--as-ink-900) !important; font-weight: 600; }
.as-prose em { font-style: italic; }
.as-prose a {
  color: var(--as-gold-700) !important;
  text-decoration: underline;
  text-decoration-color: rgba(196, 162, 101, 0.45);
  text-underline-offset: 3px;
  transition: all var(--as-t-fast);
}
.as-prose a:hover { color: var(--as-ink-900) !important; text-decoration-color: var(--as-gold-500); }

.as-prose ul, .as-prose ol { margin: 0 0 1.35rem; padding: 0; list-style: none; display: grid; gap: 0.6rem; }
.as-prose li { position: relative; padding-left: 1.6rem; color: var(--as-ink-700) !important; line-height: 1.72; }
.as-prose ul > li::before {
  content: ""; position: absolute; left: 0.05rem; top: 0.72em;
  width: 0.62rem; height: 0.62rem; border-radius: 50%;
  border: 1.5px solid var(--as-gold-500);
}
.as-prose ol { counter-reset: as-ol; }
.as-prose ol > li { counter-increment: as-ol; padding-left: 2.1rem; }
.as-prose ol > li::before {
  content: counter(as-ol) ".";
  position: absolute; left: 0; top: 0;
  font-family: var(--as-serif); font-weight: 700; font-size: 0.98rem;
  color: var(--as-gold-600); font-variant-numeric: tabular-nums;
}
.as-prose li > ul, .as-prose li > ol { margin: 0.55rem 0 0; }
.as-prose li strong { color: var(--as-ink-900) !important; }

.as-prose blockquote {
  margin: 1.9rem 0;
  padding: 0.35rem 0 0.35rem 1.5rem;
  border-left: 3px solid var(--as-gold-500);
  font-family: var(--as-serif);
  font-size: 1.2rem;
  font-style: italic;
  line-height: 1.55;
  color: var(--as-ink-800) !important;
}
.as-prose blockquote p { font-family: inherit; font-size: inherit; color: inherit !important; }

.as-prose hr { border: 0; border-top: 1px solid var(--as-line); margin: 2.5rem 0; }

.as-prose code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.88em; background: var(--as-cream-100);
  padding: 0.15em 0.4em; border-radius: var(--as-r-sm); color: var(--as-ink-800) !important;
}

/* ---------------------------------------------------------------- tables -- */

/* Scoped to .as-tablewrap, not .as-prose — section tables live in
   .as-sec__wide, outside the prose column, and were previously unstyled. */

.as-tablewrap {
  margin: 1.9rem 0;
  border: 1px solid var(--as-line-strong);
  border-radius: var(--as-r-lg);
  overflow: hidden;
  background: var(--as-paper);
  box-shadow: var(--as-shadow-sm);
}
.as-tablescroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.as-tablewrap figure { margin: 0; }   /* Gutenberg wraps tables in one */

.as-tablewrap table {
  width: 100%;
  min-width: 36rem;
  border-collapse: collapse;
  font-family: var(--as-sans);
  font-size: 0.93rem;
  background: var(--as-paper);
}

/* A labelled bar across the top rather than a floating line of text. */
.as-tablewrap caption {
  caption-side: top;
  text-align: left;
  padding: 0.9rem 1.25rem;
  background: var(--as-cream-100);
  border-bottom: 1px solid var(--as-line-strong);
  font-size: 0.68rem;
  font-weight: 700 !important;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--as-gold-700) !important;
}

/* Header row: unmistakable, and it anchors the column rules below it. */
.as-tablewrap thead th {
  background: var(--as-ink-900);
  color: rgba(255, 255, 255, 0.94) !important;
  text-align: left;
  vertical-align: bottom;
  padding: 0.9rem 1.25rem;
  font-size: 0.69rem;
  font-weight: 700 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.4;
  white-space: nowrap;
  border-right: 1px solid rgba(255, 255, 255, 0.14);
}
.as-tablewrap thead th:last-child { border-right: 0; }

/* Body: horizontal rules between rows, vertical rules between columns. */
.as-tablewrap tbody th,
.as-tablewrap tbody td {
  padding: 0.9rem 1.25rem;
  vertical-align: top;
  line-height: 1.62;
  color: var(--as-ink-700) !important;
  border-top: 1px solid var(--as-line);
  border-right: 1px solid var(--as-line);
}
.as-tablewrap tbody td:last-child,
.as-tablewrap tbody th:last-child { border-right: 0; }
.as-tablewrap tbody tr:first-child > * { border-top: 0; }

.as-tablewrap tbody tr:nth-child(even) { background: var(--as-cream-50); }
.as-tablewrap tbody tr { transition: background var(--as-t-fast); }
.as-tablewrap tbody tr:hover { background: var(--as-cream-100); }

/* First column reads as the row label. */
.as-tablewrap tbody td:first-child,
.as-tablewrap tbody th:first-child {
  color: var(--as-ink-900) !important;
  font-weight: 600;
  background: rgba(243, 237, 226, 0.42);
}
.as-tablewrap tbody tr:hover td:first-child { background: rgba(234, 225, 210, 0.6); }

.as-tablewrap strong, .as-tablewrap b { color: var(--as-ink-900) !important; font-weight: 600; }
.as-tablewrap span, .as-tablewrap em, .as-tablewrap small { color: inherit !important; }
.as-tablewrap a { color: var(--as-gold-700) !important; text-decoration: underline; text-underline-offset: 2px; }
.as-tablewrap a:hover { color: var(--as-ink-900) !important; }

/* A table that is still wider than its box says so. */
.as-tablewrap__hint {
  display: none;
  padding: 0.55rem 1.25rem;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--as-ink-500) !important;
  background: var(--as-cream-50);
  border-top: 1px solid var(--as-line);
}
@media (max-width: 760px) { .as-tablewrap__hint { display: block; } }

/* A footnote that belongs to the table it sits under. */
.as-tablewrap__note {
  margin: 0;
  padding: 0.85rem 1.25rem;
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--as-ink-700) !important;
  background: var(--as-cream-50);
  border-top: 1px solid var(--as-line);
}

/* ------------------------------------------------- tables on small screens -- */

/* Tables built from structured data carry a data-label per cell, so they can
   fold into stacked rows instead of scrolling. */
@media (max-width: 640px) {
  .as-tablewrap--stack table { min-width: 0; }
  .as-tablewrap--stack thead { display: none; }
  .as-tablewrap--stack table,
  .as-tablewrap--stack tbody,
  .as-tablewrap--stack tr,
  .as-tablewrap--stack td { display: block; width: 100%; }

  .as-tablewrap--stack tbody tr {
    padding: 0.75rem 0;
    border-top: 2px solid var(--as-line-strong);
    background: none !important;
  }
  .as-tablewrap--stack tbody tr:first-child { border-top: 0; }

  .as-tablewrap--stack tbody td {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    text-align: right;
    padding: 0.4rem 1.1rem;
    border: 0;
  }
  .as-tablewrap--stack tbody td::before {
    content: attr(data-label);
    flex: none;
    text-align: left;
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--as-gold-700);
  }
  .as-tablewrap--stack tbody td[data-label=""]::before { content: none; }

  .as-tablewrap--stack tbody td:first-child {
    display: block;
    text-align: left;
    background: none;
    font-family: var(--as-serif);
    font-size: 1.08rem;
    line-height: 1.3;
    color: var(--as-ink-900) !important;
    padding: 0.35rem 1.1rem 0.55rem;
  }
  .as-tablewrap--stack tbody td:first-child::before { content: none; }
  .as-tablewrap--stack .as-tablewrap__hint { display: none; }
}

/* --------------------------------------------------------------- figures -- */

.as-figure { margin: 2.1rem 0; }
.as-figure__frame {
  position: relative;
  overflow: hidden;
  border-radius: var(--as-r-lg);
  background: var(--as-cream-100);
  box-shadow: var(--as-shadow-md);
}
.as-figure__frame img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.as-figure:hover .as-figure__frame img { transform: scale(1.035); }
.as-figure--wide .as-figure__frame { aspect-ratio: 16 / 9; }
.as-figure--tall .as-figure__frame { aspect-ratio: 4 / 5; }
.as-figure--square .as-figure__frame { aspect-ratio: 1 / 1; }
.as-figure figcaption {
  margin-top: 0.75rem;
  font-size: 0.8rem;
  line-height: 1.6;
  color: var(--as-ink-500) !important;
  display: flex; gap: 0.6rem; align-items: baseline;
}
.as-figure figcaption::before {
  content: ""; flex: none; width: 1.15rem; height: 1px;
  background: var(--as-gold-500); transform: translateY(-0.35em);
}

.as-figrow { display: grid; gap: 1rem; margin: 2.1rem 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.as-figrow--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.as-figrow .as-figure { margin: 0; }
@media (max-width: 640px) {
  .as-figrow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; }
  .as-figrow--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; }
  .as-figrow .as-figure figcaption { font-size: 0.72rem; }
}
@media (max-width: 460px) {
  .as-figrow, .as-figrow--3 { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .as-figrow .as-figure--square .as-figure__frame { aspect-ratio: 16 / 10; }
}

/* --------------------------------------------------------------- callout -- */

.as-callout {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem 1.15rem;
  margin: 2.1rem 0;
  padding: 1.35rem 1.5rem;
  background: var(--as-cream-50);
  border: 1px solid var(--as-line-soft);
  border-left: 3px solid var(--as-gold-500);
  border-radius: 0 var(--as-r-md) var(--as-r-md) 0;
}
.as-callout__icon {
  width: 2.35rem; height: 2.35rem; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--as-gold-500); color: #fff;
  font-size: 1.1rem; flex: none;
}
.as-callout__icon i { color: #fff !important; }
.as-callout__body > :last-child { margin-bottom: 0 !important; }
.as-callout__title {
  font-family: var(--as-sans);
  font-size: 0.7rem; font-weight: 700 !important; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--as-gold-700) !important;
  margin: 0 0 0.4rem;
}
.as-callout p { margin-bottom: 0.6rem !important; font-size: 0.94rem; line-height: 1.68; }
.as-callout--ink { background: var(--as-ink-900); border-color: transparent; border-left-color: var(--as-gold-500); }
.as-callout--ink p, .as-callout--ink li { color: rgba(255, 255, 255, 0.8) !important; }
.as-callout--ink strong { color: #fff !important; }
.as-callout--ink .as-callout__title { color: var(--as-gold-400) !important; }

/* --------------------------------------------------------- inline ribbon -- */

.as-inline-cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 1.15rem;
  margin: 2.4rem 0;
  padding: 1.5rem 1.75rem;
  border-radius: var(--as-r-lg);
  background: linear-gradient(135deg, var(--as-ink-900) 0%, var(--as-ink-800) 100%);
  position: relative; overflow: hidden;
}
.as-inline-cta::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 85% 15%, rgba(196, 162, 101, 0.22), transparent 55%);
  pointer-events: none;
}
.as-inline-cta > * { position: relative; z-index: 1; }
.as-inline-cta__text { min-width: min(100%, 18rem); flex: 1 1 20rem; }
.as-inline-cta strong {
  display: block; font-family: var(--as-serif); font-size: 1.22rem; font-weight: 700 !important;
  color: #fff !important; margin-bottom: 0.3rem; line-height: 1.3;
}
.as-inline-cta p { margin: 0 !important; font-size: 0.88rem; color: rgba(255, 255, 255, 0.68) !important; line-height: 1.6; }

/* ------------------------------------------------------------------- faq -- */

.as-faq { margin: 1.9rem 0; display: grid; gap: 0.6rem; }
.as-faq__item {
  border: 1px solid var(--as-line);
  border-radius: var(--as-r-md);
  background: var(--as-paper);
  overflow: hidden;
  transition: border-color var(--as-t-base), box-shadow var(--as-t-base);
}
.as-faq__item[open] { border-color: var(--as-gold-500); box-shadow: var(--as-shadow-sm); }
.as-faq__q {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
  padding: 1.05rem 1.25rem;
  cursor: pointer; list-style: none;
  font-family: var(--as-serif);
  font-size: 1.02rem; font-weight: 700 !important; line-height: 1.45;
  color: var(--as-ink-900) !important;
  transition: background var(--as-t-fast);
}
.as-faq__q::-webkit-details-marker { display: none; }
.as-faq__q:hover { background: var(--as-cream-50); }
.as-faq__q::after {
  content: "\002B";
  font-family: var(--as-sans); font-size: 1.3rem; font-weight: 300; line-height: 1;
  color: var(--as-gold-600); flex: none; transition: transform var(--as-t-base);
}
.as-faq__item[open] .as-faq__q::after { transform: rotate(45deg); }
.as-faq__a { padding: 0 1.25rem 1.2rem; }
.as-faq__a > :last-child { margin-bottom: 0 !important; }
.as-faq__a p { font-size: 0.95rem; line-height: 1.72; color: var(--as-ink-600) !important; margin-bottom: 0.75rem; }

/* --------------------------------------------------------------- cards --- */

.as-grid { display: grid; gap: clamp(1rem, 2vw, 1.5rem); grid-template-columns: minmax(0, 1fr); }

/* Explicit tracks rather than auto-fit: on a wide monitor auto-fit would open
   a fifth or sixth column and leave the last card stranded on its own row. */
@media (min-width: 700px) {
  .as-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 640px) {
  .as-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .as-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 980px) {
  .as-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .as-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.as-card {
  display: flex; flex-direction: column;
  background: var(--as-paper);
  border: 1px solid var(--as-line-soft);
  border-radius: var(--as-r-lg);
  overflow: hidden;
  transition: transform var(--as-t-base), box-shadow var(--as-t-base), border-color var(--as-t-base);
  text-decoration: none !important;
  height: 100%;
}
.as-card:hover { transform: translateY(-5px); box-shadow: var(--as-shadow-md); border-color: var(--as-gold-300); }
.as-card__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--as-cream-100); }
.as-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
.as-card:hover .as-card__media img { transform: scale(1.06); }
.as-card__tag {
  position: absolute; top: 0.85rem; left: 0.85rem;
  background: rgba(26, 22, 18, 0.78); backdrop-filter: blur(6px);
  color: var(--as-gold-400) !important;
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
  padding: 0.34rem 0.7rem; border-radius: 999px;
}
.as-card__body { padding: 1.15rem 1.3rem 1.35rem; display: flex; flex-direction: column; flex: 1; }
.as-card__title {
  font-family: var(--as-serif); font-size: 1.08rem; font-weight: 700 !important;
  line-height: 1.34; color: var(--as-ink-900) !important; margin: 0 0 0.45rem;
}
.as-card:hover .as-card__title { color: var(--as-gold-700) !important; }
.as-card__text { font-size: 0.875rem; line-height: 1.65; color: var(--as-ink-600) !important; margin: 0 0 0.9rem; }
.as-card__more {
  margin-top: auto; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--as-gold-700) !important; display: inline-flex; align-items: center; gap: 0.45rem;
}
.as-card__more i { color: inherit !important; transition: transform var(--as-t-base); }
.as-card:hover .as-card__more i { transform: translateX(4px); }

/* icon feature card */
.as-feature {
  background: var(--as-paper);
  border: 1px solid var(--as-line-soft);
  border-radius: var(--as-r-lg);
  padding: 1.5rem 1.4rem;
  transition: transform var(--as-t-base), box-shadow var(--as-t-base), border-color var(--as-t-base);
  height: 100%;
}
.as-feature:hover { transform: translateY(-4px); box-shadow: var(--as-shadow-md); border-color: var(--as-gold-300); }
.as-feature__icon {
  width: 2.9rem; height: 2.9rem; border-radius: 50%;
  display: grid; place-items: center; margin-bottom: 1rem;
  background: rgba(196, 162, 101, 0.14); color: var(--as-gold-600);
  font-size: 1.3rem;
}
.as-feature__icon i { color: var(--as-gold-600) !important; }
.as-feature h3 {
  font-family: var(--as-serif); font-size: 1.06rem; font-weight: 700 !important;
  color: var(--as-ink-900) !important; margin: 0 0 0.5rem; line-height: 1.35;
}
.as-feature p { font-size: 0.88rem; line-height: 1.68; color: var(--as-ink-600) !important; margin: 0; }
.as-section--ink .as-feature { background: rgba(255,255,255,0.045); border-color: var(--as-line-light); }
.as-section--ink .as-feature h3 { color: #fff !important; }
.as-section--ink .as-feature p { color: rgba(255,255,255,0.7) !important; }
.as-section--ink .as-feature__icon { background: rgba(196, 162, 101, 0.2); }
.as-section--ink .as-feature__icon i { color: var(--as-gold-400) !important; }

/* ------------------------------------------------------------ stat strip -- */

.as-stats {
  display: grid; gap: 1px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
  background: var(--as-line);
  border: 1px solid var(--as-line);
  border-radius: var(--as-r-lg);
  overflow: hidden;
}
.as-stat { background: var(--as-paper); padding: 1.4rem 1.25rem; text-align: center; }
.as-stat__v {
  display: block; font-family: var(--as-serif);
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); font-weight: 700 !important;
  color: var(--as-gold-600) !important; line-height: 1.1; margin-bottom: 0.35rem;
}
.as-stat__k {
  display: block; font-size: 0.68rem; font-weight: 600 !important; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--as-ink-500) !important; line-height: 1.4;
}
.as-section--ink .as-stats { background: var(--as-line-light); border-color: var(--as-line-light); }
.as-section--ink .as-stat { background: var(--as-ink-900); }
.as-section--ink .as-stat__v { color: var(--as-gold-400) !important; }
.as-section--ink .as-stat__k { color: rgba(255,255,255,0.6) !important; }

/* ------------------------------------------------------------- split row -- */

.as-split {
  display: grid; gap: clamp(1.75rem, 4vw, 3.5rem);
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
}
@media (min-width: 900px) {
  .as-split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .as-split--media-right .as-split__media { order: 2; }
  .as-split--wide-text { grid-template-columns: 1fr 1.15fr; }
}
.as-split__media { position: relative; }
.as-split__media img {
  width: 100%; border-radius: var(--as-r-xl); display: block;
  aspect-ratio: 4 / 3; object-fit: cover; box-shadow: var(--as-shadow-md);
}
.as-split__badge {
  position: absolute; bottom: -1rem; right: -0.5rem;
  background: var(--as-gold-500); color: #fff;
  padding: 0.9rem 1.25rem; border-radius: var(--as-r-md);
  box-shadow: var(--as-shadow-md); text-align: center; max-width: 11rem;
}
.as-split__badge .n { display: block; font-family: var(--as-serif); font-size: 1.5rem; font-weight: 700 !important; line-height: 1; color: #fff !important; }
.as-split__badge .l { display: block; font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; margin-top: 0.3rem; color: rgba(255,255,255,0.9) !important; }
.as-split__body > :last-child { margin-bottom: 0 !important; }
.as-split__body p { font-size: 1rem; line-height: 1.78; color: var(--as-ink-600) !important; margin: 0 0 1rem; }
.as-split__body ul { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: 0.7rem; }
.as-split__body li { position: relative; padding-left: 1.75rem; font-size: 0.95rem; line-height: 1.6; color: var(--as-ink-700) !important; }
.as-split__body li::before {
  content: "\2713"; position: absolute; left: 0; top: 0;
  color: var(--as-gold-600); font-weight: 700; font-size: 0.9rem;
}

/* -------------------------------------------------------------- timeline -- */

.as-timeline { display: grid; gap: 1rem; }
.as-tl {
  position: relative;
  padding: 1.4rem 1.5rem;
  background: var(--as-cream-50);
  border-radius: var(--as-r-lg);
  border-left: 3px solid var(--as-gold-500);
  transition: transform var(--as-t-base), background var(--as-t-base);
}
.as-tl:hover { background: var(--as-cream-100); transform: translateX(5px); }
.as-tl__k {
  display: block; font-size: 0.66rem; font-weight: 700 !important; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--as-gold-700) !important; margin-bottom: 0.45rem;
}
.as-tl__t {
  font-family: var(--as-serif); font-size: 1.2rem; font-weight: 700 !important;
  color: var(--as-ink-900) !important; margin: 0 0 0.5rem; line-height: 1.32;
}
.as-tl p { margin: 0; font-size: 0.93rem; line-height: 1.72; color: var(--as-ink-600) !important; }
.as-tl__list { list-style: none; margin: 0.75rem 0 0; padding: 0; display: grid; gap: 0.4rem; }
.as-tl__list li { position: relative; padding-left: 1.4rem; font-size: 0.9rem; line-height: 1.6; color: var(--as-ink-600) !important; }
.as-tl__list li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 0.7rem; height: 1px; background: var(--as-gold-500); }

/* ----------------------------------------------------------- closing cta -- */

.as-cta { position: relative; overflow: hidden; background: var(--as-ink-900); isolation: isolate; }
.as-cta__media { position: absolute; inset: 0; z-index: -2; }
.as-cta__media img { width: 100%; height: 100%; object-fit: cover; opacity: 0.28; }
.as-cta__scrim {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(to bottom, rgba(26,22,18,0.88), rgba(26,22,18,0.72));
}
.as-cta__inner { max-width: 54rem; margin-inline: auto; text-align: center; padding-block: clamp(3rem, 7vw, 5.5rem); }
.as-cta h2 {
  font-family: var(--as-serif);
  font-size: clamp(1.7rem, 1.2rem + 2.2vw, 2.75rem);
  font-weight: 700 !important; line-height: 1.16; color: #fff !important;
  margin: 0 0 1rem; text-wrap: balance;
}
.as-cta p { font-size: 1.02rem; line-height: 1.75; color: rgba(255, 255, 255, 0.78) !important; margin: 0 auto 1.9rem; max-width: 56ch; }
.as-cta__actions { display: flex; flex-wrap: wrap; gap: 0.85rem; justify-content: center; }
.as-cta__meta {
  margin: 2rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--as-line-light);
  display: flex; flex-wrap: wrap; gap: 0.6rem 2rem; justify-content: center;
  font-size: 0.82rem; color: rgba(255, 255, 255, 0.62) !important; list-style: none;
}
.as-cta__meta li { display: inline-flex; align-items: center; gap: 0.5rem; color: inherit !important; }
.as-cta__meta i { color: var(--as-gold-400) !important; }

/* --------------------------------------------------------------- related -- */

.as-related__link { display: block; text-decoration: none !important; height: 100%; }

/* ------------------------------------------------------------ page notes -- */

.as-meta,
.as-prose ul.as-meta {
  display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem;
  margin: 0 0 1.75rem; padding: 0 0 1.25rem;
  border-bottom: 1px solid var(--as-line);
  font-size: 0.76rem; letter-spacing: 0.06em; color: var(--as-ink-500) !important;
  list-style: none;
}
.as-meta li,
.as-prose ul.as-meta > li {
  display: inline-flex; align-items: center; gap: 0.45rem;
  padding-left: 0; color: inherit !important;
}
.as-prose ul.as-meta > li::before { content: none; }
.as-meta i { color: var(--as-gold-600) !important; font-size: 0.95rem; }

/* print + motion */
@media (prefers-reduced-motion: reduce) {
  .as-card, .as-figure__frame img, .as-card__media img, .as-tl, .as-feature, .as-btn { transition: none !important; }
  .as-card:hover, .as-tl:hover, .as-feature:hover { transform: none !important; }
}

/* ============================================================================
   Legacy in-content blocks
   Some pages ship their own accordion markup (.klf) with an inline <style>
   block. These rules are more specific, so the page picks up the site design
   without the stored content having to be rewritten.
   ========================================================================== */

.as-prose .klf { max-width: 100%; margin: 0; }

.as-prose .klf .klf-nav {
  display: flex; flex-wrap: wrap; gap: 0.5rem;
  margin: 0 0 2rem; padding: 0 0 1.75rem;
  border-bottom: 1px solid var(--as-line);
}
.as-prose .klf .klf-nav a {
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 0.5rem 1rem; border-radius: 999px;
  background: var(--as-cream-50);
  border: 1px solid var(--as-line);
  color: var(--as-ink-700) !important;
  text-decoration: none !important;
  transition: all var(--as-t-fast);
}
.as-prose .klf .klf-nav a:hover {
  background: var(--as-gold-500); border-color: var(--as-gold-500); color: #fff !important;
}

.as-prose .klf h2.klf-cat {
  font-family: var(--as-serif);
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 1.85rem);
  font-weight: 700 !important;
  color: var(--as-ink-900) !important;
  margin: 2.75rem 0 1.15rem;
  padding: 1.5rem 0 0;
  border-top: 1px solid var(--as-line);
  border-left: 0;
  scroll-margin-top: 6.5rem;
}
.as-prose .klf h2.klf-cat:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }

.as-prose .klf .klf-grid { display: grid; grid-template-columns: 1fr; gap: 0.6rem; align-items: start; }
@media (min-width: 900px) { .as-prose .klf .klf-grid { grid-template-columns: 1fr 1fr; gap: 0.6rem 1rem; } }

.as-prose .klf details {
  border: 1px solid var(--as-line);
  border-radius: var(--as-r-md);
  background: var(--as-paper);
  padding: 0;
  overflow: hidden;
  transition: border-color var(--as-t-base), box-shadow var(--as-t-base);
  break-inside: avoid;
}
.as-prose .klf details[open] { border-color: var(--as-gold-500); box-shadow: var(--as-shadow-sm); }
.as-prose .klf summary {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.2rem;
  font-family: var(--as-serif);
  font-size: 0.99rem; font-weight: 700 !important; line-height: 1.45;
  color: var(--as-ink-900) !important;
  cursor: pointer; list-style: none;
  transition: background var(--as-t-fast);
}
.as-prose .klf summary:hover { background: var(--as-cream-50); }
.as-prose .klf summary::-webkit-details-marker { display: none; }
.as-prose .klf summary::after {
  content: "\002B"; float: none;
  font-family: var(--as-sans); font-size: 1.3rem; font-weight: 300; line-height: 1;
  color: var(--as-gold-600); opacity: 1; flex: none;
  transition: transform var(--as-t-base);
}
.as-prose .klf details[open] summary::after { content: "\002B"; transform: rotate(45deg); }
.as-prose .klf .klf-a {
  padding: 0 1.2rem 1.15rem;
  font-size: 0.93rem; line-height: 1.72;
  color: var(--as-ink-600) !important;
  opacity: 1;
}
.as-prose .klf .klf-a a { color: var(--as-gold-700) !important; }

/* Section wrappers that arrive inside stored content */
.as-prose section { max-width: 100%; }
.as-prose > style, .as-prose style { display: none !important; }

/* Long FAQ hubs: two columns once there is room */
.as-faq--split { grid-template-columns: 1fr; }
@media (min-width: 900px) {
  .as-faq--split { grid-template-columns: 1fr 1fr; gap: 0.6rem 1rem; align-items: start; }
}

/* Anything the editor pasted that would otherwise blow out the layout */
.as-prose img { max-width: 100%; height: auto; border-radius: var(--as-r-md); }
.as-prose iframe, .as-prose video { max-width: 100%; border-radius: var(--as-r-md); }

/* ------------------------------------------------------------- gallery --- */

.as-gallery {
  display: grid;
  gap: clamp(0.65rem, 1.5vw, 1.15rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 768px) { .as-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .as-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.as-gallery__item { margin: 0; }
.as-gallery__item--lead { grid-column: span 2; }
@media (min-width: 768px) { .as-gallery__item--lead { grid-row: span 2; } }

.as-gallery__frame {
  position: relative; overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: var(--as-r-lg);
  background: var(--as-cream-200);
  box-shadow: var(--as-shadow-sm);
}
.as-gallery__item--lead .as-gallery__frame { aspect-ratio: 4 / 3; }
@media (min-width: 768px) { .as-gallery__item--lead .as-gallery__frame { aspect-ratio: 1 / 1; } }

.as-gallery__frame img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.as-gallery__item:hover .as-gallery__frame img { transform: scale(1.06); }
.as-gallery figcaption {
  margin-top: 0.6rem;
  font-size: 0.76rem; line-height: 1.5; letter-spacing: 0.02em;
  color: var(--as-ink-500) !important;
}
@media (max-width: 480px) { .as-gallery figcaption { font-size: 0.7rem; } }

/* -------------------------------------------------------- contact panel -- */

.as-contact-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1.1rem;
  padding: 1.4rem 1.5rem;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid var(--as-line-light);
  border-radius: var(--as-r-lg);
  transition: border-color var(--as-t-base), background var(--as-t-base);
}
.as-contact-row:hover { background: rgba(255, 255, 255, 0.08); border-color: var(--as-gold-500); }
.as-contact-row__icon {
  width: 2.6rem; height: 2.6rem; border-radius: 50%;
  display: grid; place-items: center; flex: none;
  background: rgba(196, 162, 101, 0.2);
}
.as-contact-row__icon i { color: var(--as-gold-400) !important; font-size: 1.2rem; }
.as-contact-row__label {
  display: block; font-size: 0.64rem; font-weight: 700 !important; letter-spacing: 0.19em;
  text-transform: uppercase; color: var(--as-gold-400) !important; margin-bottom: 0.4rem;
}
.as-contact-row__value {
  display: block; font-family: var(--as-serif);
  font-size: clamp(1.05rem, 0.95rem + 0.4vw, 1.3rem); font-weight: 700 !important;
  color: #fff !important; line-height: 1.25; text-decoration: none !important;
  transition: color var(--as-t-fast); word-break: break-word;
}
a.as-contact-row__value:hover { color: var(--as-gold-400) !important; }
.as-contact-row__note {
  margin: 0.5rem 0 0; font-size: 0.83rem; line-height: 1.6;
  color: rgba(255, 255, 255, 0.62) !important;
}

/* ----------------------------------------------------------- pagination -- */

.as-pagination { margin-top: clamp(2rem, 4vw, 3.25rem); }
.as-pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.as-pagination .nav-links {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.45rem;
}
.as-pagination .page-numbers {
  display: inline-flex; align-items: center; gap: 0.4rem;
  min-width: 2.6rem; height: 2.6rem; padding: 0 0.9rem;
  justify-content: center;
  border: 1px solid var(--as-line);
  border-radius: 999px;
  font-size: 0.85rem; font-weight: 600;
  color: var(--as-ink-700) !important;
  text-decoration: none !important;
  background: var(--as-paper);
  transition: all var(--as-t-fast);
}
.as-pagination .page-numbers i { color: inherit !important; }
.as-pagination a.page-numbers:hover { border-color: var(--as-gold-500); color: var(--as-gold-700) !important; }
.as-pagination .page-numbers.current {
  background: var(--as-gold-500); border-color: var(--as-gold-500); color: #fff !important;
}
.as-pagination .page-numbers.dots { border-color: transparent; background: transparent; }

/* ============================================================================
   Site footer
   The theme's Tailwind base layer forces black text on p / span / li / strong,
   so the footer resets those to inherit first, then paints each piece. Every
   specific rule is prefixed with .as-footer so it outranks that reset.
   ========================================================================== */

.as-footer {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--as-ink-900);
  color: rgba(255, 255, 255, 0.72);
  font-family: var(--as-sans);
  padding-block: clamp(3rem, 7vw, 5.5rem) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.as-footer h2, .as-footer h3, .as-footer p, .as-footer span,
.as-footer li, .as-footer a, .as-footer strong, .as-footer b, .as-footer i {
  color: inherit !important;
}
.as-footer a { text-decoration: none; transition: color var(--as-t-fast); }

.as-footer__media { position: absolute; inset: 0; z-index: -1; }
.as-footer__media img { width: 100%; height: 100%; object-fit: cover; opacity: 0.16; display: block; }
.as-footer__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(26,22,18,0.82) 0%, rgba(26,22,18,0.9) 55%, rgba(26,22,18,0.97) 100%);
}

/* -- reservations call to action ------------------------------------------ */

.as-footer .as-footer__cta {
  max-width: 46rem;
  margin: 0 auto clamp(2.75rem, 6vw, 4.5rem);
  text-align: center;
}
.as-footer .as-footer__cta .as-eyebrow { justify-content: center; }
.as-footer .as-footer__cta .as-eyebrow::before { display: none; }

.as-footer .as-footer__title {
  font-family: var(--as-serif);
  font-size: clamp(1.6rem, 1.1rem + 2.1vw, 2.6rem);
  font-weight: 700 !important;
  line-height: 1.16;
  color: #fff !important;
  margin: 0 0 0.9rem;
  text-wrap: balance;
}
.as-footer .as-footer__lead {
  font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.05rem);
  line-height: 1.72;
  color: rgba(255, 255, 255, 0.7) !important;
  margin: 0 auto 1.75rem;
  max-width: 40rem;
}
.as-footer .as-footer__actions {
  display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: center;
}

.as-footer .as-footer__trust {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 0.6rem 2rem;
  margin: 1.9rem 0 0; padding: 1.5rem 0 0;
  list-style: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.as-footer .as-footer__trust li {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding-left: 0;
  font-size: 0.82rem; letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.62) !important;
}
.as-footer .as-footer__trust i { color: var(--as-gold-500) !important; font-size: 1rem; }

/* -- three column body ---------------------------------------------------- */

.as-footer .as-footer__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(2rem, 4vw, 3rem);
  padding-bottom: clamp(2.25rem, 5vw, 3.5rem);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (min-width: 640px) and (max-width: 999px) {
  .as-footer .as-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* the third column would otherwise sit alone in half a row */
  .as-footer .as-footer__grid > :nth-child(3) { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
  .as-footer .as-footer__grid { grid-template-columns: 0.9fr 1.05fr 1.15fr; gap: clamp(2rem, 4vw, 4rem); }
}

.as-footer .as-footer__heading {
  font-family: var(--as-sans);
  font-size: 0.68rem;
  font-weight: 700 !important;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--as-gold-400) !important;
  margin: 0 0 1.15rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.as-footer .as-footer__heading--center { text-align: center; }

.as-footer .as-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.1rem; }
.as-footer .as-footer__links li { padding-left: 0; }
.as-footer .as-footer__links a {
  display: block;
  padding: 0.4rem 0;
  font-size: 0.9rem; line-height: 1.5;
  color: rgba(255, 255, 255, 0.7) !important;
}
.as-footer .as-footer__links a:hover { color: var(--as-gold-400) !important; }

.as-footer .as-footer__contact { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.as-footer .as-footer__contact li {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.8rem;
  align-items: start; padding-left: 0;
}
.as-footer .as-footer__contact > li > i {
  width: 2rem; height: 2rem; border-radius: 50%;
  display: grid; place-items: center; flex: none;
  background: rgba(196, 162, 101, 0.16);
  color: var(--as-gold-400) !important;
  font-size: 1rem;
}
.as-footer .as-footer__contact .k {
  display: block;
  font-size: 0.62rem; font-weight: 700 !important; letter-spacing: 0.17em;
  text-transform: uppercase; color: rgba(255, 255, 255, 0.45) !important;
  margin-bottom: 0.2rem;
}
.as-footer .as-footer__contact .v,
.as-footer .as-footer__contact a {
  display: block;
  font-size: 0.94rem; line-height: 1.45;
  color: #fff !important;
  word-break: break-word;
}
.as-footer .as-footer__contact a:hover { color: var(--as-gold-400) !important; }

.as-footer .as-footer__operator {
  font-size: 0.88rem; line-height: 1.72;
  color: rgba(255, 255, 255, 0.68) !important;
  margin: 0 0 1.15rem;
}
.as-footer .as-footer__operator strong { color: #fff !important; font-weight: 600; }

.as-footer .as-footer__badges { list-style: none; margin: 0 0 1.15rem; padding: 0; display: grid; gap: 0.55rem; }
.as-footer .as-footer__badges li {
  display: flex; align-items: center; gap: 0.6rem; padding-left: 0;
  font-size: 0.82rem; color: rgba(255, 255, 255, 0.62) !important;
}
.as-footer .as-footer__badges i { color: var(--as-gold-500) !important; font-size: 1rem; flex: none; }

.as-footer .as-footer__more {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-size: 0.7rem; font-weight: 700 !important; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--as-gold-400) !important;
}
.as-footer .as-footer__more i { transition: transform var(--as-t-base); color: inherit !important; }
.as-footer .as-footer__more:hover { color: #fff !important; }
.as-footer .as-footer__more:hover i { transform: translateX(4px); }

/* -- partners ------------------------------------------------------------- */

.as-footer .as-footer__partners { padding-block: clamp(2.25rem, 5vw, 3.5rem); }
.as-footer .as-footer__partners .as-footer__heading {
  border-bottom: 0; padding-bottom: 0; margin-bottom: 1.5rem;
}
.as-footer .as-footer__logos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
@media (min-width: 520px) { .as-footer .as-footer__logos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 820px) { .as-footer .as-footer__logos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem; } }
@media (min-width: 1100px) { .as-footer .as-footer__logos { grid-template-columns: repeat(7, minmax(0, 1fr)); } }

.as-footer .as-footer__logo {
  display: grid; place-items: center;
  padding: 0.9rem 1rem;
  min-height: 4.5rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--as-r-md);
  transition: background var(--as-t-base), border-color var(--as-t-base), transform var(--as-t-base);
}
.as-footer .as-footer__logo:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(196, 162, 101, 0.45);
  transform: translateY(-2px);
}
.as-footer .as-footer__logo a { display: block; width: 100%; }
.as-footer .as-footer__logo img {
  display: block;
  width: 100%; max-width: 8rem; height: 2.4rem;
  object-fit: contain; margin-inline: auto;
  opacity: 0.85; transition: opacity var(--as-t-base);
}
.as-footer .as-footer__logo:hover img { opacity: 1; }

/* -- operator / ownership band -------------------------------------------- */

.as-footer .as-footer__entity {
  padding: clamp(1.5rem, 3vw, 2.25rem) 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin: 0;
  max-width: none;
  text-align: left;
  opacity: 1;
}
.as-footer .as-footer__entity-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem clamp(2rem, 5vw, 4rem);
}
@media (min-width: 860px) {
  .as-footer .as-footer__entity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.as-footer .as-footer__entity-title {
  font-family: var(--as-sans);
  font-size: 0.62rem; font-weight: 700 !important; letter-spacing: 0.19em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.42) !important;
  margin: 0 0 0.6rem;
  border-bottom: 0; padding-bottom: 0;
}
.as-footer .as-footer__entity p {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.78;
  color: rgba(255, 255, 255, 0.52) !important;
}
.as-footer .as-footer__entity a {
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: underline;
  text-decoration-color: rgba(196, 162, 101, 0.4);
  text-underline-offset: 2px;
}
.as-footer .as-footer__entity a:hover {
  color: var(--as-gold-400) !important;
  text-decoration-color: var(--as-gold-400);
}

/* -- bottom bar ----------------------------------------------------------- */

.as-footer .as-footer__bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 0.5rem 1.75rem;
  margin-top: clamp(1.75rem, 4vw, 2.5rem);
  padding: 1.4rem 0 clamp(1.75rem, 4vw, 2.5rem);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.as-footer .as-footer__bar p { margin: 0; font-size: 0.76rem; letter-spacing: 0.02em; line-height: 1.6; }
.as-footer .as-footer__copy { color: rgba(255, 255, 255, 0.6) !important; }
.as-footer .as-footer__note { color: rgba(255, 255, 255, 0.4) !important; }
.as-footer .as-footer__note a { color: rgba(255, 255, 255, 0.6) !important; text-decoration: underline; text-underline-offset: 2px; }
.as-footer .as-footer__note a:hover { color: var(--as-gold-400) !important; }
@media (max-width: 720px) {
  .as-footer .as-footer__bar { justify-content: center; text-align: center; }
}

/* -- back to top ---------------------------------------------------------- */

.as-totop {
  position: fixed; z-index: 50;
  left: 1.5rem; bottom: 1.75rem;
  width: 2.9rem; height: 2.9rem;
  display: grid; place-items: center;
  border: 0; border-radius: 50%;
  background: var(--as-gold-500);
  box-shadow: 0 12px 28px rgba(26, 22, 18, 0.35);
  cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity var(--as-t-base), transform var(--as-t-base), background var(--as-t-base), visibility var(--as-t-base);
}
.as-totop.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.as-totop:hover { background: var(--as-gold-600); transform: translateY(-3px); }
.as-totop i { color: #fff !important; font-size: 1.15rem; }
@media (max-width: 640px) {
  .as-totop { left: 1rem; bottom: 1.25rem; width: 2.6rem; height: 2.6rem; }
}

/* Legacy blocks that mu-plugins may still inject: keep them from rendering
   loose on the white body if the footer ever stops carrying the wording. */
body > .kl-fleet-entity,
body > .kl-entity-block,
body > .jhg-updated {
  max-width: 1280px;
  margin-inline: auto;
  padding: 1.25rem 1.5rem 2rem;
  font-size: 0.8rem;
  line-height: 1.75;
  color: var(--as-ink-500);
  text-align: center;
}

/* ============================================================================
   Site header — horizontal nav with descriptive dropdown panels, collapsing
   into a drawer below 1080px. Element rules are reset to inherit first because
   the theme's Tailwind base layer forces black on a / span / i / li.
   ========================================================================== */

.as-skip {
  position: absolute; left: 1rem; top: -4rem; z-index: 200;
  padding: 0.7rem 1.15rem; border-radius: 999px;
  background: var(--as-gold-500); color: #fff !important;
  font-size: 0.8rem; font-weight: 600; text-decoration: none;
  transition: top var(--as-t-base);
}
.as-skip:focus { top: 1rem; }

.as-header {
  /* Must outrank .as-navscrim's z-index (110): .as-header creates its own
     stacking context, so the drawer's z-index: 120 (nested inside it) only
     ever competes with the scrim if the header itself clears the scrim. */
  position: fixed; top: 0; left: 0; right: 0; z-index: 150;
  padding-block: 0.9rem;
  background: transparent;
  transition: background var(--as-t-base), padding var(--as-t-base), box-shadow var(--as-t-base);
  font-family: var(--as-sans);
  color: rgba(255, 255, 255, 0.85);
}
.as-header a, .as-header span, .as-header i, .as-header li,
.as-header button, .as-header p, .as-header strong {
  color: inherit !important;
}
.as-header a { text-decoration: none; }

.as-header.is-scrolled {
  background: rgba(26, 22, 18, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding-block: 0.55rem;
  box-shadow: 0 10px 34px rgba(26, 22, 18, 0.28);
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.as-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem;
}

.as-header__brand { flex: none; display: inline-flex; align-items: center; }
.as-header__brand img {
  display: block; width: auto; height: 3rem; max-width: 11rem;
  object-fit: contain; transition: height var(--as-t-base);
}
.as-header.is-scrolled .as-header__brand img { height: 2.5rem; }

/* -- desktop list --------------------------------------------------------- */

.as-nav { flex: 1; display: flex; justify-content: center; }
.as-nav__list {
  display: flex; align-items: center; list-style: none;
  margin: 0; padding: 0;
  gap: clamp(0.6rem, 1.5vw, 1.75rem);
}
.as-nav__item { position: relative; padding-left: 0; }

.as-nav__link {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.45rem 0;
  background: none; border: 0; cursor: pointer;
  font-family: var(--as-sans);
  font-size: 0.855rem; font-weight: 500 !important; letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.82) !important;
  white-space: nowrap;
  position: relative;
  transition: color var(--as-t-fast);
}
.as-nav__link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0.1rem;
  height: 1px; background: var(--as-gold-400);
  transform: scaleX(0); transform-origin: right;
  transition: transform var(--as-t-base);
}
.as-nav__link:hover, .as-nav__link[aria-current] { color: #fff !important; }
.as-nav__link:hover::after,
.as-nav__item.is-active > .as-nav__link::after,
.as-nav__item.is-open > .as-nav__link::after { transform: scaleX(1); transform-origin: left; }
.as-nav__item.is-active > .as-nav__link { color: #fff !important; }

.as-nav__caret {
  flex: none; font-size: 0.85rem; opacity: 0.6;
  transition: transform var(--as-t-fast), opacity var(--as-t-fast);
}
.as-nav__item.is-open > .as-nav__link .as-nav__caret,
.no-js .as-nav__item--parent:hover .as-nav__caret { opacity: 1; transform: rotate(180deg); }

.as-nav__disclose { display: none; background: none; border: 0; cursor: pointer; }

/* -- dropdown panel ------------------------------------------------------- */

.as-nav__panel {
  position: absolute; top: calc(100% + 1.1rem); left: 50%; z-index: 20;
  min-width: 22rem; max-width: calc(100vw - 3rem);
  padding: 0.5rem;
  background: rgba(26, 22, 18, 0.97);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--as-r-md);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.45);
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateX(-50%) translateY(-8px);
  transition: opacity 0.26s ease, transform 0.26s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.26s ease;
  max-height: calc(100vh - 8rem);
  overflow-y: auto;
}
/* Invisible bridges: the pointer stays "inside" the item while it travels
   from the trigger down into the panel, so nothing flickers on the way. */
.as-nav__panel::before {
  content: ""; position: absolute;
  top: -1.5rem; left: -1.5rem; right: -1.5rem; height: 1.5rem;
}
.as-nav__item--parent::after {
  content: ""; position: absolute;
  top: 100%; left: -1rem; right: -1rem; height: 0.9rem;
}

.as-nav__item--parent.is-open > .as-nav__panel,
.as-nav__item--parent:focus-within > .as-nav__panel,
.no-js .as-nav__item--parent:hover > .as-nav__panel {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* keep the last panels inside the viewport */
@media (min-width: 1080px) {
  .as-nav__item:nth-last-child(-n+2) > .as-nav__panel { left: auto; right: 0; transform: translateY(-6px); }
  .as-nav__item:nth-last-child(-n+2).is-open > .as-nav__panel,
  .as-nav__item:nth-last-child(-n+2):focus-within > .as-nav__panel,
  .no-js .as-nav__item:nth-last-child(-n+2):hover > .as-nav__panel { transform: translateY(0); }
}

.as-nav__panel-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.1rem; }
.as-nav__panel-item { padding-left: 0; }

.as-nav__panel-link {
  display: block; padding: 0.6rem 0.7rem;
  border-radius: var(--as-r-sm);
  transition: background var(--as-t-fast);
}
.as-nav__panel-link:hover, .as-nav__panel-link:focus-visible { background: rgba(255, 255, 255, 0.07); }
.as-nav__panel-link[aria-current] { background: rgba(196, 162, 101, 0.16); }

.as-nav__panel-title {
  display: block; font-size: 0.875rem; font-weight: 500 !important; line-height: 1.35;
  color: rgba(255, 255, 255, 0.92) !important;
  transition: color var(--as-t-fast);
}
.as-nav__panel-link:hover .as-nav__panel-title,
.as-nav__panel-link[aria-current] .as-nav__panel-title { color: var(--as-gold-400) !important; }
.as-nav__panel-desc {
  display: block; margin-top: 0.2rem;
  font-size: 0.735rem; line-height: 1.5;
  color: rgba(255, 255, 255, 0.46) !important;
}

/* -- header actions ------------------------------------------------------- */

.as-header__actions { flex: none; display: flex; align-items: center; gap: 0.75rem; }
.as-header .as-header__cta { padding: 0.7rem 1.25rem; font-size: 0.74rem; }
.as-header .as-header__cta,
.as-header .as-nav__cta { color: #fff !important; }

.as-navtoggle {
  display: none;
  flex-direction: column; justify-content: center; gap: 5px;
  width: 2.75rem; height: 2.75rem;
  padding: 0 0.6rem;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  cursor: pointer;
}
.as-navtoggle__bar {
  display: block; width: 100%; height: 2px; border-radius: 1px;
  background: #fff;
  transition: transform var(--as-t-base), opacity var(--as-t-base);
}
.as-navtoggle[aria-expanded="true"] .as-navtoggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.as-navtoggle[aria-expanded="true"] .as-navtoggle__bar:nth-child(2) { opacity: 0; }
.as-navtoggle[aria-expanded="true"] .as-navtoggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.as-nav__foot { display: none; }

/* -- drawer --------------------------------------------------------------- */

@media (max-width: 1079px) {
  .as-header__inner { gap: 0.6rem; }
  .as-header .as-header__cta span { display: none; }
  .as-header .as-header__cta { padding: 0.7rem 0.9rem; }
  .as-navtoggle { display: flex; }

  .as-nav {
    position: fixed; top: 0; right: 0; bottom: 0;
    z-index: 120;
    width: min(23rem, 88vw);
    display: block;
    padding: 5.5rem 1.25rem 2rem;
    background: var(--as-ink-900);
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: -24px 0 60px rgba(0, 0, 0, 0.4);
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform var(--as-t-base), visibility var(--as-t-base);
  }
  .as-nav.is-open { transform: translateX(0); visibility: visible; }

  .as-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .as-nav__item { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }

  .as-nav__link {
    width: 100%;
    justify-content: space-between;
    padding: 0.95rem 0.25rem;
    font-family: var(--as-serif);
    font-size: 1.02rem; font-weight: 700 !important; letter-spacing: 0;
    color: #fff !important;
    text-align: left;
    white-space: normal;
  }
  .as-nav__link::after { display: none; }
  .as-nav__caret { opacity: 0.7; font-size: 1rem; }

  .as-nav__panel {
    position: static; min-width: 0; max-width: none;
    padding: 0 0 0.55rem;
    background: none; border: 0; border-radius: 0; box-shadow: none;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    opacity: 1; visibility: visible; pointer-events: auto;
    transform: none;
    max-height: 0; overflow: hidden;
    transition: max-height var(--as-t-base);
  }
  .as-nav__panel::before, .as-nav__item--parent::after { display: none; }
  .as-nav__item--parent:focus-within > .as-nav__panel { transform: none; }
  .as-nav__item--parent:not(.is-open) > .as-nav__panel { max-height: 0; }
  .as-nav__item--parent.is-open > .as-nav__panel { max-height: 46rem; transform: none; }

  .as-nav__panel-link { padding: 0.55rem 0.25rem 0.55rem 0.9rem; border-left: 1px solid rgba(255,255,255,0.12); border-radius: 0; }
  .as-nav__panel-link:hover { background: rgba(255, 255, 255, 0.05); }
  .as-nav__panel-desc { font-size: 0.72rem; }

  .as-nav__foot {
    display: block;
    margin-top: 1.5rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }
  .as-nav .as-nav__cta { width: 100%; }
  .as-nav__foot-note {
    display: flex; align-items: center; gap: 0.5rem;
    margin: 0.9rem 0 0;
    font-size: 0.74rem; line-height: 1.5;
    color: rgba(255, 255, 255, 0.45) !important;
  }
  .as-nav__foot-note i { color: var(--as-gold-500) !important; }

  .as-navscrim {
    position: fixed; inset: 0; z-index: 110;
    background: rgba(26, 22, 18, 0.6);
    backdrop-filter: blur(2px);
  }
  .as-navscrim[hidden] { display: none; }
  body.as-nav-open { overflow: hidden; }
}

@media (max-width: 420px) {
  .as-header__brand img { height: 2.4rem; max-width: 8.5rem; }
  .as-header .as-header__cta { padding: 0.65rem 0.8rem; }
}

/* -- header legibility over bright hero photography ------------------------ */

.as-header::before {
  content: "";
  position: absolute; inset: 0 0 auto; height: 9rem;
  background: linear-gradient(to bottom, rgba(26, 22, 18, 0.6) 0%, rgba(26, 22, 18, 0) 100%);
  pointer-events: none; z-index: -1;
  transition: opacity var(--as-t-base);
}
.as-header.is-scrolled::before { opacity: 0; }

/* Anchor targets sit below the fixed header when jumped to from the menu. */
:target { scroll-margin-top: 6.5rem; }
#home, #about, #specifications, #cabins, #schedule, #itinerary,
#pricing, #destinations, #contact { scroll-margin-top: 6.5rem; }

/* Six top-level items, a logo and a CTA are tight on smaller laptops. */
@media (min-width: 1080px) and (max-width: 1240px) {
  .as-nav { min-width: 0; }
  .as-nav__link { font-size: 0.8rem; }
  .as-header .as-header__cta { padding: 0.65rem 1rem; font-size: 0.7rem; }
  .as-header__brand img { height: 2.6rem; max-width: 9.5rem; }
}

/* ============================================================================
   Single-column reading polish
   Applied after the base prose rules so it wins on equal specificity.
   ========================================================================== */

/* Headings get more air now that nothing competes for horizontal space. */
.as-prose h2 {
  font-size: clamp(1.55rem, 1.15rem + 1.5vw, 2.2rem);
  margin-top: 3.4rem;
  padding-top: 1.9rem;
}
.as-prose h3 { margin-top: 2.3rem; }

.as-prose p { margin-bottom: 1.25rem; }

/* The opening statement carries the page. */
.as-prose > p:first-child,
.as-prose .x-aeo p,
.as-prose p.x-aeo { font-size: clamp(1.1rem, 1rem + 0.45vw, 1.3rem); line-height: 1.62; }
.as-prose .x-aeo { padding: 1.35rem 1.6rem; margin-bottom: 2.25rem; }

/* Media reads as a deliberate break in the column, not an interruption. */
.as-prose > .as-figure { margin-block: 2.75rem; }
.as-prose > .as-figure figcaption { max-width: var(--as-measure); }
.as-prose > .as-figrow { margin-block: 2.75rem; }
.as-prose > .as-tablewrap { margin-block: 2.5rem; }
.as-prose > .as-callout { margin-block: 2.5rem; }
.as-prose > .as-inline-cta { margin-block: 3rem; }

/* Tables have room to breathe, so give the cells some. */
/* Tables have room to breathe on a wide band, so give the cells some. */
@media (min-width: 900px) {
  .as-tablewrap table { font-size: 0.95rem; }
  .as-tablewrap thead th { padding: 0.95rem 1.4rem; }
  .as-tablewrap tbody th,
  .as-tablewrap tbody td { padding: 1rem 1.4rem; }
  .as-tablewrap caption { padding: 1rem 1.4rem; }
}

/* Lists sit slightly indented from the measure so they read as a set. */
.as-prose ul, .as-prose ol { margin-bottom: 1.5rem; gap: 0.7rem; }

/* Long FAQ hubs split into two columns once there is room. */
.as-faq--split { display: grid; grid-template-columns: 1fr; gap: 0.6rem; align-content: start; }
@media (min-width: 900px) {
  .as-faq--split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem 1rem; }
  .as-faq--split .as-faq__item { align-self: start; }
}

@media (max-width: 640px) {
  .as-prose { font-size: 1rem; line-height: 1.75; }
  .as-prose > .as-figure,
  .as-prose > .as-figrow { margin-block: 2rem; }
  .as-prose h2 { margin-top: 2.6rem; padding-top: 1.5rem; }
}

/* ============================================================================
   Editorial sections — copy lives in the page template, laid out as
   alternating text/image rows with full-width data blocks beneath.
   ========================================================================== */

.as-sec { padding-block: clamp(2.75rem, 6vw, 5rem); background: var(--as-paper); }
.as-sec--cream { background: var(--as-cream-50); }
.as-sec--sand  { background: var(--as-cream-100); }

.as-sec__split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1.75rem, 4vw, 4rem);
  align-items: center;
}
@media (min-width: 900px) {
  .as-sec__split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .as-sec__split--flip .as-sec__media { order: 2; }
}
@media (min-width: 1280px) {
  .as-sec__split { gap: clamp(3rem, 5vw, 5.5rem); }
}

.as-sec__media { margin: 0; min-width: 0; }
.as-sec__frame {
  position: relative; overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: var(--as-r-xl);
  background: var(--as-cream-100);
  box-shadow: var(--as-shadow-md);
}
.as-sec__frame img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.as-sec__media:hover .as-sec__frame img { transform: scale(1.04); }
.as-sec__media figcaption {
  margin-top: 0.8rem;
  display: flex; gap: 0.6rem; align-items: baseline;
  font-size: 0.8rem; line-height: 1.6; color: var(--as-ink-500) !important;
}
.as-sec__media figcaption::before {
  content: ""; flex: none; width: 1.15rem; height: 1px;
  background: var(--as-gold-500); transform: translateY(-0.35em);
}

.as-sec__text { min-width: 0; }
.as-sec__solo { max-width: 100%; }

/* Headings here open a section rather than divide a scroll of prose, so they
   drop the rule the in-article headings carry. */
.as-sec .as-sec__title {
  font-family: var(--as-serif);
  font-size: clamp(1.5rem, 1.15rem + 1.5vw, 2.25rem);
  font-weight: 700 !important;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--as-ink-900) !important;
  margin: 0 0 1.1rem;
  padding-top: 0;
  border-top: 0;
  scroll-margin-top: 6.5rem;
  text-wrap: balance;
}
.as-sec .as-sec__title::after {
  content: ""; display: block;
  width: 3rem; height: 2px; margin-top: 0.9rem;
  background: var(--as-gold-500);
}
.as-sec__solo .as-sec__title { text-align: center; }
.as-sec__solo .as-sec__title::after { margin-inline: auto; }

.as-sec__text > :last-child, .as-sec__solo > :last-child { margin-bottom: 0 !important; }

/* Wide blocks — tables and long FAQ lists — sit below the split. */
.as-sec__wide { margin-top: clamp(1.75rem, 3.5vw, 2.75rem); }
.as-sec__wide > :first-child { margin-top: 0; }
.as-sec__wide .as-tablewrap { margin: 0 0 1rem; }
.as-sec__wide .as-tablewrap:last-child { margin-bottom: 0; }

/* Tick list used by section bullets */
.as-prose .as-ticks { list-style: none; margin: 1.35rem 0; padding: 0; display: grid; gap: 0.7rem; }
.as-prose .as-ticks > li { position: relative; padding-left: 1.85rem; line-height: 1.68; }
.as-prose .as-ticks > li::before {
  content: "";
  position: absolute; left: 0; top: 0.5em;
  width: 0.72rem; height: 0.38rem;
  border-left: 2px solid var(--as-gold-500);
  border-bottom: 2px solid var(--as-gold-500);
  transform: rotate(-45deg);
  border-radius: 1px;
}

/* ------------------------------------------------------------------ lead -- */

.as-lead { padding-block: clamp(2.5rem, 5vw, 4rem) 0; background: var(--as-paper); }
.as-lead__inner { max-width: 58rem; margin-inline: auto; text-align: center; }
.as-lead__text.x-aeo { background: none; border: 0; padding: 0; border-radius: 0; }
.as-lead__text {
  font-family: var(--as-serif);
  font-size: clamp(1.2rem, 1rem + 0.9vw, 1.7rem);
  line-height: 1.5;
  color: var(--as-ink-800) !important;
  margin: 0;
  text-wrap: pretty;
}
.as-lead__text strong { color: var(--as-ink-900) !important; font-weight: 700; }

.as-lead__facts {
  display: grid; gap: 1px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(1.75rem, 4vw, 2.75rem);
  background: var(--as-line);
  border: 1px solid var(--as-line);
  border-radius: var(--as-r-lg);
  overflow: hidden;
}
@media (min-width: 720px) { .as-lead__facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.as-lead__fact { background: var(--as-paper); padding: 1.25rem 1rem; }
.as-lead__fact .v {
  display: block; font-family: var(--as-serif);
  font-size: clamp(1.15rem, 1rem + 0.6vw, 1.5rem); font-weight: 700 !important;
  color: var(--as-gold-600) !important; line-height: 1.15; margin-bottom: 0.3rem;
}
.as-lead__fact .k {
  display: block; font-size: 0.66rem; font-weight: 600 !important; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--as-ink-500) !important; line-height: 1.4;
}


/* When the page has already made its own call to action, the footer is purely
   informational — it does not need the same opening weight. */
.as-footer--compact { padding-block: clamp(2.25rem, 5vw, 3.5rem) 0; }
.as-footer--compact .as-footer__grid { padding-top: 0; }

/* ============================================================================
   FAQ with category tabs
   Pills select a topic; every panel stays in the document so the whole FAQ
   remains crawlable and the FAQPage schema keeps matching.
   ========================================================================== */

.as-faqx__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: center;
  margin-bottom: 1.25rem;
}

.as-faqx__tab {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.7rem 1.1rem;
  border: 1px solid var(--as-line);
  border-radius: 999px;
  background: var(--as-paper);
  font-family: var(--as-sans);
  font-size: 0.84rem;
  font-weight: 600 !important;
  line-height: 1.2;
  color: var(--as-ink-700) !important;
  cursor: pointer;
  transition: all var(--as-t-base);
  white-space: nowrap;
}
.as-faqx__tab i { color: var(--as-gold-600) !important; font-size: 1.05rem; flex: none; }
.as-faqx__tab:hover {
  border-color: var(--as-gold-500);
  background: var(--as-cream-50);
  color: var(--as-ink-900) !important;
  transform: translateY(-1px);
}
.as-faqx__tab:focus-visible { outline: 2px solid var(--as-gold-500); outline-offset: 2px; }

.as-faqx__tab.is-active {
  background: var(--as-gold-800);
  border-color: var(--as-gold-800);
  color: #fff !important;
  box-shadow: var(--as-shadow-sm);
}
.as-faqx__tab.is-active:hover {
  background: var(--as-gold-700);
  border-color: var(--as-gold-700);
  color: #fff !important;
}
.as-faqx__tab.is-active .as-faqx__tab-label { color: #fff !important; }
.as-faqx__tab.is-active i { color: var(--as-gold-300) !important; }

.as-faqx__tab-count {
  display: inline-grid;
  place-items: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding-inline: 0.4rem;
  border-radius: 999px;
  background: var(--as-cream-100);
  font-size: 0.68rem;
  font-weight: 700 !important;
  color: var(--as-ink-600) !important;
  font-variant-numeric: tabular-nums;
}
.as-faqx__tab.is-active .as-faqx__tab-count {
  background: rgba(255, 255, 255, 0.22);
  color: #fff !important;
}

.as-faqx__total {
  text-align: center;
  margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
  font-size: 0.74rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--as-ink-500) !important;
}

.as-faqx__panels { max-width: 68rem; margin-inline: auto; }
.as-faqx__panel { display: none; }
.as-faqx__panel.is-active { display: block; animation: asFaqIn 0.32s cubic-bezier(0.16, 1, 0.3, 1) both; }

@keyframes asFaqIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}

.as-faqx__panel-title {
  font-family: var(--as-serif);
  font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.65rem);
  font-weight: 700 !important;
  color: var(--as-ink-900) !important;
  margin: 0 0 1.15rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--as-line);
  scroll-margin-top: 6.5rem;
}

/* Inside a tab panel the list is already scoped to one topic, so a single
   column reads better than splitting it — and matches the reference. */
.as-faqx .as-faq { margin: 0; }
.as-faqx .as-faq--split { grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
.as-faqx .as-faq__item { background: var(--as-paper); }

/* Without JavaScript every panel simply shows, so nothing is unreachable. */
.no-js .as-faqx__panel { display: block; margin-bottom: 2rem; }
.no-js .as-faqx__tabs { display: none; }

@media (max-width: 640px) {
  .as-faqx__tabs { gap: 0.4rem; }
  .as-faqx__tab { padding: 0.55rem 0.85rem; font-size: 0.78rem; gap: 0.4rem; }
  .as-faqx__tab-label { max-width: 11rem; overflow: hidden; text-overflow: ellipsis; }
  .as-faqx__tab i { font-size: 0.95rem; }
}
