/* ============================================================================
   BRUDA CLUB V6 — "VIBE" LAYER
   Living surfaces + lit headings, borrowed from the LaDalat design system
   (ds.css): the same paper/orange/gold palette, the same easing, the same
   idea that a surface should react instead of sitting flat.

   Loaded last, so it only adds motion and glow on top of style.css —
   no layout is redefined here.
   ============================================================================ */

:root{
  --glow-gold:235,180,76;      /* --gold  #EBB44C */
  --glow-orange:217,130,43;    /* --orange #D9822B */
  --ease-vibe:cubic-bezier(.2,.7,.2,1);
  --dur-1:.14s; --dur-2:.24s; --dur-3:.45s;

  /* Dark sections are a deep jungle green. Warm enough to carry the orange
     accent without fighting it, and far lighter than the old near-black
     #17301F, so cards keep a visible edge against it. */
  --bc-green-deep:#12291E;   /* deep jungle */
  --bc-green:#1B4332;        /* jungle green */
  --bc-green-lift:#2D6A4F;   /* lit canopy */
  --bc-green-glow:45,106,79;
}

/* ============================================================================
   1 — LIT HEADINGS  ("XP bar" energy, kept dezent)
   A heading lights up once when it scrolls into view: a short sheen sweeps
   across the letters, then a faint halo stays behind. On cream backgrounds
   the halo is dropped (it would only muddy dark text) — there the sweep and
   the charge-up underline carry the effect.
   ============================================================================ */
.bc-lit{position:relative;display:inline-block;max-width:100%}

/* The "alive text" treatment from the manifesto, used for every heading: a
   warm gradient sits in the letters and drifts slowly back and forth. On
   cream the gradient stays inside the ink family so the text never loses
   contrast; on dark surfaces it runs cream to gold. */
.bc-lit::before{
  content:attr(data-text);
  position:absolute;inset:0;
  pointer-events:none;
  background-image:linear-gradient(100deg,
      var(--ink) 8%,
      var(--ink-2) 32%,
      var(--orange) 50%,
      var(--ink-2) 68%,
      var(--ink) 92%);
  background-size:220% 100%;
  background-position:0% 0;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  opacity:0;
  transition:opacity .5s var(--ease-vibe);
}
.bc-lit.is-lit::before{opacity:1;animation:bcAlive 9s ease-in-out infinite}

@keyframes bcAlive{
  0%,100%{background-position:0% 0}
  50%    {background-position:100% 0}
}

/* Dark surfaces: cream to gold instead of ink to orange. */
.hero .bc-lit::before,
.page-hero .bc-lit::before,
.manifesto-section .bc-lit::before,
.closing-line .bc-lit::before,
.final-cta .bc-lit::before,
.touring-section .bc-lit::before{
  background-image:linear-gradient(100deg,
      #F4F0E6 8%,
      var(--gold) 38%,
      var(--orange) 52%,
      var(--gold) 66%,
      #F4F0E6 92%);
  background-size:220% 100%;
  /* The `background` shorthand would reset background-clip back to border-box
     and paint a solid block over the heading, so set the image only. */
  -webkit-background-clip:text;background-clip:text;
}

/* the halo — dark surfaces only */
.hero .bc-lit.is-lit,
.page-hero .bc-lit.is-lit,
.manifesto-section .bc-lit.is-lit,
.final-cta .bc-lit.is-lit,
.touring-section .bc-lit.is-lit{
  animation:bcHalo 2.2s var(--ease-vibe) both;
}
@keyframes bcHalo{
  0%  {text-shadow:0 0 0 rgba(var(--glow-gold),0)}
  30% {text-shadow:0 0 28px rgba(var(--glow-gold),.50),0 0 8px rgba(var(--glow-orange),.32)}
  100%{text-shadow:0 0 16px rgba(var(--glow-gold),.18)}
}

/* charge-up underline — the literal XP-bar nod, 2px and quiet */
.section-header h2,
.showcase-header h2,
.path-header h2,
.touring-header h2{position:relative}
.section-header h2::after,
.showcase-header h2::after,
.path-header h2::after,
.touring-header h2::after{
  content:"";position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);
  height:2px;width:0;border-radius:2px;
  background:linear-gradient(90deg,rgba(var(--glow-orange),.9),rgba(var(--glow-gold),.9));
  box-shadow:0 0 12px rgba(var(--glow-gold),.55);
  transition:width 1.1s cubic-bezier(.16,.8,.2,1) .15s;
}
.section-header.is-lit h2::after,
.showcase-header.is-lit h2::after,
.path-header.is-lit h2::after,
.touring-header.is-lit h2::after{width:84px}

/* ============================================================================
   2 — REVEAL ON SCROLL
   ============================================================================ */
[data-reveal]{opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--ease-vibe),transform .7s var(--ease-vibe)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal][data-reveal-delay="1"]{transition-delay:.09s}
[data-reveal][data-reveal-delay="2"]{transition-delay:.18s}
[data-reveal][data-reveal-delay="3"]{transition-delay:.27s}

/* ============================================================================
   3 — LIVING SURFACES (ds.css §"Living surfaces")
   ============================================================================ */
.path-card,.path-featured,.product-card,.touring-card,.focus-card,.cf-card{
  transition:transform var(--dur-2) var(--ease-vibe),
             box-shadow var(--dur-2) var(--ease-vibe),
             border-color var(--dur-2) var(--ease-vibe);
}
@media (hover:hover){
  .path-card:hover,.product-card:hover,.touring-card:hover,.focus-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 40px -14px rgba(23,48,31,.30);
  }
  .path-featured:hover{transform:translateY(-3px);
    box-shadow:0 22px 52px -16px rgba(var(--glow-orange),.38)}
  .path-card:hover .path-card__img,
  .product-card:hover .product-card__img,
  .touring-card:hover img,
  .focus-card:hover img{transform:scale(1.05)}
}
.path-card__img,.product-card__img,.touring-card img,.focus-card img{
  transition:transform .8s var(--ease-vibe);
}

/* the hero product breathes — same heartbeat as a live event in the app */
.path-featured,.touring-card--hero{animation:bcHeartbeat 5.2s ease-in-out infinite}
@keyframes bcHeartbeat{
  0%,100%{box-shadow:0 12px 34px rgba(var(--glow-orange),.13)}
  50%    {box-shadow:0 18px 44px rgba(var(--glow-orange),.26)}
}

/* chips and service tags pick up a warm edge on hover */
.fact-chip,.base-service,.touring-fact{
  transition:background var(--dur-1) var(--ease-vibe),
             border-color var(--dur-1) var(--ease-vibe),
             color var(--dur-1) var(--ease-vibe);
}
@media (hover:hover){
  .fact-chip:hover,.base-service:hover,.touring-fact:hover{
    border-color:rgba(var(--glow-orange),.55);
    color:var(--orange-dark);
  }
}

/* primary buttons get a slow travelling shine */
.btn:not(.btn--outline):not(.btn--ghost){position:relative;overflow:hidden}
.btn:not(.btn--outline):not(.btn--ghost)::after{
  content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-18deg);pointer-events:none;
  animation:bcBtnShine 5.5s ease-in-out infinite;
}
@keyframes bcBtnShine{
  0%,72%{left:-60%}
  100%  {left:130%}
}

/* ============================================================================
   4 — TOURING SECTION (front page, hero product)
   ============================================================================ */
.touring-section{position:relative;padding:110px 0 100px;overflow:hidden;
  background:linear-gradient(165deg,var(--bc-green) 0%,var(--bc-green-deep) 55%,var(--bc-green) 100%);
  color:#F4F0E6}
.touring-section::before{
  content:"";position:absolute;inset:-20% -10% auto -10%;height:80%;
  background:radial-gradient(60% 60% at 28% 18%,rgba(var(--bc-green-glow),.55),transparent 70%),
             radial-gradient(55% 55% at 76% 8%,rgba(var(--glow-orange),.22),transparent 70%),
             radial-gradient(40% 40% at 55% 45%,rgba(var(--glow-gold),.10),transparent 72%);
  pointer-events:none;animation:bcAurora 18s ease-in-out infinite alternate}
@keyframes bcAurora{
  0%  {transform:translate3d(0,0,0) scale(1)}
  100%{transform:translate3d(3%,4%,0) scale(1.12)}
}
.touring-section > .container{position:relative;z-index:1}

.touring-header{text-align:center;max-width:760px;margin:0 auto 56px}
.touring-header .eyebrow{display:inline-block;font-size:.72rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.touring-header h2{font-size:clamp(2rem,4.6vw,3.2rem);color:#fff;margin-bottom:26px}
.touring-header p{color:rgba(244,240,230,.78);font-size:1.05rem}

/* No max-width: the film spans exactly the width of the two cards below it. */
.touring-video{position:relative;margin:0 0 28px;
  border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid rgba(var(--glow-gold),.22);
  box-shadow:0 30px 70px -24px rgba(0,0,0,.65)}
.touring-video__frame{position:relative;padding-top:56.25%}
.touring-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@keyframes bcPulse{0%,100%{opacity:1}50%{opacity:.3}}

/* Click-to-play cover. Browsers only allow autoplay when a video is muted, so
   the film waits for a real click — then it runs with sound and the full
   Vimeo controls. */
.touring-video__cover{position:absolute;inset:0;z-index:2;display:block;
  width:100%;padding:0;border:0;cursor:pointer;background:none;
  transition:opacity .35s var(--ease-vibe)}
.touring-video__cover img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;filter:brightness(.55)}
.touring-video__play{position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);z-index:2;
  display:flex;align-items:center;justify-content:center;
  width:86px;height:86px;border-radius:50%;color:#fff;
  background:rgba(217,130,43,.92);
  box-shadow:0 0 0 0 rgba(var(--glow-orange),.55);
  animation:bcPlayPulse 2.8s ease-out infinite;
  transition:transform var(--dur-2) var(--ease-vibe)}
.touring-video__play svg{margin-left:5px}
.touring-video__cover:hover .touring-video__play{transform:translate(-50%,-50%) scale(1.07)}
@keyframes bcPlayPulse{
  0%  {box-shadow:0 0 0 0 rgba(var(--glow-orange),.5)}
  70% {box-shadow:0 0 0 26px rgba(var(--glow-orange),0)}
  100%{box-shadow:0 0 0 0 rgba(var(--glow-orange),0)}
}
.touring-video__label{position:absolute;left:0;right:0;bottom:28px;z-index:2;
  display:flex;flex-direction:column;gap:3px;align-items:center;
  font-size:.82rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.touring-video__label small{font-size:.68rem;font-weight:600;letter-spacing:.1em;
  color:var(--gold);text-transform:none}
.touring-video.is-playing .touring-video__cover{opacity:0;pointer-events:none}

.touring-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:start}
.touring-grid--two{grid-template-columns:1fr 1fr;align-items:stretch}
/* Paper cards, not translucent green ones: green on green left the cards
   floating without an edge. Same surface as the cream sections uses. */
.touring-card{position:relative;display:flex;flex-direction:column;overflow:hidden;
  border-radius:var(--radius-lg);background:var(--card-bg);
  border:1px solid rgba(var(--glow-gold),.28);color:var(--ink);text-decoration:none;
  box-shadow:0 22px 50px -26px rgba(0,0,0,.7)}
.touring-card--hero{border-color:rgba(var(--glow-orange),.45)}
/* Both adventure cards are built identically: same crop, same headline size,
   bodies stretched so the buttons sit on one baseline. */
.touring-card__media{position:relative;aspect-ratio:3/2;overflow:hidden}
.touring-card__media img{width:100%;height:100%;object-fit:cover}
/* flex:0 0 auto — the photo above absorbs the leftover height of the row,
   the copy block stays exactly as tall as its content */
.touring-card__body{position:relative;padding:26px 26px 30px;display:flex;
  flex-direction:column;gap:12px;flex:1}
.touring-card__tag{align-self:flex-start;font-size:.66rem;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;padding:5px 11px;border-radius:999px;
  background:rgba(var(--glow-orange),.18);color:var(--gold)}
.touring-card h3{font-size:1.75rem;color:var(--ink)}
.touring-card p{color:var(--ink-2);font-size:.97rem;margin:0}
.touring-facts{margin-top:4px}
.touring-card .btn,.touring-card .focus-link{align-self:flex-start;margin-top:auto}

.touring-side{display:grid;gap:28px;grid-template-rows:auto auto;align-content:start}

@media(max-width:900px){
  .touring-grid{grid-template-columns:1fr}
  .touring-side{grid-template-rows:auto}
  .touring-section{padding:80px 0 70px}
}

/* ============================================================================
   5 — FOCUS ROW (House · Bike Hub · Rental)
   ============================================================================ */
.focus-section{padding:100px 0}
.focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch}
@media(max-width:980px){.focus-grid{grid-template-columns:1fr}}
.focus-card{position:relative;display:flex;flex-direction:column;overflow:hidden;
  border-radius:var(--radius-lg);background:var(--card-bg);
  border:1px solid var(--border);text-decoration:none;color:inherit;
  box-shadow:var(--shadow-sm)}
/* Identical cards: every photo the same 4:3 crop, every body stretched to the
   tallest one so the buttons line up on a single baseline across the row. */
.focus-card__media{aspect-ratio:4/3;flex:0 0 auto;overflow:hidden}
.focus-card__media img{width:100%;height:100%;object-fit:cover}
.focus-card__body{padding:24px 24px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.focus-card__tag{align-self:flex-start;font-size:.66rem;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--orange-dark)}
.focus-card h3{font-size:1.45rem}
.focus-card p{color:var(--ink-2);font-size:.96rem;margin:0}
.focus-card .btn,.focus-card .focus-link{margin-top:auto;align-self:flex-start}
.focus-link{font-weight:700;font-size:.85rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--orange-dark);
  border-bottom:2px solid rgba(var(--glow-orange),.35);padding-bottom:3px;
  transition:border-color var(--dur-1) var(--ease-vibe)}
.focus-link:hover{border-color:var(--orange)}
/* All three cards of the row carry the same warm edge — no lead card. */
.focus-card,.focus-card--wide,.focus-card--lead{
  border-color:rgba(var(--glow-orange),.38);
  box-shadow:0 14px 34px -18px rgba(var(--glow-orange),.55)}

/* ============================================================================
   5b — RENTAL BANNER + BIKE CAROUSEL (inside the dark adventure section)
   ============================================================================ */
/* A section heading, not a tile: no card, no border, just type on the green. */
.rental-banner{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:14px;margin:76px 0 30px;padding:0;background:none;border:0;box-shadow:none}
.rental-banner__tag{display:block;font-size:.7rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold)!important;margin-bottom:8px}
.rental-banner h3{font-family:var(--font-display);
  font-size:clamp(2rem,4.4vw,3rem);color:#fff;margin-bottom:6px}
.rental-banner p{color:rgba(244,240,230,.82);font-size:1.08rem;margin:0}
.rental-banner .btn{margin-top:8px}

/* One bike at a time, no captions: the photo is the whole message. Advances
   on its own every few seconds and can be swiped or clicked through. */
/* Deliberately narrower than the content column: a bike photo does not need
   the full width of the page to read. */
.bike-carousel{position:relative;max-width:640px;margin:0 auto;
  border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid rgba(var(--glow-gold),.24);background:var(--card-bg);
  box-shadow:0 22px 50px -26px rgba(0,0,0,.7)}
.bike-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none}
.bike-rail::-webkit-scrollbar{display:none}
.bike-card{flex:0 0 100%;scroll-snap-align:center;overflow:hidden;background:var(--card-bg)}
.bike-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.bike-rail__btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:46px;height:46px;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#fff;background:rgba(18,41,30,.72);border:1px solid rgba(255,255,255,.28);
  transition:background var(--dur-1) var(--ease-vibe),transform var(--dur-1) var(--ease-vibe)}
.bike-rail__btn:hover{background:var(--orange);transform:translateY(-50%) scale(1.06)}
.bike-rail__btn--prev{left:16px}
.bike-rail__btn--next{right:16px}
/* Reviews use the same rail, one card per view, moving on its own. The gap
   and the inset keep the neighbouring cards from touching the active one. */
/* Side padding gives the arrows their own lane instead of sitting on the
   card and covering the quote. */
.review-carousel{position:relative;padding:0 70px 46px}
.review-carousel .bike-rail__btn--prev{left:4px}
.review-carousel .bike-rail__btn--next{right:4px}
@media(max-width:700px){.review-carousel{padding:0 0 42px}}
.review-rail{display:flex;gap:28px;padding:6px 0 10px;
  overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none}
.review-rail::-webkit-scrollbar{display:none}
.review-rail .review-card{flex:0 0 100%;scroll-snap-align:center;
  display:flex;flex-direction:column;padding:34px 36px}
.review-rail .review-text{flex:1}
/* A reviewer's photo opens their Instagram. */
.review-avatar-link{display:inline-flex;border-radius:50%;flex:0 0 auto;
  transition:transform var(--dur-1) var(--ease-vibe),box-shadow var(--dur-1) var(--ease-vibe)}
.review-avatar-link:hover{transform:scale(1.06);
  box-shadow:0 0 0 3px rgba(var(--glow-orange),.35)}
.review-carousel .bike-rail__btn{top:calc(50% - 23px)}
.review-carousel .bike-dots{bottom:8px}
@media(max-width:700px){
  .review-rail .review-card{width:calc(100% - 24px)}
  .review-carousel .bike-rail__btn{display:none}
}

.bike-dots{position:absolute;left:0;right:0;bottom:14px;z-index:2;
  display:flex;justify-content:center;gap:8px}
/* Dark dots: the carousel is a light card, white dots vanished on it. */
.bike-dots button{width:8px;height:8px;padding:0;border-radius:50%;cursor:pointer;
  border:0;background:rgba(23,48,31,.28);transition:all var(--dur-1) var(--ease-vibe)}
.bike-dots button[aria-current="true"]{background:var(--orange);width:22px;border-radius:999px}
.rental-note{margin-top:20px;text-align:center;font-size:.85rem;
  color:rgba(244,240,230,.62)}

/* ============================================================================
   6 — READABILITY REPAIRS
   Leftovers from the old dark-green theme still force `background:#1e3a26
   !important` onto cards that now sit on cream paper and carry dark ink —
   dark-on-dark, which is where the wizard and several sections became hard
   to read. These put the surfaces back on the paper palette; contrast is
   restored by pairing every surface with an ink colour explicitly.
   ============================================================================ */
.entry-card,.entry-card:hover,
.pillar-card,.pillar-card:hover,
.review-card,.team-card,.contact-form-card,.gallery-item,
.service-card,.act-card,.faq-item,.phase-card,
#booking-tool{
  background:var(--card-bg)!important;
  border:1px solid var(--border);
  color:var(--ink)!important;
}
.review-card p,.team-card p,.faq-item p,.act-card p,
.service-card p,.phase-card p,.pillar-card p{color:var(--ink-2)!important}
.review-card h3,.team-card h3,.faq-item h3,.act-card h3,
.service-card h3,.phase-card h3,.pillar-card h3{color:var(--ink)!important}

.accom-card{background:var(--card-bg)!important}
.accom-card,.accom-card h3,.accom-card ul,.accom-card li{color:var(--ink)!important}
.accom-card p{color:var(--ink-2)!important;opacity:1}

/* ---- booking wizard ---- */
.bw-panel{background:var(--card-bg)!important;color:var(--ink)}
.bw-inline,.bw-modal__panel{color:var(--ink)}

/* Entry cards were dark green with dark text — the single worst spot. */
.bw-entry-card{
  background:#FBF6EA!important;
  border:1px solid var(--border)!important;
  color:var(--ink)!important;
  transition:background var(--dur-1) var(--ease-vibe),
             border-color var(--dur-1) var(--ease-vibe),
             transform var(--dur-1) var(--ease-vibe);
}
.bw-entry-card:hover{background:#fff!important;
  border-color:rgba(var(--glow-orange),.55)!important;transform:translateY(-2px)}
/* Line-art icon so each option is recognisable before it is read. */
.bw-entry-card{display:flex;align-items:center;gap:16px}
.bw-entry-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:12px;color:var(--orange-dark);
  background:rgba(var(--glow-orange),.12)}
.bw-entry-icon svg{width:24px;height:24px}
.bw-entry-card-body{flex:1;min-width:0;text-align:left}
.bw-entry-card:hover .bw-entry-icon{background:rgba(var(--glow-orange),.2)}
.bw-entry-title{color:var(--ink)!important;font-weight:700}
.bw-entry-title small{opacity:1!important;color:var(--ink-muted)}
.bw-entry-sub{color:var(--ink-2)!important}
.bw-entry-price,.bw-entry-card .bw-entry-price{color:var(--orange-dark)!important}
.bw-entry-price small{color:var(--ink-muted)!important;opacity:1}

/* Fewer boxes in the wizard. The chosen product and the running price were
   both framed cards stacked on top of the progress bar, three tiles before
   the first question. They are plain lines now. */
.bw-choice-banner.is-visible{background:none!important;border:0!important;
  padding:4px 28px 0!important;margin:0 0 4px!important;border-radius:0!important}
.bw-choice-banner__label{display:none}
.bw-choice-banner__name{font-family:var(--font-body)!important;font-size:.95rem!important;
  font-weight:700;color:var(--ink)}
.bw-choice-banner button{font-size:.72rem!important;letter-spacing:.08em}

.bw-price-preview{background:none!important;border:0!important;padding:18px 0 0!important;
  border-top:1px solid var(--border)!important;border-radius:0!important;margin-top:22px!important;
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.bw-price-preview__label{margin:0!important;font-size:.7rem!important;
  letter-spacing:.12em;color:var(--ink-muted)!important;order:1;width:100%}
.bw-price-preview__value{order:2;font-size:1.75rem!important;color:var(--ink)!important;
  line-height:1.1}
.bw-price-preview__note{order:3;margin:0!important;font-size:.82rem!important;
  text-transform:none!important;letter-spacing:0!important;color:var(--ink-muted)!important;
  flex:1 1 100%}
.bw-price-preview .price-value,.bw-price-preview__value .price-value{
  background:none!important;color:inherit!important;padding:0!important}

/* Field labels were white at 10px, a leftover from the dark wizard: on the
   cream panel they were invisible and every field looked unlabelled. */
.bw-panel .bw-field label,
.bw-modal__panel .bw-field label,
.bw-panel .bw-consent span,
.bw-modal__panel .bw-consent span{
  color:var(--ink)!important;font-size:.86rem!important;font-weight:600;
  letter-spacing:.02em;text-transform:none}
.bw-panel .bw-consent span,.bw-modal__panel .bw-consent span{font-weight:500;color:var(--ink-2)!important}
.bw-panel .bw-hint,.bw-modal__panel .bw-hint{color:var(--ink-muted)!important;font-size:.82rem}
/* .bw-grid sets display:grid, which beats the browser default for [hidden]:
   without this the hourly and daily rows would both stay on screen. */
.bw-grid[hidden],[data-rental-day][hidden],[data-rental-hour][hidden]{display:none!important}
.bw-panel input,.bw-panel select,.bw-panel textarea,
.bw-modal__panel input,.bw-modal__panel select,.bw-modal__panel textarea{
  color:var(--ink)!important;background:#FBF6EA!important;
  border:1px solid var(--border)!important}
.bw-panel input::placeholder,.bw-panel textarea::placeholder{color:var(--ink-muted)!important}
.bw-stepper__val{color:var(--ink)!important}

/* Body copy inside the wizard: readable sizes, real contrast. */
.bw-headline{color:var(--ink)}
.bw-subline{color:var(--ink-2);font-size:16px;line-height:1.6}
.bw-eyebrow{color:var(--orange-dark)}
.bw-opt{background:#FBF6EA;border:1px solid var(--border);color:var(--ink)}
.bw-opt__title{color:var(--ink);font-size:15px}
.bw-opt__sub{color:var(--ink-2);font-size:13px;line-height:1.5}
.bw-opt.sel,.bw-opt.bw-selected{background:var(--orange);border-color:var(--orange)}
.bw-opt.sel .bw-opt__title,.bw-opt.sel .bw-opt__sub,
.bw-opt.bw-selected .bw-opt__title,.bw-opt.bw-selected .bw-opt__sub{color:#fff!important}
.bw-tour-note{color:var(--ink-2);font-size:13.5px}
.bw-opt-label{color:var(--ink-muted)}

/* ============================================================================
   6b — KEYWORDS AS TEXT, NOT TILES
   Feature keywords used to sit in pills and chips, which read as a second
   layer of buttons. They are supporting text, so they are typeset as text:
   one quiet line, separated by a middot, no box around anything.
   ============================================================================ */
/* text-align:center because display:block drops the flex centring these
   rows used to rely on */
.touring-facts,.reset-facts,.product-card__included,.chip-row,.rental-facts{
  display:block;margin:2px 0 4px;line-height:1.9;text-align:center}
.touring-fact,.fact-chip,.product-card__included span,.chip-row span,.rental-fact{
  display:inline;background:none!important;border:0!important;padding:0!important;
  border-radius:0!important;font-size:.86rem;font-weight:500;letter-spacing:.01em}
.touring-fact:not(:last-child)::after,
.fact-chip:not(:last-child)::after,
.product-card__included span:not(:last-child)::after,
.chip-row span:not(:last-child)::after,
.rental-fact:not(:last-child)::after{
  content:"·";padding:0 .5em;opacity:.55}
.touring-fact{color:var(--ink-2)!important}
.fact-chip,.product-card__included span,.chip-row span,.rental-fact{
  color:var(--ink-2)!important}

/* Product labels and card tags: plain uppercase type, no pill. */
.touring-card__tag,.focus-card__tag,.product-card__label,
.rental-banner__tag,.path-featured__tag{
  display:block;background:none!important;padding:0!important;
  border-radius:0!important;
  font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.touring-card__tag,.rental-banner__tag{color:var(--gold)}
.focus-card__tag,.product-card__label{color:var(--orange-dark)!important}

/* Service list keeps its dot markers but loses the chip look. */
.base-service{font-weight:500}

/* ============================================================================
   6b2 — EVERY DARK SURFACE FOLLOWS THE SAND PALETTE
   Footer, hero fade and the closing CTA were the last places still tinted
   green; they now sit in the same warm dark family as the sections above.
   ============================================================================ */
.site-footer{background:var(--bc-green-deep)!important}
.final-cta::after{background:linear-gradient(180deg,rgba(18,41,30,.62),rgba(18,41,30,.88))!important}
.hero::after{background:linear-gradient(to bottom,transparent 0%,transparent 40%,
  rgba(18,41,30,.72) 80%,rgba(18,41,30,.96) 100%)!important}


/* ---- page heros ----
   The photo used to sit at 55% opacity on cream paper, which washed it into
   a milky grey and left dark type on a light-grey photo. Full photo, warm
   sand scrim, gold headline, cream subline. */
.page-hero{overflow:hidden}
.page-hero__bg{opacity:1!important}
/* Same treatment as the home hero: dark enough for the type, then fading
   into the cream page so the header hands over instead of cutting off. */
.page-hero::after{background:linear-gradient(to bottom,
  rgba(27,67,50,.38) 0%,
  rgba(18,41,30,.55) 45%,
  rgba(56,72,58,.58) 74%,
  rgba(206,199,180,.86) 93%,
  #F2EDDF 100%)!important}
.page-hero__content h1{color:var(--gold)!important;
  text-shadow:0 2px 24px rgba(0,0,0,.45)}
.page-hero__content p{color:rgba(244,240,230,.88)!important;
  text-shadow:0 1px 12px rgba(0,0,0,.4)}
.page-hero__eyebrow{color:#F4F0E6!important}

/* Subpage titles were set to run up to 5.8rem, which pushed a two line
   headline across the full width. Capped, and the copy block narrowed. */
.page-hero__content{max-width:640px}
.page-hero__content h1{font-size:clamp(2.1rem,4.4vw,3.4rem)!important;line-height:1.1}
.page-hero__content p{font-size:1.05rem;max-width:440px}

/* The home hero had the same problem twice over: the photo at 42% opacity
   plus a mask fading it into the cream body, which read as a white veil.
   Full photo, green scrim, gold headline.

   overflow:hidden matters: the parallax script scales the photo to 1.08 and
   slides it down on scroll, and with the stock overflow:visible the surplus
   spilled out below the hero as a second, undimmed strip of the picture. */
.hero{overflow:hidden!important}
.hero__bg-img{opacity:1!important;
  -webkit-mask-image:none!important;mask-image:none!important}
/* Dark enough for the type at the top, fading into the cream page at the
   bottom so the hero hands over to the next section instead of cutting. */
.hero::after{background:linear-gradient(to bottom,
  rgba(27,67,50,.42) 0%,
  rgba(18,41,30,.52) 45%,
  rgba(56,72,58,.55) 72%,
  rgba(206,199,180,.85) 92%,
  #F2EDDF 100%)!important}

/* No scroll prompt in the hero. */
.hero__scroll{display:none!important}
.hero__title{color:var(--gold)}
.hero__subtitle{color:rgba(244,240,230,.9)}
.hero__eyebrow{color:#F4F0E6}
.hero__scroll{color:rgba(244,240,230,.75)}

/* ============================================================================
   6b3 — SCROLL OFFSET
   The header is fixed, so anything scrolled to by an anchor has to keep a
   header's worth of space above it, or its first line hides underneath.
   ============================================================================ */
html{scroll-padding-top:96px}
section[id],[id^="bw-"],.bw-step{scroll-margin-top:96px}

/* ============================================================================
   6c — HEADER
   The bar was fully transparent with white links, so on every cream page the
   navigation sat white-on-cream. It now always carries a green bar behind it.
   ============================================================================ */
.site-header,.site-header--transparent{
  background:linear-gradient(180deg,rgba(27,67,50,.88),rgba(27,67,50,.55))!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(var(--glow-gold),.18)!important}
.site-header.header--scrolled{
  background:rgba(18,41,30,.96)!important;
  border-bottom-color:rgba(var(--glow-gold),.28)!important;
  box-shadow:0 2px 24px rgba(0,0,0,.35)!important}
/* White at rest, orange on hover or on the current page. Green on green was
   unreadable, and an orange resting state left nothing for the hover to say. */
.site-nav a{color:#FFFFFF!important;font-weight:600}
.site-nav a:hover,.site-nav a:focus-visible,
.site-nav a[aria-current="page"]{color:var(--orange)!important}
.site-nav .nav-cta{color:#FFFFFF!important;border-color:rgba(255,255,255,.6)!important}
.site-nav .nav-cta:hover,.site-nav .nav-cta[aria-current="page"]{
  background:var(--orange)!important;color:#fff!important;border-color:var(--orange)!important}

/* ============================================================================
   6d — CENTRED CONTENT BLOCKS
   One thread through the whole site: any block that ends in a call to action
   is centred, copy and button alike, so the eye always lands in the middle
   of the card instead of drifting between a left edge and a right image.
   ============================================================================ */
.focus-card__body,
.touring-card__body,
.exp-copy,
.rental-content,
.reset-content,
.base-content{text-align:center}

.focus-card__body,
.touring-card__body,
.exp-copy,
.rental-content,
.reset-content,
.base-content{display:flex;flex-direction:column;align-items:center}

.focus-card .btn,.focus-card .focus-link,
.touring-card .btn,.touring-card .focus-link,
.exp-copy .btn,
.rental-content .btn,
.reset-content .btn,
.base-content .btn{align-self:center}

/* The lists and price rows inside those blocks centre with them. */
.touring-card__tag,.focus-card__tag,.exp-copy .product-card__label,
.rental-eyebrow,.reset-eyebrow,.base-eyebrow{text-align:center;width:100%}
.rental-price,.reset-price,.exp-copy .product-card__price{justify-content:center}
/* Second, smaller price line: the hourly rate under the day rate. The two
   lines narrow as they go down, which is the shape we want in every block:
   headline widest, then copy, then the smaller detail, then the button. */
.rental-price--small{margin-top:-6px}
.rental-price--small strong{font-size:1.15rem!important}
.rental-price--small span{font-size:.85rem}

/* Pyramid text flow: each block gets narrower as it descends. */
.rental-content h2,.base-content h2,.reset-content h2{max-width:22ch}
.rental-content > p,.base-content > p,.reset-content > p{max-width:46ch}
.rental-content .rental-price,.rental-content .rental-price--small{max-width:30ch}
/* Six services in an even two by three grid. No rules, no box: the alignment
   does the work, every bullet starts on the same vertical line. */
.base-services--grid{display:grid!important;grid-template-columns:1fr 1fr;
  gap:14px 32px;margin:0 0 28px;border:0;background:none}
.base-services--grid .base-service{display:flex;align-items:center;justify-content:flex-start;
  gap:12px;padding:0;text-align:left;border:0}
@media(max-width:560px){.base-services--grid{grid-template-columns:1fr}}

/* ============================================================================
   6e — THE RESET: one clear block, gallery beside it
   ============================================================================ */
.reset-note{margin:4px 0 18px;font-style:italic;color:var(--ink-muted);font-size:.95rem}
.reset-content .reset-price{display:flex;margin:0 0 24px}
.reset-content .btn{display:inline-block}

.reset-gallery{position:relative;border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--border);box-shadow:var(--shadow-md);min-height:420px}
.reset-gallery img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.1s var(--ease-vibe)}
.reset-gallery img.is-current{opacity:1}
.reset-gallery__dots{position:absolute;left:0;right:0;bottom:16px;z-index:2;
  display:flex;justify-content:center;gap:8px}
.reset-gallery__dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;
  cursor:pointer;background:rgba(255,255,255,.5);transition:all var(--dur-1) var(--ease-vibe)}
.reset-gallery__dots button[aria-current="true"]{background:var(--orange);width:22px;border-radius:999px}

/* ============================================================================
   6f — MANIFESTO: the loudest section on the page, so give it colour
   ============================================================================ */
.manifesto-section{position:relative;overflow:hidden;
  background:linear-gradient(150deg,var(--bc-green-lift) 0%,var(--bc-green) 42%,var(--bc-green-deep) 100%)!important}
.manifesto-section::before{
  content:"";position:absolute;inset:-30% -15%;pointer-events:none;
  background:radial-gradient(45% 45% at 18% 22%,rgba(var(--glow-orange),.34),transparent 68%),
             radial-gradient(40% 40% at 82% 30%,rgba(var(--glow-gold),.26),transparent 70%),
             radial-gradient(50% 50% at 50% 95%,rgba(var(--bc-green-glow),.55),transparent 72%);
  animation:bcAurora 14s ease-in-out infinite alternate}
.manifesto-grid,.manifesto-close{position:relative;z-index:1}
.manifesto-part h3{
  background:linear-gradient(100deg,#fff 10%,var(--gold) 45%,var(--orange) 75%,#fff 95%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:bcManifestoShift 9s ease-in-out infinite}
.manifesto-part:nth-child(2) h3{animation-delay:.9s}
.manifesto-part:nth-child(3) h3{animation-delay:1.8s}
@keyframes bcManifestoShift{
  0%,100%{background-position:0% 0}
  50%    {background-position:100% 0}
}
.manifesto-part p{color:rgba(244,240,230,.82)!important}
.manifesto-part .manifesto-sub{color:var(--gold)!important}
.manifesto-close h2{color:#fff!important;text-shadow:0 0 30px rgba(var(--glow-gold),.35)}

/* Just the Instagram mark under the closing line, no button, no label. */
.manifesto-ig{display:flex;justify-content:center;margin-top:30px;position:relative;z-index:1}
.manifesto-ig a{display:inline-flex;color:rgba(244,240,230,.7);padding:6px;
  transition:color var(--dur-1) var(--ease-vibe),transform var(--dur-1) var(--ease-vibe)}
.manifesto-ig a:hover{color:var(--gold);transform:translateY(-2px)}

/* ============================================================================
   6g — VISIT HERE: content and map side by side
   ============================================================================ */
.visit-map{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);
  box-shadow:var(--shadow-sm);background:var(--card-bg)}
.visit-map iframe{display:block;width:100%;height:100%;min-height:320px;border:0}
.visit-map__address{display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:14px 18px;font-size:.88rem;color:var(--ink-2);
  border-top:1px solid var(--border);text-decoration:none;
  transition:background var(--dur-1) var(--ease-vibe)}
.visit-map__address:hover{background:#FBF6EA;color:var(--ink-2)}
.visit-map__go{flex:0 0 auto;font-size:.72rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--orange-dark);white-space:nowrap}
.base-grid--map{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
@media(max-width:900px){.base-grid--map{grid-template-columns:1fr}}

/* ============================================================================
   6g2 — FEATURE LIST (The Reset)
   The house features were chips, which read as filters. As a list with line
   art they read as what they are: what you get.
   ============================================================================ */
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;
  margin:8px 0 4px;list-style:none;padding:0;text-align:left}
.feature-list li{display:flex;align-items:center;gap:12px;
  color:var(--ink-2);font-size:.95rem}
.feature-list__icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:10px;color:var(--orange-dark);
  background:rgba(var(--glow-orange),.12);overflow:hidden}
/* bruda_icon() wraps its svg in .bc-icon, which style.css fixes at 40x40.
   Inside a 34px tile that overflowed top left, so the wrapper is resized
   here rather than only the svg. */
.feature-list__icon .bc-icon{width:19px!important;height:19px!important;display:flex}
.feature-list__icon svg{width:19px!important;height:19px!important;fill:none;
  stroke:currentColor!important;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:700px){.feature-list{grid-template-columns:1fr}}

/* ============================================================================
   6g3 — OFFER GRID (The Reset): price and extras at a glance
   ============================================================================ */
.offer-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:32px;align-items:stretch}
.offer-grid .pricing-card{margin:0;max-width:none;height:100%}
/* No second card next to the price: the extras stand on the page itself. */
.addons-panel{display:flex;flex-direction:column;justify-content:center;gap:18px;
  padding:8px 0 8px 8px;border:0;background:none;box-shadow:none}
.addons-panel .addons-label{margin:0;text-align:center;font-size:.72rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--orange-dark)}
.addons-grid--2x2{display:grid!important;grid-template-columns:1fr 1fr;
  gap:18px 26px;flex:1;align-content:center}
.addon-quote{margin:0;padding:2px 0 2px 16px;border-left:3px solid var(--orange);
  text-align:left;font-family:var(--font-display);font-style:italic;
  font-size:.95rem;line-height:1.45;color:var(--ink-2)}
.addon-quote strong{display:block;font-style:normal;font-size:1.05rem;
  color:var(--ink);margin-bottom:3px}
@media(max-width:900px){
  .offer-grid{grid-template-columns:1fr}
  .addons-grid--2x2{grid-template-columns:1fr}
}

/* ============================================================================
   6g4 — SUPPORT THE VISION (about page)
   ============================================================================ */
.support-intro{text-align:center;max-width:640px;margin:56px auto 28px}
.support-intro h3{font-family:var(--font-display);font-size:clamp(1.35rem,2.6vw,1.8rem);
  color:var(--ink);text-transform:uppercase;margin-bottom:10px}
.support-intro p{color:var(--ink-2)}
.support-links{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:820px;
  margin:0 auto}

/* ============================================================================
   6g5 — REVIEW STATS
   ============================================================================ */
.review-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  max-width:720px;margin:0 auto;text-align:center}
.review-stat strong{display:block;font-family:var(--font-display);
  font-size:clamp(2rem,4vw,2.8rem);color:var(--ink);line-height:1}
.review-stat span{display:block;margin-top:6px;font-size:.78rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
@media(max-width:560px){.review-stats{grid-template-columns:1fr;gap:18px}}

/* Team line introduces the portraits. */
.team-caption{text-align:center;margin-top:48px}
.team-caption--top{margin:0 0 40px}
.team-caption h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2.2rem);
  color:var(--ink);text-transform:uppercase;line-height:1.25;margin-bottom:8px}
.team-caption p{color:var(--ink-muted);font-style:italic}
.support-card{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:10px;padding:32px 26px;border-radius:var(--radius-lg);
  background:var(--card-bg);border:1px solid rgba(var(--glow-orange),.32);
  box-shadow:var(--shadow-sm);text-decoration:none;color:inherit;
  transition:transform var(--dur-2) var(--ease-vibe),box-shadow var(--dur-2) var(--ease-vibe)}
@media (hover:hover){
  .support-card:hover{transform:translateY(-4px);
    box-shadow:0 18px 40px -16px rgba(var(--glow-orange),.45)}
}
.support-card strong{font-family:var(--font-display);font-size:1.3rem;color:var(--ink)}
.support-card span{color:var(--ink-2);font-size:.94rem}
.support-card__icon{display:flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:50%;color:var(--orange-dark);
  background:rgba(var(--glow-orange),.14)}
.support-card__icon svg{width:26px;height:26px;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.support-card .focus-link{margin-top:6px}
@media(max-width:760px){.support-links{grid-template-columns:1fr}}

/* ============================================================================
   6h — CLOSING LINE
   Subpages end on the brand line instead of one more call to action: after
   the booking wizard there is nothing left to ask for.
   ============================================================================ */
/* As tall as a page header, so the photo behind it keeps its proportions
   instead of being cropped down to a strip. */
.closing-line{position:relative;overflow:hidden;
  min-height:56vh;display:flex;align-items:center;justify-content:center;
  padding:120px 24px;text-align:center;
  background:linear-gradient(150deg,var(--bc-green-lift) 0%,var(--bc-green) 45%,var(--bc-green-deep) 100%)}
.closing-line__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.45;pointer-events:none}
@media(max-width:700px){.closing-line{min-height:44vh;padding:88px 20px}}
.closing-line::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(18,41,30,.55),rgba(18,41,30,.82)),
             radial-gradient(45% 45% at 20% 25%,rgba(var(--glow-orange),.26),transparent 68%),
             radial-gradient(40% 40% at 80% 30%,rgba(var(--glow-gold),.18),transparent 70%)}
.closing-line .container{position:relative;z-index:1}
.closing-line__lead{font-size:.78rem;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.closing-line h2{font-family:var(--font-display);color:#fff;
  font-size:clamp(2rem,5vw,3.4rem);text-transform:uppercase;line-height:1.2;
  text-shadow:0 0 30px rgba(var(--glow-gold),.35)}

/* ============================================================================
   6h2 — POINTS ROW (adventure page)
   Three equal cells, centred, all the same height whatever the copy length.
   ============================================================================ */
.points-grid{display:grid!important;grid-template-columns:repeat(3,1fr);gap:24px;
  align-items:stretch;margin-top:56px}
.point-item{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:10px;padding:28px 24px;border:1px solid var(--border);
  border-radius:var(--radius-md);background:var(--card-bg);box-shadow:var(--shadow-sm)}
.point-item h3{font-family:var(--font-display);font-size:1.35rem;color:var(--ink);
  text-transform:uppercase;margin:0}
.point-item p{color:var(--ink-2);margin:0;max-width:34ch}
@media(max-width:820px){.points-grid{grid-template-columns:1fr}}

/* Centred intro block, used where a section opens with a statement. */
.copy-block--centered{text-align:center;max-width:760px;margin:0 auto}

/* ============================================================================
   6i — EXPERIENCE BLOCKS (adventure page)
   Copy on one side, a lead photo plus three supporting shots on the other.
   ============================================================================ */
.exp-block{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center;
  margin-top:64px}
.exp-block--flip .exp-copy{order:2}
.exp-block--flip .exp-media{order:1}
.exp-copy h3{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.3rem);
  color:var(--ink);margin:10px 0 14px;text-transform:uppercase}
.exp-copy p{color:var(--ink-2);margin-bottom:16px}
.exp-copy .product-card__price{margin:18px 0 22px}

.exp-media{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.exp-media img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-md);
  aspect-ratio:1/1;box-shadow:var(--shadow-sm);transition:transform .8s var(--ease-vibe)}
.exp-media__lead{grid-column:1/-1;aspect-ratio:16/9!important}
@media (hover:hover){.exp-media img:hover{transform:scale(1.03)}}
@media(max-width:900px){
  .exp-block{grid-template-columns:1fr;gap:28px;margin-top:48px}
  .exp-block--flip .exp-copy{order:1}
  .exp-block--flip .exp-media{order:2}
}

/* ============================================================================
   7 — QUOTE (no tile, just the quote)
   ============================================================================ */
.bc-quote,
.intro-highlight{margin:28px 0 0;padding:0 0 0 20px;border-left:3px solid var(--orange);
  border-radius:0;box-shadow:none;
  background:none!important;font-family:var(--font-display);font-style:italic;
  font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.5;color:var(--ink)}
.intro-highlight p{color:var(--ink);margin:0}
/* Centred variant: the rule sits above the lines instead of beside them. */
.bc-quote--centered{padding:16px 0 0;border-left:0;border-top:3px solid var(--orange);
  text-align:center;display:inline-block;margin:28px auto 0}

/* ============================================================================
   7b — PRICE SWITCHER: a quiet control next to the price, not a block
   ============================================================================ */
.price-switcher{display:inline-flex!important;align-items:center;gap:8px;
  margin:6px 0 18px;padding:0;background:none;border:0}
.price-switcher__label{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-muted)}
.price-switcher__group{display:inline-flex;gap:2px}
.price-switcher__btn{padding:3px 8px!important;font-size:.68rem!important;
  border-radius:999px!important;line-height:1.4}
.rental-content .price-switcher,.reset-content .price-switcher,
.pricing-card .price-switcher{justify-content:center}

/* ============================================================================
   7c — TOUCH TARGETS
   Carousel dots are 8px of ink. On a phone they need a finger-sized area
   around them, so the dot keeps its size and the padding does the catching.
   ============================================================================ */
@media(hover:none){
  .bike-dots button,.reset-gallery__dots button,.cf-dot,.bc-slider__dot{
    padding:18px!important;background-clip:content-box!important;
    box-sizing:content-box!important}
  .bike-dots,.reset-gallery__dots,.cf-dots,.bc-slider__dots{gap:0!important}
}

/* ============================================================================
   8 — MOTION PREFERENCES
   ============================================================================ */
@media (prefers-reduced-motion:reduce){
  .bc-lit::before,
  .path-featured,.touring-card--hero,
  .btn:not(.btn--outline):not(.btn--ghost)::after,
  .touring-section::before{animation:none!important}
  .bc-lit.is-lit{text-shadow:none!important;animation:none!important}
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
}