/* ==========================================================================
   LUXURY V3 — ACCOMMODATION ARCHIVE
   --------------------------------------------------------------------------
   Supersedes the V2c interim treatment on every page EXCEPT the homepage.

   Two defects this file exists to correct
   ---------------------------------------
   1. V2c painted an image-light olive hero because the HOMEPAGE had no
      licensed photograph. The selector `.sw-hero--photo` was unscoped, so it
      also hid the genuine photography on every other template — which is why
      the accommodation archive rendered as a near-black block that reads like
      a missing image. Here the photograph is restored and leads the page.

   2. The Google Fonts @import sits at byte 17,085 of the Global Styles block,
      after ~17KB of rules. CSS ignores an @import that follows any rule, so
      Cormorant Garamond and Karla were never loading. Replaced below with
      @font-face, which is valid anywhere in a stylesheet.

   Position corrected on licensing: a property's own photography, on that
   property's own card, is correctly licensed for exactly that use. On this
   template the photography is present, carries real alt text, and has srcset
   to 2560w. So here photography leads and typography supports.

   Rollback: delete everything between the LUXURY V3 markers. V2/V2b/V2c and
   the platform are untouched.
   ========================================================================== */

/* --------------------------------------------------------------------------
   FONT LOADING — @font-face, NOT @import. Both faces are variable fonts, so
   one file per subset covers the whole weight range.
   -------------------------------------------------------------------------- */
@font-face{
  font-family:"Cormorant Garamond";font-style:normal;font-weight:300 700;font-display:swap;
  src:url(https://fonts.gstatic.com/s/cormorantgaramond/v21/co3bmX5slCNuHLi8bLeY9MK7whWMhyjYqXtK.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";font-style:normal;font-weight:300 700;font-display:swap;
  src:url(https://fonts.gstatic.com/s/cormorantgaramond/v21/co3bmX5slCNuHLi8bLeY9MK7whWMhyjYp3tKgS4.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:Karla;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(https://fonts.gstatic.com/s/karla/v33/qkBbXvYC6trAT7RVLtw.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:Karla;font-style:normal;font-weight:200 800;font-display:swap;
  src:url(https://fonts.gstatic.com/s/karla/v33/qkBbXvYC6trAT7RbLtyG5Q.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* the theme hard-codes these preset vars with !important; redefine the value */
:root{
  --wp--preset--font-family--inter-variable:Karla,"Helvetica Neue",Helvetica,sans-serif;
  --wp--preset--font-family--manrope:Karla,"Helvetica Neue",Helvetica,sans-serif;
  --wp--preset--font-family--instrument-serif:"Cormorant Garamond",Georgia,serif;
}

/* ---------- tokens: warmer, same brand hues ---------- */
:root{
  /* surfaces — sunlight on limestone, linen, timber */
  --v3-ivory:#F7F5EF;
  --v3-limestone:#F2EDE4;
  --v3-linen:#EAE3D6;
  --v3-stone:#D8D3C8;
  --v3-timber:#2E2A22;        /* warm dark, replaces cold charcoal */
  --v3-olive:#5F6238;
  --v3-olive-deep:#3D4026;
  --v3-gold:#A98A4B;

  /* ink — warm, not blue-black */
  --v3-ink:#221F19;
  --v3-ink-soft:#5A554A;
  --v3-ink-faint:#7C7566;
  --v3-on-dark:#F6F2E9;
  --v3-on-dark-soft:#D7D0C0;

  --v3-hair:rgba(34,31,25,.16);

  /* type — scaled UP. luxury is confidence, not miniaturisation */
  --v3-d1:clamp(2.85rem,6vw,5.75rem);   /* hero            46 -> 92 */
  --v3-d2:clamp(2.15rem,3.5vw,3.5rem);  /* section head    34 -> 56 */
  --v3-d3:clamp(1.65rem,2.2vw,2.15rem); /* dominant card   26 -> 34 */
  --v3-d4:clamp(1.35rem,1.5vw,1.6rem);  /* secondary card  22 -> 26 */
  --v3-lead:clamp(1.19rem,1.35vw,1.44rem);
  --v3-body:1.125rem;                    /* 18px — was ~15/16 */
  --v3-meta:0.9rem;                      /* 14.4px readable metadata */
  --v3-eyebrow:0.785rem;                 /* 12.5px, calmer tracking */

  --v3-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --v3-sans:Karla,"Helvetica Neue",Helvetica,Arial,sans-serif;

  --v3-gut:4.5rem;
  --v3-chapter:clamp(4.5rem,8vw,9.5rem);
  --v3-wrap:1280px;
}

/* ==========================================================================
   1. SCALE AND WARMTH — the page ground
   ========================================================================== */
body.post-type-archive-spw_accommodation,
body.page-template-accommodation,
.sw-safari-v200{
  background:var(--v3-ivory);
  color:var(--v3-ink);
}
.sw-safari-v200{
  font-family:var(--v3-sans);
  font-size:var(--v3-body);
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
}
.sw-safari-v200 p{font-size:var(--v3-body);line-height:1.72;color:var(--v3-ink-soft)}
.sw-safari-v200 .sw-lead{
  font-size:var(--v3-lead);line-height:1.58;color:var(--v3-ink);
  max-width:34ch;font-weight:300;
}
.sw-safari-v200 h1,.sw-safari-v200 h2,.sw-safari-v200 h3{
  font-family:var(--v3-serif);font-weight:400;color:var(--v3-ink);
  text-wrap:balance;letter-spacing:-.005em;
}
.sw-safari-v200 h2{font-size:var(--v3-d2);line-height:1.08;max-width:24ch;margin:0 0 1.1rem}
.sw-safari-v200 h3{font-size:var(--v3-d4);line-height:1.18}

/* eyebrows — readable, not microscopic */
.sw-safari-v200 .sw-eyebrow{
  font-family:var(--v3-sans);
  font-size:var(--v3-eyebrow);
  letter-spacing:.155em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--v3-olive);
  margin:0 0 1.15rem;
}
.sw-safari-v200 .sw-eyebrow::after{
  content:"";display:block;width:3.25rem;height:1px;
  background:var(--v3-gold);margin-top:1.05rem;
}
/* an empty eyebrow must not print a stray gold rule */
.sw-safari-v200 .sw-eyebrow:empty{display:none}

/* four distinct levels: display / body / metadata / tertiary */
.sw-safari-v200 .sw-wrap{max-width:var(--v3-wrap);margin-inline:auto;padding-inline:var(--v3-gut)}
.sw-safari-v200 .sw-section{padding-block:var(--v3-chapter)}
.sw-safari-v200 .sw-area-text{max-width:46rem;margin-bottom:clamp(2.75rem,4vw,4.25rem)}
.sw-safari-v200 .sw-area-text p{font-size:var(--v3-lead);line-height:1.6;color:var(--v3-ink-soft);max-width:44ch}

/* CTAs — confident, not timid */
.sw-safari-v200 .sw-btn .wp-element-button,
.sw-safari-v200 .spw-btn{
  font-family:var(--v3-sans);
  font-size:1rem;letter-spacing:.055em;text-transform:uppercase;font-weight:500;
  padding:1.08rem 2.3rem;border-radius:0;border:1px solid transparent;
  background:var(--v3-olive);color:#fff;text-decoration:none;
  display:inline-flex;align-items:center;min-height:52px;
  transition:background .45s cubic-bezier(.32,.72,0,1),color .45s cubic-bezier(.32,.72,0,1);
}
.sw-safari-v200 .sw-btn .wp-element-button:hover{background:var(--v3-olive-deep)}
.sw-safari-v200 .spw-btn--outline{
  background:transparent;border-color:var(--v3-hair);color:var(--v3-ink);
}

/* ==========================================================================
   2. HEADER — the entrance lobby, not the admin bar
   ========================================================================== */
.spurwing-header{
  background:var(--v3-ivory);
  border-bottom:1px solid var(--v3-hair);
}
/* full width, so the enquiry CTA is never clipped at the right edge */
.spurwing-header-inner{
  padding-block:1.6rem;
  max-width:none;
  padding-inline:clamp(1.375rem,3.5vw,4rem);
  align-items:center;
  gap:2rem;
}
.spurwing-wordmark{margin:0}
.spurwing-wordmark a{
  font-family:var(--v3-serif);font-weight:500;
  font-size:1.62rem;letter-spacing:.055em;
  color:var(--v3-ink);text-decoration:none;
}
.spurwing-brand-descriptor{
  font-family:var(--v3-sans);
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--v3-ink-faint);margin:.42rem 0 0;
}
.spurwing-primary-navigation .wp-block-navigation-item__label{
  font-family:var(--v3-sans);
  font-size:.945rem;letter-spacing:.015em;font-weight:400;
  color:var(--v3-ink);
}
.spurwing-primary-navigation .wp-block-navigation__container{gap:1.9rem}
.spurwing-primary-navigation .wp-block-navigation-item__content{
  padding-block:.55rem;text-decoration:none;
  transition:color .35s cubic-bezier(.32,.72,0,1);
}
.spurwing-primary-navigation .wp-block-navigation-item__content:hover{color:var(--v3-olive)}
/* calmer dropdown */
.spurwing-primary-navigation .wp-block-navigation__submenu-container{
  background:var(--v3-limestone);
  border:none;border-top:1px solid var(--v3-gold);
  box-shadow:0 22px 48px -28px rgba(46,42,34,.32);
  padding:1.1rem 0;min-width:17rem;
}
.spurwing-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  padding:.62rem 1.6rem;font-size:.92rem;
}
.spurwing-navigation-cta a,.spurwing-navigation-cta .wp-element-button{
  font-family:var(--v3-sans);font-size:.85rem;letter-spacing:.09em;
  text-transform:uppercase;font-weight:500;white-space:nowrap;
  background:var(--v3-olive);color:#fff;border-radius:0;
  padding:.85rem 1.5rem;text-decoration:none;
}

/* ==========================================================================
   3. HERO — immersive arrival. THE PHOTOGRAPH IS RESTORED.
   ========================================================================== */
.sw-hero--photo{
  position:relative;isolation:isolate;
  display:flex;align-items:flex-end;
  min-height:min(86vh,860px);
  padding-block:clamp(4rem,9vw,7.5rem);
  background:var(--v3-timber);            /* only ever seen while the image loads */
  overflow:hidden;
}
/* undo V2c: the media was display:none — put it back, full bleed */
.sw-hero--photo .sw-hero__media{
  display:block;position:absolute;inset:0;margin:0;z-index:0;
}
.sw-hero--photo .sw-hero__media figure,
.sw-hero--photo .sw-hero__img{margin:0;height:100%;width:100%}
.sw-hero--photo .sw-hero__media img{
  width:100%;height:100%;object-fit:cover;
  object-position:50% 42%;
  display:block;
}
/* warm scrim — readable type, photograph still breathes */
.sw-hero--photo::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(to top,rgba(30,27,20,.86) 0%,rgba(30,27,20,.52) 32%,rgba(30,27,20,.10) 62%,rgba(30,27,20,0) 100%),
    linear-gradient(to right,rgba(30,27,20,.46) 0%,rgba(30,27,20,0) 58%);
}
.sw-hero--photo .sw-wrap{position:relative;z-index:2;width:100%}
.sw-hero--photo .sw-hero__crumb{
  font-family:var(--v3-sans);font-size:.785rem;letter-spacing:.155em;
  text-transform:uppercase;color:var(--v3-on-dark-soft);margin:0 0 1.5rem;
}
.sw-hero--photo .sw-hero__crumb a{color:var(--v3-on-dark-soft);text-decoration:none}
.sw-hero--photo h1{
  font-family:var(--v3-serif);font-weight:400;
  font-size:var(--v3-d1);line-height:1.02;letter-spacing:-.012em;
  color:#FCFAF4;max-width:19ch;margin:0 0 1.5rem;
  text-shadow:0 1px 34px rgba(24,21,15,.4);
}
.sw-hero--photo .sw-lead{
  color:var(--v3-on-dark);max-width:40ch;
  font-size:var(--v3-lead);line-height:1.56;margin:0 0 2.5rem;
}
.sw-hero--photo .sw-btn .wp-element-button{
  background:var(--v3-on-dark);color:var(--v3-ink);
}
.sw-hero--photo .sw-btn .wp-element-button:hover{background:#fff}

/* the homepage keeps its image-light treatment — scoped, this time */
.sw-home-hero .sw-hero__media{display:none}

/* ==========================================================================
   4. B — QUIET PROOF STRIP
   ========================================================================== */
.sw-safari-v200 .sw-section.sw-r0-proof{
  background:var(--v3-limestone);
  padding-block:clamp(3.25rem,5vw,5rem);
}
.sw-r0-proof .sw-wrap > div{
  display:grid!important;grid-template-columns:repeat(4,1fr);
  gap:0;background:none;align-items:start;
}
.sw-r0-proof .sw-wrap > div > div{
  background:none;width:auto;max-width:none;flex-basis:auto!important;margin:0;
  padding:.1rem 2.25rem;border-left:1px solid var(--v3-hair);
}
.sw-r0-proof .sw-wrap > div > div:first-child{border-left:none;padding-left:0}
.sw-r0-proof h3{
  font-family:var(--v3-serif);font-weight:400;
  font-size:clamp(2.1rem,2.8vw,2.85rem);line-height:1;
  color:var(--v3-olive);margin:0 0 .6rem;
}
.sw-r0-proof p{
  font-size:var(--v3-meta);line-height:1.5;
  color:var(--v3-ink-soft);margin:0;max-width:24ch;
}

/* ==========================================================================
   5. C / F — ASYMMETRIC STORY + LARGE IMAGE
   ========================================================================== */
.sw-safari-v200 .sw-r0-split .sw-wrap{
  display:grid;grid-template-columns:1.32fr 1fr;
  gap:clamp(2.75rem,5vw,6rem);align-items:center;
}
.sw-safari-v200 .sw-r0-split--flip .sw-wrap{grid-template-columns:1fr 1.32fr}
.sw-safari-v200 .sw-r0-split--flip .sw-r0-split__media{order:2}
.sw-safari-v200 .sw-r0-split--flip .sw-r0-split__text{order:1}
.sw-safari-v200 .sw-r0-split__media figure{margin:0;aspect-ratio:4/5;overflow:hidden}
.sw-safari-v200 .sw-r0-split--flip .sw-r0-split__media figure{aspect-ratio:3/2}
.sw-safari-v200 .sw-r0-split__media img{width:100%;height:100%;object-fit:cover;display:block}
.sw-safari-v200 .sw-r0-split__text{max-width:38rem}
.sw-safari-v200 .sw-r0-split__text p{max-width:46ch}
.sw-safari-v200 .sw-section.sw-white{background:var(--v3-ivory)}

/* ==========================================================================
   6. D — DESTINATION PATHWAYS: one dominant, two supporting
   ========================================================================== */
.sw-safari-v200 .sw-section.sw-stone{background:var(--v3-linen)}
.sw-safari-v200 .sw-path-grid{
  display:grid!important;
  grid-template-columns:1.5fr 1fr;
  grid-template-rows:auto auto;
  gap:clamp(1.75rem,3vw,3rem) clamp(2rem,4vw,4rem);
}
.sw-safari-v200 .sw-path-card{
  background:none;border:none;border-radius:0;box-shadow:none;padding:0;margin:0;
  width:auto;max-width:none;flex-basis:auto!important;
}
/* 3.5.4: the one-dominant / two-supporting placement never applies to a path grid
   nested in a split's text column. There the page's own rule makes the grid one
   column (.sw-p5-slot, (0,5,0)); `grid-column:2` then created an implicit auto
   track that took 414 px and squeezed the declared 1fr to 0 px — /private-safaris/
   printed its first card one character per line. :where() adds no specificity. */
.sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(1){grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column}
.sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(2){grid-column:2;grid-row:1}
.sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(3){grid-column:2;grid-row:2}
.sw-safari-v200 .sw-path-card figure{margin:0 0 1.5rem;overflow:hidden}
.sw-safari-v200 .sw-path-card img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.1s cubic-bezier(.32,.72,0,1)}
.sw-safari-v200 .sw-path-card:hover img{transform:scale(1.035)}
.sw-safari-v200 .sw-path-card:nth-child(1) figure{aspect-ratio:4/5}
.sw-safari-v200 .sw-path-card:nth-child(n+2) figure{aspect-ratio:16/10}
.sw-safari-v200 .sw-path-card:nth-child(1) h3{font-size:var(--v3-d3)}
.sw-safari-v200 .sw-path-card h3{margin:0 0 .7rem}
.sw-safari-v200 .sw-path-card p{font-size:var(--v3-body);max-width:40ch;margin:0 0 1.1rem}
.sw-safari-v200 .sw-path-card:nth-child(n+2) p{font-size:1rem}
.sw-safari-v200 .sw-link-row a{
  font-family:var(--v3-sans);font-size:.875rem;letter-spacing:.115em;
  text-transform:uppercase;font-weight:500;color:var(--v3-olive);
  text-decoration:none;border-bottom:1px solid var(--v3-gold);
  padding-bottom:.28rem;
}

/* ==========================================================================
   7. E — FEATURED STAYS: luxury editorial spread, warm ground
   (was: masonry directory on black)
   ========================================================================== */
.sw-safari-v200 .sw-section.sw-r0-dark{
  background:var(--v3-limestone);        /* was near-black */
  color:var(--v3-ink);
}
.sw-r0-dark h2,.sw-r0-dark h3{color:var(--v3-ink)}
.sw-r0-dark .sw-eyebrow{color:var(--v3-olive)}
.sw-r0-dark .sw-area-text p{color:var(--v3-ink-soft)}

:where(.sw-safari-v200) .spw-accommodation-grid{
  display:grid!important;
  grid-template-columns:repeat(12,1fr);
  column-gap:clamp(2rem,3.5vw,3.5rem);
  row-gap:clamp(4rem,7vw,7.5rem);
}
/* kill every card affordance — these are editorial plates, not cards */
:where(.sw-safari-v200) .spw-accommodation-card{
  background:none;border:none;border-radius:0;box-shadow:none;padding:0;margin:0;
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  align-self:start;width:auto;max-width:none;
}
/* row 1: dominant left, secondary right — row 2 reverses — row 3 reverses back */
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(1){grid-column:1 / span 7}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(2){grid-column:8 / span 5}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(3){grid-column:1 / span 5}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(4){grid-column:6 / span 7}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(5){grid-column:1 / span 7}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(6){grid-column:8 / span 5}
/* declared ratios — this is what fixes the inconsistent floating heights */
:where(.sw-safari-v200) .spw-accommodation-card__image{
  margin:0 0 1.7rem;overflow:hidden;display:block;background:var(--v3-stone);
}
:where(.sw-safari-v200) .spw-accommodation-card__image img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s cubic-bezier(.32,.72,0,1);
}
:where(.sw-safari-v200) .spw-accommodation-card:hover .spw-accommodation-card__image img{transform:scale(1.04)}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(1) .spw-accommodation-card__image,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(4) .spw-accommodation-card__image,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(5) .spw-accommodation-card__image{aspect-ratio:3/2}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(2) .spw-accommodation-card__image,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(3) .spw-accommodation-card__image,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(6) .spw-accommodation-card__image{aspect-ratio:4/5}

:where(.sw-safari-v200) .spw-accommodation-card__body{display:flex;flex-direction:column;max-width:42ch}
/* metadata: readable sentence-scale, NOT tiny uppercase catalogue text */
:where(.sw-safari-v200) .spw-accommodation-card__location{
  order:1;font-family:var(--v3-sans);font-size:var(--v3-meta);
  letter-spacing:.085em;text-transform:uppercase;font-weight:500;
  color:var(--v3-olive);margin:0 0 .72rem;
}
:where(.sw-safari-v200) .spw-accommodation-card__title{
  order:2;font-family:var(--v3-serif);font-weight:400;
  font-size:var(--v3-d4);line-height:1.12;color:var(--v3-ink);
  margin:0 0 .5rem;
}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(1) .spw-accommodation-card__title,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(4) .spw-accommodation-card__title,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(5) .spw-accommodation-card__title{font-size:var(--v3-d3)}
:where(.sw-safari-v200) .spw-accommodation-card__type{
  order:3;font-family:var(--v3-sans);font-size:var(--v3-meta);
  color:var(--v3-ink-faint);letter-spacing:.015em;text-transform:none;
  margin:0 0 1.05rem;
}
/* one restrained descriptor — never a long uppercase excerpt */
:where(.sw-safari-v200) .spw-accommodation-card__descriptor{
  order:4;font-size:1.0625rem;line-height:1.66;color:var(--v3-ink-soft);
  margin:0 0 1.25rem;text-transform:none;letter-spacing:normal;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(2) .spw-accommodation-card__descriptor,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(3) .spw-accommodation-card__descriptor,
:where(.sw-safari-v200) .spw-accommodation-card:nth-child(6) .spw-accommodation-card__descriptor{-webkit-line-clamp:2}
/* labels are tertiary — present, quiet */
:where(.sw-safari-v200) .spw-accommodation-card__labels{
  order:5;font-size:.82rem;letter-spacing:.06em;color:var(--v3-ink-faint);
  margin:0 0 1.15rem;text-transform:uppercase;
}
:where(.sw-safari-v200) .spw-accommodation-card .spw-btn{
  order:6;align-self:flex-start;background:none;border:none;padding:0;min-height:0;
  font-family:var(--v3-sans);font-size:.875rem;letter-spacing:.115em;
  text-transform:uppercase;font-weight:500;color:var(--v3-ink);
  border-bottom:1px solid var(--v3-gold);padding-bottom:.3rem;
}

/* ==========================================================================
   8. G — COMPLETE COLLECTION: two-column luxury index
   (was: three-column WordPress masonry)
   ========================================================================== */
.sw-v2-browse{background:var(--v3-ivory)}
.spw-acm-catalogue{max-width:none}
.spw-acm-filters{
  display:flex;flex-wrap:wrap;gap:1.6rem 2.1rem;align-items:flex-end;
  padding:1.9rem 0 2.1rem;margin:0 0 clamp(3rem,5vw,4.5rem);
  border-top:1px solid var(--v3-hair);border-bottom:1px solid var(--v3-hair);
}
.spw-acm-filter{display:flex;flex-direction:column;gap:.5rem;min-width:13rem;flex:1 1 13rem}
.spw-acm-filter > span{
  font-family:var(--v3-sans);font-size:.735rem;letter-spacing:.155em;
  text-transform:uppercase;font-weight:500;color:var(--v3-ink-faint);
}
.spw-acm-filter select{
  appearance:none;-webkit-appearance:none;
  font-family:var(--v3-sans);font-size:1rem;color:var(--v3-ink);
  background:transparent;border:none;border-bottom:1px solid var(--v3-ink);
  border-radius:0;padding:.55rem 1.6rem .6rem 0;min-height:44px;width:100%;
  background-image:linear-gradient(45deg,transparent 50%,var(--v3-olive) 50%),
                   linear-gradient(135deg,var(--v3-olive) 50%,transparent 50%);
  background-position:calc(100% - 9px) calc(50% + 1px),calc(100% - 4px) calc(50% + 1px);
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
.spw-acm-filter-submit{align-self:flex-end}
.spw-acm-results-head{
  display:flex;justify-content:space-between;align-items:baseline;
  margin:0 0 2.25rem;
}
.spw-acm-results-count{font-size:var(--v3-meta);color:var(--v3-ink-faint);letter-spacing:.04em}
.spw-acm-results-count strong{font-family:var(--v3-serif);font-size:1.4rem;font-weight:400;color:var(--v3-ink)}

.spw-acm-grid{
  display:grid!important;
  grid-template-columns:repeat(2,1fr);       /* two generous columns, not three narrow */
  column-gap:clamp(2.25rem,4vw,4.25rem);
  row-gap:clamp(3.25rem,5.5vw,5.75rem);
}
.spw-acm-card{
  background:none;border:none;border-radius:0;box-shadow:none;padding:0;margin:0;
  display:flex;flex-direction:column;align-self:start;width:auto;max-width:none;
}
.spw-acm-card__image{
  display:block;margin:0 0 1.45rem;overflow:hidden;
  aspect-ratio:3/2;background:var(--v3-stone);
}
.spw-acm-card__image img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s cubic-bezier(.32,.72,0,1);
}
.spw-acm-card:hover .spw-acm-card__image img{transform:scale(1.04)}
/* one full-width interruption per page to break the rhythm */
.spw-acm-card:nth-child(7){grid-column:1 / -1;display:grid;
  grid-template-columns:1.45fr 1fr;gap:clamp(2rem,3.5vw,3.5rem);align-items:center}
.spw-acm-card:nth-child(7) .spw-acm-card__image{aspect-ratio:21/9;margin:0}
.spw-acm-card:nth-child(7) .spw-acm-card__title{font-size:var(--v3-d3)}
.spw-acm-card:nth-child(7) .spw-acm-card__descriptor{-webkit-line-clamp:3}

.spw-acm-card__body{display:flex;flex-direction:column;max-width:44ch}
.spw-acm-card__meta{
  font-family:var(--v3-sans);font-size:var(--v3-meta);letter-spacing:.085em;
  text-transform:uppercase;font-weight:500;color:var(--v3-olive);margin:0 0 .7rem;
}
.spw-acm-card__title{
  font-family:var(--v3-serif);font-weight:400;font-size:var(--v3-d4);
  line-height:1.14;margin:0 0 .72rem;
}
.spw-acm-card__title a{color:var(--v3-ink);text-decoration:none}
.spw-acm-card__title a:hover{color:var(--v3-olive)}
/* max 1-2 sentences, real sentence case */
.spw-acm-card__descriptor{
  font-size:1.0625rem;line-height:1.66;color:var(--v3-ink-soft);margin:0 0 1.15rem;
  text-transform:none;letter-spacing:normal;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
/* understated View stay */
.spw-acm-card__link{margin:0}
.spw-acm-card__link a{
  font-family:var(--v3-sans);font-size:.85rem;letter-spacing:.115em;
  text-transform:uppercase;font-weight:500;color:var(--v3-ink);
  text-decoration:none;border-bottom:1px solid var(--v3-gold);padding-bottom:.3rem;
}
.spw-acm-card__link a:hover{color:var(--v3-olive)}

.spw-acm-pagination{
  display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;
  margin-top:clamp(3.5rem,6vw,5.5rem);padding-top:2.25rem;
  border-top:1px solid var(--v3-hair);
}
.spw-acm-pagination a,.spw-acm-pagination span{
  font-family:var(--v3-sans);font-size:.95rem;
  min-width:46px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;color:var(--v3-ink-soft);border:1px solid transparent;
}
.spw-acm-pagination a:hover{color:var(--v3-ink);border-color:var(--v3-hair)}
.spw-acm-pagination .current{color:var(--v3-ink);border-color:var(--v3-ink)}

/* ==========================================================================
   9. H — FULL-BLEED ENQUIRY MOMENT
   ========================================================================== */
.sw-safari-v200 .sw-section.sw-r0-close{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;align-items:center;
  min-height:min(64vh,620px);
  padding-block:clamp(4.5rem,8vw,7.5rem);
  background:var(--v3-olive-deep);
}
.sw-r0-close .sw-v2-photo__img{position:absolute;inset:0;margin:0;z-index:0}
.sw-r0-close .sw-v2-photo__img figure{margin:0;height:100%;width:100%}
.sw-r0-close .sw-v2-photo__img img{width:100%;height:100%;object-fit:cover;display:block;object-position:50% 45%}
.sw-r0-close::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to right,rgba(28,25,18,.84) 0%,rgba(28,25,18,.58) 45%,rgba(28,25,18,.20) 100%);
}
.sw-r0-close .sw-wrap{position:relative;z-index:2;width:100%}
.sw-r0-close .sw-eyebrow{color:var(--v3-on-dark-soft)}
.sw-r0-close .sw-eyebrow::after{background:var(--v3-gold)}
.sw-r0-close h2{color:#FCFAF4;max-width:26ch;font-size:clamp(2rem,3.2vw,3.15rem)}
.sw-r0-close p{color:var(--v3-on-dark);max-width:42ch;font-size:var(--v3-lead);line-height:1.58}
.sw-r0-close .sw-btn .wp-element-button{background:var(--v3-on-dark);color:var(--v3-ink)}
.sw-r0-close .sw-btn .wp-element-button:hover{background:#fff}

/* ==========================================================================
   10. RESPONSIVE — recompose, do not merely stack
   ========================================================================== */
@media (max-width:1024px){
  :root{--v3-gut:2.5rem}
  .sw-r0-proof .sw-wrap > div{grid-template-columns:repeat(2,1fr);row-gap:2.25rem}
  .sw-r0-proof .sw-wrap > div > div:nth-child(odd){border-left:none;padding-left:0}
  /* pathways: dominant on top, two side by side beneath.
     3.5.4: these were unscoped and reached every page with a path grid
     (/destinations/, /dinokeng/, /garden-route/, /safaris/, /travel-guide/).
     :where() scopes them to this layer's wrapper at unchanged specificity. */
  :where(.sw-safari-v200) .sw-path-grid:where(:not(.sw-r0-split__text *)){grid-template-columns:1fr 1fr}
  :where(.sw-safari-v200) .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(1){grid-column:1 / -1;grid-row:1}
  :where(.sw-safari-v200) .sw-path-card:nth-child(1) figure{aspect-ratio:16/9}
  :where(.sw-safari-v200) .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(2){grid-column:1;grid-row:2}
  :where(.sw-safari-v200) .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(3){grid-column:2;grid-row:2}
  .sw-r0-split .sw-wrap,
  .sw-r0-split--flip .sw-wrap{grid-template-columns:1fr;gap:2.5rem}
  .sw-r0-split--flip .sw-r0-split__media,
  .sw-r0-split--flip .sw-r0-split__text{order:initial}
  .sw-r0-split__media figure,
  .sw-r0-split--flip .sw-r0-split__media figure{aspect-ratio:16/9}
  .sw-hero--photo{min-height:min(72vh,680px)}
}

@media (max-width:820px){
  .spw-acm-card:nth-child(7){grid-template-columns:1fr;gap:1.45rem}
  .spw-acm-card:nth-child(7) .spw-acm-card__image{aspect-ratio:16/9;margin:0 0 1.45rem}
}

@media (max-width:600px){
  :root{
    --v3-gut:1.375rem;
    --v3-body:1.0625rem;
    --v3-chapter:clamp(3.25rem,11vw,4.5rem);
  }
  .spurwing-header-inner{padding-inline:1.375rem;padding-block:1.1rem}
  .spurwing-wordmark a{font-size:1.4rem}
  /* hero: portrait crop, not a letterboxed desktop frame */
  .sw-hero--photo{min-height:min(92vh,760px);align-items:flex-end}
  .sw-hero--photo .sw-hero__media img{object-position:52% 38%}
  .sw-hero--photo h1{max-width:15ch}
  .sw-hero--photo .sw-lead{max-width:32ch;margin-bottom:1.85rem}
  /* proof strip: 2x2 */
  .sw-r0-proof .sw-wrap > div{grid-template-columns:1fr 1fr;row-gap:1.85rem}
  .sw-r0-proof .sw-wrap > div > div{padding:.1rem 1.1rem}
  .sw-r0-proof h3{font-size:1.95rem}
  /* pathways: single column, dominant keeps its portrait crop */
  :where(.sw-safari-v200) .sw-path-grid{grid-template-columns:1fr;gap:2.75rem}
  :where(.sw-safari-v200) .sw-path-card:nth-child(n){grid-column:1;grid-row:auto}
  :where(.sw-safari-v200) .sw-path-card:nth-child(1) figure{aspect-ratio:4/5}
  :where(.sw-safari-v200) .sw-path-card:nth-child(n+2) figure{aspect-ratio:3/2}
  /* featured: single column, ratios alternate so it never reads as a list */
  :where(.sw-safari-v200) .spw-accommodation-grid{grid-template-columns:1fr;row-gap:3.5rem}
  :where(.sw-safari-v200) .spw-accommodation-card:nth-child(n){grid-column:1}
  :where(.sw-safari-v200) .spw-accommodation-card:nth-child(odd) .spw-accommodation-card__image{aspect-ratio:4/5}
  :where(.sw-safari-v200) .spw-accommodation-card:nth-child(even) .spw-accommodation-card__image{aspect-ratio:3/2}
  :where(.sw-safari-v200) .spw-accommodation-card__body{max-width:none}
  /* catalogue: single column */
  .spw-acm-grid{grid-template-columns:1fr;row-gap:3rem}
  .spw-acm-card:nth-child(7){grid-column:1}
  .spw-acm-card__body{max-width:none}
  .spw-acm-filters{flex-direction:column;align-items:stretch;gap:1.4rem}
  .spw-acm-filter{min-width:0;flex:none}
  .sw-r0-close{min-height:min(74vh,640px)}
  .sw-r0-close::before{
    background:linear-gradient(to top,rgba(28,25,18,.88) 0%,rgba(28,25,18,.52) 48%,rgba(28,25,18,.18) 100%);
  }
}

@media (prefers-reduced-motion:reduce){
  .sw-safari-v200 *,.spurwing-header *{transition:none!important;animation:none!important}
  :where(.sw-safari-v200) .spw-accommodation-card:hover .spw-accommodation-card__image img,
  .spw-acm-card:hover .spw-acm-card__image img,
  .sw-path-card:hover img{transform:none}
}
/* ===================== end LUXURY V3 ===================== */

/* ==========================================================================
   11. SPECIFICITY LAYER — required, not decorative
   --------------------------------------------------------------------------
   The v2.0 generation CSS already on the site is far more specific than a
   plain class selector. Measured on this page:

     :is(.sw-trade-v170,…,.sw-safari-v200,…) .sw-hero h1   (0,2,1)
     :is(…) .sw-section h2                                  (0,2,1)
     .sw-safari-v200 .sw-path-card h3                       (0,2,1)
     .sw-safari-v200 .sw-hero .sw-lead                      (0,3,0)
     .sw-safari-v200 .sw-path-grid > .wp-block-column       (0,2,1)  + margin !important
     .sw-safari-v200 .sw-eyebrow                            font-size:12px !important

   `:is()` takes the specificity of its MOST specific argument, which is what
   made the hero h1 resolve to Manrope/68px despite the rules above. Prefixing
   with `body` buys one element unit and wins without an !important war.
   !important appears below ONLY where the existing rule already uses it.
   ========================================================================== */

/* --- display type: the serif finally applies --- */
body .sw-safari-v200 .sw-hero h1{
  font-family:var(--v3-serif);font-size:var(--v3-d1);font-weight:400;
  line-height:1.02;letter-spacing:-.012em;
  max-width:19ch;margin:0 0 1.5rem;text-wrap:balance;
}
/* 3.5.4: the on-dark colour only where a photograph sits behind the copy.
   `.sw-safari-v200` is shared by eight pages; five have a plain paper hero
   (/private-safaris/, /safari-packages/, /madikwe-safaris/,
   /greater-kruger-safaris/, /dinokeng-safaris/) where #FCFAF4 on paper was
   invisible (1.04:1). :where() keeps the specificity at (0,2,2). */
body .sw-safari-v200 .sw-hero:where(.sw-hero--photo) h1{color:#FCFAF4}
body .sw-safari-v200 .sw-section h2{
  font-family:var(--v3-serif);font-size:var(--v3-d2);font-weight:400;
  line-height:1.08;letter-spacing:-.005em;color:var(--v3-ink);
  max-width:24ch;margin:0 0 1.1rem;text-wrap:balance;
}
body .sw-safari-v200 .sw-section.sw-r0-close h2{color:#FCFAF4;max-width:26ch}
body .sw-safari-v200 .sw-section.sw-r0-close p{color:var(--v3-on-dark)!important;max-width:42ch}

/* --- lead --- */
body .sw-safari-v200 .sw-hero .sw-lead{
  font-size:var(--v3-lead);line-height:1.56;max-width:40ch;
  margin:0 0 2.5rem;font-weight:300;
}
body .sw-safari-v200 .sw-hero:where(.sw-hero--photo) .sw-lead{color:var(--v3-on-dark)}

/* --- eyebrow: readable, warm, serif-adjacent tracking --- */
body .sw-safari-v200 .sw-eyebrow{
  font-family:var(--v3-sans)!important;
  font-size:var(--v3-eyebrow)!important;
  letter-spacing:.155em;font-weight:500;
  color:var(--v3-olive);margin:0 0 1.15rem;line-height:1.3;
}
body .sw-safari-v200 .sw-r0-close .sw-eyebrow{color:var(--v3-on-dark-soft)}

/* --- D: pathways become one dominant + two supporting, with no white boxes --- */
body .sw-safari-v200 .sw-path-grid{
  grid-template-columns:1.5fr 1fr;
  grid-template-rows:auto auto;
  gap:clamp(1.75rem,3vw,3rem) clamp(2rem,4vw,4rem);
  margin:0;
}
body .sw-safari-v200 .sw-path-grid > .wp-block-column,
body .sw-safari-v200 .sw-path-card{
  background:none!important;border:0!important;
  padding:0!important;margin:0!important;min-width:0;
}
body .sw-safari-v200 .sw-path-card h3{
  font-family:var(--v3-serif);font-weight:400;
  font-size:var(--v3-d4);line-height:1.18;margin:0 0 .7rem;color:var(--v3-ink);
}
body .sw-safari-v200 .sw-path-card:nth-child(1) h3{font-size:var(--v3-d3)}
body .sw-safari-v200 .sw-path-card p{
  font-size:var(--v3-body);line-height:1.7;color:var(--v3-ink-soft);margin:0 0 1.1rem;
}
body .sw-safari-v200 .sw-path-card:nth-child(n+2) p{font-size:1rem}

/* --- CTAs: the markup uses wp-block-button__link, not wp-element-button --- */
body .sw-safari-v200 .sw-btn .wp-block-button__link,
body .sw-safari-v200 .sw-btn .wp-element-button{
  background:var(--v3-olive);color:#fff;
  border-radius:0!important;border:1px solid transparent;
  font-family:var(--v3-sans);font-size:1rem;font-weight:500;
  letter-spacing:.055em;text-transform:uppercase;
  padding:1.08rem 2.3rem;min-height:52px;
  display:inline-flex;align-items:center;justify-content:center;
}
body .sw-safari-v200 .sw-hero:where(.sw-hero--photo) .sw-btn .wp-block-button__link,
body .sw-safari-v200 .sw-hero:where(.sw-hero--photo) .sw-btn .wp-element-button,
body .sw-safari-v200 .sw-r0-close .sw-btn .wp-block-button__link,
body .sw-safari-v200 .sw-r0-close .sw-btn .wp-element-button{
  background:var(--v3-on-dark);color:var(--v3-ink);
}

/* --- body copy scale --- */
body .sw-safari-v200 .sw-section p{font-size:var(--v3-body);line-height:1.72;color:var(--v3-ink-soft)}
body .sw-safari-v200 .sw-area-text p{font-size:var(--v3-lead);line-height:1.6;max-width:44ch}

/* --- E: featured plates, at winning specificity --- */
body .sw-safari-v200 .spw-accommodation-card__title{
  font-family:var(--v3-serif);font-weight:400;font-size:var(--v3-d4);line-height:1.12;
}
body .sw-safari-v200 .spw-accommodation-card:nth-child(1) .spw-accommodation-card__title,
body .sw-safari-v200 .spw-accommodation-card:nth-child(4) .spw-accommodation-card__title,
body .sw-safari-v200 .spw-accommodation-card:nth-child(5) .spw-accommodation-card__title{
  font-size:var(--v3-d3);
}
body .sw-safari-v200 .spw-accommodation-card__descriptor{
  font-size:1.0625rem;line-height:1.66;color:var(--v3-ink-soft);text-transform:none;letter-spacing:normal;
}
body .sw-safari-v200 .spw-acm-card__title{
  font-family:var(--v3-serif);font-weight:400;font-size:var(--v3-d4);line-height:1.14;
}
body .sw-safari-v200 .spw-acm-card__descriptor{
  font-size:1.0625rem;line-height:1.66;color:var(--v3-ink-soft);text-transform:none;letter-spacing:normal;
}

/* --- E: the featured grid itself. Existing rules are (0,2,0):
       .sw-v2-featured .spw-accommodation-grid  { repeat(3,minmax(0,1fr)) }
       .sw-r0-dark     .spw-accommodation-grid  { repeat(3,minmax(0,1fr)) }
   plus 2-col and 1-col variants in media queries. A plain
   .spw-accommodation-grid (0,1,0) loses, so the 12-column track never
   applied and the browser fell back to implicit auto tracks — which is
   why seven columns measured 0px. Prefixed to (0,3,1) below. --- */
body .sw-safari-v200 .sw-r0-dark .spw-accommodation-grid,
body .sw-safari-v200 .sw-v2-featured .spw-accommodation-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  column-gap:clamp(2rem,3.5vw,3.5rem);
  row-gap:clamp(4rem,7vw,7.5rem);
  margin-top:clamp(2.5rem,4vw,4rem);
}

@media (max-width:1024px){
  body .sw-safari-v200 .sw-r0-dark .spw-accommodation-grid,
  body .sw-safari-v200 .sw-v2-featured .spw-accommodation-grid{
    grid-template-columns:repeat(12,1fr);
    row-gap:clamp(3rem,6vw,5rem);
  }
}
@media (max-width:600px){
  body .sw-safari-v200 .sw-r0-dark .spw-accommodation-grid,
  body .sw-safari-v200 .sw-v2-featured .spw-accommodation-grid{
    grid-template-columns:1fr;
    row-gap:3.5rem;
  }
}

/* --- E: the section was built for a near-black ground, so its text colours
       are all light. Now that the ground is warm limestone they must invert.
       `.sw-r0-dark .sw-area-text p:not(.sw-eyebrow)` is (0,3,1) — beaten here
       at (0,4,2). The wrap stays a named-area grid ("text link" / "grid"),
       which is a good structure; only its spacing is tightened. --- */
body .sw-safari-v200 .sw-r0-dark .sw-area-text p:not(.sw-eyebrow),
body .sw-safari-v200 .sw-r0-dark > .sw-wrap > p:not(.sw-eyebrow){
  color:var(--v3-ink-soft);
}
body .sw-safari-v200 .sw-r0-dark .sw-v2-viewall a{
  color:var(--v3-ink);border-bottom:1px solid var(--v3-gold);
  font-family:var(--v3-sans);font-size:.875rem;font-weight:500;
  letter-spacing:.115em;text-transform:uppercase;
}
body .sw-safari-v200 .sw-r0-dark .sw-v2-viewall a:hover{color:var(--v3-olive)}
/* the named-area grid already supplies the gap under the intro */
body .sw-safari-v200 .sw-r0-dark .sw-area-text{margin-bottom:0}

/* --- G: the masonry rotation. The plugin CSS cycles image ratios:
       .spw-acm-card:nth-child(4n+1) .spw-acm-card__image { 4/5 }   (0,3,0)
       .spw-acm-card:nth-child(4n+4) .spw-acm-card__image { 1/1 }   (0,3,0)
   In a two-column index that is what makes the columns float at
   inconsistent heights. Replaced with ONE calm ratio plus a single
   deliberate full-width interruption. Beaten at (0,4,1). --- */
body .sw-safari-v200 .spw-acm-card:nth-child(n) .spw-acm-card__image{
  aspect-ratio:3/2;border-radius:0;overflow:hidden;display:block;
  margin:0 0 1.45rem;background:var(--v3-stone);
}
body .sw-safari-v200 .spw-acm-card:nth-child(7) .spw-acm-card__image{
  aspect-ratio:21/9;margin:0;
}
@media (max-width:820px){
  body .sw-safari-v200 .spw-acm-card:nth-child(7) .spw-acm-card__image{
    aspect-ratio:16/9;margin:0 0 1.45rem;
  }
}

/* --- G: filter controls. Underline fields, not boxed inputs. --- */
body .sw-safari-v200 .spw-acm-filters select,
body .sw-safari-v200 .spw-acm-filter select{
  appearance:none;-webkit-appearance:none;
  font-family:var(--v3-sans);font-size:1rem;color:var(--v3-ink);
  background-color:transparent;
  border:0;border-bottom:1px solid var(--v3-ink);
  border-radius:0;padding:.55rem 1.6rem .6rem 0;min-height:44px;width:100%;
  background-image:linear-gradient(45deg,transparent 50%,var(--v3-olive) 50%),
                   linear-gradient(135deg,var(--v3-olive) 50%,transparent 50%);
  background-position:calc(100% - 9px) calc(50% + 1px),calc(100% - 4px) calc(50% + 1px);
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
body .sw-safari-v200 .spw-acm-filters select:focus-visible,
body .sw-safari-v200 .spw-acm-filter select:focus-visible{
  outline:2px solid var(--v3-olive);outline-offset:3px;
}
body .sw-safari-v200 .spw-acm-filter-submit{
  background:var(--v3-olive);color:#fff;
  border:0;border-radius:0;
  font-family:var(--v3-sans);font-size:.875rem;font-weight:500;
  letter-spacing:.09em;text-transform:uppercase;
  padding:1rem 2.1rem;min-height:48px;cursor:pointer;
  transition:background .45s cubic-bezier(.32,.72,0,1);
}
body .sw-safari-v200 .spw-acm-filter-submit:hover{background:var(--v3-olive-deep)}
body .sw-safari-v200 .spw-acm-results-count{
  font-family:var(--v3-sans);font-size:var(--v3-meta);color:var(--v3-ink-faint);
}

/* --- G: the deliberate stagger. `.spw-acm-card:nth-child(even)` carries
       transform:translateY(4.5rem) (0,2,0), which is what made the two
       columns sit at different heights. Removed at (0,3,1). --- */
body .sw-safari-v200 .spw-acm-card:nth-child(even),
body .sw-safari-v200 .spw-acm-card:nth-child(odd){transform:none}

/* --- G: the global form rule is
       .wp-site-blocks :is(input:not([type=checkbox])…,select,textarea)
   `:is()` takes the specificity of its most specific argument, and that
   `input:not(…)` chain carries six attribute selectors, so the rule lands at
   (0,7,1). Matching it would need a deliberately unreadable selector, so
   !important is used here — scoped to this one component, and only for the
   properties the global rule actually sets. --- */
body .sw-safari-v200 .spw-acm-filter select{
  border:0!important;
  border-bottom:1px solid var(--v3-ink)!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-image:linear-gradient(45deg,transparent 50%,var(--v3-olive) 50%),
                   linear-gradient(135deg,var(--v3-olive) 50%,transparent 50%)!important;
  background-position:calc(100% - 9px) calc(50% + 1px),calc(100% - 4px) calc(50% + 1px)!important;
  background-size:5px 5px,5px 5px!important;
  background-repeat:no-repeat!important;
  padding:.55rem 1.6rem .6rem 0!important;
  min-height:44px!important;
  font-size:1rem!important;
  color:var(--v3-ink)!important;
  box-shadow:none!important;
}

/* --- G: pagination. Markup is <nav.spw-acm-pagination><ul.page-numbers>,
       and the theme paints .page-numbers.current as a filled dark box, which
       rendered as a black rectangle with invisible text. --- */
body .sw-safari-v200 .spw-acm-pagination ul.page-numbers{
  display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;
  list-style:none;margin:0;padding:0;
}
body .sw-safari-v200 .spw-acm-pagination ul.page-numbers li{
  margin:0;padding:0;list-style:none;
}
body .sw-safari-v200 .spw-acm-pagination .page-numbers{
  font-family:var(--v3-sans);font-size:.95rem;font-weight:400;
  min-width:46px;min-height:46px;
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;color:var(--v3-ink-soft);
  background:none;border:0;border-bottom:1px solid transparent;border-radius:0;
  padding:0 .35rem;
  transition:color .35s cubic-bezier(.32,.72,0,1),border-color .35s cubic-bezier(.32,.72,0,1);
}
body .sw-safari-v200 .spw-acm-pagination a.page-numbers:hover{
  color:var(--v3-ink);border-bottom-color:var(--v3-hair);
}
/* the current page is marked with a gold rule, not a filled block */
body .sw-safari-v200 .spw-acm-pagination .page-numbers.current{
  color:var(--v3-ink);background:none;
  border-bottom:1px solid var(--v3-gold);font-weight:500;
}
body .sw-safari-v200 .spw-acm-pagination .page-numbers.dots{
  color:var(--v3-ink-faint);min-width:1.75rem;
}
body .sw-safari-v200 .spw-acm-pagination .next.page-numbers{
  margin-left:.9rem;color:var(--v3-ink);
  border-bottom:1px solid var(--v3-gold);
  font-size:.85rem;letter-spacing:.115em;text-transform:uppercase;font-weight:500;
}
body .sw-safari-v200 .spw-acm-pagination a.page-numbers:focus-visible,
body .sw-safari-v200 .spw-acm-filter-submit:focus-visible{
  outline:2px solid var(--v3-olive);outline-offset:3px;
}

/* --- the previous generation prints a decorative 38x1px gold tick above every
       section wrap:
         :is(…) .sw-section:not(.sw-final) .sw-wrap::before   (0,4,1)
       The eyebrow already carries a gold hairline, so this rendered as a
       second, orphaned dash floating above each chapter. Removed at (0,4,2). */
body .sw-safari-v200 .sw-section:not(.sw-final) .sw-wrap::before{
  content:none;
}

/* --- B: proof strip hierarchy. The label was set tight enough to collide with
       its own second line at 390. Readable label, comfortable leading. --- */
body .sw-safari-v200 .sw-r0-proof h3{
  font-family:var(--v3-sans);font-weight:500;
  font-size:.9rem;letter-spacing:.085em;text-transform:uppercase;
  line-height:1.5;color:var(--v3-olive);margin:0 0 .55rem;max-width:20ch;
}
body .sw-safari-v200 .sw-r0-proof h3 .spw-acm-count{
  font-family:var(--v3-serif);font-size:1.5rem;font-weight:400;
  letter-spacing:0;line-height:1;color:var(--v3-ink);
  display:inline-block;transform:translateY(.09em);margin-right:.12em;
}
body .sw-safari-v200 .sw-r0-proof p{
  font-size:1rem;line-height:1.6;color:var(--v3-ink-soft);max-width:26ch;margin:0;
}

/* --- 2b. HEADER width. `.spurwing-header-inner` is an `alignwide` child of an
       `is-layout-constrained` group, so the theme caps it at the global wide
       size via `:where(.is-layout-constrained) > .alignwide`, which is why the
       enquiry CTA was being clipped at the right edge. --- */
body .spurwing-header.wp-block-group{max-width:none;padding-inline:0}
body .spurwing-header > .spurwing-header-inner,
body .spurwing-header .spurwing-header-inner.alignwide{
  max-width:1560px;width:100%;margin-inline:auto;
  padding-inline:clamp(1.375rem,3.5vw,4rem);
  gap:clamp(1.25rem,2.5vw,2.5rem);
  flex-wrap:nowrap;
}
body .spurwing-header .spurwing-primary-navigation{min-width:0;flex-shrink:1}
body .spurwing-header .spurwing-navigation-cta{flex-shrink:0}

/* the CTA inherits the nav's dark link colour on an olive ground (~2.1:1).
   Forced to ivory for 7.4:1. */
body .spurwing-header .spurwing-navigation-cta a,
body .spurwing-header .spurwing-navigation-cta .wp-block-navigation-item__content,
body .spurwing-header .spurwing-navigation-cta .wp-block-navigation-item__label{
  color:#FBFAF6;
}
body .spurwing-header .spurwing-navigation-cta a:hover,
body .spurwing-header .spurwing-navigation-cta a:hover .wp-block-navigation-item__label{color:#fff}
/* ==========================================================================
   12. IMAGE-LIGHT HERO — by condition, not by page name
   --------------------------------------------------------------------------
   Site audit, 176 URLs, element-level (2026-09-27):
     .sw-hero--photo elements ......... 18
     .sw-home-hero elements ............ 1   (the homepage, correctly image-free)
     real hero photographs suppressed .. 17   by the old unscoped display:none
     .sw-hero--photo with NO image ..... 1   (/travel-guide/, after the
                                              unlicensed asset was removed)

   Two defects corrected here, both found by measuring the rendered page:

   a) The hero ground is painted by
        .wp-block-group .sw-hero.sw-hero--photo { background:#1F1F1B }   (0,3,0)
      which outranked every image-light rule written below it. Homepage and
      /travel-guide/ were therefore rendering as near-black rectangles — the
      exact failure this work exists to remove. Matched at (0,4,2) below.

   b) `:has()` was sharing a comma list with the homepage selector. An invalid
      or unsupported selector invalidates the WHOLE list, so on any engine
      without :has() the homepage treatment vanished too. The two cases are
      now separate rules: the homepage never depends on :has().
   ========================================================================== */

/* --- a page whose hero is image-light by design (homepage). No :has().
       The existing `.sw-home-hero` rule declares its background with
       !important, so no amount of specificity reaches it; matched in kind,
       and only for the two properties that rule actually sets. --- */
body .wp-block-group .sw-hero.sw-home-hero,
body .wp-block-group.sw-hero.sw-home-hero,
body .sw-hero.sw-home-hero{
  background-color:#3D4026!important;
  background-image:
    radial-gradient(120% 90% at 18% 110%, rgba(95,98,56,.55) 0%, rgba(61,64,38,0) 62%),
    linear-gradient(180deg,#434733 0%,#3D4026 55%,#343722 100%)!important;
  min-height:min(72vh,720px);
}
body .sw-hero.sw-home-hero .sw-hero__media{display:none}
body .sw-hero.sw-home-hero::after{display:none}
body .sw-hero.sw-home-hero::before{background:none}
body .sw-hero.sw-home-hero h1{color:#FBFAF6;max-width:16ch;text-shadow:none}

/* --- a photo hero that currently has no photograph. Separate rule, so if an
       engine does not support :has() only this block is dropped and the
       photographic treatment remains — never a black rectangle by accident. */
body .wp-block-group .sw-hero.sw-hero--photo:not(:has(.sw-hero__media img)),
body .wp-block-group.sw-hero.sw-hero--photo:not(:has(.sw-hero__media img)){
  background-color:#3D4026;
  background-image:
    radial-gradient(120% 90% at 18% 110%, rgba(95,98,56,.55) 0%, rgba(61,64,38,0) 62%),
    linear-gradient(180deg,#434733 0%,#3D4026 55%,#343722 100%);
  min-height:min(72vh,720px);
}
body .sw-hero.sw-hero--photo:not(:has(.sw-hero__media img))::before{background:none}
body .sw-hero.sw-hero--photo:not(:has(.sw-hero__media img))::after{display:none}
body .sw-hero.sw-hero--photo:not(:has(.sw-hero__media img)) h1{
  color:#FBFAF6;max-width:16ch;text-shadow:none;
}


/* ==========================================================================
   13. MOBILE TARGETS AND MINIMUM TYPE
   --------------------------------------------------------------------------
   Measured at 390 and 768: horizontal overflow 0px, but standalone link CTAs
   measured 21-26px high and 12 text nodes computed under 12px. Both are
   explicit acceptance criteria.
   Inline links inside a sentence are exempt from target sizing; these are
   standalone controls, so they get a real target.
   ========================================================================== */
@media (max-width:820px){
  body .sw-safari-v200 .spw-acm-card__link a,
  body .sw-safari-v200 .spw-accommodation-card .spw-btn,
  body .sw-safari-v200 .sw-link-row a,
  body .sw-safari-v200 .sw-v2-viewall a,
  body .sw-safari-v200 .spw-acm-pagination .page-numbers{
    min-height:44px;
    display:inline-flex;
    align-items:center;
  }
  /* the underline should hug the text, not the 44px box */
  body .sw-safari-v200 .spw-acm-card__link a,
  body .sw-safari-v200 .spw-accommodation-card .spw-btn,
  body .sw-safari-v200 .sw-link-row a,
  body .sw-safari-v200 .sw-v2-viewall a{
    border-bottom:0;
    box-shadow:inset 0 -1px 0 0 var(--v3-gold);
    padding-bottom:0;
    background-position:0 100%;
  }
  /* footer navigation is a shared template; give it usable targets too */
  body .spurwing-footer a{
    min-height:44px;display:inline-flex;align-items:center;
  }
}

/* no microscopic metadata anywhere in this layer */
body .sw-safari-v200 .sw-section :is(p,span,li,a,td,th,label,figcaption){
  font-size:max(0.75rem,1em);
}
body .sw-safari-v200 .spw-accommodation-card__labels,
body .sw-safari-v200 .spw-acm-card__link a,
body .sw-safari-v200 .spw-accommodation-card .spw-btn{
  font-size:.8125rem;   /* 13px floor for tertiary text */
}

/* Card title links measured 26px high. That already satisfies WCAG 2.2 AA
   (24x24 minimum, and the card image plus "View stay" reach the same
   destination), but it is short of a comfortable thumb target. Padding the
   hit area and pulling the margin back by the same amount grows the target
   ~24px with zero net layout change. */
@media (max-width:820px){
  body .sw-safari-v200 .spw-acm-card__title a,
  body .sw-safari-v200 .spw-accommodation-card__title{
    display:inline-block;
    padding-block:.8rem;
    margin-block:-.8rem;
  }
}

/* ==========================================================================
   14. MOBILE REGRESSION FIXES (from section 13)
   --------------------------------------------------------------------------
   Two defects introduced by the target-size work, both caught at 390:
   a) `display:inline-flex` + `min-height` on link rows turned a wrapped
      two-word link into stacked line blocks ("EXPLORE / KRUGER / STAYS").
      Padding an inline-block grows the target without changing wrapping.
   b) The pathway figures kept the block editor's intrinsic width and
      rendered at roughly half the column.
   ========================================================================== */
@media (max-width:820px){
  body .sw-safari-v200 .spw-acm-card__link a,
  body .sw-safari-v200 .spw-accommodation-card .spw-btn,
  body .sw-safari-v200 .sw-link-row a,
  body .sw-safari-v200 .sw-v2-viewall a{
    display:inline-block;
    min-height:0;
    padding-block:.8rem;
    margin-block:-.4rem;
    line-height:1.35;
  }
  body .spurwing-footer a{
    display:inline-block;min-height:0;
    padding-block:.7rem;margin-block:-.35rem;
  }
}

/* pathway and split figures must fill their column at every width */
body .sw-safari-v200 .sw-path-card figure,
body .sw-safari-v200 .sw-path-card figure img,
body .sw-safari-v200 .sw-r0-split__media figure,
body .sw-safari-v200 .sw-r0-split__media figure img{
  width:100%;
  max-width:none;
  margin-inline:0;
  display:block;
}
body .sw-safari-v200 .sw-path-card figure img,
body .sw-safari-v200 .sw-r0-split__media figure img{
  height:100%;object-fit:cover;
}

/* ==========================================================================
   15. CASCADE COLLISION FIX
   --------------------------------------------------------------------------
   Section 11 raised `.sw-path-grid` to `body .sw-safari-v200 .sw-path-grid`
   (0,3,0) to beat the generation CSS — but that rule sits OUTSIDE any media
   query, so it also beat this layer's own responsive rules at (0,1,0). The
   pathway grid therefore stayed two columns at 390, figures rendered at 169px
   (half a column) and a two-word link wrapped to three lines inside them.
   Every responsive override of a section-11 selector must match its
   specificity.
   ========================================================================== */
@media (max-width:1024px){
  body .sw-safari-v200 .sw-path-grid{
    grid-template-columns:1fr 1fr;
  }
  body .sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(1){grid-column:1 / -1;grid-row:1}
  body .sw-safari-v200 .sw-path-card:nth-child(1) figure{aspect-ratio:16/9}
  body .sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(2){grid-column:1;grid-row:2}
  body .sw-safari-v200 .sw-path-card:where(:not(.sw-r0-split__text *)):nth-child(3){grid-column:2;grid-row:2}
}
@media (max-width:600px){
  body .sw-safari-v200 .sw-path-grid{
    grid-template-columns:1fr;
    grid-template-rows:auto;
    gap:2.75rem;
  }
  body .sw-safari-v200 .sw-path-card:nth-child(n){grid-column:1;grid-row:auto}
  body .sw-safari-v200 .sw-path-card:nth-child(1) figure{aspect-ratio:4/5}
  body .sw-safari-v200 .sw-path-card:nth-child(n+2) figure{aspect-ratio:3/2}
}

/* link targets: pad without a negative margin, so the measured height is the
   real target height rather than being clawed back */
@media (max-width:820px){
  body .sw-safari-v200 .spw-acm-card__link a,
  body .sw-safari-v200 .spw-accommodation-card .spw-btn,
  body .sw-safari-v200 .sw-link-row a,
  body .sw-safari-v200 .sw-v2-viewall a{
    display:inline-block;min-height:0;
    padding-block:.75rem;margin-block:0;line-height:1.3;
  }
  body .spurwing-footer a{
    display:inline-block;min-height:0;
    padding-block:.65rem;margin-block:0;
  }
}

/* ==========================================================================
   16. SPLIT SECTIONS — the image was covering the copy
   --------------------------------------------------------------------------
   Measured on the deployed page at 1440:
     text  l=202 r=728
     media l=670 r=1238   margin-left:-130px
     gap   -58px          (4 text elements overlapped the photograph)

   Cause, found by rule dump:

     .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
       margin: 0 calc(-1 * (100vw - 100%) / 2);        (0,4,0)
     }

   That is a full-bleed technique, but it applies the negative margin to BOTH
   sides. On the flipped variant the photograph sits on the right, so the LEFT
   -130px drags it back across the gutter and over the copy. At 1440 with a
   1180 wrap, (100vw - 100%)/2 = 130.

   The photograph is NOT shrunk to fix this. It keeps its bleed — but only
   outward, toward the viewport edge it actually touches. Beaten at (0,5,1).

   Composition: copy 40% / image 60% with a real editorial gutter, per brief.
   ========================================================================== */
@media (min-width:1025px){
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap{
    display:grid;
    /* explicit 40%: an fr track is distorted by the media's negative bleed
       margin, which measured copy at 33% instead of the intended 38-42% */
    grid-template-columns:minmax(0,40%) minmax(0,1fr);
    column-gap:clamp(3.5rem,5vw,5.5rem);
    align-items:center;
  }
  /* deterministic order: copy left, photograph right, in both variants */
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__text,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__text{
    order:1;min-width:0;
  }
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
    order:2;min-width:0;
    /* bleed to the RIGHT viewport edge only — never back across the gutter */
    /* deterministic bleed: viewport and fixed values only. `100%` in a margin
       resolves against the GRID AREA, not the wrap, which is what produced a
       -445px margin and a 373px overlap. */
    margin-left:0;
    margin-right:calc(-1 * max(0px, (100vw - var(--sw-wrap, 1180px)) / 2) - 4.5rem);
  }
}

/* stacked: no bleed at all, full width, no negative margins either side */
@media (max-width:1024px){
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap{
    grid-template-columns:minmax(0,1fr);
    row-gap:clamp(2rem,4vw,3rem);
  }
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
    order:2;margin:0;min-width:0;
  }
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__text,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__text{
    order:1;min-width:0;
  }
}

/* ==========================================================================
   17. REFINEMENT PASS — approved direction, four adjustments only
   ========================================================================== */

/* --- 17a. RATE SECTION: the photograph was vertically centred against a
       taller copy column, leaving ~230px of air beneath it. The columns now
       top-align and the photograph stretches to the row height, so it ends
       where the copy ends. Image scale, 72px gutter, 40/60 relationship and
       zero overlap are all preserved. --- */
@media (min-width:1025px){
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap{
    align-items:start;
  }
  body .sw-safari-v200 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media,
  body .sw-safari-v200 .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
    align-self:stretch;
    display:flex;
  }
  body .sw-safari-v200 .sw-r0-split__media figure,
  body .sw-safari-v200 .sw-r0-split--flip .sw-r0-split__media figure{
    aspect-ratio:auto;
    height:100%;
    width:100%;
    min-height:clamp(26rem,34vw,38rem);
    margin:0;
  }
  body .sw-safari-v200 .sw-r0-split__media figure img{
    height:100%;width:100%;object-fit:cover;display:block;
  }
}

/* --- 17b. FEATURED STAYS: property name given more presence, body copy more
       readable. Metadata deliberately unchanged and still restrained.
       Composition, asymmetry and photography scale untouched. --- */
body .sw-safari-v200 .spw-accommodation-card__title{
  font-size:clamp(1.55rem,1.85vw,1.95rem);
  line-height:1.1;
  margin:0 0 .55rem;
}
body .sw-safari-v200 .spw-accommodation-card:nth-child(1) .spw-accommodation-card__title,
body .sw-safari-v200 .spw-accommodation-card:nth-child(4) .spw-accommodation-card__title,
body .sw-safari-v200 .spw-accommodation-card:nth-child(5) .spw-accommodation-card__title{
  font-size:clamp(1.95rem,2.6vw,2.55rem);
}
body .sw-safari-v200 .spw-accommodation-card__descriptor{
  font-size:1.125rem;
  line-height:1.72;
  color:#514C42;
  margin:0 0 1.35rem;
}
body .sw-safari-v200 .spw-accommodation-card__type{
  font-size:.92rem;color:var(--v3-ink-faint);margin:0 0 1.1rem;
}

/* --- 17c. FULL CATALOGUE: hierarchy only. Two columns and image scale
       unchanged. Name first, metadata clearly secondary, description
       comfortable, View Stay understated but unmistakable. --- */
body .sw-safari-v200 .spw-acm-card__title{
  font-size:clamp(1.5rem,1.75vw,1.85rem);
  line-height:1.12;
  margin:0 0 .5rem;
}
body .sw-safari-v200 .spw-acm-card__meta{
  font-size:.815rem;
  letter-spacing:.105em;
  font-weight:500;
  color:#8A8272;
  margin:0 0 .6rem;
}
body .sw-safari-v200 .spw-acm-card__descriptor{
  font-size:1.0625rem;
  line-height:1.72;
  color:#514C42;
  margin:0 0 1.25rem;
}
body .sw-safari-v200 .spw-acm-card__link a{
  font-size:.815rem;
  letter-spacing:.14em;
  color:var(--v3-ink);
  border-bottom:1px solid var(--v3-gold);
  padding-bottom:.35rem;
}

/* --- 17d. FILTERS: concierge finish. Still a clean horizontal row on a
       hairline — no boxed filter-card UI. --- */
body .sw-safari-v200 .spw-acm-filters{
  gap:2rem 3rem;
  padding:2.25rem 0 2.5rem;
  border-top:1px solid var(--v3-hair);
  border-bottom:1px solid var(--v3-hair);
  align-items:end;
}
body .sw-safari-v200 .spw-acm-filter{gap:.7rem;flex:1 1 13.5rem}
body .sw-safari-v200 .spw-acm-filter > span{
  font-size:.7rem;
  letter-spacing:.2em;
  font-weight:600;
  color:var(--v3-ink);
  text-transform:uppercase;
}
body .sw-safari-v200 .spw-acm-filter select{
  font-size:1.0625rem!important;
  padding:.6rem 1.75rem .7rem 0!important;
  border-bottom:1px solid rgba(34,31,25,.34)!important;
  transition:border-color .4s cubic-bezier(.32,.72,0,1);
  cursor:pointer;
}
body .sw-safari-v200 .spw-acm-filter select:hover{
  border-bottom-color:var(--v3-olive)!important;
}
body .sw-safari-v200 .spw-acm-filter-submit{
  padding:1.05rem 2.4rem;
  letter-spacing:.14em;
  font-size:.8125rem;
  background:transparent;
  color:var(--v3-ink);
  border:1px solid rgba(34,31,25,.34);
}
body .sw-safari-v200 .spw-acm-filter-submit:hover{
  background:var(--v3-olive);border-color:var(--v3-olive);color:#fff;
}
/* ==========================================================================
   SPURWING — GLOBAL TYPOGRAPHY MAPPING  (TYPE ONLY, NO COMPOSITION)
   --------------------------------------------------------------------------
   Separate file, separately removable. Deleting it reverts every template to
   Manrope display type and changes nothing else.

   Why it is needed
   ----------------
   Fixing the dead @import makes Cormorant Garamond AVAILABLE; it does not make
   it APPLY. Nine templates declare the display face literally:

     :is(.sw-trade-v170,…,.sw-safari-v200,…) .sw-hero h1   font-family:Manrope   (0,2,1)
     :is(…) .sw-section h2                                 font-family:Manrope   (0,2,1)
     :is(…) .sw-section > .sw-wrap > h3                    font-family:Manrope   (0,2,1)
     .sw-gw-hero h1 / .sw-gw-section h2 / .sw-gw-card h3   font-family:Manrope
     .sw-kruger summary                                    font-family:Manrope

   Measured on staging: Manrope, Inter, Instrument Serif and Fira Code all
   return 200 from the site's own origin, so they load correctly — Manrope is a
   deliberate declaration, not a fallback. Only a mapping changes it.

   SCOPE: font-family, weight and optical letter-spacing only. No sizes, no
   spacing, no colour, no layout. Cormorant is a higher-contrast face than
   Manrope at the same size, so tracking is relaxed slightly where Manrope had
   been tightened to -.032em/-.038em.
   ========================================================================== */

:root{
  --sw-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sw-text:Karla,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

/* --- display face, at the specificity the existing rules occupy --- */
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-hero h1,
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-section h2,
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-section > .sw-wrap > h3,
body .sw-gw-hero h1,
body .sw-gw-section h2,
body .sw-gw-final h2,
body .sw-gw-card h3,
body .sw-home-hero h1,
body .sw-home h2{
  font-family:var(--sw-display);
  font-weight:400;
  letter-spacing:-.008em;   /* was -.025em to -.040em, set for a grotesque */
}

/* Cormorant sets a smaller apparent size than Manrope at an identical
   font-size, because its x-height is markedly lower. A single optical
   correction, applied only where the existing rule set a display size. */
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-hero h1{
  font-size:clamp(3rem,5.6vw,5rem);
  line-height:1.04;
}
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-section h2{
  font-size:clamp(2.1rem,3.5vw,3.35rem);
  line-height:1.1;
}

/* --- text face: catch the literal declarations the preset remap cannot reach --- */
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-section p,
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-section li,
body .sw-gw-section p,
body .sw-kruger p,
body .sw-kruger li{
  font-family:var(--sw-text);
}
body .sw-kruger summary{font-family:var(--sw-display);font-weight:500;letter-spacing:0}

/* eyebrows are set in Inter by the generation CSS; Karla is the approved
   text face and Inter is not in the brand system at all */
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220) .sw-eyebrow{
  font-family:var(--sw-text);
}

/* forms and controls */
body .wp-site-blocks :is(input,select,textarea,button),
body .wp-block-button__link,
body .wp-element-button{
  font-family:var(--sw-text);
}
/* ============== end GLOBAL TYPOGRAPHY MAPPING ============== */

/* --------------------------------------------------------------------------
   Templates that do not use the .sw-*-vNNN generation wrappers
   --------------------------------------------------------------------------
   Measured per template (element-level, from the rendered page):
     accommodation single  .spw-accommodation  h1.spw-accommodation-hero__heading
     tour single           .spw-tour           h1.spw-hero__heading
     enquiry               .sw-enq-v251        h1.wp-block-heading  (Manrope)
     group                 .sw-transport-v210  body copy in Instrument Serif
     travel trade          .sw-trade-v170      body copy in Instrument Serif
     homepage              .sw-home-v301/308   h2 inherited the text face
   -------------------------------------------------------------------------- */

/* Accommodation single (Tour Engine template) — headings inherit, so they
   were rendering in the text face.

   TOUR SINGLES ARE EXCLUDED BY DECISION (rollback, 2026-09-28): the tour
   template keeps its own Tour Engine presentation — Manrope hero, Inter
   body, its own buttons — as template-specific art direction
   (experiential / action-oriented). No luxury rule may reach `.spw-tour`
   content; the `.spw-btn` line in the UI-face block below carries the same
   exclusion via `body:where(:not(.spw-tour-page))`, which costs nothing. */
body .spw-accommodation .spw-accommodation-hero__heading,
body .spw-accommodation h2,
body .spw-accommodation .spw-section h2{
  font-family:var(--sw-display);
  font-weight:400;
  letter-spacing:-.008em;
}
body .spw-accommodation p,
body .spw-accommodation li{font-family:var(--sw-text)}

/* enquiry generation was not in the :is() list above */
body .sw-enq-v251 .sw-hero h1,
body .sw-enq-v251 .sw-section h2,
body .sw-enq-v251 h1,
body .sw-enq-v251 h2{
  font-family:var(--sw-display);font-weight:400;letter-spacing:-.008em;
}
body .sw-enq-v251 p,
body .sw-enq-v251 label,
body .sw-enq-v251 .wpcf7 input,
body .sw-enq-v251 .wpcf7 select,
body .sw-enq-v251 .wpcf7 textarea,
body .sw-enq-v251 .wpcf7 input[type=submit]{
  font-family:var(--sw-text);
}

/* homepage h2 was inheriting the text face */
body.home .sw-home-v301 h2,
body.home .sw-home-v308 h2,
body.home .sw-home-v301 .sw-final h2{
  font-family:var(--sw-display);font-weight:400;letter-spacing:-.008em;
}

/* Instrument Serif is not in the brand system. The preset variable is
   redefined in the accommodation layer, but several blocks carry the literal
   utility class, which declares the variable with !important — so the class
   itself is remapped here. */
body .has-instrument-serif-font-family,
body .wp-site-blocks .has-instrument-serif-font-family{
  font-family:var(--sw-display)!important;
}
body .has-inter-variable-font-family,
body .has-manrope-font-family{
  font-family:var(--sw-text)!important;
}
/* group and travel-trade body copy */
body .sw-transport-v210 .sw-section p,
body .sw-transport-v210 .sw-section li,
body .sw-trade-v170 .sw-section p,
body .sw-trade-v170 .sw-section li{
  font-family:var(--sw-text);
}

/* Statement / pull-quote paragraphs declare "Instrument Serif" literally
   (not via the preset variable, which is correctly remapped). These are
   display elements, so they take the display face rather than the text face. */
body .sw-v2-statement,
body .sw-statement,
body .sw-lead--serif{
  font-family:var(--sw-display);
  font-weight:400;
  letter-spacing:-.006em;
}

/* button faces that name Inter directly */
body .sw-enq-button .wp-block-button__link,
body .sw-gw-button .wp-block-button__link,
body .sw-enq-v251 .wpcf7 input[type=submit]{
  font-family:var(--sw-text);
}

/* the statement rule is scoped inside the generation wrapper, so it outranks a
   bare class selector; matched at (0,3,1) */
body :is(.sw-trade-v170,.sw-premium-v180,.sw-safari-v200,.sw-transport-v210,.sw-dream-v220,.sw-enq-v251) .sw-v2-statement{
  font-family:var(--sw-display);font-weight:400;letter-spacing:-.006em;
}
/* --------------------------------------------------------------------------
   UI text faces — measured on the deployed page, not assumed.
   --------------------------------------------------------------------------
   After deployment the browser was still fetching InterVariable.woff2 (352KB)
   and Manrope-VariableFont.woff2 (54KB) — 406KB of a 476KB font payload —
   because a browser downloads a face the moment ANY element resolves to it.
   A computed sweep found exactly where, and a rule-match dump found why:

     .wp-block-group .sw-hero--photo .sw-hero__crumb { font-family:Inter }  (0,3,0)

   The v2.0 generation prefixes its rules with `.wp-block-group`, which puts
   them at (0,3,0) — above any `body .class` selector. Rather than guess the
   competing selector for each of the six element groups, this one narrow
   block uses !important: it sets font-family ONLY, on UI furniture only, and
   carries no layout risk. Every other override in this project matches
   specificity instead; this is the documented exception.

   Target: zero elements resolving to Inter or Manrope, which is the only
   thing that actually stops the download.
   -------------------------------------------------------------------------- */
body .spurwing-primary-navigation a,
body .spurwing-primary-navigation li,
body .spurwing-primary-navigation .wp-block-navigation-item__label,
body .wp-block-navigation__submenu-container a,
body .wp-block-navigation__submenu-container li,
body .sw-hero__crumb,
body .sw-hero__crumb a,
body .sw-hero__crumb span,
body .sw-link-row a,
body .sw-r0-links a,
body .sw-r0-links li,
body:where(:not(.spw-tour-page)) .spw-btn,
body:where(:not(.spw-tour-page)) .spw-btn--outline,
body .spurwing-footer a,
body .spurwing-footer li,
body .spw-acm-card__link a,
body .sw-v2-viewall a{
  font-family:var(--sw-text)!important;
}

/* ==========================================================================
   DEFECT REPAIR — split-media bleed direction (NOT a composition change)
   --------------------------------------------------------------------------
   PRE-EXISTING V2 bug, found by the collision audit on /greater-kruger/:
   the photograph sat 58px over the copy, obscuring three text elements.

   Source rule:
     .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
       margin: 0 calc(-1 * (100vw - 100%) / 2);        (0,4,0)
     }

   Two traps this block exists to avoid, both hit on the first attempt:
     - `100%` inside a margin resolves against the GRID AREA, not the wrap,
       so the calc produced -445px and a 373px overlap.
     - `:first-child` matches DOM order, but the media is visually second via
       `order`, so a "photograph is on the left" branch fired incorrectly.

   So the bleed is now expressed with viewport and fixed values only, always
   toward the edge the photograph actually touches, never back across the gutter.
   Changes margin only: no grid tracks, no order, no sizing, no composition.

   3.5.0 — the direction depends on the modifier, and the first version of
   this block only covered one of them. Measured on /madikwe/ (no --flip):
   the generation sets `order:2` on the media, so it sits RIGHT — and this
   block was still bleeding it LEFT by 202px, straight over the heading.
   Branch by modifier, in the same viewport-only terms:
     --flip   media order:-1, sits LEFT   -> bleed LEFT
     no flip  media order:2,  sits RIGHT  -> bleed RIGHT
   A right bleed in 100vw terms can overshoot by the scrollbar width in a
   real browser, so the non-flip section clips its own x-overflow (clip, not
   hidden: it creates no scroll container and changes no layout).

   SPECIFICITY IS PART OF THE CONTRACT. Both branches must stay at (0,4,1):
   the accommodation layer overrides this block at (0,5,1) — it recomposes
   its splits with the media on the right for both modifiers — and it sits
   EARLIER in the bundle, so a tie here wins by order and puts the photograph
   back over the copy (measured on /accommodation/ during 3.5.0: −202px).
   Hence two classes on the section, and `:where(:not())` for the branch
   test, which costs nothing.
   ========================================================================== */
@media (min-width:1025px){
  body .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{                       /* (0,4,1) */
    margin-left:calc(-1 * max(0px, (100vw - var(--sw-wrap, 1180px)) / 2) - 4.5rem);
    margin-right:0;
    min-width:0;
  }
  body .sw-section.sw-r0-split:where(:not(.sw-r0-split--flip)) > .sw-wrap > .sw-r0-split__media{   /* (0,4,1) */
    margin-left:0;
    margin-right:calc(-1 * max(0px, (100vw - var(--sw-wrap, 1180px)) / 2) - 4.5rem);
    min-width:0;
  }
  body .sw-section.sw-r0-split:where(:not(.sw-r0-split--flip)){overflow-x:clip}
}
@media (max-width:1024px){
  body .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media,
  body .sw-section.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
    margin-left:0;margin-right:0;min-width:0;
  }
}
/* ==========================================================================
   SPURWING — HOMEPAGE COMPOSITION LAYER
   --------------------------------------------------------------------------
   Scoped to `.sw-home-v301`. Shares the approved language with accommodation
   (typography, olive/stone palette, spacing philosophy, hairlines, CTA
   language, image behaviour, editorial restraint) but composes every section
   for this page. Nothing here uses an accommodation selector.

   Accommodation 3.2.0 is the floor. This page has to exceed it, so the
   display scale steps up (hero to 104px against accommodation's 80px), the
   chapter rhythm is longer, and the page is built to read as one continuous
   journey rather than a stack of sections: alternating warm grounds, no
   repeated component, and a single dominant element per chapter.

   PHOTOGRAPHY CONSTRAINT, measured on the deployed page:
   the homepage carries FOUR images, three of them unverified `temporary-*`.
   So the composition is built to carry itself typographically and to improve
   — not break — when those three are removed. No slot assumes an image.
   ========================================================================== */

:root{
  --h-ivory:#F7F5EF;
  --h-limestone:#F2EDE4;
  --h-linen:#EAE3D6;
  --h-stone:#D8D3C8;
  --h-olive:#5F6238;
  --h-olive-deep:#3D4026;
  --h-timber:#2E2A22;
  --h-gold:#A98A4B;
  --h-ink:#221F19;
  --h-ink-soft:#514C42;
  --h-ink-faint:#7C7566;
  --h-on-dark:#F6F2E9;
  --h-on-dark-soft:#D7D0C0;
  --h-hair:rgba(34,31,25,.16);
  --h-hair-dark:rgba(246,242,233,.22);

  --h-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --h-sans:Karla,"Helvetica Neue",Helvetica,Arial,sans-serif;

  --h-wrap:1280px;
  --h-gut:clamp(1.375rem,4vw,5rem);
  --h-chapter:clamp(5rem,9vw,11rem);
}

/* ---------- page ground and shared rhythm ---------- */
body .sw-home-v301{
  background:var(--h-ivory);
  color:var(--h-ink);
  font-family:var(--h-sans);
}
body .sw-home-v301 .sw-wrap{
  max-width:var(--h-wrap);margin-inline:auto;padding-inline:var(--h-gut);
}
body .sw-home-v301 .sw-section{padding-block:var(--h-chapter)}
body .sw-home-v301 h1,
body .sw-home-v301 h2,
body .sw-home-v301 h3{
  font-family:var(--h-serif);font-weight:400;color:var(--h-ink);
  text-wrap:balance;letter-spacing:-.008em;
}
body .sw-home-v301 p{font-family:var(--h-sans);color:var(--h-ink-soft)}
body .sw-home-v301 .sw-eyebrow{
  font-family:var(--h-sans)!important;
  font-size:.785rem!important;
  letter-spacing:.17em;text-transform:uppercase;font-weight:500;
  color:var(--h-olive);margin:0 0 1.2rem;line-height:1.3;
}
body .sw-home-v301 .sw-eyebrow::after{
  content:"";display:block;width:3.25rem;height:1px;
  background:var(--h-gold);margin-top:1.1rem;
}
/* one CTA language across the page */
body .sw-home-v301 .sw-home-link{
  font-family:var(--h-sans);font-size:.85rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:500;color:var(--h-ink);
  text-decoration:none;display:inline-block;
  border-bottom:1px solid var(--h-gold);padding-bottom:.32rem;
  transition:color .4s cubic-bezier(.32,.72,0,1);
}
body .sw-home-v301 .sw-home-link:hover{color:var(--h-olive)}

/* ==========================================================================
   ARRIVAL — hero
   Image-light by necessity, not by accident. Built so the P0 photograph drops
   into the same composition: the copy column keeps its width and vertical
   position, and only the background layer changes.
   ========================================================================== */
body .sw-home-hero{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;align-items:center;
  min-height:min(88vh,880px);
  padding-block:clamp(5rem,11vw,9rem);
}
/* tonal depth: three layers, no flat block, no hard edge */
body .sw-home-hero::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(130% 100% at 12% 108%, rgba(95,98,56,.50) 0%, rgba(61,64,38,0) 60%),
    radial-gradient(90% 70% at 88% -10%, rgba(169,138,75,.13) 0%, rgba(169,138,75,0) 62%);
  display:block;
}
body .sw-home-hero .sw-hero-copy{position:relative;z-index:2;width:100%}
body .sw-home-hero .sw-eyebrow{color:var(--h-on-dark-soft)}
body .sw-home-hero .sw-eyebrow::after{background:var(--h-gold)}
body .sw-home-hero h1{
  font-size:clamp(3.4rem,7vw,6.5rem);
  line-height:.98;letter-spacing:-.018em;
  color:#FCFAF4;max-width:15ch;margin:0 0 1.75rem;
}
body .sw-home-hero .sw-home-position{
  font-size:clamp(1.19rem,1.5vw,1.5rem);
  line-height:1.56;color:var(--h-on-dark);
  max-width:40ch;margin:0 0 2.75rem;font-weight:300;
}
/* ONE strong CTA. The second button is demoted to a quiet link so the two
   stop competing — the brief asks for a single primary action. */
body .sw-home-hero .wp-block-buttons{gap:2.25rem!important;align-items:center}
body .sw-home-hero .wp-block-button .wp-element-button{
  background:var(--h-on-dark);color:var(--h-ink);
  border:1px solid var(--h-on-dark);border-radius:0!important;
  font-family:var(--h-sans);font-size:.9rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;
  padding:1.15rem 2.6rem;min-height:56px;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .45s cubic-bezier(.32,.72,0,1),color .45s cubic-bezier(.32,.72,0,1);
}
body .sw-home-hero .wp-block-button .wp-element-button:hover{background:#fff}
body .sw-home-hero .is-style-outline .wp-element-button{
  background:transparent;border:0;color:var(--h-on-dark);
  padding:0;min-height:0;
  border-bottom:1px solid rgba(246,242,233,.45);
  border-radius:0!important;
  font-size:.85rem;letter-spacing:.14em;
  padding-bottom:.35rem;
}
body .sw-home-hero .is-style-outline .wp-element-button:hover{
  background:transparent;color:#fff;border-bottom-color:var(--h-gold);
}
body .sw-home-hero .sw-home-hero-note{
  font-size:.875rem;letter-spacing:.02em;color:var(--h-on-dark-soft);
  margin:2.75rem 0 0;max-width:46ch;
}

/* ==========================================================================
   DESIRE — approach / proof
   A hairline proof band, not three feature boxes.
   ========================================================================== */
body .sw-home-v301 .sw-approach{background:var(--h-limestone)}
body .sw-home-v301 .sw-approach-head{max-width:46rem;margin-bottom:clamp(3rem,5vw,4.5rem)}
body .sw-home-v301 .sw-approach-head h2{
  font-size:clamp(2.35rem,4vw,3.9rem);line-height:1.06;max-width:20ch;margin:0 0 1.25rem;
}
body .sw-home-v301 .sw-approach-head .sw-lead{
  font-size:clamp(1.15rem,1.4vw,1.38rem);line-height:1.62;
  color:var(--h-ink-soft);max-width:46ch;
}
body .sw-home-v301 .sw-proof3{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;margin:0 0 clamp(3rem,5vw,4.5rem);
}
body .sw-home-v301 .sw-proof3 .sw-rule{
  padding:.15rem 2.5rem;border-left:1px solid var(--h-hair);
  background:none;border-radius:0;box-shadow:none;margin:0;
}
body .sw-home-v301 .sw-proof3 .sw-rule:first-child{border-left:0;padding-left:0}
body .sw-home-v301 .sw-proof3 .sw-rule strong{
  display:block;font-family:var(--h-sans);
  font-size:.9rem;letter-spacing:.09em;text-transform:uppercase;font-weight:500;
  color:var(--h-olive);margin:0 0 .7rem;line-height:1.45;
}
body .sw-home-v301 .sw-proof3 .sw-rule p{
  font-size:1.0625rem;line-height:1.66;color:var(--h-ink-soft);margin:0;max-width:26ch;
}
/* the value statement is the chapter's closing note, set larger and quieter */
body .sw-home-v301 .sw-value{
  border-top:1px solid var(--h-hair);padding-top:clamp(2.25rem,3.5vw,3rem);
  display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr);
  gap:clamp(2rem,4vw,4.5rem);align-items:start;
}
body .sw-home-v301 .sw-value h3{
  font-size:clamp(1.5rem,2vw,2rem);line-height:1.18;margin:0;max-width:18ch;
}
body .sw-home-v301 .sw-value p{font-size:1.125rem;line-height:1.72;margin:0;max-width:52ch}
body .sw-home-v301 .sw-quiet-links{margin-top:clamp(2rem,3vw,2.75rem)}

/* ==========================================================================
   DISCOVERY — Explore South Africa
   An asymmetric editorial spread. Kruger dominant, Johannesburg secondary,
   the rest quieter. Never equal cards.
   ========================================================================== */
body .sw-home-v301 .sw-explore{background:var(--h-ivory)}
body .sw-home-v301 .sw-section-head{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:2rem 4rem;align-items:end;
  margin-bottom:clamp(3rem,5vw,4.5rem);
}
body .sw-home-v301 .sw-section-head h2{
  font-size:clamp(2.35rem,4vw,3.9rem);line-height:1.06;max-width:18ch;margin:0;
}
body .sw-home-v301 .sw-section-head p{
  font-size:1.0625rem;line-height:1.66;max-width:38ch;margin:0 0 1rem;
}
body .sw-home-v301 .sw-explore-feature{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(2rem,3.5vw,3.5rem);
  row-gap:clamp(3.5rem,6vw,6rem);
}
body .sw-home-v301 .sw-dest-feature{
  background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;
  align-self:start;min-width:0;
}
/* dominant */
body .sw-home-v301 .sw-dest-feature:nth-child(1){grid-column:1 / span 7}
/* secondary */
body .sw-home-v301 .sw-dest-feature:nth-child(2){grid-column:8 / span 5}
/* supporting, quieter and smaller */
body .sw-home-v301 .sw-dest-feature:nth-child(n+3){grid-column:span 4}
body .sw-home-v301 .sw-dest-feature .sw-home-photo{
  margin:0 0 1.65rem;overflow:hidden;background:var(--h-stone);
}
body .sw-home-v301 .sw-dest-feature .sw-home-photo img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s cubic-bezier(.32,.72,0,1);
}
body .sw-home-v301 .sw-dest-feature:hover .sw-home-photo img{transform:scale(1.035)}
body .sw-home-v301 .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:3/2}
body .sw-home-v301 .sw-dest-feature:nth-child(2) .sw-home-photo{aspect-ratio:4/5}
body .sw-home-v301 .sw-dest-feature:nth-child(n+3) .sw-home-photo{aspect-ratio:16/10}
body .sw-home-v301 .sw-dest-copy .sw-eyebrow{margin:0 0 .7rem}
body .sw-home-v301 .sw-dest-copy .sw-eyebrow::after{display:none}
body .sw-home-v301 .sw-dest-feature h3{
  font-size:clamp(1.6rem,2vw,2.05rem);line-height:1.1;margin:0 0 .6rem;
}
body .sw-home-v301 .sw-dest-feature:nth-child(1) h3{font-size:clamp(2.1rem,2.9vw,2.85rem)}
body .sw-home-v301 .sw-dest-feature p{
  font-size:1.0625rem;line-height:1.7;color:var(--h-ink-soft);
  margin:0 0 1.2rem;max-width:42ch;
}
body .sw-home-v301 .sw-dest-feature:nth-child(n+3) h3{font-size:1.4rem}
body .sw-home-v301 .sw-dest-feature:nth-child(n+3) p{font-size:1rem;max-width:34ch}

/* ==========================================================================
   DISCOVERY — Travel Your Way
   Hierarchy, not three identical panels. The first route is dominant; the
   rest are a hairline index; group travel is a quiet footnote.
   ========================================================================== */
body .sw-home-v301 .sw-travel{background:var(--h-linen)}
body .sw-home-v301 .sw-travel-grid{
  display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);
  gap:clamp(2.5rem,5vw,6rem);align-items:start;
}
body .sw-home-v301 .sw-travel-grid > div:first-child > div:first-child h2{
  font-size:clamp(2.35rem,3.6vw,3.5rem);line-height:1.07;max-width:16ch;margin:0 0 1.2rem;
}
body .sw-home-v301 .sw-travel-grid .sw-lead{
  font-size:clamp(1.1rem,1.3vw,1.3rem);line-height:1.64;color:var(--h-ink-soft);max-width:40ch;
}
body .sw-home-v301 .sw-path{
  background:none;border:0;border-radius:0;box-shadow:none;
  padding:clamp(1.75rem,2.5vw,2.25rem) 0;margin:0;
  border-top:1px solid var(--h-hair);
  display:grid;grid-template-columns:auto minmax(0,1fr);
  column-gap:clamp(1.5rem,2.5vw,2.5rem);align-items:start;
}
body .sw-home-v301 .sw-path:first-of-type{border-top:0;padding-top:0}
body .sw-home-v301 .sw-path .sw-num{
  font-family:var(--h-serif);font-size:1.5rem;font-weight:400;
  color:var(--h-gold);line-height:1;padding-top:.25rem;grid-row:1 / span 3;
}
body .sw-home-v301 .sw-path h3{
  font-size:clamp(1.45rem,1.9vw,1.85rem);line-height:1.14;margin:0 0 .5rem;
}
/* one dominant pathway */
body .sw-home-v301 .sw-path:first-of-type h3{font-size:clamp(1.85rem,2.5vw,2.4rem)}
body .sw-home-v301 .sw-path p{
  font-size:1.0625rem;line-height:1.7;color:var(--h-ink-soft);margin:0 0 1rem;max-width:46ch;
}
body .sw-home-v301 .sw-group-route{
  margin-top:clamp(2rem,3vw,2.75rem);padding-top:1.75rem;
  border-top:1px solid var(--h-hair);
  background:none;border-radius:0;box-shadow:none;
}
body .sw-home-v301 .sw-group-route strong{
  display:block;font-family:var(--h-sans);font-size:.85rem;
  letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  color:var(--h-olive);margin:0 0 .5rem;
}
body .sw-home-v301 .sw-group-route p{font-size:1rem;line-height:1.66;margin:0;max-width:44ch}

/* ==========================================================================
   DISCOVERY — Kruger chapter
   An immersive pause. Deep warm ground, the photograph given the dominant
   share. `.sw-kruger-main` preserved exactly as it is.
   ========================================================================== */
body .sw-home-v301 .sw-kruger{
  background:var(--h-olive-deep);
  color:var(--h-on-dark);
}
body .sw-home-v301 .sw-kruger h2,
body .sw-home-v301 .sw-kruger h3{color:#FCFAF4}
body .sw-home-v301 .sw-kruger p{color:var(--h-on-dark-soft)}
body .sw-home-v301 .sw-kruger .sw-eyebrow{color:var(--h-on-dark-soft)}
body .sw-home-v301 .sw-kruger .sw-eyebrow::after{background:var(--h-gold)}
body .sw-home-v301 .sw-kruger-grid{
  display:grid;grid-template-columns:minmax(0,58%) minmax(0,1fr);
  gap:clamp(2.5rem,5vw,5.5rem);align-items:center;
}
body .sw-home-v301 .sw-kruger-grid > figure.sw-kruger-main{
  margin:0;overflow:hidden;min-width:0;
}
body .sw-home-v301 .sw-kruger-grid > figure.sw-kruger-main img{
  width:100%;height:auto;display:block;
}
body .sw-home-v301 .sw-kruger h2{
  font-size:clamp(2.35rem,3.6vw,3.5rem);line-height:1.07;max-width:16ch;margin:0 0 1.2rem;
}
body .sw-home-v301 .sw-kruger .sw-lead{
  font-size:clamp(1.1rem,1.3vw,1.3rem);line-height:1.64;
  color:var(--h-on-dark);max-width:40ch;margin:0 0 2rem;
}
body .sw-home-v301 .sw-kruger .sw-kpath{
  border-top:1px solid var(--h-hair-dark);padding:1.5rem 0 0;margin:0 0 1.5rem;
  background:none;border-radius:0;box-shadow:none;
}
body .sw-home-v301 .sw-kruger .sw-kpath h3{
  font-size:clamp(1.3rem,1.6vw,1.6rem);line-height:1.16;margin:0 0 .45rem;
}
body .sw-home-v301 .sw-kruger .sw-kpath p{font-size:1rem;line-height:1.68;margin:0 0 .9rem;max-width:40ch}
body .sw-home-v301 .sw-kruger .sw-home-link{
  color:var(--h-on-dark);border-bottom-color:var(--h-gold);
}
body .sw-home-v301 .sw-kruger .sw-home-link:hover{color:#fff}

/* ==========================================================================
   PEOPLE — image-light by design, intentionally restrained
   No placeholder, no brief on screen, no corporate team grid.
   ========================================================================== */
body .sw-home-v301 .sw-people{background:var(--h-limestone)}
/* the figure is empty until the P0 shoot; hide it rather than show a hole */
body .sw-home-v301 .sw-people .sw-people-grid > figure:empty,
body .sw-home-v301 .sw-people .sw-photo:not(:has(img)){display:none}
body .sw-home-v301 .sw-people-grid{
  display:grid;grid-template-columns:minmax(0,34%) minmax(0,1fr);
  gap:clamp(2.5rem,5vw,6rem);align-items:start;
}
/* with no photograph the copy takes the full measure, but stays a two-column
   editorial rather than a single wide slab */
body .sw-home-v301 .sw-people-grid:not(:has(img)){
  grid-template-columns:minmax(0,38%) minmax(0,1fr);
}
body .sw-home-v301 .sw-people h2{
  font-size:clamp(2.35rem,3.6vw,3.5rem);line-height:1.07;max-width:16ch;margin:0 0 1.2rem;
}
body .sw-home-v301 .sw-people .sw-lead{
  font-size:clamp(1.1rem,1.35vw,1.34rem);line-height:1.64;
  color:var(--h-ink-soft);max-width:44ch;margin:0 0 2.25rem;
}
body .sw-home-v301 .sw-people .sw-kpath{
  border-top:1px solid var(--h-hair);padding:1.5rem 0 0;margin:0 0 1.5rem;
  background:none;border-radius:0;box-shadow:none;
}
body .sw-home-v301 .sw-people .sw-kpath h3{
  font-size:clamp(1.25rem,1.5vw,1.5rem);line-height:1.18;margin:0 0 .45rem;
}
body .sw-home-v301 .sw-people .sw-kpath p{font-size:1.0625rem;line-height:1.7;margin:0;max-width:46ch}
body .sw-home-v301 .sw-people-proof{
  margin-top:clamp(2rem,3vw,2.5rem);padding-top:1.5rem;
  border-top:1px solid var(--h-hair);
  font-size:1rem;color:var(--h-ink-faint);max-width:50ch;
}

/* ==========================================================================
   TRUST — Travel guide. Typographic, quiet, no forced imagery.
   ========================================================================== */
body .sw-home-v301 .sw-guide{background:var(--h-ivory)}
body .sw-home-v301 .sw-guide-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(3rem,6vw,6rem);row-gap:0;
}
body .sw-home-v301 .sw-guide-item{
  background:none;border:0;border-radius:0;box-shadow:none;padding:0;
  border-top:1px solid var(--h-hair);
  padding-block:clamp(2rem,3vw,2.5rem);margin:0;min-width:0;
}
body .sw-home-v301 .sw-guide-item .sw-eyebrow{
  margin:0 0 .65rem;color:var(--h-ink-faint);font-size:.72rem!important;
}
body .sw-home-v301 .sw-guide-item .sw-eyebrow::after{display:none}
body .sw-home-v301 .sw-guide-item h3{
  font-size:clamp(1.45rem,1.85vw,1.8rem);line-height:1.16;margin:0 0 .55rem;
}
body .sw-home-v301 .sw-guide-item p{
  font-size:1.0625rem;line-height:1.7;color:var(--h-ink-soft);margin:0 0 1rem;max-width:44ch;
}

/* ==========================================================================
   TRUST — Group (warm, human) and Travel Trade (precise, professional)
   The distinction is preserved through ground and weight, not through
   a large gloomy black block.
   ========================================================================== */
body .sw-home-v301 .sw-group{background:var(--h-linen)}
body .sw-home-v301 .sw-trade{
  background:var(--h-timber);color:var(--h-on-dark);
}
body .sw-home-v301 .sw-trade h2,
body .sw-home-v301 .sw-trade h3{color:#FCFAF4}
body .sw-home-v301 .sw-trade p{color:var(--h-on-dark-soft)}
body .sw-home-v301 .sw-trade .sw-eyebrow{color:var(--h-on-dark-soft)}
body .sw-home-v301 .sw-trade .sw-eyebrow::after{background:var(--h-gold)}
body .sw-home-v301 .sw-trade .sw-home-link{color:var(--h-on-dark);border-bottom-color:var(--h-gold)}
body .sw-home-v301 .sw-trade .sw-home-link:hover{color:#fff}

body .sw-home-v301 .sw-ops-grid{
  display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);
  gap:clamp(2.5rem,5vw,6rem);align-items:start;
}
body .sw-home-v301 .sw-ops-grid h2{
  font-size:clamp(2.1rem,3.2vw,3.1rem);line-height:1.08;max-width:17ch;margin:0 0 1.15rem;
}
body .sw-home-v301 .sw-ops-grid .sw-lead{
  font-size:clamp(1.08rem,1.3vw,1.28rem);line-height:1.64;max-width:42ch;margin:0 0 1.75rem;
}
body .sw-home-v301 .sw-audiences{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(2rem,3.5vw,3.5rem);row-gap:0;
}
body .sw-home-v301 .sw-audience,
body .sw-home-v301 .sw-client{
  background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;
  border-top:1px solid var(--h-hair);padding-block:1.5rem;min-width:0;
}
body .sw-home-v301 .sw-trade .sw-audience,
body .sw-home-v301 .sw-trade .sw-client{border-top-color:var(--h-hair-dark)}
body .sw-home-v301 .sw-audience h3,
body .sw-home-v301 .sw-client h3{
  font-size:clamp(1.15rem,1.4vw,1.4rem);line-height:1.2;margin:0 0 .45rem;
}
body .sw-home-v301 .sw-audience p,
body .sw-home-v301 .sw-client p{font-size:1rem;line-height:1.66;margin:0;max-width:38ch}
body .sw-home-v301 .sw-trade-actions{
  display:flex;flex-wrap:wrap;gap:1.5rem 2.5rem;margin-top:1.75rem;
}

/* ==========================================================================
   ENQUIRE — final. A concierge invitation, not a CTA banner.
   No safe photograph exists, so this is composed in stone and olive with the
   type doing the work.
   ========================================================================== */
body .sw-home-v301 .sw-final{
  background:var(--h-olive-deep);
  color:var(--h-on-dark);
  position:relative;isolation:isolate;overflow:hidden;
  padding-block:clamp(6rem,11vw,12rem);
}
body .sw-home-v301 .sw-final::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(120% 90% at 82% 112%, rgba(95,98,56,.55) 0%, rgba(61,64,38,0) 62%),
    radial-gradient(80% 60% at 8% -8%, rgba(169,138,75,.14) 0%, rgba(169,138,75,0) 60%);
}
body .sw-home-v301 .sw-final .sw-final-inner{position:relative;z-index:2;max-width:64rem}
body .sw-home-v301 .sw-final .sw-eyebrow{color:var(--h-on-dark-soft)}
body .sw-home-v301 .sw-final .sw-eyebrow::after{background:var(--h-gold)}
body .sw-home-v301 .sw-final h2{
  font-size:clamp(2.8rem,5.2vw,5rem);line-height:1.02;letter-spacing:-.015em;
  color:#FCFAF4;max-width:15ch;margin:0 0 1.5rem;
}
body .sw-home-v301 .sw-final .sw-lead{
  font-size:clamp(1.15rem,1.45vw,1.45rem);line-height:1.6;
  color:var(--h-on-dark);max-width:46ch;margin:0 0 2.75rem;
}
body .sw-home-v301 .sw-final .sw-btn-primary{
  background:var(--h-on-dark);color:var(--h-ink);
  border:1px solid var(--h-on-dark);border-radius:0!important;
  font-family:var(--h-sans);font-size:.9rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;
  padding:1.15rem 2.6rem;min-height:56px;
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;
  transition:background .45s cubic-bezier(.32,.72,0,1);
}
body .sw-home-v301 .sw-final .sw-btn-primary:hover{background:#fff}
body .sw-home-v301 .sw-final-routes{
  display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2.25rem;
  margin-top:clamp(2.75rem,4vw,3.5rem);padding-top:2rem;
  border-top:1px solid var(--h-hair-dark);
}
body .sw-home-v301 .sw-final-routes > span:first-child{
  font-family:var(--h-sans);font-size:.75rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--h-on-dark-soft);
}
body .sw-home-v301 .sw-final-routes .sw-home-link{
  color:var(--h-on-dark);border-bottom-color:var(--h-gold);
}
body .sw-home-v301 .sw-final-routes .sw-home-link:hover{color:#fff}

/* ==========================================================================
   RESPONSIVE — recomposed, not stacked
   ========================================================================== */
@media (max-width:1024px){
  body .sw-home-v301 .sw-proof3{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:2rem}
  body .sw-home-v301 .sw-proof3 .sw-rule:nth-child(odd){border-left:0;padding-left:0}
  body .sw-home-v301 .sw-value{grid-template-columns:minmax(0,1fr);gap:1.25rem}
  body .sw-home-v301 .sw-section-head{grid-template-columns:minmax(0,1fr);align-items:start}
  /* explore: dominant full width, then a pair, then the rest */
  body .sw-home-v301 .sw-dest-feature:nth-child(1){grid-column:1 / -1}
  body .sw-home-v301 .sw-dest-feature:nth-child(2){grid-column:1 / span 6}
  body .sw-home-v301 .sw-dest-feature:nth-child(n+3){grid-column:span 6}
  body .sw-home-v301 .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:16/9}
  body .sw-home-v301 .sw-travel-grid,
  body .sw-home-v301 .sw-kruger-grid,
  body .sw-home-v301 .sw-people-grid,
  body .sw-home-v301 .sw-people-grid:not(:has(img)),
  body .sw-home-v301 .sw-ops-grid{
    grid-template-columns:minmax(0,1fr);gap:clamp(2rem,4vw,3rem);
  }
  body .sw-home-v301 .sw-guide-grid{column-gap:3rem}
  body .sw-home-hero{min-height:min(78vh,720px)}
}

@media (max-width:600px){
  :root{--h-chapter:clamp(3.5rem,12vw,5rem)}
  body .sw-home-hero{min-height:min(92vh,760px);align-items:flex-end}
  body .sw-home-hero h1{max-width:13ch}
  body .sw-home-hero .sw-home-position{max-width:34ch;margin-bottom:2rem}
  body .sw-home-hero .wp-block-buttons{
    flex-direction:column;align-items:flex-start;gap:1.5rem!important;
  }
  body .sw-home-hero .wp-block-button,
  body .sw-home-hero .wp-block-button .wp-element-button{width:100%}
  body .sw-home-hero .is-style-outline .wp-element-button{width:auto}
  /* proof band becomes a stacked hairline list, never 2x2 crush */
  body .sw-home-v301 .sw-proof3{grid-template-columns:minmax(0,1fr);row-gap:0}
  body .sw-home-v301 .sw-proof3 .sw-rule{
    border-left:0;padding:1.35rem 0;border-top:1px solid var(--h-hair);
  }
  body .sw-home-v301 .sw-proof3 .sw-rule:first-child{border-top:0;padding-top:0}
  /* explore: single column, dominant keeps a portrait crop for presence */
  body .sw-home-v301 .sw-explore-feature{grid-template-columns:minmax(0,1fr);row-gap:3rem}
  body .sw-home-v301 .sw-dest-feature:nth-child(n){grid-column:1}
  body .sw-home-v301 .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:4/5}
  body .sw-home-v301 .sw-dest-feature:nth-child(2) .sw-home-photo{aspect-ratio:3/2}
  body .sw-home-v301 .sw-dest-feature:nth-child(n+3) .sw-home-photo{aspect-ratio:3/2}
  body .sw-home-v301 .sw-dest-feature:nth-child(n+3) h3{font-size:1.35rem}
  /* travel: number sits above its step */
  body .sw-home-v301 .sw-path{grid-template-columns:minmax(0,1fr);row-gap:.35rem}
  body .sw-home-v301 .sw-path .sw-num{grid-row:auto;padding-top:0}
  body .sw-home-v301 .sw-guide-grid{grid-template-columns:minmax(0,1fr)}
  body .sw-home-v301 .sw-audiences{grid-template-columns:minmax(0,1fr)}
  body .sw-home-v301 .sw-final-routes{gap:.85rem 1.5rem}
}

@media (prefers-reduced-motion:reduce){
  body .sw-home-v301 *{transition:none!important;animation:none!important}
  body .sw-home-v301 .sw-dest-feature:hover .sw-home-photo img{transform:none}
}
/* ================= end HOMEPAGE COMPOSITION LAYER ================= */

/* ==========================================================================
   CORRECTIONS — measured on the deployed page, not assumed
   --------------------------------------------------------------------------
   1. EXPLORE. The section contains exactly TWO destination features, and a
      12-column track set collapsed against them: item 1 measured 156px wide
      (its seven tracks all resolved to 0) while item 2 took 883px. A
      two-column asymmetric grid expresses the same composition — Kruger
      dominant, Johannesburg secondary — without depending on fr distribution
      across tracks that contain no items.
      The existing rule is `.sw-home-v301 .sw-explore-feature` (0,2,0) with
      `grid-template-columns:1.7fr 1fr`, so this is matched above it.

   2. HERO DISPLAY. `.sw-home .sw-home-hero h1` (0,2,1) caps the headline at
      clamp(42px,5.7vw,74px). The homepage is the emotional flagship and has
      to exceed accommodation's 80px, so it is matched at (0,3,1).
   ========================================================================== */
body .sw-home-v301 .sw-explore-feature{
  display:grid;
  grid-template-columns:minmax(0,58%) minmax(0,1fr);
  column-gap:clamp(2.5rem,4vw,4.5rem);
  row-gap:clamp(3.5rem,6vw,6rem);
  align-items:start;
}
body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(n){
  grid-column:auto;min-width:0;
}
body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:3/2}
body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(2) .sw-home-photo{aspect-ratio:4/5}

/* hero display, at winning specificity */
body .sw-home-v301 .sw-hero.sw-home-hero h1{
  /* `.sw-home-hero h1` declares its size with !important and no media query,
     so specificity cannot reach it; matched in kind. */
  font-size:clamp(3.4rem,6.6vw,6.1rem)!important;
  line-height:.99;letter-spacing:-.018em;
  color:#FCFAF4;max-width:15ch;margin:0 0 1.75rem;
}
body .sw-home-v301 .sw-hero.sw-home-hero .sw-home-position{
  font-size:clamp(1.19rem,1.45vw,1.45rem);
  line-height:1.56;max-width:40ch;
}

@media (max-width:1024px){
  body .sw-home-v301 .sw-explore-feature{
    grid-template-columns:minmax(0,1fr);row-gap:3rem;
  }
  body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:16/9}
  body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(2) .sw-home-photo{aspect-ratio:3/2}
}
@media (max-width:600px){
  body .sw-home-v301 .sw-explore-feature > .sw-dest-feature:nth-child(1) .sw-home-photo{aspect-ratio:4/5}
}

/* The hero sits OUTSIDE `.sw-home-v301` (it is a sibling inside the
   `.sw-home-v308-shell` wrapper), so a v301-scoped selector never matched it.
   Scoped to `.sw-home` instead, at (0,3,1) to clear
   `.sw-home .sw-home-hero h1` (0,2,1). */
body .sw-home .sw-hero.sw-home-hero h1{
  /* `.sw-home-hero h1` declares its size with !important and no media query,
     so specificity cannot reach it; matched in kind. */
  font-size:clamp(3.4rem,6.6vw,6.1rem)!important;
  line-height:.99;letter-spacing:-.018em;
  color:#FCFAF4;max-width:15ch;margin:0 0 1.75rem;
}
body .sw-home .sw-hero.sw-home-hero .sw-home-position{
  font-size:clamp(1.19rem,1.45vw,1.45rem);line-height:1.56;max-width:40ch;
}
@media (max-width:600px){
  body .sw-home .sw-hero.sw-home-hero h1{
    font-size:clamp(2.6rem,10vw,3.1rem)!important;max-width:13ch!important;
  }
  body .sw-home .sw-hero.sw-home-hero .sw-home-position{
    font-size:1.0625rem!important;max-width:34ch!important;
  }
}

/* The hero's own wrap is also outside `.sw-home-v301`, so it kept a narrow
   centred measure (copy started at x=414 against the page's ~190 gutter),
   which read as a centred layout inconsistent with every section below it.
   Aligned to the same wrap and gutter as the rest of the page. */
body .sw-home .sw-home-hero .sw-hero-copy{
  max-width:var(--h-wrap);
  margin-inline:auto;
  padding-inline:var(--h-gut);
  width:100%;
}
body .sw-home .sw-home-hero .sw-home-hero-note{
  color:var(--h-on-dark-soft);
  font-size:.875rem;letter-spacing:.02em;max-width:46ch;margin:2.75rem 0 0;
}
body .sw-home .sw-home-hero .sw-home-hero-note a{color:var(--h-on-dark-soft)}

/* ==========================================================================
   SECTION-BY-SECTION REVIEW CORRECTIONS (3.3.5)
   Every item below was found by capturing the deployed section and looking
   at it. None was visible in the collision audit, which passed 0/0/0 - the
   audit measures overlap, not composition.
   ========================================================================== */

/* --- TRAVEL YOUR WAY. The two-column grid on .sw-path collapsed: .sw-num is
       out of flow, so the h3 took the auto column and the paragraph was
       squeezed into ~150px with one or two words per line. A block stack is
       the deterministic composition; the numeral becomes a quiet gold serif
       marker above the route name. --- */
body .sw-home-v301 .sw-path{
  display:block;
  padding:clamp(1.75rem,2.5vw,2.25rem) 0;margin:0;
  border-top:1px solid var(--h-hair);
  background:none;border-radius:0;box-shadow:none;
}
body .sw-home-v301 .sw-path:first-of-type{border-top:0;padding-top:0}
body .sw-home-v301 .sw-path .sw-num{
  display:block;position:static;
  font-family:var(--h-serif);font-size:1.15rem;font-weight:400;
  color:var(--h-gold);line-height:1;margin:0 0 .75rem;letter-spacing:.04em;
}
body .sw-home-v301 .sw-path h3{
  display:block;font-size:clamp(1.6rem,2.1vw,2.05rem);line-height:1.12;margin:0 0 .6rem;
}
body .sw-home-v301 .sw-path:first-of-type h3{font-size:clamp(1.95rem,2.6vw,2.5rem)}
body .sw-home-v301 .sw-path p{
  display:block;font-size:1.0625rem;line-height:1.7;color:var(--h-ink-soft);
  margin:0 0 1.1rem;max-width:46ch;
}
/* the safari route is the dominant pathway: it carries the photograph, and
   its copy sits INSIDE the figure, so the figure is a normal block and the
   copy flows beneath the image - no forced height. */
body .sw-home-v301 .sw-safari-feature{
  background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;min-width:0;
}
body .sw-home-v301 .sw-safari-feature > .sw-num{
  display:block;font-family:var(--h-serif);font-size:1.15rem;
  color:var(--h-gold);line-height:1;margin:0 0 .9rem;letter-spacing:.04em;
}
body .sw-home-v301 .sw-safari-feature .sw-home-photo{
  margin:0;padding:0;height:auto!important;background:none;overflow:visible;
}
body .sw-home-v301 .sw-safari-feature .sw-home-photo img{
  width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;
  margin:0 0 1.6rem;
}
body .sw-home-v301 .sw-safari-feature .sw-eyebrow{margin:0 0 .7rem}
body .sw-home-v301 .sw-safari-feature .sw-eyebrow::after{display:none}
body .sw-home-v301 .sw-safari-feature h3{
  font-size:clamp(2rem,2.7vw,2.6rem);line-height:1.1;margin:0 0 .65rem;
}
body .sw-home-v301 .sw-safari-feature p{
  font-size:1.0625rem;line-height:1.7;color:var(--h-ink-soft);margin:0 0 1.2rem;max-width:46ch;
}

/* --- KRUGER. Photograph ended at ~460px beside ~1400px of copy, leaving a
       dark hole - the same air-below-image failure as the rate section. The
       figure now stretches to the row and the image covers it. Only the
       kruger-main figure is touched; the site :not(.sw-kruger-main) fix
       governs the other photos and is untouched. --- */
@media (min-width:1025px){
  body .sw-home-v301 .sw-kruger-grid{align-items:stretch}
  body .sw-home-v301 .sw-kruger-grid > figure.sw-kruger-main{
    display:flex;align-self:stretch;min-height:clamp(30rem,40vw,44rem);
  }
  body .sw-home-v301 .sw-kruger-grid > figure.sw-kruger-main img{
    width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block;
  }
}
/* the insight callout was a pale box whose text the dark-ground colour rule
   turned near-invisible. On this ground it is a transparent aside on a gold
   rule - no white rectangle on olive. */
body .sw-home-v301 .sw-kruger .sw-insight{
  background:transparent!important;border:0;border-left:1px solid var(--h-gold);
  border-radius:0;box-shadow:none;padding:.35rem 0 .35rem 1.5rem;margin:2rem 0 0;
}
body .sw-home-v301 .sw-kruger .sw-insight strong{
  display:block;font-family:var(--h-sans);font-size:.78rem;letter-spacing:.17em;
  text-transform:uppercase;font-weight:500;color:var(--h-gold);margin:0 0 .6rem;
}
body .sw-home-v301 .sw-kruger .sw-insight p{
  color:var(--h-on-dark-soft);font-size:1rem;line-height:1.68;margin:0;max-width:44ch;
}

/* --- PEOPLE. With the figure hidden the single copy div sat in a 38% column
       and the right 60% of the chapter was empty - an accidental blank hole.
       The copy now spans the full measure and composes itself as an editorial
       two-column: heading and lead left, the three roles and the closing
       statement right. --- */
body .sw-home-v301 .sw-people-grid:not(:has(img)){
  grid-template-columns:minmax(0,1fr);
}
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div{
  display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr);
  column-gap:clamp(3rem,6vw,7rem);row-gap:0;align-items:start;
}
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-eyebrow,
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > h2,
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-lead{grid-column:1}
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-kpath,
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-people-proof,
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-home-link{grid-column:2}
body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-kpath:first-of-type{
  grid-row:1 / span 1;
}
/* the proof statement takes the display face, which also retires the stray
   InstrumentSerif-Italic download */
body .sw-home-v301 .sw-people-proof{
  font-family:var(--h-serif);font-style:normal;font-weight:400;
  font-size:clamp(1.35rem,1.7vw,1.7rem);line-height:1.38;color:var(--h-ink);
  margin:0;padding-top:1.6rem;border-top:1px solid var(--h-hair);max-width:30ch;
}

/* --- FINAL. text-align:center left the gold rule of the eyebrow orphaned at
       the left edge and wrapped the route list onto a stranded second line.
       The whole page is left-aligned editorial, so the invitation is too. --- */
body .sw-home-v301 .sw-final .sw-final-inner{text-align:left}
body .sw-home-v301 .sw-final-routes{justify-content:flex-start}

@media (max-width:1024px){
  body .sw-home-v301 .sw-people-grid:not(:has(img)) > div{grid-template-columns:minmax(0,1fr)}
  /* 3.5.4: `> *` is (0,2,3) and lost to the desktop `> .sw-kpath / .sw-people-proof /
     .sw-home-link {grid-column:2}` at (0,3,3). The kept column-2 placement created an
     implicit track that squeezed the declared 1fr to 0 px — at 390 the heading printed
     one letter per line. :is(*, .sw-kpath) matches (0,3,3) and wins by order; the pinned
     first role card is released so the reading order stays eyebrow → heading → lead → roles. */
  body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > :is(*, .sw-kpath){grid-column:1;grid-row:auto}
  body .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-kpath:first-of-type{grid-row:auto}
}

/* ==========================================================================
   SECOND SECTION REVIEW (3.3.6)
   Found by capturing 3.3.5 and looking at it, plus a rule dump on the
   deployed page. The homepage generation prefixes its rules with `body.home`,
   which is one class unit above `body .sw-home-v301`; the fixes below match
   that prefix and come later, so nothing needs !important.
   ========================================================================== */

/* --- PEOPLE. The 38/62 grid shared rows between the two columns, so "Our
       Team" was aligned to the tall heading row and left orphaned at the top,
       and the closing link collapsed against the proof quote. Two independent
       floated stacks give each column its own flow with no markup change. --- */
@media (min-width:1025px){
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div{
    display:block;overflow:hidden;
  }
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-eyebrow,
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > h2,
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-lead{
    float:left;clear:left;width:38%;grid-column:auto;
  }
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-kpath,
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-people-proof,
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-home-link{
    float:right;clear:right;width:calc(62% - clamp(3rem,6vw,7rem));grid-column:auto;
  }
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-home-link{
    margin-top:1.75rem;width:auto;
  }
}

/* the proof statement: matched at body.home so the display face applies and
   the italic is retired - which also stops InstrumentSerif-Italic downloading */
body.home .sw-home-v301 .sw-people-proof{
  font-family:var(--h-serif);font-style:normal;font-weight:400;
  font-size:clamp(1.35rem,1.7vw,1.7rem);line-height:1.38;color:var(--h-ink);
}

/* --- APPROACH. The value statement heading was the second Instrument Serif
       holdout; same prefix, same fix. --- */
body.home .sw-home-v301 .sw-value h3{
  font-family:var(--h-serif);font-weight:400;
}

/* --- TRAVEL. The route numerals were hidden by
       body.home .sw-home-v301 .sw-travel .sw-num { display:none }.
       Restored as quiet gold serif markers above each route name. --- */
body.home .sw-home-v301 .sw-travel .sw-path .sw-num,
body.home .sw-home-v301 .sw-travel .sw-safari-feature > .sw-num{
  display:block;position:static;
  font-family:var(--h-serif);font-size:1.15rem;font-weight:400;
  color:var(--h-gold);line-height:1;margin:0 0 .75rem;letter-spacing:.04em;
}

/* --- FINAL. Left-aligning the text left the inner block itself centred
       (copy at x=265 against the page gutter of 188) and the CTA centred
       within it, and the route label still pushed a link to a second line.
       The inner now sits on the page gutter, the CTA leads, and the label
       takes its own row so the four routes sit together. --- */
body.home .sw-home-v301 .sw-final .sw-final-inner{
  text-align:left;margin-inline:0;max-width:64rem;
}
body.home .sw-home-v301 .sw-final .sw-buttons{
  display:flex;justify-content:flex-start;
}
body.home .sw-home-v301 .sw-final-routes{
  justify-content:flex-start;
}
body.home .sw-home-v301 .sw-final-routes > span:first-child{
  flex-basis:100%;margin-bottom:.35rem;
}

/* ==========================================================================
   FINAL INNER ALIGNMENT (3.3.7)
   3.3.6 set margin-inline:0 on .sw-final-inner to stop it centring. Measured
   on the deployed page that pushed the block to x=0 with the CTA at 58px -
   off the page gutter entirely. The inner was taking its horizontal position
   from auto margins, so removing them was the wrong lever.
   Correct lever: the inner is the page wrap (max-width, auto margins, gutter
   padding) and the COPY measure is constrained on the children. Content then
   lands on the same gutter as the hero (~188px at 1440).
   ========================================================================== */
body.home .sw-home-v301 .sw-final .sw-final-inner{
  max-width:var(--h-wrap);
  margin-inline:auto;
  padding-inline:var(--h-gut);
  width:100%;
  text-align:left;
}
body.home .sw-home-v301 .sw-final h2{max-width:15ch}
body.home .sw-home-v301 .sw-final .sw-lead{max-width:46ch}
body.home .sw-home-v301 .sw-final-routes{max-width:64rem}

/* ==========================================================================
   FINAL INNER GUTTER (3.3.8)
   Measured on 3.3.7: every sibling wrap renders at width 1180 / box-left 130
   (the site caps .sw-wrap at 1180px), giving content at x=188. The final
   inner alone rendered at width 1280 / box-left 80 because 3.3.7 forced
   max-width:var(--h-wrap) (1280px) at body.home specificity, beating that
   cap - content at x=138, a 50px gutter mismatch against the hero and every
   other section. Matched to the measured sibling value.
   ========================================================================== */
body.home .sw-home-v301 .sw-final .sw-final-inner{
  max-width:1180px;
}

/* ==========================================================================
   PEOPLE RIGHT COLUMN ALIGNMENT (3.3.9)
   Measured on 3.3.8: the three roles align to the column edge at x=680, but
   the proof statement (max-width:30ch) and the closing link (width:auto)
   are float:right with shrink-to-fit widths, so they pack against the right
   edge at x=772 and x=938 - a ragged column. Both now fill the column width
   so their left edges align with the roles above them.
   ========================================================================== */
@media (min-width:1025px){
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-people-proof{
    max-width:none;
    width:calc(62% - clamp(3rem,6vw,7rem));
  }
  body.home .sw-home-v301 .sw-people-grid:not(:has(img)) > div > .sw-home-link{
    width:calc(62% - clamp(3rem,6vw,7rem));
    text-align:left;
  }
}

/* ==========================================================================
   FINAL ART-DIRECTION REFINEMENT (3.4.0) - direction approved at 3.3.9
   No redesign, no content-architecture change. Four adjustments, plus two
   future photograph slots composed now so the genuine P0 imagery drops in
   without another pass. No supplier photography added to fake rhythm.
   ========================================================================== */

/* --- 1. HERO. The second action was already demoted in computed terms, but
       `.sw-home-hero .spw-btn + .spw-btn ... { border:1px solid !important }`
       forces a box on all four sides - the outlined rectangle. Matched in
       kind: a single hairline beneath the text, nothing else. The supporting
       line was locked at 13px !important, too weak at desktop. --- */
body .sw-home .sw-home-hero .is-style-outline .wp-block-button__link,
body .sw-home .sw-home-hero .is-style-outline .wp-element-button{
  border-width:0 0 1px 0!important;
  border-style:solid!important;
  border-color:rgba(246,242,233,.42)!important;
  border-radius:0!important;
  padding:0 0 .4rem 0!important;
  background:transparent!important;
  min-height:0;
  font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  color:var(--h-on-dark);
  transition:border-color .45s cubic-bezier(.32,.72,0,1),color .45s cubic-bezier(.32,.72,0,1);
}
body .sw-home .sw-home-hero .is-style-outline .wp-block-button__link:hover,
body .sw-home .sw-home-hero .is-style-outline .wp-element-button:hover{
  border-color:var(--h-gold)!important;color:#fff;
}
/* reduce competition: the two actions share a baseline, with more air between */
body .sw-home .sw-home-hero .wp-block-buttons{
  gap:2.75rem!important;align-items:center;
}
body .sw-home .sw-home-hero .sw-home-hero-note{
  font-size:1rem!important;
  line-height:1.6;
  color:var(--h-on-dark-soft)!important;
  max-width:44ch;margin:2.75rem 0 0;
}

/* --- 3. PEOPLE - the future documentary slot, composed now.
       The markup already carries an empty <figure class="sw-photo spw-pi-frame">.
       Today it holds no image and is hidden, and the copy composes as two
       floated stacks (3.3.6/3.3.9). The moment a genuine photograph is set
       on that figure, this branch takes over: content 58% left, portrait
       image 42% right, no other change. Intended image: a real Spurwing
       guide or staff member, candid, in operation, not looking at camera.
       No placeholder, no AI person, ever. --- */
@media (min-width:1025px){
  body.home .sw-home-v301 .sw-people-grid:has(img){
    display:grid;
    grid-template-columns:minmax(0,58%) minmax(0,1fr);
    column-gap:clamp(3rem,5vw,5.5rem);
    align-items:start;
  }
  body.home .sw-home-v301 .sw-people-grid:has(img) > figure{
    display:block;order:2;margin:0;padding:0;
    border:0;background:none;box-shadow:none;
    align-self:stretch;
  }
  body.home .sw-home-v301 .sw-people-grid:has(img) > figure img{
    width:100%;height:100%;min-height:clamp(30rem,40vw,42rem);
    aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;display:block;
  }
  body.home .sw-home-v301 .sw-people-grid:has(img) > div{
    order:1;display:block;overflow:visible;
  }
  /* with a photograph beside it the copy runs as one measured column */
  body.home .sw-home-v301 .sw-people-grid:has(img) > div > *{
    float:none;width:auto;clear:none;
  }
  body.home .sw-home-v301 .sw-people-grid:has(img) > div > .sw-lead{max-width:44ch}
  body.home .sw-home-v301 .sw-people-grid:has(img) > div > .sw-kpath p{max-width:46ch}
  body.home .sw-home-v301 .sw-people-grid:has(img) > div > .sw-people-proof{max-width:34ch}
}
/* the empty frame must never show a border or a hole at any width */
body.home .sw-home-v301 .sw-people .spw-pi-frame:not(:has(img)),
body.home .sw-home-v301 .sw-people .sw-photo:not(:has(img)){
  display:none!important;
}

/* --- 4. GROUP TRAVEL. Composition kept. The supporting right-hand copy
       breathes: shorter measure, more internal air, a wider gutter between
       the two audience columns. Still hairlines, not cards. --- */
body.home .sw-home-v301 .sw-group .sw-audiences{
  column-gap:clamp(2.75rem,4.5vw,4.5rem);
}
body.home .sw-home-v301 .sw-group .sw-audience{
  padding-block:1.9rem;
}
body.home .sw-home-v301 .sw-group .sw-audience h3{
  margin:0 0 .6rem;
}
body.home .sw-home-v301 .sw-group .sw-audience p{
  max-width:32ch;line-height:1.7;
}

/* --- 5. TRAVEL TRADE. Intentionally unchanged: precise, premium,
       operational. Not darker than the warm timber it already sits on. --- */

/* --- 2/7. FINAL - the future photographic close, composed now.
       The section has no figure in its markup today and closes in stone and
       olive with the type doing the work, which is approved. When a genuine
       Spurwing operational photograph exists (guest welcome, vehicle in
       use), add `<figure class="sw-final__media"><img ...></figure>` as the
       FIRST child of .sw-final and this branch composes it exactly like the
       accommodation close: full-bleed, warm left-to-right scrim, copy
       unchanged. --- */
body.home .sw-home-v301 .sw-final:has(.sw-final__media img){
  background:var(--h-olive-deep);
}
body.home .sw-home-v301 .sw-final:has(.sw-final__media img)::before{
  background:linear-gradient(to right,rgba(28,25,18,.86) 0%,rgba(28,25,18,.60) 42%,rgba(28,25,18,.22) 100%);
}
body.home .sw-home-v301 .sw-final .sw-final__media{
  position:absolute;inset:0;margin:0;z-index:0;
}
body.home .sw-home-v301 .sw-final .sw-final__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block;
}
body.home .sw-home-v301 .sw-final:has(.sw-final__media img) .sw-final-inner{
  position:relative;z-index:2;
}
@media (max-width:600px){
  body.home .sw-home-v301 .sw-final:has(.sw-final__media img)::before{
    background:linear-gradient(to top,rgba(28,25,18,.90) 0%,rgba(28,25,18,.55) 48%,rgba(28,25,18,.20) 100%);
  }
}
/* ==========================================================================
   SPURWING — DESTINATION COMPOSITION LAYER (3.5.0)
   --------------------------------------------------------------------------
   Scoped to `.sw-hub-v300` (the destination hubs: /greater-kruger/,
   /madikwe/ and siblings). Shares the approved language with accommodation
   3.2.0 and homepage 3.4.0 — Cormorant display, Karla text, ivory / linen /
   olive / gold, hairlines not cards, one CTA language, photographs that keep
   their size — and composes every section for this template. Nothing here
   uses an accommodation or homepage selector.

   The benchmark is the homepage Kruger chapter: image, large type,
   restrained detail, clear choices, colour. Every section below is built to
   that balance.

   MEASURED BEFORE (3.4.0 live, 1440):
     hero            h1 80px Cormorant, copy at x=130 while every body
                     section sits at x=192 — a 62px gutter mismatch
     photo-open      1056px inset frame, 21/9
     text chapters   single column, h2 860px measure, p 608px
     photo-split     7fr/5fr, image 570px wide, copy centred beside it
     with-spurwing   5fr/6fr; on the non-flip page the media was pulled
                     202px LEFT over the heading (defect — global repair
                     fixed in luxury-v3-typography-global.css)
     lodges          Tour Engine 3-col grid received the accommodation
                     nth-child placements (defect — now :where()-scoped in
                     luxury-v3-accommodation.css); 144 / 888 / 96 px cards
     final           ink block, 3px gold border, 92px padding

   Selector prefix `body .sw-hub-v300` adds (0,1,1); each rule is written to
   clear the generation rule it replaces (noted where it matters).
   ========================================================================== */

:root{
  --dx-wrap:1180px;                          /* hub wrap cap, measured */
  --dx-gut:clamp(1.375rem,4.3vw,3.875rem);   /* 62px at 1440 = measured content edge x=192 */
  /* exact distance from the wrap's content edge to the viewport edge */
  --dx-bleed:calc(-1 * ((100vw - min(var(--dx-wrap), 100vw - 64px)) / 2) - var(--dx-gut));
}

/* ---------- page ground and shared rhythm ---------- */
body .sw-hub-v300{
  background:var(--v3-ivory);color:var(--v3-ink);
  font-family:var(--v3-sans);
  -webkit-font-smoothing:antialiased;
}
body .sw-hub-v300 .sw-wrap{
  width:min(var(--dx-wrap),100% - 64px);
  padding-inline:var(--dx-gut);
  margin-inline:auto;
}
body .sw-hub-v300 .sw-section{padding-block:var(--v3-chapter)}             /* (0,2,1) > :is(...) .sw-section (0,2,0) */
body .sw-hub-v300 .sw-section.sw-white{background:var(--v3-ivory)}         /* (0,3,1) > .sw-premium-v180 .sw-section.sw-white (0,3,0) */
body .sw-hub-v300 .sw-section.sw-stone{background:var(--v3-linen)}

body .sw-hub-v300 h1,
body .sw-hub-v300 h2,
body .sw-hub-v300 h3{
  font-family:var(--v3-serif);font-weight:400;color:var(--v3-ink);
  text-wrap:balance;letter-spacing:-.008em;
}
body .sw-hub-v300 .sw-section h2{
  font-size:clamp(2.3rem,3.7vw,3.5rem);line-height:1.06;
  max-width:16ch;margin:0 0 1.4rem;
}
body .sw-hub-v300 .sw-section p:not(.sw-eyebrow){
  font-family:var(--v3-sans);font-size:var(--v3-body);line-height:1.72;
  color:var(--v3-ink-soft);max-width:58ch;margin:0 0 1.1rem;
}
body .sw-hub-v300 .sw-section .sw-eyebrow{
  font-family:var(--v3-sans)!important;
  font-size:var(--v3-eyebrow)!important;
  letter-spacing:.17em;text-transform:uppercase;font-weight:500;
  color:var(--v3-olive);margin:0 0 1.2rem;line-height:1.3;max-width:none;
}
body .sw-hub-v300 .sw-section .sw-eyebrow::after{
  content:"";display:block;width:3.25rem;height:1px;
  background:var(--v3-gold);margin-top:1.05rem;
}
body .sw-hub-v300 .sw-section .sw-eyebrow:empty{display:none}

/* one CTA language: olive block, no radius, quiet uppercase */
body .sw-hub-v300 .sw-btn .wp-element-button{
  font-family:var(--v3-sans);font-size:.9rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;
  padding:1.1rem 2.4rem;min-height:54px;border-radius:0;
  background:var(--v3-olive);color:#fff;border:1px solid var(--v3-olive);
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .45s cubic-bezier(.32,.72,0,1),color .45s cubic-bezier(.32,.72,0,1),border-color .45s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .sw-btn .wp-element-button:hover{
  background:var(--v3-olive-deep);border-color:var(--v3-olive-deep);color:#fff;
}
body .sw-hub-v300 .sw-section .wp-block-buttons{margin-top:1.6rem}

/* ==========================================================================
   ARRIVAL — hero. The photograph is the destination; the copy sits low,
   on the gutter every other section uses.
   ========================================================================== */
body .sw-hub-v300 .sw-hero.sw-hero--photo{                                 /* (0,3,1) > .wp-block-group .sw-hero.sw-hero--photo (0,3,0) */
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;align-items:flex-end;
  min-height:min(88vh,860px);
  padding:0;
  background:var(--v3-timber);            /* only ever seen while the image loads */
}
body .sw-hub-v300 .sw-hero.sw-hero--photo::before,
body .sw-hub-v300 .sw-hero.sw-hero--photo::after{content:none}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__media{
  display:block;position:absolute;inset:0;margin:0;z-index:0;
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__media figure,
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__img{margin:0;height:100%;width:100%}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 42%;display:block;
}
/* warm scrim — readable type, photograph still breathes */
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(to top,rgba(30,27,20,.86) 0%,rgba(30,27,20,.52) 32%,rgba(30,27,20,.10) 62%,rgba(30,27,20,0) 100%),
    linear-gradient(to right,rgba(30,27,20,.56) 0%,rgba(30,27,20,.22) 40%,rgba(30,27,20,0) 64%);
}
body .sw-hub-v300 .sw-hero.sw-hero--photo > .sw-wrap{                      /* (0,4,1) > .wp-block-group .sw-hero--photo > .sw-wrap (0,3,0) */
  position:relative;z-index:2;
  width:min(var(--dx-wrap),100% - 64px);
  padding:clamp(6rem,10vw,9rem) var(--dx-gut) clamp(4rem,7vw,6rem);
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__crumb{
  font-family:var(--v3-sans);font-size:.785rem;letter-spacing:.155em;
  text-transform:uppercase;color:var(--v3-on-dark-soft);
  margin:0 0 1.6rem;max-width:none;line-height:1.4;
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__crumb a{color:var(--v3-on-dark-soft);text-decoration:none}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__crumb a:hover{color:#fff}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__crumb span{color:rgba(215,208,192,.55);margin:0 .55em}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-eyebrow{
  font-family:var(--v3-sans)!important;font-size:var(--v3-eyebrow)!important;
  letter-spacing:.17em;text-transform:uppercase;font-weight:500;
  color:var(--v3-on-dark-soft);margin:0 0 1.4rem;
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-eyebrow::after{
  content:"";display:block;width:3.25rem;height:1px;background:var(--v3-gold);margin-top:1.05rem;
}
body .sw-hub-v300 .sw-hero.sw-hero--photo h1{                             /* (0,4,1) > .wp-block-group .sw-hero--photo h1 (0,3,1) */
  font-family:var(--v3-serif);font-weight:400;
  font-size:clamp(3.1rem,6vw,5.6rem);line-height:1;letter-spacing:-.014em;
  color:#FCFAF4;max-width:16ch;margin:0 0 1.6rem;
  text-shadow:0 1px 34px rgba(24,21,15,.4);
}
body .sw-hub-v300 .sw-hero.sw-hero--photo p:not(.sw-eyebrow):not(.sw-hero__crumb){   /* (0,6,1) > gen (0,5,1) */
  font-family:var(--v3-sans);font-size:clamp(1.15rem,1.4vw,1.4rem);
  line-height:1.58;color:var(--v3-on-dark);font-weight:300;
  max-width:40ch;margin:0 0 2.5rem;
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-btn .wp-element-button{
  background:var(--v3-on-dark);color:var(--v3-ink);border-color:var(--v3-on-dark);
}
body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-btn .wp-element-button:hover{
  background:#fff;border-color:#fff;color:var(--v3-ink);
}

/* ==========================================================================
   PHOTO-OPEN — the second frame of the arrival. Full-bleed 21/9 on an ivory
   mount beneath the hero, not a 1056px inset frame. Kruger only.
   ========================================================================== */
body .sw-hub-v300 .sw-section.sw-photo-open{
  padding:clamp(2.25rem,4vw,3.75rem) 0 0;background:var(--v3-ivory);
}
body .sw-hub-v300 .sw-section.sw-photo-open > .sw-wrap{width:100%;max-width:none;padding:0}
body .sw-hub-v300 .sw-section.sw-photo-open .sw-wrap::before{content:none}
body .sw-hub-v300 .sw-section.sw-photo-open figure{margin:0;width:100%}
body .sw-hub-v300 .sw-section.sw-photo-open img{
  width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;display:block;
}

/* ==========================================================================
   TEXT CHAPTERS — heading left, argument right. Large type, one measure.
   Applies to the plain white/stone chapters only: not the split, not the
   lodges, not the close, and not a wrap that holds a photo-split.
   3.5.4: nor a wrap that holds a component — a card / column grid, a tour
   listing, a band or an area-text block. `.sw-hub-v300` is shared by eleven
   pages; on /destinations/, /safaris/, /tours/, /dinokeng/ and /garden-route/
   the 5/7 split pushed those components into the 7fr column (card tracks
   123–175 px at 1440). Added to the existing :has() list, so the specificity
   of every selector below is unchanged.
   ========================================================================== */
@media (min-width:1025px){
  body .sw-hub-v300 .sw-section:is(.sw-white,.sw-stone):not(.sw-r0-split):not(.sw-x-featured) > .sw-wrap:not(:has(.sw-photo-split, .wp-block-columns, .spw-tour-listing, .sw-v2-band, .sw-area-text)){
    display:grid;
    grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    column-gap:clamp(3rem,6vw,6.5rem);
    align-items:start;
  }
  body .sw-hub-v300 .sw-section:is(.sw-white,.sw-stone):not(.sw-r0-split):not(.sw-x-featured) > .sw-wrap:not(:has(.sw-photo-split, .wp-block-columns, .spw-tour-listing, .sw-v2-band, .sw-area-text)) > h2{
    /* the 5fr column is the measure; a ch cap narrower than the longest
       word ("Accommodation", 13ch) broke it mid-word */
    grid-column:1;grid-row:1 / span 12;margin:0;max-width:none;overflow-wrap:normal;
  }
  body .sw-hub-v300 .sw-section:is(.sw-white,.sw-stone):not(.sw-r0-split):not(.sw-x-featured) > .sw-wrap:not(:has(.sw-photo-split, .wp-block-columns, .spw-tour-listing, .sw-v2-band, .sw-area-text)) > :not(h2){
    grid-column:2;min-width:0;
  }
  /* the first paragraph is the argument: lead measure, lighter weight */
  body .sw-hub-v300 .sw-section:is(.sw-white,.sw-stone):not(.sw-r0-split):not(.sw-x-featured) > .sw-wrap:not(:has(.sw-photo-split, .wp-block-columns, .spw-tour-listing, .sw-v2-band, .sw-area-text)) > p:first-of-type{
    font-size:var(--v3-lead);line-height:1.58;color:var(--v3-ink);font-weight:300;
    max-width:46ch;margin:.55rem 0 1.25rem;
  }
  body .sw-hub-v300 .sw-section:is(.sw-white,.sw-stone):not(.sw-r0-split):not(.sw-x-featured) > .sw-wrap:not(:has(.sw-photo-split, .wp-block-columns, .spw-tour-listing, .sw-v2-band, .sw-area-text)) > .wp-block-buttons{
    margin-top:1.4rem;
  }
}

/* ==========================================================================
   PHOTO-SPLIT — the photograph takes 58% and runs to the viewport edge on
   the side it touches; the copy sits beside it at rest. Same balance as the
   homepage Kruger chapter.
   ========================================================================== */
body .sw-hub-v300 .sw-section:has(> .sw-wrap > .sw-photo-split.is-reverse){overflow-x:clip}
body .sw-hub-v300 .sw-photo-split{
  display:grid;grid-template-columns:minmax(0,1fr);row-gap:2.5rem;align-items:center;
}
body .sw-hub-v300 .sw-photo-split > figure{margin:0;min-width:0}
body .sw-hub-v300 .sw-photo-split > figure img{
  width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;
}
body .sw-hub-v300 .sw-photo-split .sw-photo-copy{padding:0;margin:0;min-width:0}
body .sw-hub-v300 .sw-photo-split .sw-photo-copy h2{max-width:none;overflow-wrap:normal}
/* beside a photograph the copy is a 42% column: body measure, not lead —
   a fifteen-line paragraph at lead size is a wall, not an argument */
body .sw-hub-v300 .sw-photo-split .sw-photo-copy p{
  font-size:var(--v3-body);line-height:1.72;color:var(--v3-ink-soft);font-weight:400;max-width:44ch;
}
body .sw-hub-v300 .sw-photo-split .sw-photo-copy > :last-child{margin-bottom:0}
@media (min-width:1025px){
  body .sw-hub-v300 .sw-photo-split{
    grid-template-columns:minmax(0,58%) minmax(0,1fr);
    column-gap:clamp(3rem,6vw,7rem);row-gap:0;
  }
  body .sw-hub-v300 .sw-photo-split.is-reverse{grid-template-columns:minmax(0,1fr) minmax(0,58%)}
  body .sw-hub-v300 .sw-photo-split.is-reverse > figure{order:2}
  body .sw-hub-v300 .sw-photo-split.is-reverse > .sw-photo-copy{order:1}
  body .sw-hub-v300 .sw-photo-split > figure{align-self:stretch}
  body .sw-hub-v300 .sw-photo-split:not(.is-reverse) > figure{margin-left:var(--dx-bleed)}
  body .sw-hub-v300 .sw-photo-split.is-reverse > figure{margin-right:var(--dx-bleed)}
  body .sw-hub-v300 .sw-photo-split > figure img{
    height:100%;aspect-ratio:auto;min-height:clamp(28rem,36vw,40rem);
  }
  body .sw-hub-v300 .sw-photo-split .sw-photo-copy{padding-block:clamp(2rem,4vw,4rem)}
}

/* ==========================================================================
   WITH SPURWING — the clear choices. Photograph 54% to the edge it touches,
   copy beside it, and the routes as a hairline index in the display face.
   Bleed direction is repaired globally; the exact value is set here.
   ========================================================================== */
body .sw-hub-v300 .sw-section.sw-r0-split:not(.sw-r0-split--flip){overflow-x:clip}
@media (min-width:1025px){
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap{                    /* (0,4,1) > .sw-section.sw-r0-split > .sw-wrap (0,3,0) */
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,54%);
    column-gap:clamp(3rem,6vw,7rem);
    align-items:center;
  }
  body .sw-hub-v300 .sw-section.sw-r0-split.sw-r0-split--flip > .sw-wrap{
    grid-template-columns:minmax(0,54%) minmax(0,1fr);
  }
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media{
    align-self:stretch;min-width:0;
  }
  body .sw-hub-v300 .sw-section.sw-r0-split:not(.sw-r0-split--flip) > .sw-wrap > .sw-r0-split__media{
    margin-left:0;margin-right:var(--dx-bleed);
  }
  body .sw-hub-v300 .sw-section.sw-r0-split.sw-r0-split--flip > .sw-wrap > .sw-r0-split__media{
    margin-right:0;margin-left:var(--dx-bleed);
  }
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media figure{margin:0;height:100%}
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media img{
    width:100%;height:100%;min-height:clamp(30rem,40vw,44rem);object-fit:cover;display:block;
  }
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__text{
    padding-block:clamp(2rem,4vw,4rem);min-width:0;
  }
}
@media (max-width:1024px){
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap{
    display:grid;grid-template-columns:minmax(0,1fr);row-gap:2.5rem;
  }
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media,
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__text{order:initial;margin:0;min-width:0}
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media figure{margin:0}
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media img{
    width:100%;height:auto;aspect-ratio:16/9;min-height:0;object-fit:cover;display:block;
  }
}
body .sw-hub-v300 .sw-section.sw-r0-split .sw-r0-split__text h2{max-width:14ch;margin:0 0 1.2rem}
body .sw-hub-v300 .sw-section.sw-r0-split .sw-r0-split__text > p:not(.sw-eyebrow){
  font-size:var(--v3-lead);line-height:1.58;color:var(--v3-ink-soft);font-weight:300;
  max-width:40ch;margin:0 0 2.25rem;
}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-split__text ul.sw-r0-links{
  list-style:none;margin:0;padding:0;border-bottom:1px solid var(--v3-hair);
}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-split__text ul.sw-r0-links li{   /* (0,6,3) > gen (0,6,2) */
  border-top:1px solid var(--v3-hair);border-bottom:0;
  padding:1.15rem 0;margin:0;
}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-split__text ul.sw-r0-links li::before,
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-split__text ul.sw-r0-links li::marker{content:none}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a{
  font-family:var(--v3-serif)!important;                 /* the UI-face block sets Karla with !important; the choice is display type */
  font-size:clamp(1.45rem,1.8vw,1.75rem);font-weight:400;line-height:1.2;
  letter-spacing:-.005em;color:var(--v3-ink);text-decoration:none;
  display:inline-flex;align-items:center;min-height:44px;border:0;padding:0;
  transition:color .4s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a::after{
  content:"\2192";font-family:var(--v3-sans);font-size:.72em;color:var(--v3-gold);
  margin-left:.7em;transition:transform .45s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a:hover{color:var(--v3-olive)}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a:hover::after{transform:translateX(.3em)}
body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links small{
  display:block;font-family:var(--v3-sans);font-size:.95rem;line-height:1.55;
  color:var(--v3-ink-faint);margin-top:.3rem;max-width:44ch;
}

/* ==========================================================================
   LODGES — three plates on limestone, stepped so they never read as a
   row of cards. Heading and argument share a baseline above them.
   ========================================================================== */
body .sw-hub-v300 .sw-section.sw-x-featured{background:var(--v3-limestone)}
body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text{     /* (0,5,1) > .sw-x-featured>.sw-wrap>.sw-area-text (0,3,0) */
  max-width:none;margin:0 0 clamp(2.75rem,4.5vw,4.5rem);
}
body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text h2{margin:0;max-width:none;overflow-wrap:normal}
body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text p:not(.sw-eyebrow){
  font-size:var(--v3-lead);line-height:1.58;color:var(--v3-ink-soft);font-weight:300;
  max-width:44ch;margin:1rem 0 0;
}
@media (min-width:1025px){
  body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text{
    display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    column-gap:clamp(3rem,6vw,6.5rem);align-items:end;
  }
  body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text .sw-eyebrow{grid-column:1;grid-row:1}
  body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text h2{grid-column:1;grid-row:2}
  body .sw-hub-v300 .sw-section.sw-x-featured > .sw-wrap > .sw-area-text p:not(.sw-eyebrow){
    grid-column:2;grid-row:1 / span 2;align-self:end;margin:0 0 .4rem;
  }
}
body .sw-hub-v300 .sw-v2-featured{margin:0;padding:0}
body .sw-hub-v300 .sw-v2-featured .spw-accommodation-grid{                 /* (0,3,1) > .sw-v2-featured .spw-accommodation-grid (0,2,0) */
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(2rem,3.5vw,3.5rem);row-gap:3.5rem;
  align-items:start;
}
body .sw-hub-v300 .spw-accommodation-card{
  grid-column:auto;grid-row:auto;
  background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  width:auto;max-width:none;align-self:start;transform:none;
}
body .sw-hub-v300 .spw-accommodation-card:hover,
body .sw-hub-v300 .spw-accommodation-card:focus-within{transform:none;box-shadow:none;background:none}
body .sw-hub-v300 .spw-accommodation-card:nth-child(2){margin-top:clamp(2.5rem,5vw,5rem)}
body .sw-hub-v300 .spw-accommodation-card:nth-child(3){margin-top:clamp(5rem,10vw,10rem)}
body .sw-hub-v300 .spw-accommodation-card__image{
  margin:0 0 1.5rem;overflow:hidden;display:block;background:var(--v3-stone);
  aspect-ratio:4/5;border-radius:0;
}
body .sw-hub-v300 .spw-accommodation-card__image img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:0;
  transition:transform 1.2s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .spw-accommodation-card:hover .spw-accommodation-card__image img{transform:scale(1.04)}
body .sw-hub-v300 .spw-accommodation-card__body{display:flex;flex-direction:column;padding:0;max-width:42ch}
body .sw-hub-v300 .spw-accommodation-card__location{
  order:1;font-family:var(--v3-sans);font-size:var(--v3-meta);
  letter-spacing:.085em;text-transform:uppercase;font-weight:500;
  color:var(--v3-olive);margin:0 0 .72rem;max-width:none;
}
body .sw-hub-v300 .spw-accommodation-card__title{
  order:2;font-family:var(--v3-serif);font-weight:400;
  font-size:var(--v3-d3);line-height:1.12;color:var(--v3-ink);margin:0 0 .5rem;
}
body .sw-hub-v300 .spw-accommodation-card__type{
  order:3;font-family:var(--v3-sans);font-size:var(--v3-meta);
  color:var(--v3-ink-faint);letter-spacing:.015em;text-transform:none;margin:0 0 1.05rem;max-width:none;
}
body .sw-hub-v300 .spw-accommodation-card__descriptor{
  order:4;font-size:1.0625rem;line-height:1.66;color:var(--v3-ink-soft);
  margin:0 0 1.25rem;text-transform:none;letter-spacing:normal;max-width:none;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
body .sw-hub-v300 .spw-accommodation-card__labels{
  order:5;font-size:.82rem;letter-spacing:.06em;color:var(--v3-ink-faint);
  margin:0 0 1.15rem;text-transform:uppercase;max-width:none;
}
body .sw-hub-v300 .spw-accommodation-card__labels > *{
  display:inline;background:none;border:0;padding:0;margin:0 .7em 0 0;
  color:inherit;font:inherit;letter-spacing:inherit;border-radius:0;
}
body .sw-hub-v300 .spw-accommodation-card .spw-btn{
  order:6;align-self:flex-start;background:none;border:0;padding:0 0 .3rem;min-height:0;
  font-family:var(--v3-sans);font-size:.875rem;letter-spacing:.115em;
  text-transform:uppercase;font-weight:500;color:var(--v3-ink);
  border-bottom:1px solid var(--v3-gold);border-radius:0;
  transition:color .4s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .spw-accommodation-card:hover .spw-btn{color:var(--v3-olive)}
/* the handoff to the full list: one quiet line */
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall,
body .sw-hub-v300 .sw-section.sw-x-featured .spw-tl__viewall{
  margin-top:clamp(2.5rem,4vw,3.5rem);padding-top:1.4rem;border-top:1px solid var(--v3-hair);
  max-width:none;   /* the hairline spans the wrap, not the paragraph measure */
}
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall .sw-eyebrow{margin-bottom:.8rem}
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall .sw-eyebrow::after{content:none}
/* the generation prints the "<destination> accommodation" eyebrow as a
   ::before pseudo-element set in Inter — the one selector on the hubs that
   still pulled InterVariable.woff2 (352 KB, measured 3.5.1). Mapped here. */
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall::before{
  font-family:var(--v3-sans);font-size:var(--v3-eyebrow);letter-spacing:.17em;
  text-transform:uppercase;font-weight:500;color:var(--v3-olive);
  display:block;margin:0 0 .8rem;line-height:1.3;
}
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall a,
body .sw-hub-v300 .sw-section.sw-x-featured .spw-tl__viewall a{
  font-family:var(--v3-sans);font-size:.875rem;letter-spacing:.115em;text-transform:uppercase;
  font-weight:500;color:var(--v3-ink);text-decoration:none;border:0;
  border-bottom:1px solid var(--v3-gold);padding:0 0 .3rem;display:inline-block;
  transition:color .4s cubic-bezier(.32,.72,0,1);
}
body .sw-hub-v300 .sw-section.sw-x-featured .sw-v2-viewall a:hover,
body .sw-hub-v300 .sw-section.sw-x-featured .spw-tl__viewall a:hover{color:var(--v3-olive)}
@media (max-width:1024px){
  body .sw-hub-v300 .sw-v2-featured .spw-accommodation-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:3rem}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(2){margin-top:3rem}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(3){grid-column:1 / -1;margin-top:0}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(3) .spw-accommodation-card__image{aspect-ratio:16/9}
}
@media (max-width:600px){
  body .sw-hub-v300 .sw-v2-featured .spw-accommodation-grid{grid-template-columns:minmax(0,1fr);row-gap:3.25rem}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(n){grid-column:1;margin-top:0}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(odd) .spw-accommodation-card__image{aspect-ratio:4/5}
  body .sw-hub-v300 .spw-accommodation-card:nth-child(even) .spw-accommodation-card__image{aspect-ratio:3/2}
  body .sw-hub-v300 .spw-accommodation-card__body{max-width:none}
}

/* ==========================================================================
   CLOSE — the concierge invitation. With a photograph (Madikwe) it is the
   full-bleed close of accommodation; without one (Kruger) the type carries
   it on deep olive with the homepage's tonal depth. Same composition either
   way, so the P0 operational frame drops in without another pass.
   ========================================================================== */
body .sw-hub-v300 .sw-section.sw-final{                                     /* (0,3,1) > .sw-section.sw-final.sw-r0-close (0,3,0) */
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;align-items:center;
  min-height:min(64vh,620px);
  padding-block:clamp(4.5rem,8vw,7.5rem);
  background:var(--v3-olive-deep);border-top:0;
}
body .sw-hub-v300 .sw-section.sw-final > .sw-wrap{                          /* (0,4,1) > .sw-section.sw-final.sw-r0-close > .sw-wrap (0,4,0) */
  position:relative;z-index:2;width:min(var(--dx-wrap),100% - 64px);
}
body .sw-hub-v300 .sw-section.sw-final .sw-v2-photo__img{position:absolute;inset:0;margin:0;z-index:0}
body .sw-hub-v300 .sw-section.sw-final .sw-v2-photo__img figure{margin:0;height:100%;width:100%}
body .sw-hub-v300 .sw-section.sw-final .sw-v2-photo__img img{
  width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block;
}
body .sw-hub-v300 .sw-section.sw-final::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to right,rgba(28,25,18,.84) 0%,rgba(28,25,18,.58) 45%,rgba(28,25,18,.20) 100%);
}
body .sw-hub-v300 .sw-section.sw-final:not(:has(.sw-v2-photo__img img))::before{
  background:
    radial-gradient(130% 100% at 12% 108%, rgba(95,98,56,.55) 0%, rgba(61,64,38,0) 60%),
    radial-gradient(90% 70% at 88% -10%, rgba(169,138,75,.14) 0%, rgba(169,138,75,0) 62%);
}
body .sw-hub-v300 .sw-section.sw-final .sw-eyebrow{color:var(--v3-on-dark-soft)}
body .sw-hub-v300 .sw-section.sw-final h2{
  color:#FCFAF4!important;                 /* WP's .has-*-color rules are !important */
  font-size:clamp(2.3rem,3.6vw,3.4rem);max-width:18ch;margin:0 0 1.4rem;
}
body .sw-hub-v300 .sw-section.sw-final p:not(.sw-eyebrow){
  color:var(--v3-on-dark)!important;
  font-size:var(--v3-lead);line-height:1.58;font-weight:300;max-width:44ch;margin:0 0 2.5rem;
}
body .sw-hub-v300 .sw-section.sw-final .wp-block-buttons{margin-top:0}
body .sw-hub-v300 .sw-section.sw-final .sw-btn .wp-element-button{
  background:var(--v3-on-dark);color:var(--v3-ink);border-color:var(--v3-on-dark);
}
body .sw-hub-v300 .sw-section.sw-final .sw-btn .wp-element-button:hover{background:#fff;border-color:#fff;color:var(--v3-ink)}

/* ==========================================================================
   RESPONSIVE — recompose, do not merely stack
   ========================================================================== */
@media (max-width:1024px){
  body .sw-hub-v300 .sw-hero.sw-hero--photo{min-height:min(76vh,700px)}
  body .sw-hub-v300 .sw-hero.sw-hero--photo > .sw-wrap{padding-top:clamp(5rem,9vw,7rem)}
  body .sw-hub-v300 .sw-section.sw-photo-open img{aspect-ratio:16/9}
}
@media (max-width:600px){
  body .sw-hub-v300 .sw-hero.sw-hero--photo{min-height:min(92vh,760px)}
  body .sw-hub-v300 .sw-hero.sw-hero--photo .sw-hero__media img{object-position:52% 38%}
  body .sw-hub-v300 .sw-hero.sw-hero--photo h1{font-size:clamp(2.6rem,11.5vw,3.6rem);max-width:12ch}
  body .sw-hub-v300 .sw-hero.sw-hero--photo p:not(.sw-eyebrow):not(.sw-hero__crumb){font-size:1.1rem;max-width:32ch;margin-bottom:1.85rem}
  body .sw-hub-v300 .sw-hero.sw-hero--photo > .sw-wrap{padding-bottom:clamp(2.75rem,8vw,4rem)}
  body .sw-hub-v300 .sw-section.sw-photo-open{padding-top:1.25rem}
  body .sw-hub-v300 .sw-section.sw-photo-open img{aspect-ratio:4/3}
  body .sw-hub-v300 .sw-photo-split > figure img{aspect-ratio:4/5}
  body .sw-hub-v300 .sw-section.sw-r0-split > .sw-wrap > .sw-r0-split__media img{aspect-ratio:4/3}
  body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a{font-size:1.4rem}
  body .sw-hub-v300 .sw-section.sw-final{min-height:min(74vh,640px)}
  body .sw-hub-v300 .sw-section.sw-final:has(.sw-v2-photo__img img)::before{
    background:linear-gradient(to top,rgba(28,25,18,.88) 0%,rgba(28,25,18,.52) 48%,rgba(28,25,18,.18) 100%);
  }
  body .sw-hub-v300 .sw-btn .wp-element-button{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  body .sw-hub-v300 *{transition:none!important;animation:none!important}
  body .sw-hub-v300 .spw-accommodation-card:hover .spw-accommodation-card__image img{transform:none}
  body .sw-hub-v300 .sw-section.sw-r0-split.sw-dx-paths .sw-r0-links a:hover::after{transform:none}
}
/* ===================== end DESTINATION LAYER ===================== */
/* ==========================================================================
   SPURWING — EDITORIAL COMPOSITION LAYER (3.6.3)
   --------------------------------------------------------------------------
   The quietest template on the site: a luxury travel publication, not a
   WordPress blog. One paper surface, one reading measure, large Cormorant
   headings, Karla body, hairlines instead of boxes, one calm close.

   SCOPE (the 3.5.4 rule — composition is never scoped by a generation
   wrapper alone). `.sw-authority` is a page-type marker, not a generation:
   enumerated 2026-09-28 on every live URL, it is carried by exactly three
   long-form guides — /first-time-visitor-south-africa/,
   /best-time-to-visit-south-africa/, /johannesburg-travel-guide/ — all with
   the same structure (hero: eyebrow / H1 / deck; white & stone chapters
   holding `.sw-two-grid` pairs of `.sw-area-text` or a direct eyebrow / H2 /
   copy; an optional `.sw-continue` reading list; `.sw-final` close).
   The other guide types (`sw-authority-guide`, `sw-decision-guide`,
   `sw-itinerary-guide`, `sw-practical-guide`, `sw-guide-hub`) are NOT
   reached until this page is judged.

   Every grid placement below has a matching ≤1024 reset at equal or higher
   specificity (the implicit-track lesson of 3.5.4).
   ========================================================================== */

body .sw-authority {
  --ed-ink: #221F19;
  --ed-ink-soft: #4F4A40;
  --ed-ink-faint: #7C7566;
  --ed-paper: #F7F5EF;
  --ed-stone: #EBE6DA;
  --ed-olive: #5F6238;
  --ed-olive-deep: #3D4026;
  --ed-gold: #8A7440;
  --ed-hair: rgba(34, 31, 25, 0.14);
  --ed-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --ed-sans: Karla, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ed-rail: 12.5rem;          /* margin column: the chapter's small label */
  --ed-gap: clamp(2.5rem, 4vw, 4.5rem);
  --ed-measure: 36.5rem;       /* 3.6.3: measured on staging, 18 px Karla sets 69 characters per line (median,
                                  spaces counted), 75 max, across the three guides; 41rem gave 78 / 86 */
  --ed-system: calc(var(--ed-rail) + var(--ed-gap) + var(--ed-measure));
  background: var(--ed-paper);
  color: var(--ed-ink);
}

/* ---------------------------------------------------------- one paper surface */
body .sw-authority > .sw-section:not(.sw-final) {
  background: var(--ed-paper);
  padding: clamp(3.25rem, 5.5vw, 5.25rem) 0 0;
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap::before {
  content: none; /* the stray gold tick at the left edge — (0,4,2) over the generation's (0,4,1) */
}
body .sw-authority .sw-hero::after {
  content: none; /* 3.6.2: the generation's 96 px gold hero bar sat flush under the header, far left of the
                    reading measure — (0,2,2) over the generation's (0,2,1); the calm hero is eyebrow / H1 / standfirst */
}
body .sw-authority .sw-section > .sw-wrap,
body .sw-authority .sw-hero > .sw-wrap {
  width: min(var(--ed-system), 100% - 2 * clamp(1.25rem, 5vw, 4rem));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

/* ---------------------------------------------------------- hero: eyebrow / H1 / standfirst */
body .sw-authority .sw-hero {
  background: var(--ed-paper);
  padding: clamp(3.5rem, 7vw, 6.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
  border: 0;
}
body .sw-authority .sw-hero > .sw-wrap {
  padding-left: calc(var(--ed-rail) + var(--ed-gap));
}
body .sw-authority .sw-hero .sw-eyebrow {
  font-family: var(--ed-sans);
  font-size: 0.74rem;
  letter-spacing: 0.2em;
  font-weight: 500;
  color: var(--ed-gold);
  margin: 0 0 1.5rem;
}
body .sw-authority .sw-hero h1 {
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(2.9rem, 2rem + 3vw, 4.6rem);
  line-height: 1.03;
  letter-spacing: -0.012em;
  color: var(--ed-ink);
  max-width: 15ch;
  margin: 0 0 1.75rem;
  text-wrap: balance;
}
body .sw-authority .sw-hero .sw-hero-deck {
  font-family: var(--ed-serif);
  font-size: clamp(1.45rem, 1.2rem + 0.8vw, 1.85rem);
  line-height: 1.35;
  font-weight: 400;
  color: var(--ed-ink);
  max-width: 30ch;
  margin: 0 0 1.25rem;
}
body .sw-authority .sw-hero p:not(.sw-eyebrow):not(.sw-hero-deck) {
  font-family: var(--ed-sans);
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--ed-ink-soft);
  max-width: var(--ed-measure);
  margin: 0;
}

/* ---------------------------------------------------------- chapters: rail label | reading column */
/* the two-up pairs become consecutive chapters */
body .sw-authority .sw-section .sw-two-grid {
  display: block;
}
body .sw-authority .sw-section .sw-two-grid > .sw-area-text + .sw-area-text {
  margin-top: clamp(3rem, 5vw, 4.5rem);
}
/* a chapter is either an .sw-area-text or a wrap that holds its own eyebrow / H2 / copy */
body .sw-authority .sw-section .sw-area-text,
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) {
  display: grid;
  grid-template-columns: var(--ed-rail) minmax(0, var(--ed-measure));
  column-gap: var(--ed-gap);
  align-items: baseline;
  border-top: 1px solid var(--ed-hair);
  padding: clamp(1.75rem, 2.5vw, 2.25rem) 0 0;
  background: none;
  box-shadow: none;
}
body .sw-authority .sw-section .sw-area-text > *,
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > * {
  grid-column: 2;
  min-width: 0;
}
body .sw-authority .sw-section .sw-area-text > .sw-eyebrow,
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > .sw-eyebrow {
  display: block; /* the generation hides eyebrows inside .sw-two-grid (0,3,0); in the margin column they are the chapter's label */
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  padding-top: 0.95rem; /* sits on the H2's first line */
  max-width: 14em;
}
body .sw-authority .sw-section .sw-area-text > h2,
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > h2 {
  grid-row: 1;
}
body .sw-authority .sw-section .sw-eyebrow {
  font-family: var(--ed-sans);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  line-height: 1.5;
  font-weight: 500;
  color: var(--ed-gold);
  margin: 0;
}
body .sw-authority .sw-section .sw-eyebrow::after {
  content: none;
}
body .sw-authority .sw-section h2,
body .sw-authority .sw-section .sw-two-grid .sw-area-text > h2 { /* (0,4,2): the generation's `.sw-two-grid .sw-area-text h2` is (0,3,1) */
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(2rem, 1.55rem + 1.35vw, 2.65rem);
  line-height: 1.1;
  letter-spacing: -0.006em;
  color: var(--ed-ink);
  max-width: 22ch;
  margin: 0 0 1.1rem;
  text-wrap: balance;
}
body .sw-authority .sw-section .sw-area-text p:not(.sw-eyebrow),
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > p:not(.sw-eyebrow) {
  font-family: var(--ed-sans);
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--ed-ink-soft);
  max-width: var(--ed-measure);
  margin: 0 0 1.1rem;
}
body .sw-authority .sw-section p a {
  color: var(--ed-ink);
  text-decoration: underline;
  text-decoration-color: var(--ed-gold);
  text-underline-offset: 0.22em;
  text-decoration-thickness: 1px;
}
body .sw-authority .sw-section p a:hover,
body .sw-authority .sw-section p a:focus-visible {
  color: var(--ed-olive-deep);
}

/* ---------------------------------------------------------- related reading: a quiet two-column index */
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2.5rem;
  border-top: 1px solid var(--ed-hair);
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li {
  border: 0;
  border-bottom: 1px solid var(--ed-hair);
  padding: 0.95rem 0;
  margin: 0;
  font-family: var(--ed-sans);
  font-size: 1rem;
  line-height: 1.5;
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li::before {
  content: none;
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li a {
  color: var(--ed-ink);
  text-decoration: none;
  font-family: var(--ed-serif);
  font-size: 1.3rem;
  line-height: 1.3;
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li a::after {
  content: " \2192";
  font-family: var(--ed-sans);
  font-size: 0.8em;
  color: var(--ed-gold);
}
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li a:hover,
body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list > li a:focus-visible {
  color: var(--ed-olive-deep);
  text-decoration: underline;
  text-decoration-color: var(--ed-gold);
  text-underline-offset: 0.2em;
}

/* ---------------------------------------------------------- the close: calm, one action */
body .sw-authority > .sw-section.sw-final {
  background: var(--ed-stone);
  color: var(--ed-ink);
  margin-top: clamp(4rem, 7vw, 6.5rem);
  padding: clamp(3.5rem, 6vw, 5rem) 0;
  border-top: 0;
}
body .sw-authority > .sw-section.sw-final::before {
  content: none;
}
body .sw-authority > .sw-section.sw-final > .sw-wrap {
  padding-left: calc(var(--ed-rail) + var(--ed-gap));
}
body .sw-authority .sw-section.sw-final .sw-eyebrow {
  margin: 0 0 1rem;
}
body .sw-authority .sw-section.sw-final h2 {
  color: var(--ed-ink);
  max-width: 24ch;
}
body .sw-authority .sw-section.sw-final > .sw-wrap > p:not(.sw-eyebrow) { /* (0,5,2): the generation's dark-close colour is (0,5,1) */
  font-family: var(--ed-sans);
  font-size: 1.1rem;
  line-height: 1.7;
  color: var(--ed-ink-soft);
  max-width: 36rem;
  margin: 0 0 1.75rem;
}
body .sw-authority .sw-section.sw-final .wp-block-button__link {
  background: var(--ed-olive);
  color: #F6F2E9;
  border: 0;
  border-radius: 2px;
  font-family: var(--ed-sans);
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
  padding: 1.05rem 1.75rem;
  min-height: 48px;
}
body .sw-authority .sw-section.sw-final .wp-block-button__link:hover,
body .sw-authority .sw-section.sw-final .wp-block-button__link:focus-visible {
  background: var(--ed-olive-deep);
  color: #fff;
}

/* ---------------------------------------------------------- tablet / phone: one column, the label above */
@media (max-width: 1024px) {
  body .sw-authority .sw-hero > .sw-wrap,
  body .sw-authority > .sw-section.sw-final > .sw-wrap {
    padding-left: 0;
  }
  body .sw-authority .sw-section > .sw-wrap,
  body .sw-authority .sw-hero > .sw-wrap {
    width: min(var(--ed-measure), 100% - 2 * clamp(1.25rem, 5vw, 3rem));
  }
  body .sw-authority .sw-section .sw-area-text,
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) {
    grid-template-columns: minmax(0, 1fr);
  }
  /* every placement above is released at the same specificity */
  body .sw-authority .sw-section .sw-area-text > *,
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > *,
  body .sw-authority .sw-section .sw-area-text > .sw-eyebrow,
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > .sw-eyebrow,
  body .sw-authority .sw-section .sw-area-text > h2,
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > h2 {
    grid-column: 1;
    grid-row: auto;
  }
  body .sw-authority .sw-section .sw-area-text > .sw-eyebrow,
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap:not(:has(> .sw-two-grid)) > .sw-eyebrow {
    padding-top: 0;
    margin-bottom: 0.9rem;
  }
}
@media (max-width: 640px) {
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > ul.wp-block-list {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-authority .sw-section .sw-area-text p:not(.sw-eyebrow),
  body .sw-authority .sw-section:not(.sw-final) > .sw-wrap > p:not(.sw-eyebrow),
  body .sw-authority .sw-hero p:not(.sw-eyebrow):not(.sw-hero-deck) {
    font-size: 1.0625rem;
  }
  body .sw-authority .sw-section.sw-final .wp-block-button__link {
    display: flex;
    justify-content: center;
    width: 100%;
  }
}
/* ============== end EDITORIAL COMPOSITION LAYER ============== */
/* ==========================================================================
   SPURWING — GROUP TRAVEL COMPOSITION LAYER (3.7.0)
   --------------------------------------------------------------------------
   "More people, more moving parts — quietly handled."
   Warm, capable, coordinated, human. More operational than Accommodation:
   strong type, a route rhythm, a manifest of moving parts, restrained proof.
   Not a corporate events page, not a safari template, no card walls.

   SCOPE (the 3.5.4 rule). `.sw-group-travel` is a page-type marker carried by
   exactly one URL, /group-travel/ (page 130), enumerated 2026-09-28 over all
   130 published pages. The page no longer carries the shared transport
   generation wrapper (`.sw-transport-v210`, 11 other URLs), so no generation
   rule reaches it and nothing here reaches them. Every selector starts
   `body .sw-group-travel` and every class below is `gt-` prefixed.

   Photograph slots (`.sw-slot`, `.sw-p5-slot`) belong to the Page Images
   plugin and the Conversion Routes failsafe: with no photograph chosen the
   public never sees the slot (its chapter gains `sw-p5-slot--empty`); editors
   see a labelled marker. The composition stands complete without them.
   ========================================================================== */

body .sw-group-travel {
  --gt-paper: #F7F5EF;
  --gt-stone: #EBE6DA;
  --gt-stone-deep: #E2DBCB;
  --gt-olive: #5F6238;
  --gt-olive-deep: #3D4026;
  --gt-ink: #221F19;
  --gt-ink-soft: #4F4A40;
  --gt-ink-faint: #7C7566;
  --gt-gold: #8A7440;
  --gt-ivory: #FCFAF4;
  --gt-hair: rgba(34, 31, 25, 0.14);
  --gt-hair-light: rgba(252, 250, 244, 0.22);
  --gt-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --gt-sans: Karla, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --gt-max: 1240px;
  --gt-pad: clamp(1.25rem, 4vw, 3rem);
  --gt-space: clamp(4.5rem, 8vw, 8rem);
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--gt-paper);
  color: var(--gt-ink);
  font-family: var(--gt-sans);
}
body .sw-group-travel > * {
  margin: 0;
  max-width: none;
}
body .sw-group-travel .gt-wrap {
  max-width: var(--gt-max);
  margin: 0 auto;
  padding: 0 var(--gt-pad);
  box-sizing: border-box;
}
body .sw-group-travel .gt-wrap > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* ---------------------------------------------------------- shared type */
body .sw-group-travel .gt-eyebrow {
  font-family: var(--gt-sans);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gt-gold);
  margin: 0 0 1.4rem;
}
body .sw-group-travel .gt-h2 {
  font-family: var(--gt-serif);
  font-weight: 400;
  font-size: clamp(2.2rem, 1.5rem + 2.4vw, 3.5rem);
  line-height: 1.06;
  letter-spacing: -0.01em;
  color: var(--gt-ink);
  margin: 0;
  text-wrap: balance;
}
body .sw-group-travel .gt-h3 {
  font-family: var(--gt-serif);
  font-weight: 500;
  font-size: clamp(1.45rem, 1.2rem + 0.7vw, 1.8rem);
  line-height: 1.15;
  color: var(--gt-ink);
  margin: 0 0 0.6rem;
}
body .sw-group-travel .gt-body,
body .sw-group-travel .gt-roster p,
body .sw-group-travel .gt-line p,
body .sw-group-travel .gt-steps p {
  font-family: var(--gt-sans);
  font-size: 1.075rem;
  line-height: 1.72;
  color: var(--gt-ink-soft);
  margin: 0;
  max-width: 36rem;
}
body .sw-group-travel .gt-label {
  font-family: var(--gt-sans);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gt-ink-faint);
  margin: 0;
}

/* buttons: one olive action, no pills */
body .sw-group-travel .gt-actions {
  display: flex;
  gap: 1rem;
  margin: 0;
}
body .sw-group-travel .gt-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 52px;
  padding: 0 1.9rem;
  border: 0;
  border-radius: 0;
  background: var(--gt-olive);
  color: var(--gt-ivory);
  font-family: var(--gt-sans);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-group-travel .gt-btn .wp-block-button__link::after {
  content: "\2192";
  font-size: 1rem;
  letter-spacing: 0;
  transition: transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-group-travel .gt-btn .wp-block-button__link:hover,
body .sw-group-travel .gt-btn .wp-block-button__link:focus-visible {
  background: var(--gt-olive-deep);
}
body .sw-group-travel .gt-btn .wp-block-button__link:hover::after {
  transform: translateX(3px);
}
body .sw-group-travel a:focus-visible {
  outline: 2px solid var(--gt-gold);
  outline-offset: 3px;
}

/* split chapters: a head column and a body column, asymmetric */
body .sw-group-travel .gt-split {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6.5rem);
  align-items: start;
}
body .sw-group-travel .gt-split > * {
  grid-column: auto;
  min-width: 0;
}
body .sw-group-travel .gt-split__head > * + * {
  margin-top: 0;
}

/* ---------------------------------------------------------- 1. arrival */
body .sw-group-travel .gt-arrival {
  background: var(--gt-paper);
  padding: clamp(4rem, 8vw, 7.5rem) 0 clamp(3rem, 5vw, 4.5rem);
}
body .sw-group-travel .gt-arrival .gt-wrap {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
body .sw-group-travel .gt-arrival .gt-eyebrow {
  grid-column: 1 / -1;
}
body .sw-group-travel .gt-title {
  grid-column: 1;
  grid-row: 2 / span 2;
  font-family: var(--gt-serif);
  font-weight: 400;
  font-size: clamp(3.1rem, 1.6rem + 4.6vw, 6.4rem);
  line-height: 1.03;
  letter-spacing: -0.018em;
  color: var(--gt-ink);
  margin: 0;
  max-width: 12ch;
  text-wrap: balance;
}
body .sw-group-travel .gt-lead {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  font-family: var(--gt-sans);
  font-size: 1.12rem;
  line-height: 1.72;
  color: var(--gt-ink-soft);
  margin: 0 0 1.75rem;
  max-width: 30rem;
}
body .sw-group-travel .gt-arrival .gt-actions {
  grid-column: 2;
  grid-row: 3;
  align-self: start;
}

/* the route: one group, one continuous operation */
body .sw-group-travel .gt-route {
  grid-column: 1 / -1;
  grid-row: 4;
  list-style: none;
  margin: clamp(3.5rem, 6vw, 5.5rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  position: relative;
  border-top: 1px solid var(--gt-hair);
}
body .sw-group-travel .gt-route li {
  position: relative;
  margin: 0;
  padding: 1.35rem 0 0;
}
body .sw-group-travel .gt-route li::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gt-paper);
  border: 1px solid var(--gt-olive);
  box-sizing: border-box;
}
body .sw-group-travel .gt-route li:first-child::before,
body .sw-group-travel .gt-route li:last-child::before {
  background: var(--gt-olive);
}
body .sw-group-travel .gt-route__stop {
  font-family: var(--gt-sans);
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gt-ink-soft);
}

/* ---------------------------------------------------------- 2. who we move */
body .sw-group-travel .gt-who {
  background: var(--gt-paper);
  padding: var(--gt-space) 0;
  border-top: 1px solid var(--gt-hair);
}
body .sw-group-travel .gt-roster {
  border-top: 1px solid var(--gt-ink);
}
body .sw-group-travel .gt-roster__row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(1.5rem, 3vw, 2.75rem);
  padding: 1.9rem 0 2.1rem;
  border-bottom: 1px solid var(--gt-hair);
  margin: 0;
}
body .sw-group-travel .gt-roster__name {
  font-family: var(--gt-serif);
  font-weight: 400;
  font-size: clamp(1.6rem, 1.25rem + 1vw, 2.15rem);
  line-height: 1.08;
  color: var(--gt-ink);
  margin: 0;
}

/* ---------------------------------------------------------- 3. moving parts */
body .sw-group-travel .gt-moving {
  background: var(--gt-stone);
  padding: var(--gt-space) 0;
}
body .sw-group-travel .gt-moving .gt-h2 {
  max-width: 17ch;
}
body .sw-group-travel .gt-moving .gt-body {
  margin-top: 1.5rem;
}
body .sw-group-travel .gt-manifest {
  list-style: none;
  margin: clamp(2.5rem, 4vw, 3.5rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--gt-ink);
}
body .sw-group-travel .gt-manifest li {
  margin: 0;
  padding: 1.15rem 1.25rem 1.3rem 0;
  border-bottom: 1px solid var(--gt-hair);
  font-family: var(--gt-sans);
  font-size: 1.02rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--gt-ink);
  display: flex;
  align-items: baseline;
  gap: 0.7rem;
}
body .sw-group-travel .gt-manifest li::before {
  content: "";
  flex: none;
  width: 14px;
  height: 1px;
  background: var(--gt-olive);
  transform: translateY(-0.3em);
}
body .sw-group-travel .gt-statement {
  font-family: var(--gt-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem);
  line-height: 1.22;
  color: var(--gt-olive-deep);
  margin: clamp(3rem, 5vw, 4.5rem) 0 0;
  max-width: 34ch;
  text-wrap: balance;
}

/* ---------------------------------------------------------- 4. operational proof */
body .sw-group-travel .gt-proof {
  background: var(--gt-olive-deep);
  color: var(--gt-ivory);
  padding: var(--gt-space) 0;
}
body .sw-group-travel .gt-proof .gt-eyebrow {
  color: #CDBB8C;
}
body .sw-group-travel .gt-display {
  font-family: var(--gt-serif);
  font-weight: 400;
  font-size: clamp(2.8rem, 1.6rem + 3.6vw, 5.2rem);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--gt-ivory);
  margin: 0;
  max-width: 11ch;
  text-wrap: balance;
}
body .sw-group-travel .gt-proof .gt-body {
  color: rgba(252, 250, 244, 0.84);
}
body .sw-group-travel .gt-proof__body {
  padding-top: 0.5rem;
}
body .sw-group-travel .gt-proof__body > .gt-body:first-child {
  font-size: 1.2rem;
  line-height: 1.65;
  color: var(--gt-ivory);
}
body .sw-group-travel .gt-proof .gt-h3 {
  color: var(--gt-ivory);
  margin-top: 2.5rem;
  padding-top: 2.25rem;
  border-top: 1px solid var(--gt-hair-light);
}
body .sw-group-travel .gt-proof .gt-label {
  color: rgba(252, 250, 244, 0.62);
  margin-top: 2.5rem;
}
body .sw-group-travel .gt-proof__cases {
  list-style: none;
  margin: 0.9rem 0 0;
  padding: 0;
  border-top: 1px solid var(--gt-hair-light);
}
body .sw-group-travel .gt-proof__cases li {
  margin: 0;
  border-bottom: 1px solid var(--gt-hair-light);
}
body .sw-group-travel .gt-proof__cases a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 1rem 0;
  min-height: 44px;
  box-sizing: border-box;
  font-family: var(--gt-serif);
  font-size: 1.3rem;
  line-height: 1.3;
  color: var(--gt-ivory);
  text-decoration: none;
}
body .sw-group-travel .gt-proof__cases a::after {
  content: "\2192";
  font-family: var(--gt-sans);
  font-size: 0.95rem;
  color: #CDBB8C;
  transition: transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-group-travel .gt-proof__cases a:hover::after {
  transform: translateX(4px);
}

/* ---------------------------------------------------------- 5. group types */
body .sw-group-travel .gt-types {
  background: var(--gt-paper);
  padding: var(--gt-space) 0;
}
body .sw-group-travel .gt-index {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--gt-ink);
}
body .sw-group-travel .gt-index li {
  margin: 0;
  border-bottom: 1px solid var(--gt-hair);
}
body .sw-group-travel .gt-index a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1.5rem;
  padding: 1.15rem 0;
  min-height: 44px;
  box-sizing: border-box;
  font-family: var(--gt-serif);
  font-size: clamp(1.5rem, 1.2rem + 0.9vw, 2rem);
  line-height: 1.15;
  color: var(--gt-ink);
  text-decoration: none;
  transition: color 0.2s ease, padding-left 0.3s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-group-travel .gt-index a::after {
  content: "\2192";
  font-family: var(--gt-sans);
  font-size: 1rem;
  color: var(--gt-gold);
}
body .sw-group-travel .gt-index a:hover,
body .sw-group-travel .gt-index a:focus-visible {
  color: var(--gt-olive);
  padding-left: 0.5rem;
}

/* ---------------------------------------------------------- 6. vehicles, guides, coordination */
body .sw-group-travel .gt-ground {
  background: var(--gt-stone);
  padding: var(--gt-space) 0;
}
body .sw-group-travel .gt-ground__intro {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6.5rem);
  align-items: end;
}
body .sw-group-travel .gt-ground__copy {
  padding-bottom: 0.5rem;
}
body .sw-group-travel .gt-photo {
  margin: 0;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--gt-stone-deep);
}
body .sw-group-travel .gt-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 42% 45%;
}
body .sw-group-travel .gt-line {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(2rem, 4vw, 4rem);
  margin-top: clamp(3.5rem, 6vw, 5rem);
  border-top: 1px solid var(--gt-ink);
}
body .sw-group-travel .gt-line__node {
  position: relative;
  padding-top: 2.1rem;
  margin: 0;
}
body .sw-group-travel .gt-line__node::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gt-olive);
}
body .sw-group-travel .gt-line p {
  max-width: 22rem;
}
body .sw-group-travel .gt-more {
  margin-top: 1.1rem;
}
body .sw-group-travel .gt-line .gt-more a,
body .sw-group-travel .gt-more a {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
  font-family: var(--gt-sans);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gt-olive-deep);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
body .sw-group-travel .gt-more a::after {
  content: "\2192";
  letter-spacing: 0;
  color: var(--gt-gold);
}
body .sw-group-travel .gt-more a:hover {
  border-bottom-color: var(--gt-gold);
}

/* ---------------------------------------------------------- 7. planning process (a real sequence) */
body .sw-group-travel .gt-process {
  background: var(--gt-paper);
  padding: var(--gt-space) 0;
}
body .sw-group-travel .gt-steps {
  list-style: none;
  counter-reset: gt-step;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--gt-ink);
}
body .sw-group-travel .gt-steps li {
  counter-increment: gt-step;
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  column-gap: 1.5rem;
  padding: 1.75rem 0 1.9rem;
  margin: 0;
  border-bottom: 1px solid var(--gt-hair);
}
body .sw-group-travel .gt-steps li::before {
  content: counter(gt-step, decimal-leading-zero);
  grid-column: 1;
  grid-row: 1 / span 2;
  font-family: var(--gt-serif);
  font-size: 2.1rem;
  line-height: 1;
  color: var(--gt-gold);
  font-variant-numeric: lining-nums tabular-nums;
}
body .sw-group-travel .gt-steps__title {
  grid-column: 2;
  font-family: var(--gt-serif);
  font-weight: 500;
  font-size: 1.55rem;
  line-height: 1.15;
  color: var(--gt-ink);
  margin: 0 0 0.45rem;
}
body .sw-group-travel .gt-steps p {
  grid-column: 2;
}

/* ---------------------------------------------------------- trade aside */
body .sw-group-travel .gt-trade {
  background: var(--gt-paper);
  padding: 0 0 clamp(3rem, 5vw, 4.5rem);
}
body .sw-group-travel .gt-trade__line {
  border-top: 1px solid var(--gt-hair);
  padding-top: 1.6rem;
  margin: 0;
  font-family: var(--gt-sans);
  font-size: 0.98rem;
  line-height: 1.7;
  color: var(--gt-ink-soft);
  max-width: 62rem;
}
body .sw-group-travel .gt-trade__label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gt-gold);
  margin-right: 0.9rem;
}
body .sw-group-travel .gt-trade__line a {
  color: var(--gt-olive-deep);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--gt-gold);
  text-underline-offset: 0.22em;
  white-space: nowrap;
}

/* ---------------------------------------------------------- 8. enquiry close */
body .sw-group-travel .gt-close {
  background: var(--gt-stone-deep);
  padding: clamp(4.5rem, 8vw, 7rem) 0;
}
body .sw-group-travel .gt-close__title {
  font-family: var(--gt-serif);
  font-weight: 400;
  font-size: clamp(2.4rem, 1.6rem + 2.6vw, 4rem);
  line-height: 1.04;
  letter-spacing: -0.012em;
  color: var(--gt-ink);
  margin: 0;
  max-width: 17ch;
  text-wrap: balance;
}
body .sw-group-travel .gt-close .gt-body {
  margin: 1.6rem 0 2.2rem;
  max-width: 34rem;
}

/* ---------------------------------------------------------- photograph slots (editor-only markers) */
body .sw-group-travel .sw-slot {
  margin: 2.5rem 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gt-stone-deep);
  border: 1px dashed rgba(34, 31, 25, 0.28);
  color: var(--gt-ink-faint);
  font-family: var(--gt-sans);
  font-size: 0.8rem;
  text-align: center;
  padding: 1.5rem;
  box-sizing: border-box;
}
body .sw-group-travel .sw-slot--4-3 { aspect-ratio: 4 / 3; }
body .sw-group-travel .sw-slot--3-2 { aspect-ratio: 3 / 2; }
body .sw-group-travel .sw-slot--4-5 { aspect-ratio: 4 / 5; max-width: 22rem; }
body .sw-group-travel .gt-proof .sw-slot {
  background: rgba(252, 250, 244, 0.06);
  border-color: var(--gt-hair-light);
  color: rgba(252, 250, 244, 0.7);
}
body .sw-group-travel .spw-pi-filled {
  margin: 2.5rem 0 0;
}
body .sw-group-travel .spw-pi-filled img {
  display: block;
  width: 100%;
  height: auto;
}

/* ---------------------------------------------------------- tablet: ≤1024 */
@media (max-width: 1024px) {
  body .sw-group-travel .gt-arrival .gt-wrap,
  body .sw-group-travel .gt-split,
  body .sw-group-travel .gt-ground__intro {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-group-travel .gt-arrival .gt-wrap > *,
  body .sw-group-travel .gt-title,
  body .sw-group-travel .gt-lead,
  body .sw-group-travel .gt-arrival .gt-actions,
  body .sw-group-travel .gt-route {
    grid-column: 1;
    grid-row: auto;
  }
  body .sw-group-travel .gt-title {
    max-width: 13ch;
    margin-bottom: 1.75rem;
  }
  body .sw-group-travel .gt-split__head {
    margin-bottom: 2.5rem;
  }
  body .sw-group-travel .gt-ground__copy {
    margin-bottom: 2.25rem;
  }
  body .sw-group-travel .gt-manifest {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body .sw-group-travel .gt-display {
    max-width: 14ch;
  }
  body .sw-group-travel .gt-proof__body {
    padding-top: 0;
  }
}

/* ---------------------------------------------------------- phone: ≤640 */
@media (max-width: 640px) {
  body .sw-group-travel .gt-route {
    grid-template-columns: minmax(0, 1fr);
    border-top: 0;
    border-left: 1px solid var(--gt-hair);
    margin-left: 4px;
  }
  body .sw-group-travel .gt-route li {
    padding: 0 0 1.1rem 1.4rem;
  }
  body .sw-group-travel .gt-route li:last-child {
    padding-bottom: 0;
  }
  body .sw-group-travel .gt-route li::before {
    top: 0.3em;
    left: -5px;
  }
  body .sw-group-travel .gt-roster__row {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.75rem;
  }
  body .sw-group-travel .gt-manifest {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-group-travel .gt-manifest li {
    padding-right: 0;
  }
  body .sw-group-travel .gt-line {
    grid-template-columns: minmax(0, 1fr);
    border-top: 0;
    border-left: 1px solid var(--gt-ink);
    margin-left: 4px;
    row-gap: 2.25rem;
  }
  body .sw-group-travel .gt-line__node {
    padding: 0 0 0 1.5rem;
  }
  body .sw-group-travel .gt-line__node::before {
    top: 0.45em;
    left: -5px;
  }
  body .sw-group-travel .gt-steps li {
    grid-template-columns: 3.25rem minmax(0, 1fr);
    column-gap: 1rem;
  }
  body .sw-group-travel .gt-steps li::before {
    font-size: 1.7rem;
  }
  body .sw-group-travel .gt-actions,
  body .sw-group-travel .gt-btn,
  body .sw-group-travel .gt-btn .wp-block-button__link {
    width: 100%;
  }
  body .sw-group-travel .gt-btn .wp-block-button__link {
    justify-content: center;
  }
  body .sw-group-travel .gt-trade__line a {
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .sw-group-travel * {
    transition: none !important;
  }
}
/* ==========================================================================
   SPURWING — TRAVEL TRADE HUB COMPOSITION LAYER (3.8.0)
   --------------------------------------------------------------------------
   "Your South African Ground Partner." Precise, confident, operational,
   discreet, partner-led. More B2B than the rest of the site and still
   Spurwing: controlled charcoal and olive-black surfaces, ivory type,
   restrained stone chapters, exact hairlines, a specification-sheet grid.
   Not Group Travel in darker colours; no corporate blue, no card walls,
   no icons, no dashboard.

   SCOPE (the 3.5.4 rule). `.sw-travel-trade` is a page-type marker carried
   by exactly one URL, /travel-trade/ (page 131), enumerated 2026-09-28 over
   all published pages. The hub no longer carries the shared trade generation
   wrapper (`.sw-trade-v170`, 10 child pages) or `.sw-factory-page` (88 other
   pages; no rule or code keys on it). Every selector starts
   `body .sw-travel-trade`; every class below is `tt-` prefixed.
   ========================================================================== */

body .sw-travel-trade {
  --tt-charcoal: #1F201B;
  --tt-olive-black: #2C2E22;
  --tt-paper: #F4F1E9;
  --tt-stone: #E6E0D2;
  --tt-ink: #1F201B;
  --tt-ink-soft: #4B4A41;
  --tt-ink-faint: #767264;
  --tt-ivory: #F4F0E6;
  --tt-ivory-soft: rgba(244, 240, 230, 0.78);
  --tt-ivory-faint: rgba(244, 240, 230, 0.56);
  --tt-gold: #8A7440;
  --tt-gold-light: #C8AE74;
  --tt-hair: rgba(31, 32, 27, 0.16);
  --tt-hair-dark: rgba(244, 240, 230, 0.16);
  --tt-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --tt-sans: Karla, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --tt-max: 1240px;
  --tt-pad: clamp(1.25rem, 4vw, 3rem);
  --tt-space: clamp(4.5rem, 8vw, 7.5rem);
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--tt-paper);
  color: var(--tt-ink);
  font-family: var(--tt-sans);
}
body .sw-travel-trade > * {
  margin: 0;
  max-width: none;
}
body .sw-travel-trade .tt-wrap {
  max-width: var(--tt-max);
  margin: 0 auto;
  padding: 0 var(--tt-pad);
  box-sizing: border-box;
}
body .sw-travel-trade .tt-wrap > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* ---------------------------------------------------------- shared type */
body .sw-travel-trade .tt-eyebrow {
  font-family: var(--tt-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--tt-gold);
  margin: 0 0 1.35rem;
}
body .sw-travel-trade .tt-h2 {
  font-family: var(--tt-serif);
  font-weight: 400;
  font-size: clamp(2.1rem, 1.45rem + 2.2vw, 3.3rem);
  line-height: 1.06;
  letter-spacing: -0.01em;
  color: var(--tt-ink);
  margin: 0;
  text-wrap: balance;
}
body .sw-travel-trade .tt-h3 {
  font-family: var(--tt-serif);
  font-weight: 500;
  font-size: clamp(1.4rem, 1.2rem + 0.6vw, 1.7rem);
  line-height: 1.15;
  margin: 0 0 0.6rem;
}
body .sw-travel-trade .tt-body {
  font-family: var(--tt-sans);
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--tt-ink-soft);
  margin: 0;
  max-width: 38rem;
}
body .sw-travel-trade .tt-body--lead {
  font-size: 1.18rem;
  line-height: 1.66;
  color: var(--tt-ink);
}

/* buttons: square, precise */
body .sw-travel-trade .tt-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem 1.1rem;
  margin: 0;
}
body .sw-travel-trade .tt-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 52px;
  padding: 0 1.8rem;
  border: 1px solid var(--tt-ivory);
  border-radius: 0;
  background: var(--tt-ivory);
  color: var(--tt-charcoal);
  font-family: var(--tt-sans);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.25s cubic-bezier(0.2, 0.7, 0.2, 1), color 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-travel-trade .tt-btn .wp-block-button__link::after {
  content: "\2192";
  font-size: 1rem;
  letter-spacing: 0;
  transition: transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-travel-trade .tt-btn .wp-block-button__link:hover,
body .sw-travel-trade .tt-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tt-ivory);
}
body .sw-travel-trade .tt-btn .wp-block-button__link:hover::after {
  transform: translateX(3px);
}
body .sw-travel-trade .tt-btn--quiet .wp-block-button__link {
  background: transparent;
  color: var(--tt-ivory);
  border-color: var(--tt-hair-dark);
}
body .sw-travel-trade .tt-btn--quiet .wp-block-button__link:hover,
body .sw-travel-trade .tt-btn--quiet .wp-block-button__link:focus-visible {
  border-color: var(--tt-ivory);
}
body .sw-travel-trade a:focus-visible {
  outline: 2px solid var(--tt-gold-light);
  outline-offset: 3px;
}

/* the specification sheet: a full-width rule, a narrow head, a wide body */
body .sw-travel-trade .tt-sheet {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
body .sw-travel-trade .tt-sheet > * {
  min-width: 0;
}
body .sw-travel-trade .tt-sheet::before {
  content: "";
  grid-column: 1 / -1;
  height: 1px;
  background: currentColor;
  opacity: 0.9;
  margin-bottom: clamp(2rem, 3.5vw, 3rem);
}

/* ---------------------------------------------------------- 1. partnership proposition */
body .sw-travel-trade .tt-hero {
  background: var(--tt-charcoal);
  color: var(--tt-ivory);
  padding: clamp(4.5rem, 9vw, 8rem) 0 clamp(3rem, 5vw, 4.25rem);
}
body .sw-travel-trade .tt-hero .tt-wrap {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
}
body .sw-travel-trade .tt-hero .tt-eyebrow {
  grid-column: 1 / -1;
  color: var(--tt-gold-light);
}
body .sw-travel-trade .tt-title {
  grid-column: 1;
  grid-row: 2 / span 2;
  font-family: var(--tt-serif);
  font-weight: 400;
  font-size: clamp(3rem, 1.6rem + 4.2vw, 5.6rem);
  line-height: 1.02;
  letter-spacing: -0.018em;
  color: var(--tt-ivory);
  margin: 0;
  max-width: 13.5ch;
  text-wrap: balance;
}
body .sw-travel-trade .tt-lead {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  font-family: var(--tt-sans);
  font-size: 1.1rem;
  line-height: 1.72;
  color: var(--tt-ivory-soft);
  margin: 0 0 1.9rem;
  max-width: 30rem;
}
body .sw-travel-trade .tt-hero .tt-actions {
  grid-column: 2;
  grid-row: 3;
  align-self: start;
}
body .sw-travel-trade .tt-spec {
  grid-column: 1 / -1;
  grid-row: 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.7fr);
  margin: clamp(3.5rem, 6vw, 5.5rem) 0 0;
  padding: 0;
  border-top: 1px solid var(--tt-hair-dark);
}
body .sw-travel-trade .tt-spec > div {
  padding: 1.35rem 1.25rem 0 0;
  margin: 0;
}
body .sw-travel-trade .tt-spec > div + div {
  padding-left: 1.25rem;
  border-left: 1px solid var(--tt-hair-dark);
}
body .sw-travel-trade .tt-spec dt {
  font-family: var(--tt-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tt-gold-light);
  margin: 0 0 0.5rem;
}
body .sw-travel-trade .tt-spec dd {
  font-family: var(--tt-sans);
  font-size: 1rem;
  line-height: 1.45;
  color: var(--tt-ivory);
  margin: 0;
  font-variant-numeric: lining-nums tabular-nums;
}

/* ---------------------------------------------------------- 2. what Spurwing handles */
body .sw-travel-trade .tt-services {
  background: var(--tt-paper);
  color: var(--tt-ink);
  padding: var(--tt-space) 0;
}
body .sw-travel-trade .tt-ledger {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--tt-hair);
  grid-column: 2;
  grid-row: 2;
}
body .sw-travel-trade .tt-ledger li {
  margin: 0;
  border-bottom: 1px solid var(--tt-hair);
}
body .sw-travel-trade .tt-ledger a {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) 1.5rem;
  column-gap: 1.75rem;
  align-items: baseline;
  padding: 1.35rem 0 1.45rem;
  min-height: 44px;
  box-sizing: border-box;
  color: var(--tt-ink);
  text-decoration: none;
  transition: padding-left 0.3s cubic-bezier(0.2, 0.7, 0.2, 1), background-color 0.3s ease;
}
body .sw-travel-trade .tt-ledger a::after {
  content: "\2192";
  font-family: var(--tt-sans);
  color: var(--tt-gold);
  justify-self: end;
}
body .sw-travel-trade .tt-ledger a:hover,
body .sw-travel-trade .tt-ledger a:focus-visible {
  padding-left: 0.6rem;
}
body .sw-travel-trade .tt-ledger__name {
  font-family: var(--tt-serif);
  font-size: clamp(1.45rem, 1.2rem + 0.7vw, 1.85rem);
  line-height: 1.12;
  color: var(--tt-ink);
}
body .sw-travel-trade .tt-ledger__note {
  font-family: var(--tt-sans);
  font-size: 0.98rem;
  line-height: 1.6;
  color: var(--tt-ink-soft);
}
body .sw-travel-trade .tt-services .tt-more {
  grid-column: 2;
  margin-top: 1.4rem;
}
body .sw-travel-trade .tt-more a {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
  font-family: var(--tt-sans);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--tt-ink);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
body .sw-travel-trade .tt-more a::after {
  content: "\2192";
  letter-spacing: 0;
  color: var(--tt-gold);
}
body .sw-travel-trade .tt-more a:hover {
  border-bottom-color: var(--tt-gold);
}

/* ---------------------------------------------------------- 3. protecting the client relationship */
body .sw-travel-trade .tt-relationship {
  background: var(--tt-olive-black);
  color: var(--tt-ivory);
  padding: var(--tt-space) 0;
}
body .sw-travel-trade .tt-relationship .tt-eyebrow,
body .sw-travel-trade .tt-capability .tt-eyebrow,
body .sw-travel-trade .tt-close .tt-eyebrow {
  color: var(--tt-gold-light);
}
body .sw-travel-trade .tt-display {
  font-family: var(--tt-serif);
  font-weight: 400;
  font-size: clamp(2.6rem, 1.6rem + 3vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: -0.015em;
  color: var(--tt-ivory);
  margin: 0;
  max-width: 10ch;
  text-wrap: balance;
}
body .sw-travel-trade .tt-relationship .tt-body,
body .sw-travel-trade .tt-capability .tt-body,
body .sw-travel-trade .tt-close .tt-body {
  color: var(--tt-ivory-soft);
}
body .sw-travel-trade .tt-relationship .tt-body--lead,
body .sw-travel-trade .tt-capability .tt-body--lead {
  color: var(--tt-ivory);
}
body .sw-travel-trade .tt-relationship .tt-h3 {
  color: var(--tt-ivory);
  margin-top: 2.6rem;
}
body .sw-travel-trade .tt-principles {
  margin: 2.6rem 0 0;
  padding: 0;
  border-top: 1px solid var(--tt-hair-dark);
}
body .sw-travel-trade .tt-principles > div {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  column-gap: 1.75rem;
  padding: 1.25rem 0 1.35rem;
  border-bottom: 1px solid var(--tt-hair-dark);
  margin: 0;
}
body .sw-travel-trade .tt-principles dt {
  font-family: var(--tt-sans);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1.5;
  color: var(--tt-ivory);
  margin: 0;
}
body .sw-travel-trade .tt-principles dd {
  font-family: var(--tt-sans);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--tt-ivory-soft);
  margin: 0;
}

/* ---------------------------------------------------------- 4. how the operation works (a real sequence) */
body .sw-travel-trade .tt-process {
  background: var(--tt-stone);
  color: var(--tt-ink);
  padding: var(--tt-space) 0;
}
body .sw-travel-trade .tt-process__intro {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: end;
}
body .sw-travel-trade .tt-process__copy .tt-body {
  margin-top: 1.4rem;
}
body .sw-travel-trade .tt-stages {
  list-style: none;
  counter-reset: tt-stage;
  margin: clamp(3.25rem, 5vw, 4.5rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  column-gap: clamp(1.25rem, 2.2vw, 2rem);
  border-top: 1px solid var(--tt-ink);
}
body .sw-travel-trade .tt-stages li {
  counter-increment: tt-stage;
  position: relative;
  padding: 2rem 0 0;
  margin: 0;
}
body .sw-travel-trade .tt-stages li::before {
  content: counter(tt-stage, decimal-leading-zero);
  position: absolute;
  top: -0.8rem;
  left: 0;
  padding-right: 0.6rem;
  background: var(--tt-stone);
  font-family: var(--tt-sans);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: 1.6rem;
  color: var(--tt-gold);
  font-variant-numeric: lining-nums tabular-nums;
}
body .sw-travel-trade .tt-stages__name {
  font-family: var(--tt-serif);
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.15;
  color: var(--tt-ink);
  margin: 0 0 0.6rem;
}
body .sw-travel-trade .tt-stages p {
  font-family: var(--tt-sans);
  font-size: 0.98rem;
  line-height: 1.62;
  color: var(--tt-ink-soft);
  margin: 0;
}

/* ---------------------------------------------------------- 5. operational capability */
body .sw-travel-trade .tt-capability {
  background: var(--tt-charcoal);
  color: var(--tt-ivory);
  padding: var(--tt-space) 0;
}
body .sw-travel-trade .tt-capability .tt-h2 {
  color: var(--tt-ivory);
  max-width: 13ch;
}
body .sw-travel-trade .tt-capacities {
  list-style: none;
  margin: 2.75rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, auto));
  justify-content: start;
  border-top: 1px solid var(--tt-hair-dark);
  border-bottom: 1px solid var(--tt-hair-dark);
}
body .sw-travel-trade .tt-capacities li {
  margin: 0;
  padding: 1.1rem 1.5rem 1.15rem 0;
  font-family: var(--tt-serif);
  font-size: 1.35rem;
  line-height: 1.2;
  color: var(--tt-ivory);
  white-space: nowrap;
}
body .sw-travel-trade .tt-capacities li + li {
  padding-left: 1.5rem;
  border-left: 1px solid var(--tt-hair-dark);
}

/* ---------------------------------------------------------- 6. agent resources */
body .sw-travel-trade .tt-resources {
  background: var(--tt-paper);
  color: var(--tt-ink);
  padding: var(--tt-space) 0;
}
body .sw-travel-trade .tt-resources__intro {
  max-width: 44rem;
}
body .sw-travel-trade .tt-resources__intro .tt-body {
  margin-top: 1.4rem;
}
body .sw-travel-trade .tt-routes {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  margin-top: clamp(3rem, 5vw, 4rem);
}
body .sw-travel-trade .tt-routes__group {
  border-top: 1px solid var(--tt-ink);
  padding-top: 1.4rem;
}
body .sw-travel-trade .tt-routes__label {
  font-family: var(--tt-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tt-gold);
  margin: 0 0 0.9rem;
}
body .sw-travel-trade .tt-routes__note {
  font-family: var(--tt-sans);
  font-size: 0.98rem;
  line-height: 1.66;
  color: var(--tt-ink-soft);
  margin: 0 0 1.2rem;
  max-width: 34rem;
}
body .sw-travel-trade .tt-routes ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
body .sw-travel-trade .tt-routes li {
  margin: 0;
  border-bottom: 1px solid var(--tt-hair);
}
body .sw-travel-trade .tt-routes a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 1rem 0;
  min-height: 44px;
  box-sizing: border-box;
  font-family: var(--tt-serif);
  font-size: clamp(1.35rem, 1.15rem + 0.6vw, 1.7rem);
  line-height: 1.2;
  color: var(--tt-ink);
  text-decoration: none;
  transition: padding-left 0.3s cubic-bezier(0.2, 0.7, 0.2, 1);
}
body .sw-travel-trade .tt-routes a::after {
  content: "\2192";
  font-family: var(--tt-sans);
  font-size: 0.95rem;
  color: var(--tt-gold);
}
body .sw-travel-trade .tt-routes a:hover,
body .sw-travel-trade .tt-routes a:focus-visible {
  padding-left: 0.5rem;
}

/* ---------------------------------------------------------- 7. partnership close */
body .sw-travel-trade .tt-close {
  background: var(--tt-olive-black);
  color: var(--tt-ivory);
  padding: clamp(4.5rem, 8vw, 7rem) 0;
  border-bottom: 1px solid var(--tt-hair-dark);
}
body .sw-travel-trade .tt-close__title {
  font-family: var(--tt-serif);
  font-weight: 400;
  font-size: clamp(2.3rem, 1.5rem + 2.5vw, 3.9rem);
  line-height: 1.05;
  letter-spacing: -0.012em;
  color: var(--tt-ivory);
  margin: 0;
  max-width: 19ch;
  text-wrap: balance;
}
body .sw-travel-trade .tt-close .tt-body {
  margin: 1.6rem 0 2.2rem;
  max-width: 34rem;
}

/* ---------------------------------------------------------- photograph slots (editor-only markers) */
body .sw-travel-trade .sw-slot {
  margin: 2.5rem 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(31, 32, 27, 0.06);
  border: 1px dashed rgba(31, 32, 27, 0.3);
  color: var(--tt-ink-faint);
  font-family: var(--tt-sans);
  font-size: 0.8rem;
  text-align: center;
  padding: 1.5rem;
  box-sizing: border-box;
}
body .sw-travel-trade .sw-slot--4-3 { aspect-ratio: 4 / 3; }
body .sw-travel-trade .sw-slot--3-2 { aspect-ratio: 3 / 2; margin-top: 0; }
body .sw-travel-trade .sw-slot--4-5 { aspect-ratio: 4 / 5; max-width: 22rem; }
body .sw-travel-trade :is(.tt-relationship, .tt-capability) .sw-slot {
  background: rgba(244, 240, 230, 0.05);
  border-color: var(--tt-hair-dark);
  color: var(--tt-ivory-faint);
}
body .sw-travel-trade .spw-pi-filled {
  margin: 2.5rem 0 0;
}
body .sw-travel-trade .spw-pi-filled img {
  display: block;
  width: 100%;
  height: auto;
}

/* ---------------------------------------------------------- tablet: ≤1024 */
@media (max-width: 1024px) {
  body .sw-travel-trade .tt-hero .tt-wrap,
  body .sw-travel-trade .tt-sheet,
  body .sw-travel-trade .tt-process__intro {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-travel-trade .tt-hero .tt-wrap > *,
  body .sw-travel-trade .tt-title,
  body .sw-travel-trade .tt-lead,
  body .sw-travel-trade .tt-hero .tt-actions,
  body .sw-travel-trade .tt-spec,
  body .sw-travel-trade .tt-ledger,
  body .sw-travel-trade .tt-services .tt-more {
    grid-column: 1;
    grid-row: auto;
  }
  body .sw-travel-trade .tt-title {
    margin-bottom: 1.75rem;
    max-width: 12ch;
  }
  body .sw-travel-trade .tt-spec {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body .sw-travel-trade .tt-spec > div,
  body .sw-travel-trade .tt-spec > div + div {
    padding: 1.2rem 1rem 1.1rem 0;
    border-left: 0;
    border-bottom: 1px solid var(--tt-hair-dark);
  }
  body .sw-travel-trade .tt-sheet__head {
    margin-bottom: 2.5rem;
  }
  body .sw-travel-trade .sw-slot--3-2 {
    margin-top: 2.5rem;
  }
  body .sw-travel-trade .tt-stages {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 2.25rem;
    border-top: 0;
  }
  body .sw-travel-trade .tt-stages li {
    border-top: 1px solid var(--tt-ink);
  }
  body .sw-travel-trade .tt-capacities {
    grid-template-columns: repeat(3, minmax(0, auto));
  }
  body .sw-travel-trade .tt-capacities li:nth-child(4) {
    padding-left: 0;
    border-left: 0;
  }
}

/* ---------------------------------------------------------- phone: ≤640 */
@media (max-width: 640px) {
  body .sw-travel-trade .tt-spec {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-travel-trade .tt-ledger a {
    grid-template-columns: minmax(0, 1fr) 1.25rem;
    row-gap: 0.45rem;
  }
  body .sw-travel-trade .tt-ledger__name {
    grid-column: 1;
    grid-row: 1;
  }
  body .sw-travel-trade .tt-ledger a::after {
    grid-column: 2;
    grid-row: 1;
  }
  body .sw-travel-trade .tt-ledger__note {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  body .sw-travel-trade .tt-principles > div {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.45rem;
  }
  body .sw-travel-trade .tt-stages {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-travel-trade .tt-capacities {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-travel-trade .tt-capacities li,
  body .sw-travel-trade .tt-capacities li + li,
  body .sw-travel-trade .tt-capacities li:nth-child(4) {
    padding: 0.85rem 0;
    border-left: 0;
    white-space: normal;
  }
  body .sw-travel-trade .tt-capacities li + li {
    border-top: 1px solid var(--tt-hair-dark);
  }
  body .sw-travel-trade .tt-routes {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 2.5rem;
  }
  body .sw-travel-trade .tt-actions,
  body .sw-travel-trade .tt-btn,
  body .sw-travel-trade .tt-btn .wp-block-button__link {
    width: 100%;
  }
  body .sw-travel-trade .tt-btn .wp-block-button__link {
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .sw-travel-trade * {
    transition: none !important;
  }
}

/* ==========================================================================
   LUXURY V3 — SCOPED FIXES (3.8.1)
   Each fix names the exact component relationship it targets and the URLs
   that carry it. Nothing here widens a frozen or global selector.
   ========================================================================== */

/* Private Safaris — "Choose the privacy that changes the experience".
   Global Styles sets `.sw-section.sw-r0-split.sw-p5-slot .sw-r0-split__text
   .wp-block-columns{gap:0}` at (0,5,0), which collapsed the three privacy
   options into one another. Of the eight `.sw-safari-v200` pages only
   /private-safaris/ has a path grid inside a split's text column (enumerated
   2026-09-29). /tailor-made/ has the same structure on `.sw-dream-v220`, and
   is deliberately untouched. (0,5,1) beats the global rule without editing it;
   only the row gap is set. */
body .sw-safari-v200 .sw-section.sw-r0-split .sw-r0-split__text .sw-path-grid{
  row-gap:clamp(1.5rem,2.5vw,2.25rem);
}

/* ==========================================================================
   SPURWING — TRANSFERS HUB COMPOSITION LAYER (3.9.0)
   --------------------------------------------------------------------------
   "The journey between the journeys is handled properly too." Reliable,
   calm, precise, premium, operationally competent. More precise than the
   accommodation layer, less editorial than the destination layer: an ivory
   hero drawn around an example journey line (the transfers are the legs),
   a charcoal operational sheet, a route index set like a timetable, a stone
   vehicles-and-guides chapter, a run sheet, an olive-black close. No vehicle
   hero, no stock, no cards, no icons.

   SCOPE (the 3.5.3 / 3.5.4 rule). `.sw-transfers` is a page-type marker
   carried by exactly one URL, /transfers/ (page 127), enumerated 2026-09-29
   over all 127 published pages. The hub no longer carries the shared
   transport generation wrapper `.sw-transport-v210`, which stays on the
   ten other transport pages (/airport-transfers/, /or-tambo-airport-
   transfers/, /safari-transfers/, /johannesburg-to-kruger-transfer/,
   /or-tambo-to-kruger-transfer/, /johannesburg-to-madikwe-transfer/,
   /johannesburg-to-dinokeng-transfer/, /private-transfers/,
   /group-transport/, /vehicle-and-guide-hire/). Every selector starts
   `body .sw-transfers`; every composition class is `tr-` prefixed.
   ========================================================================== */

body .sw-transfers {
  --tr-charcoal: #1F201B;
  --tr-olive-black: #2C2E22;
  --tr-paper: #F4F1E9;
  --tr-ivory-ground: #FAF8F2;
  --tr-stone: #E6E0D2;
  --tr-ink: #1F201B;
  --tr-ink-soft: #4B4A41;
  --tr-ink-faint: #6E6A5D;
  --tr-ivory: #F4F0E6;
  --tr-ivory-soft: rgba(244, 240, 230, 0.8);
  --tr-ivory-faint: rgba(244, 240, 230, 0.58);
  --tr-olive: #5C5F3E;
  --tr-gold: #8A7440;
  --tr-gold-light: #C8AE74;
  --tr-hair: rgba(31, 32, 27, 0.15);
  --tr-hair-strong: rgba(31, 32, 27, 0.55);
  --tr-hair-dark: rgba(244, 240, 230, 0.16);
  --tr-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --tr-sans: Karla, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --tr-max: 1240px;
  --tr-pad: clamp(1.25rem, 4vw, 3rem);
  --tr-space: clamp(4.5rem, 8vw, 7.5rem);
  --tr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--tr-paper);
  color: var(--tr-ink);
  font-family: var(--tr-sans);
}
body .sw-transfers > * {
  margin: 0;
  max-width: none;
}
body .sw-transfers .tr-wrap {
  max-width: var(--tr-max);
  margin: 0 auto;
  padding: 0 var(--tr-pad);
  box-sizing: border-box;
}
body .sw-transfers .tr-wrap > * {
  margin-top: 0;
  margin-bottom: 0;
}
body .sw-transfers :is(ul, ol, dl, dd, figure) {
  margin: 0;
  padding: 0;
}
body .sw-transfers :is(ul, ol) {
  list-style: none;
}

/* ---------------------------------------------------------- shared type */
body .sw-transfers .tr-eyebrow {
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--tr-gold);
  margin: 0 0 1.3rem;
}
body .sw-transfers .tr-h2 {
  font-family: var(--tr-serif);
  font-weight: 400;
  font-size: clamp(2.1rem, 1.45rem + 2.2vw, 3.3rem);
  line-height: 1.06;
  letter-spacing: -0.01em;
  color: var(--tr-ink);
  margin: 0;
  max-width: 18ch;
  text-wrap: balance;
}
body .sw-transfers .tr-body {
  font-family: var(--tr-sans);
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--tr-ink-soft);
  margin: 0;
  max-width: 36rem;
}

/* buttons: square, exact, one primary */
body .sw-transfers .tr-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem 1.1rem;
  margin: 0;
}
body .sw-transfers .tr-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 52px;
  padding: 0 1.8rem;
  border: 1px solid var(--tr-charcoal);
  border-radius: 0;
  background: var(--tr-charcoal);
  color: var(--tr-ivory);
  font-family: var(--tr-sans);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color 0.25s var(--tr-ease), color 0.25s var(--tr-ease), border-color 0.25s var(--tr-ease);
}
body .sw-transfers .tr-btn .wp-block-button__link::after {
  content: "\2192";
  font-size: 1rem;
  letter-spacing: 0;
  transition: transform 0.25s var(--tr-ease);
}
body .sw-transfers .tr-btn .wp-block-button__link:hover,
body .sw-transfers .tr-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tr-charcoal);
}
body .sw-transfers .tr-btn .wp-block-button__link:hover::after {
  transform: translateX(3px);
}
body .sw-transfers .tr-btn-quiet .wp-block-button__link {
  background: transparent;
  color: var(--tr-charcoal);
  border-color: transparent;
  border-bottom-color: var(--tr-hair-strong);
  padding: 0 0.15rem;
}
body .sw-transfers .tr-btn-quiet .wp-block-button__link::after {
  content: "\2193";
}
body .sw-transfers .tr-btn-quiet .wp-block-button__link:hover,
body .sw-transfers .tr-btn-quiet .wp-block-button__link:focus-visible {
  border-color: transparent;
  border-bottom-color: var(--tr-charcoal);
}
body .sw-transfers .tr-btn-quiet .wp-block-button__link:hover::after {
  transform: translateY(2px);
}
body .sw-transfers a:focus-visible {
  outline: 2px solid var(--tr-gold);
  outline-offset: 3px;
}

/* ---------------------------------------------------------- 1. arrival / proposition */
body .sw-transfers .tr-hero {
  background: var(--tr-ivory-ground);
  color: var(--tr-ink);
  padding: clamp(4.5rem, 9vw, 7.5rem) 0 clamp(3.5rem, 6vw, 5rem);
  border-bottom: 1px solid var(--tr-hair);
}
body .sw-transfers .tr-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
}
body .sw-transfers .tr-hero__grid > * {
  min-width: 0;
}
body .sw-transfers .tr-hero .tr-eyebrow {
  grid-column: 1 / -1;
}
body .sw-transfers .tr-title {
  grid-column: 1;
  grid-row: 2 / span 2;
  font-family: var(--tr-serif);
  font-weight: 400;
  font-size: clamp(2.9rem, 1.5rem + 4.1vw, 5.3rem);
  line-height: 1.03;
  letter-spacing: -0.018em;
  color: var(--tr-ink);
  margin: 0;
  max-width: 14ch;
  text-wrap: balance;
}
body .sw-transfers .tr-lead {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  font-family: var(--tr-sans);
  font-size: 1.1rem;
  line-height: 1.72;
  color: var(--tr-ink-soft);
  margin: 0 0 1.9rem;
  max-width: 30rem;
}
body .sw-transfers .tr-hero .tr-actions {
  grid-column: 2;
  grid-row: 3;
  align-self: start;
}

/* the example journey: stops on a hairline, the transfers drawn as the legs */
body .sw-transfers .tr-journey {
  margin-top: clamp(3.5rem, 6vw, 5.5rem);
}
body .sw-transfers .tr-journey__cap {
  font-family: var(--tr-sans);
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--tr-ink-faint);
  margin: 0 0 1.75rem;
}
body .sw-transfers .tr-journey__cap span {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tr-gold);
  margin-right: 0.9rem;
}
body .sw-transfers .tr-journey__line {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
body .sw-transfers .tr-journey__line::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0.4rem;
  height: 1px;
  background: var(--tr-hair-strong);
}
body .sw-transfers .tr-journey__line > li {
  position: relative;
  margin: 0;
  padding: 1.55rem 0.75rem 0 0;
  min-width: 0;
}
body .sw-transfers .tr-stop::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  border: 1px solid var(--tr-charcoal);
  background: var(--tr-ivory-ground);
  box-sizing: border-box;
}
body .sw-transfers .tr-stop__place {
  display: block;
  font-family: var(--tr-serif);
  font-size: clamp(1.3rem, 1.1rem + 0.5vw, 1.6rem);
  line-height: 1.15;
  color: var(--tr-ink);
}
body .sw-transfers .tr-stop__note {
  display: block;
  margin-top: 0.3rem;
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--tr-ink-faint);
}
/* the line ends at the final stop */
body .sw-transfers .tr-journey__line > li:last-child::after {
  content: "";
  position: absolute;
  left: 0.8rem;
  right: 0;
  top: calc(0.4rem - 1px);
  height: 3px;
  background: var(--tr-ivory-ground);
}
body .sw-transfers .tr-leg::before {
  content: "";
  position: absolute;
  left: 1.1rem;
  right: 1.1rem;
  top: calc(0.4rem - 1px);
  height: 3px;
  background: var(--tr-gold);
}
body .sw-transfers .tr-leg a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  margin-left: 1.1rem;
  font-family: var(--tr-sans);
  font-size: 0.95rem;
  line-height: 1.35;
  color: var(--tr-ink);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.25s var(--tr-ease), color 0.25s var(--tr-ease);
}
body .sw-transfers .tr-leg a::after {
  content: "\2192";
  color: var(--tr-gold);
  transition: transform 0.25s var(--tr-ease);
}
body .sw-transfers .tr-leg a:hover,
body .sw-transfers .tr-leg a:focus-visible {
  color: var(--tr-olive);
}
body .sw-transfers .tr-leg a:hover::after {
  transform: translateX(3px);
}

/* ---------------------------------------------------------- 2. what Spurwing moves + operational proof */
body .sw-transfers .tr-moves {
  background: var(--tr-charcoal);
  color: var(--tr-ivory);
  padding: var(--tr-space) 0;
}
body .sw-transfers .tr-moves__head {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: end;
}
body .sw-transfers .tr-moves__head .tr-eyebrow {
  grid-column: 1 / -1;
  color: var(--tr-gold-light);
}
body .sw-transfers .tr-moves .tr-h2 {
  color: var(--tr-ivory);
  max-width: 14ch;
}
body .sw-transfers .tr-moves .tr-body {
  color: var(--tr-ivory-soft);
}
body .sw-transfers .tr-proof__label {
  margin: clamp(3rem, 5vw, 4.5rem) 0 0;
  padding: 0 0 1.1rem;
  border-bottom: 1px solid var(--tr-ivory-faint);
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tr-gold-light);
}
body .sw-transfers .tr-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 3vw, 2.75rem);
}
body .sw-transfers .tr-proof > div {
  padding: 1.5rem 0 1.6rem;
  border-bottom: 1px solid var(--tr-hair-dark);
  min-width: 0;
}
body .sw-transfers .tr-proof dt {
  font-family: var(--tr-serif);
  font-size: 1.45rem;
  line-height: 1.15;
  color: var(--tr-ivory);
  margin: 0 0 0.55rem;
}
body .sw-transfers .tr-proof dd {
  font-family: var(--tr-sans);
  font-size: 0.96rem;
  line-height: 1.6;
  color: var(--tr-ivory-soft);
}

/* ---------------------------------------------------------- 3–6. route index, grouped by movement */
body .sw-transfers .tr-routes {
  background: var(--tr-paper);
  padding: var(--tr-space) 0;
}
body .sw-transfers .tr-routes__head {
  margin-bottom: clamp(2.5rem, 4.5vw, 3.75rem);
}
body .sw-transfers #tr-routes {
  scroll-margin-top: 6rem;
}
body .sw-transfers .tr-group {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  padding: clamp(1.75rem, 3vw, 2.5rem) 0 clamp(2.25rem, 4vw, 3.25rem);
  border-top: 1px solid var(--tr-ink);
}
body .sw-transfers .tr-group > * {
  min-width: 0;
}
body .sw-transfers .tr-group__name {
  font-family: var(--tr-serif);
  font-weight: 400;
  font-size: clamp(1.6rem, 1.3rem + 0.8vw, 2.05rem);
  line-height: 1.1;
  color: var(--tr-ink);
  margin: 0 0 0.75rem;
  text-wrap: balance;
}
body .sw-transfers .tr-group__note {
  font-family: var(--tr-sans);
  font-size: 0.98rem;
  line-height: 1.62;
  color: var(--tr-ink-soft);
  margin: 0;
  max-width: 24rem;
}
body .sw-transfers .tr-index li {
  margin: 0;
  border-bottom: 1px solid var(--tr-hair);
}
body .sw-transfers .tr-index li:first-child a {
  padding-top: 0.2rem;
}
body .sw-transfers .tr-index a {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 6fr) 1.25rem;
  column-gap: 1.75rem;
  align-items: baseline;
  padding: 1.05rem 0 1.15rem;
  min-height: 44px;
  box-sizing: border-box;
  color: var(--tr-ink);
  text-decoration: none;
}
body .sw-transfers .tr-index a::after {
  content: "\2192";
  font-family: var(--tr-sans);
  color: var(--tr-gold);
  justify-self: end;
  transition: transform 0.25s var(--tr-ease);
}
body .sw-transfers .tr-index a:hover::after,
body .sw-transfers .tr-index a:focus-visible::after {
  transform: translateX(4px);
}
body .sw-transfers .tr-index__name {
  font-family: var(--tr-serif);
  font-size: clamp(1.3rem, 1.15rem + 0.35vw, 1.48rem);
  line-height: 1.15;
  color: var(--tr-ink);
  font-variant-numeric: lining-nums;
}
body .sw-transfers .tr-index a:hover .tr-index__name,
body .sw-transfers .tr-index a:focus-visible .tr-index__name {
  color: var(--tr-olive);
}
body .sw-transfers .tr-to {
  font-family: var(--tr-sans);
  font-size: 0.9em;
  color: var(--tr-gold);
  padding: 0 0.2em;
}
body .sw-transfers .tr-index__note {
  font-family: var(--tr-sans);
  font-size: 0.96rem;
  line-height: 1.58;
  color: var(--tr-ink-soft);
}

/* ---------------------------------------------------------- 7. vehicles & guides */
body .sw-transfers .tr-fleet {
  background: var(--tr-stone);
  padding: var(--tr-space) 0 clamp(3.5rem, 6vw, 5rem);
}
body .sw-transfers .tr-fleet__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
body .sw-transfers .tr-fleet__grid > * {
  min-width: 0;
}
body .sw-transfers .tr-fleet__head .tr-body {
  margin-top: 1.5rem;
}
body .sw-transfers .tr-capability {
  grid-column: 2;
  border-top: 1px solid var(--tr-hair-strong);
}
body .sw-transfers .tr-capability > div {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
  column-gap: 1.75rem;
  padding: 1.35rem 0 1.45rem;
  border-bottom: 1px solid var(--tr-hair);
}
body .sw-transfers .tr-capability dt {
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tr-olive);
  padding-top: 0.3rem;
}
body .sw-transfers .tr-capability dd {
  font-family: var(--tr-sans);
  font-size: 1.02rem;
  line-height: 1.68;
  color: var(--tr-ink);
}
body .sw-transfers .tr-more {
  grid-column: 2;
  margin: 1.4rem 0 0;
}
body .sw-transfers .tr-more a {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
  font-family: var(--tr-sans);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--tr-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--tr-hair-strong);
}
body .sw-transfers .tr-more a::after {
  content: "\2192";
  color: var(--tr-gold);
  letter-spacing: 0;
}
body .sw-transfers .tr-more a:hover,
body .sw-transfers .tr-more a:focus-visible {
  border-color: var(--tr-ink);
}
body .sw-transfers .tr-since {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: end;
  margin-top: clamp(3.5rem, 6vw, 5rem);
  padding-top: clamp(1.75rem, 3vw, 2.5rem);
  border-top: 1px solid var(--tr-hair-strong);
}
body .sw-transfers .tr-since__year {
  font-family: var(--tr-serif);
  font-size: clamp(3.2rem, 2rem + 3.6vw, 5.4rem);
  line-height: 0.95;
  color: var(--tr-ink);
  margin: 0;
  font-variant-numeric: lining-nums;
}
body .sw-transfers .tr-since__year span {
  display: block;
  margin-bottom: 0.75rem;
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tr-olive);
  line-height: 1.3;
}
body .sw-transfers .tr-since__text {
  font-family: var(--tr-sans);
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--tr-ink-soft);
  margin: 0;
  max-width: 38rem;
}

/* ---------------------------------------------------------- 8. how transfer planning works: a run sheet */
body .sw-transfers .tr-plan {
  background: var(--tr-paper);
  padding: var(--tr-space) 0;
}
body .sw-transfers .tr-plan__grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
body .sw-transfers .tr-plan__grid > * {
  min-width: 0;
}
body .sw-transfers .tr-run {
  border-top: 1px solid var(--tr-ink);
}
body .sw-transfers .tr-run li {
  display: grid;
  grid-template-columns: 3.25rem minmax(0, 4fr) minmax(0, 7fr);
  column-gap: 1.5rem;
  align-items: baseline;
  margin: 0;
  padding: 1.4rem 0 1.5rem;
  border-bottom: 1px solid var(--tr-hair);
}
body .sw-transfers .tr-run__n {
  font-family: var(--tr-sans);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--tr-gold);
  font-variant-numeric: tabular-nums;
}
body .sw-transfers .tr-run__name {
  font-family: var(--tr-serif);
  font-size: clamp(1.35rem, 1.2rem + 0.45vw, 1.6rem);
  line-height: 1.15;
  color: var(--tr-ink);
}
body .sw-transfers .tr-run__text {
  font-family: var(--tr-sans);
  font-size: 0.98rem;
  line-height: 1.62;
  color: var(--tr-ink-soft);
}

/* ---------------------------------------------------------- 9. enquiry close */
body .sw-transfers .tr-close {
  background: var(--tr-olive-black);
  color: var(--tr-ivory);
  padding: clamp(4.5rem, 8vw, 7rem) 0;
  border-bottom: 1px solid var(--tr-hair-dark);
}
body .sw-transfers .tr-close__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  column-gap: clamp(2.5rem, 7vw, 7rem);
  align-items: end;
}
body .sw-transfers .tr-close__grid > * {
  min-width: 0;
}
body .sw-transfers .tr-close .tr-eyebrow {
  color: var(--tr-gold-light);
}
body .sw-transfers .tr-close__title {
  font-family: var(--tr-serif);
  font-weight: 400;
  font-size: clamp(2.3rem, 1.5rem + 2.5vw, 3.8rem);
  line-height: 1.05;
  letter-spacing: -0.012em;
  color: var(--tr-ivory);
  margin: 0;
  max-width: 19ch;
  text-wrap: balance;
}
body .sw-transfers .tr-close__text {
  font-family: var(--tr-sans);
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--tr-ivory-soft);
  margin: 1.6rem 0 2.2rem;
  max-width: 34rem;
}
body .sw-transfers .tr-close .tr-btn .wp-block-button__link {
  background: var(--tr-ivory);
  border-color: var(--tr-ivory);
  color: var(--tr-charcoal);
}
body .sw-transfers .tr-close .tr-btn .wp-block-button__link:hover,
body .sw-transfers .tr-close .tr-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tr-ivory);
}
body .sw-transfers .tr-close a:focus-visible {
  outline-color: var(--tr-gold-light);
}
body .sw-transfers .tr-ready {
  border-top: 1px solid var(--tr-ivory-faint);
  padding-top: 1.1rem;
}
body .sw-transfers .tr-ready__label {
  font-family: var(--tr-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tr-gold-light);
  margin: 0 0 0.6rem;
}
body .sw-transfers .tr-ready li {
  margin: 0;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--tr-hair-dark);
  font-family: var(--tr-sans);
  font-size: 0.98rem;
  line-height: 1.5;
  color: var(--tr-ivory-soft);
}

/* ---------------------------------------------------------- tablet: ≤1024 */
@media (max-width: 1024px) {
  body .sw-transfers .tr-hero__grid,
  body .sw-transfers .tr-moves__head,
  body .sw-transfers .tr-group,
  body .sw-transfers .tr-fleet__grid,
  body .sw-transfers .tr-since,
  body .sw-transfers .tr-plan__grid,
  body .sw-transfers .tr-close__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-transfers .tr-hero__grid > *,
  body .sw-transfers .tr-title,
  body .sw-transfers .tr-lead,
  body .sw-transfers .tr-hero .tr-actions,
  body .sw-transfers .tr-capability,
  body .sw-transfers .tr-more {
    grid-column: 1;
    grid-row: auto;
  }
  body .sw-transfers .tr-title {
    margin-bottom: 1.75rem;
  }
  body .sw-transfers .tr-moves .tr-h2 {
    margin-bottom: 1.5rem;
  }
  body .sw-transfers .tr-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body .sw-transfers .tr-group__head {
    margin-bottom: 1.5rem;
  }
  body .sw-transfers .tr-capability {
    margin-top: 2.5rem;
  }
  body .sw-transfers .tr-since__year {
    margin-bottom: 1.25rem;
  }
  body .sw-transfers .tr-plan__head {
    margin-bottom: 2.25rem;
  }
  body .sw-transfers .tr-ready {
    margin-top: 3rem;
    max-width: 30rem;
  }
}

/* ---------------------------------------------------------- journey line turns vertical: ≤1180
   (the horizontal line needs ~1180 px before stop names meet the leg labels) */
@media (max-width: 1180px) {
  body .sw-transfers .tr-journey__line {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-transfers .tr-journey__line::before {
    left: 0.4rem;
    right: auto;
    top: 0.4rem;
    bottom: 0.4rem;
    width: 1px;
    height: auto;
  }
  body .sw-transfers .tr-journey__line > li {
    padding: 0 0 0 2.1rem;
  }
  body .sw-transfers .tr-stop {
    padding-bottom: 0.2rem;
  }
  body .sw-transfers .tr-stop::before {
    top: 0.3rem;
  }
  body .sw-transfers .tr-leg {
    padding: 0.35rem 0 0.35rem 2.1rem;
  }
  body .sw-transfers .tr-leg::before {
    left: calc(0.4rem - 1px);
    right: auto;
    top: 0.25rem;
    bottom: 0.25rem;
    width: 3px;
    height: auto;
  }
  body .sw-transfers .tr-leg a {
    margin-left: 0;
  }
  body .sw-transfers .tr-journey__line > li:last-child::after {
    left: 0;
    right: auto;
    top: 1.1rem;
    bottom: 0;
    width: 0.8rem;
    height: auto;
  }
  body .sw-transfers .tr-journey__cap span {
    display: block;
    margin: 0 0 0.4rem;
  }
}

/* ---------------------------------------------------------- phone: ≤640 */
@media (max-width: 640px) {
  body .sw-transfers .tr-proof {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-transfers .tr-index a {
    grid-template-columns: minmax(0, 1fr) 1.25rem;
    row-gap: 0.35rem;
  }
  body .sw-transfers .tr-index__name {
    grid-column: 1;
    grid-row: 1;
  }
  body .sw-transfers .tr-index a::after {
    grid-column: 2;
    grid-row: 1;
  }
  body .sw-transfers .tr-index__note {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  body .sw-transfers .tr-capability > div {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.4rem;
  }
  body .sw-transfers .tr-run li {
    grid-template-columns: 2.5rem minmax(0, 1fr);
    row-gap: 0.4rem;
  }
  body .sw-transfers .tr-run__text {
    grid-column: 2;
  }
  body .sw-transfers .tr-actions,
  body .sw-transfers .tr-btn,
  body .sw-transfers .tr-btn .wp-block-button__link {
    width: 100%;
  }
  body .sw-transfers .tr-btn .wp-block-button__link {
    justify-content: center;
  }
  body .sw-transfers .tr-btn-quiet,
  body .sw-transfers .tr-btn-quiet .wp-block-button__link {
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .sw-transfers * {
    transition: none !important;
  }
}

/* ==========================================================================
   SPURWING — TRANSPORT PAGE TYPES (3.10.0) — representatives, pre-propagation
   --------------------------------------------------------------------------
   The /transfers/ hub (3.9.2, `luxury-v3-transport.css`) is frozen. The 13
   transport pages below it are three different page types, so each type gets
   its own page-type marker. Composition is never keyed on the shared
   generation wrappers (`.sw-transport-v210` 10 pages, `.sw-premium-v180`
   many), per the 3.5.3 / 3.5.4 rule.

     .sw-transfer-route    A. route-specific: route-led, practical, conversion
     .sw-transfer-service  B. service: service-led, flexible, contextual
     .sw-transfer-ops      C. operational / scale: capability-led, darker

   First pass (2026-09-29) carries each marker on exactly one URL:
     .sw-transfer-route    /johannesburg-to-kruger-transfer/ (155)
     .sw-transfer-service  /safari-transfers/ (154)
     .sw-transfer-ops      /group-transport/ (83)
   Every selector starts with `body` + one of the three markers; every
   composition class is `tp-` prefixed.
   ========================================================================== */

body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) {
  --tp-charcoal: #1F201B;
  --tp-olive-black: #2C2E22;
  --tp-paper: #F4F1E9;
  --tp-ivory-ground: #FAF8F2;
  --tp-stone: #E6E0D2;
  --tp-ink: #1F201B;
  --tp-ink-soft: #4B4A41;
  --tp-ink-faint: #6E6A5D;
  --tp-ivory: #F4F0E6;
  --tp-ivory-soft: rgba(244, 240, 230, 0.8);
  --tp-ivory-faint: rgba(244, 240, 230, 0.58);
  --tp-olive: #5C5F3E;
  --tp-gold: #8A7440;
  --tp-gold-light: #C8AE74;
  --tp-hair: rgba(31, 32, 27, 0.15);
  --tp-hair-strong: rgba(31, 32, 27, 0.55);
  --tp-hair-dark: rgba(244, 240, 230, 0.16);
  --tp-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --tp-sans: Karla, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --tp-max: 1240px;
  --tp-pad: clamp(1.25rem, 4vw, 3rem);
  --tp-space: clamp(4.25rem, 7.5vw, 7rem);
  --tp-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--tp-paper);
  color: var(--tp-ink);
  font-family: var(--tp-sans);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) > * {
  margin: 0;
  max-width: none;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-wrap {
  max-width: var(--tp-max);
  margin: 0 auto;
  padding: 0 var(--tp-pad);
  box-sizing: border-box;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-wrap > * {
  margin-top: 0;
  margin-bottom: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(ul, ol, dl, dd, figure) {
  margin: 0;
  padding: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(ul, ol) {
  list-style: none;
}

/* ---------------------------------------------------------- shared type */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-eyebrow {
  font-family: var(--tp-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--tp-gold);
  margin: 0 0 1.3rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-eyebrow a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-eyebrow a:hover,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-eyebrow a:focus-visible {
  border-bottom-color: currentColor;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-h2 {
  font-family: var(--tp-serif);
  font-weight: 400;
  font-size: clamp(2rem, 1.4rem + 2vw, 3.1rem);
  line-height: 1.07;
  letter-spacing: -0.01em;
  color: var(--tp-ink);
  margin: 0;
  max-width: 19ch;
  text-wrap: balance;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-body {
  font-family: var(--tp-sans);
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--tp-ink-soft);
  margin: 0;
  max-width: 36rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-label {
  font-family: var(--tp-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tp-gold);
  margin: 0 0 1rem;
}

/* ---------------------------------------------------------- buttons: square, one primary */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.9rem 1.4rem;
  margin: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 52px;
  padding: 0 1.8rem;
  border: 1px solid var(--tp-charcoal);
  border-radius: 0;
  background: var(--tp-charcoal);
  color: var(--tp-ivory);
  font-family: var(--tp-sans);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color 0.25s var(--tp-ease), color 0.25s var(--tp-ease), border-color 0.25s var(--tp-ease);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link::after {
  content: "\2192";
  font-size: 1rem;
  letter-spacing: 0;
  transition: transform 0.25s var(--tp-ease);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link:hover,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tp-charcoal);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link:hover::after {
  transform: translateX(3px);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn-quiet .wp-block-button__link {
  background: transparent;
  color: var(--tp-charcoal);
  border-color: transparent;
  border-bottom-color: var(--tp-hair-strong);
  padding: 0 0.15rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn-quiet .wp-block-button__link:hover,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn-quiet .wp-block-button__link:focus-visible {
  border-color: transparent;
  border-bottom-color: var(--tp-charcoal);
}
/* buttons on dark grounds */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-close, .tp-dark) .tp-btn .wp-block-button__link {
  background: var(--tp-ivory);
  border-color: var(--tp-ivory);
  color: var(--tp-charcoal);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-close, .tp-dark) .tp-btn .wp-block-button__link:hover,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-close, .tp-dark) .tp-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tp-ivory);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-close, .tp-dark) .tp-btn-quiet .wp-block-button__link {
  background: transparent;
  color: var(--tp-ivory);
  border-color: transparent;
  border-bottom-color: var(--tp-ivory-faint);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) a:focus-visible {
  outline: 2px solid var(--tp-gold);
  outline-offset: 3px;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-close, .tp-dark) a:focus-visible {
  outline-color: var(--tp-gold-light);
}

/* ---------------------------------------------------------- hero (ivory; ops overrides to charcoal) */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-hero {
  background: var(--tp-ivory-ground);
  padding: clamp(4rem, 8vw, 6.5rem) 0 clamp(3.25rem, 5.5vw, 4.5rem);
  border-bottom: 1px solid var(--tp-hair);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-hero__grid > * {
  min-width: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-hero__grid > .tp-eyebrow {
  grid-column: 1 / -1;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-title {
  grid-column: 1;
  grid-row: 2 / span 2;
  font-family: var(--tp-serif);
  font-weight: 400;
  font-size: clamp(2.6rem, 1.5rem + 3.2vw, 4.4rem);
  line-height: 1.04;
  letter-spacing: -0.016em;
  color: var(--tp-ink);
  margin: 0;
  max-width: 16ch;
  text-wrap: balance;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-lead {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  font-family: var(--tp-sans);
  font-size: 1.08rem;
  line-height: 1.72;
  color: var(--tp-ink-soft);
  margin: 0 0 1.9rem;
  max-width: 30rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-hero .tp-actions {
  grid-column: 2;
  grid-row: 3;
  align-self: start;
}

/* ---------------------------------------------------------- shared: split chapter (head | body) */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-chapter {
  padding: var(--tp-space) 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-paper { background: var(--tp-paper); }
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-stone { background: var(--tp-stone); }
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark {
  background: var(--tp-charcoal);
  color: var(--tp-ivory);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-eyebrow,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-label {
  color: var(--tp-gold-light);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-h2 {
  color: var(--tp-ivory);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-body {
  color: var(--tp-ivory-soft);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-split {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-split > * {
  min-width: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-split .tp-body + .tp-body {
  margin-top: 1.2rem;
}

/* questions / asks: three columns, top rule, question in serif */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-asks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 3vw, 2.5rem);
  margin-top: clamp(2.75rem, 5vw, 4rem);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-asks > div {
  padding-top: 1.25rem;
  border-top: 1px solid var(--tp-ink);
  min-width: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-asks dt {
  font-family: var(--tp-serif);
  font-size: clamp(1.4rem, 1.2rem + 0.5vw, 1.7rem);
  line-height: 1.15;
  color: var(--tp-ink);
  margin: 0 0 0.6rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-asks dd {
  font-family: var(--tp-sans);
  font-size: 0.98rem;
  line-height: 1.62;
  color: var(--tp-ink-soft);
}

/* related links: a quiet index (routes as "A → B") */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links {
  border-top: 1px solid var(--tp-ink);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links li {
  margin: 0;
  border-bottom: 1px solid var(--tp-hair);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 6fr) 1.25rem;
  column-gap: 1.75rem;
  align-items: baseline;
  padding: 1.05rem 0 1.15rem;
  min-height: 44px;
  box-sizing: border-box;
  color: var(--tp-ink);
  text-decoration: none;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a::after {
  content: "\2192";
  color: var(--tp-gold);
  justify-self: end;
  transition: transform 0.25s var(--tp-ease);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a:hover::after,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a:focus-visible::after {
  transform: translateX(4px);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links__name {
  font-family: var(--tp-serif);
  font-size: clamp(1.3rem, 1.15rem + 0.35vw, 1.48rem);
  line-height: 1.15;
  color: var(--tp-ink);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a:hover .tp-links__name,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a:focus-visible .tp-links__name {
  color: var(--tp-olive);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links__note {
  font-family: var(--tp-sans);
  font-size: 0.96rem;
  line-height: 1.58;
  color: var(--tp-ink-soft);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-to {
  font-family: var(--tp-sans);
  font-size: 0.9em;
  color: var(--tp-gold);
  padding: 0 0.2em;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links {
  border-top-color: var(--tp-ivory-faint);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links li {
  border-bottom-color: var(--tp-hair-dark);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links a,
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links__name {
  color: var(--tp-ivory);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links__note {
  color: var(--tp-ivory-soft);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links a::after {
  color: var(--tp-gold-light);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-dark .tp-links a:hover .tp-links__name {
  color: var(--tp-gold-light);
}

/* ---------------------------------------------------------- close (olive-black) */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close {
  background: var(--tp-olive-black);
  color: var(--tp-ivory);
  padding: clamp(4.25rem, 7.5vw, 6.5rem) 0;
  border-bottom: 1px solid var(--tp-hair-dark);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  column-gap: clamp(2.5rem, 7vw, 7rem);
  align-items: end;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close__grid > * {
  min-width: 0;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close .tp-eyebrow {
  color: var(--tp-gold-light);
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close__title {
  font-family: var(--tp-serif);
  font-weight: 400;
  font-size: clamp(2.2rem, 1.5rem + 2.3vw, 3.5rem);
  line-height: 1.06;
  letter-spacing: -0.012em;
  color: var(--tp-ivory);
  margin: 0;
  max-width: 19ch;
  text-wrap: balance;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close__text {
  font-family: var(--tp-sans);
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--tp-ivory-soft);
  margin: 1.5rem 0 2.1rem;
  max-width: 34rem;
}
/* a close with no paragraph (152, 153): keep the gap the paragraph would give */
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-close__title + .tp-actions {
  margin-top: 2.1rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-ready {
  border-top: 1px solid var(--tp-ivory-faint);
  padding-top: 1.1rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-ready .tp-label {
  color: var(--tp-gold-light);
  margin-bottom: 0.6rem;
}
body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-ready li {
  margin: 0;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--tp-hair-dark);
  font-family: var(--tp-sans);
  font-size: 0.98rem;
  line-height: 1.5;
  color: var(--tp-ivory-soft);
}

/* ==========================================================================
   A. ROUTE — the route itself is the hero device
   ========================================================================== */
body .sw-transfer-route .tp-route {
  display: grid;
  grid-template-columns: auto minmax(4rem, 1fr) auto;
  align-items: end;
  column-gap: clamp(1.25rem, 3vw, 2.5rem);
  margin: 0 0 clamp(2.5rem, 4.5vw, 3.75rem);
}
body .sw-transfer-route .tp-route__end {
  min-width: 0;
}
body .sw-transfer-route .tp-route__label {
  display: block;
  font-family: var(--tp-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tp-ink-faint);
  margin-bottom: 0.45rem;
}
body .sw-transfer-route .tp-route__place {
  display: block;
  font-family: var(--tp-serif);
  font-weight: 400;
  font-size: clamp(2.3rem, 1.3rem + 3.4vw, 4.6rem);
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--tp-ink);
}
body .sw-transfer-route .tp-route__leg {
  position: relative;
  height: 3px;
  margin-bottom: clamp(0.9rem, 1.6vw, 1.5rem);
  background: var(--tp-gold);
}
body .sw-transfer-route .tp-route__leg::before,
body .sw-transfer-route .tp-route__leg::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 0.8rem;
  height: 0.8rem;
  margin-top: -0.4rem;
  border-radius: 50%;
  border: 1px solid var(--tp-charcoal);
  background: var(--tp-ivory-ground);
  box-sizing: border-box;
}
body .sw-transfer-route .tp-route__leg::before { left: -0.4rem; }
body .sw-transfer-route .tp-route__leg::after { right: -0.4rem; }
body .sw-transfer-route .tp-hero .tp-title {
  font-size: clamp(2rem, 1.35rem + 2vw, 3rem);
  line-height: 1.1;
  max-width: 20ch;
}

/* the route in practice: a four-part spec under the hero */
body .sw-transfer-route .tp-spec {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1.4fr) minmax(0, 1fr);
  margin-top: clamp(3rem, 5vw, 4.5rem);
  border-top: 1px solid var(--tp-hair-strong);
}
body .sw-transfer-route .tp-spec > div {
  padding: 1.2rem 1.25rem 0 0;
  min-width: 0;
}
body .sw-transfer-route .tp-spec > div + div {
  padding-left: 1.25rem;
  border-left: 1px solid var(--tp-hair);
}
body .sw-transfer-route .tp-spec dt {
  font-family: var(--tp-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tp-gold);
  margin: 0 0 0.45rem;
}
body .sw-transfer-route .tp-spec dd {
  font-family: var(--tp-sans);
  font-size: 0.98rem;
  line-height: 1.5;
  color: var(--tp-ink);
}

/* ==========================================================================
   B. SERVICE — when it matters, where it connects
   ========================================================================== */
body .sw-transfer-service .tp-when {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 3vw, 2.5rem);
}
body .sw-transfer-service .tp-when__label {
  margin: clamp(3rem, 5vw, 4.5rem) 0 1.1rem;
}
body .sw-transfer-service .tp-when > div {
  padding-top: 1.1rem;
  border-top: 1px solid var(--tp-hair-strong);
  min-width: 0;
}
body .sw-transfer-service .tp-when dt {
  font-family: var(--tp-serif);
  font-size: clamp(1.35rem, 1.2rem + 0.4vw, 1.6rem);
  line-height: 1.15;
  color: var(--tp-ink);
  margin: 0 0 0.5rem;
}
body .sw-transfer-service .tp-when dd {
  font-family: var(--tp-sans);
  font-size: 0.96rem;
  line-height: 1.58;
  color: var(--tp-ink-soft);
}
body .sw-transfer-service .tp-connect .tp-links {
  grid-column: 2;
}
body :is(.sw-transfer-route, .sw-transfer-service) .tp-together {
  margin-top: clamp(2.5rem, 4vw, 3.25rem);
}

/* ==========================================================================
   C. OPERATIONS / SCALE — capability-led, darker, exact
   ========================================================================== */
body .sw-transfer-ops .tp-hero {
  background: var(--tp-charcoal);
  color: var(--tp-ivory);
  border-bottom: 0;
}
body .sw-transfer-ops .tp-hero .tp-eyebrow {
  color: var(--tp-gold-light);
}
body .sw-transfer-ops .tp-hero .tp-title {
  color: var(--tp-ivory);
}
body .sw-transfer-ops .tp-hero .tp-lead {
  color: var(--tp-ivory-soft);
}
body .sw-transfer-ops .tp-hero .tp-btn .wp-block-button__link {
  background: var(--tp-ivory);
  border-color: var(--tp-ivory);
  color: var(--tp-charcoal);
}
body .sw-transfer-ops .tp-hero .tp-btn .wp-block-button__link:hover,
body .sw-transfer-ops .tp-hero .tp-btn .wp-block-button__link:focus-visible {
  background: transparent;
  color: var(--tp-ivory);
}
body .sw-transfer-ops .tp-hero .tp-btn-quiet .wp-block-button__link {
  background: transparent;
  color: var(--tp-ivory);
  border-color: transparent;
  border-bottom-color: var(--tp-ivory-faint);
}
body .sw-transfer-ops .tp-hero a:focus-visible {
  outline-color: var(--tp-gold-light);
}
/* the moving parts: the lead's own list, set as an exact inventory */
body .sw-transfer-ops .tp-parts {
  margin-top: clamp(3rem, 5vw, 4.5rem);
  padding-top: 1.2rem;
  border-top: 1px solid var(--tp-hair-dark);
}
body .sw-transfer-ops .tp-parts .tp-label {
  color: var(--tp-gold-light);
}
body .sw-transfer-ops .tp-parts ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0;
}
body .sw-transfer-ops .tp-parts li {
  margin: 0;
  font-family: var(--tp-serif);
  font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.7rem);
  line-height: 1.3;
  color: var(--tp-ivory);
}
body .sw-transfer-ops .tp-parts li:not(:last-child)::after {
  content: "·";
  padding: 0 0.7em;
  color: var(--tp-gold-light);
}
/* capability ledger */
body .sw-transfer-ops .tp-ledger {
  border-top: 1px solid var(--tp-ink);
}
body .sw-transfer-ops .tp-ledger > div {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: 1.75rem;
  padding: 1.35rem 0 1.45rem;
  border-bottom: 1px solid var(--tp-hair);
}
body .sw-transfer-ops .tp-ledger dt {
  font-family: var(--tp-serif);
  font-size: clamp(1.4rem, 1.2rem + 0.5vw, 1.7rem);
  line-height: 1.15;
  color: var(--tp-ink);
}
body .sw-transfer-ops .tp-ledger dd {
  font-family: var(--tp-sans);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--tp-ink-soft);
}
/* since 1996 */
body .sw-transfer-ops .tp-since {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(2.5rem, 6vw, 6rem);
  align-items: end;
}
body .sw-transfer-ops .tp-since__year {
  font-family: var(--tp-serif);
  font-size: clamp(3.2rem, 2rem + 3.6vw, 5.4rem);
  line-height: 0.95;
  color: var(--tp-ivory);
  margin: 0;
  font-variant-numeric: lining-nums;
}
body .sw-transfer-ops .tp-since__year span {
  display: block;
  margin-bottom: 0.75rem;
  font-family: var(--tp-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--tp-gold-light);
  line-height: 1.3;
}
body .sw-transfer-ops .tp-since .tp-h2 {
  color: var(--tp-ivory);
  margin-bottom: 1.1rem;
}

/* ---------------------------------------------------------- tablet: ≤1024 */
@media (max-width: 1024px) {
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-hero__grid, .tp-split, .tp-close__grid) {
    grid-template-columns: minmax(0, 1fr);
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-hero__grid > *, .tp-title, .tp-lead, .tp-hero .tp-actions) {
    grid-column: 1;
    grid-row: auto;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-title {
    margin-bottom: 1.6rem;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-split > :first-child {
    margin-bottom: 2rem;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-ready {
    margin-top: 3rem;
    max-width: 30rem;
  }
  body .sw-transfer-route .tp-spec {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body .sw-transfer-route .tp-spec > div,
  body .sw-transfer-route .tp-spec > div + div {
    padding: 1.1rem 1rem 1rem 0;
    border-left: 0;
    border-bottom: 1px solid var(--tp-hair);
  }
  body .sw-transfer-service .tp-when {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 1.75rem;
  }
  body .sw-transfer-service .tp-connect .tp-links {
    grid-column: 1;
  }
  body .sw-transfer-ops .tp-since {
    grid-template-columns: minmax(0, 1fr);
  }
  body .sw-transfer-ops .tp-since__year {
    margin-bottom: 1.5rem;
  }
}

/* ---------------------------------------------------------- phone: ≤640 */
@media (max-width: 640px) {
  body .sw-transfer-route .tp-route {
    grid-template-columns: 0.8rem minmax(0, 1fr);
    column-gap: 1.1rem;
    row-gap: 0;
    align-items: stretch;
  }
  body .sw-transfer-route .tp-route__end {
    grid-column: 2;
  }
  body .sw-transfer-route .tp-route__leg {
    grid-column: 1;
    grid-row: 1 / span 3;
    justify-self: center;
    width: 3px;
    height: auto;
    margin: 1.9rem 0 0.9rem;
  }
  body .sw-transfer-route .tp-route__leg::before,
  body .sw-transfer-route .tp-route__leg::after {
    left: 50%;
    right: auto;
    margin-left: -0.4rem;
    margin-top: 0;
  }
  body .sw-transfer-route .tp-route__leg::before { top: -0.4rem; }
  body .sw-transfer-route .tp-route__leg::after { top: auto; bottom: -0.4rem; }
  body .sw-transfer-route .tp-route__end + .tp-route__leg + .tp-route__end {
    margin-top: 1.4rem;
  }
  body .sw-transfer-route .tp-spec,
  body .sw-transfer-service .tp-when,
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-asks {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1.5rem;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a {
    grid-template-columns: minmax(0, 1fr) 1.25rem;
    row-gap: 0.35rem;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links__name {
    grid-column: 1;
    grid-row: 1;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links a::after {
    grid-column: 2;
    grid-row: 1;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-links__note {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  body .sw-transfer-ops .tp-ledger > div {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.4rem;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-actions, .tp-btn, .tp-btn .wp-block-button__link) {
    width: 100%;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) .tp-btn .wp-block-button__link {
    justify-content: center;
  }
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) :is(.tp-btn-quiet, .tp-btn-quiet .wp-block-button__link) {
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body :is(.sw-transfer-route, .sw-transfer-service, .sw-transfer-ops) * {
    transition: none !important;
  }
}