/* Motorcycle Morocco Tours — static resilience layer.
   Content is visible by default: no page section depends on JavaScript to appear. */
.reveal,
.reveal.is-visible {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

#mmt-form-status {
  margin-top: 1rem;
  border-radius: 1rem;
  padding: 1rem 1.25rem;
  font-size: .95rem;
  line-height: 1.55;
}
#mmt-form-status[data-state="success"] {
  border: 1px solid rgba(163, 74, 45, .25);
  background: rgba(163, 74, 45, .07);
}
#mmt-form-status[data-state="error"] {
  border: 1px solid rgba(153, 27, 27, .25);
  background: rgba(254, 242, 242, .95);
}

/* Future Consent Mode UI. It stays absent until a Google measurement ID is configured. */
#mmt-consent-banner {
  position: fixed;
  z-index: 9999;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  max-width: 760px;
  margin: 0 auto;
  padding: 1rem;
  border-radius: 1rem;
  background: #1f2423;
  color: #fff;
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
  font: 14px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
#mmt-consent-banner p { margin: 0 0 .75rem; }
#mmt-consent-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
#mmt-consent-actions button {
  border: 0;
  border-radius: 999px;
  padding: .65rem 1rem;
  cursor: pointer;
  font-weight: 700;
}
#mmt-consent-accept { background: #b55f3d; color: #fff; }
#mmt-consent-reject { background: #fff; color: #1f2423; }

/* MMT Enduro navigation */
.mmt-enduro-menu>summary{list-style:none}.mmt-enduro-menu>summary::-webkit-details-marker{display:none}.mmt-enduro-chevron{transition:transform .2s ease}.mmt-enduro-menu[open] .mmt-enduro-chevron{transform:rotate(180deg)}


/* ==========================================================================
   MMT patch 2026-09 — appended block
   Rebuilt 2026-09-04 from work/REPORT-qa.md §"Live defects" (1–8) after the
   original patch file was lost with the previous workspace.

   Loaded AFTER /_next/static/css/811d83181b4b7d5c.css, so these rules win the
   cascade without touching the compiled Tailwind build.

   Design tokens taken verbatim from the compiled file:
     ink        rgb(21 17 13)        cream      rgb(247 242 234) / hsl(37 45% 94%)
     rust       rgb(138 47 42)       rust-light rgb(168 65 58)
     rust-soft  rgb(230 167 159)     sand-50    rgb(250 246 239)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Utility classes used in the live markup but absent from the compiled
      Tailwind file (REPORT-qa §6). Without these the stats bars had no
      padding, itinerary day badges collapsed and the About page grid fell
      back to a single column.
   -------------------------------------------------------------------------- */

.py-7        { padding-top: 1.75rem; padding-bottom: 1.75rem; }
.pt-10       { padding-top: 2.5rem; }
.h-9         { height: 2.25rem; }
.w-9         { width: 2.25rem; }
.max-w-4xl   { max-width: 56rem; }

.text-cream\/60 { color: hsla(37, 45%, 94%, .6); }
.text-cream\/65 { color: hsla(37, 45%, 94%, .65); }
.bg-cream\/10   { background-color: hsla(37, 45%, 94%, .1); }

.tracking-\[0\.18em\] { letter-spacing: .18em; }

.hover\:text-rust-light:hover { color: rgb(168 65 58); }

@media (min-width: 1536px) {
  .\32 xl\:gap-6 { gap: 1.5rem; }
}

/* Additional undefined utilities found by build/class_audit.py that the
   previous pass missed (its grep could not read CSS-escaped selectors). */
.left-0 { left: 0; }
.pb-2   { padding-bottom: .5rem; }
.border-b { border-bottom-width: 1px; }

@media (min-width: 640px) {
  .sm\:items-center   { align-items: center; }
  .sm\:justify-between { justify-content: space-between; }
}

/* Correction to the previous report: `md:grid-cols-[minmax(0,320px)_1fr]`
   (About page "Meet Yassin" grid) IS present in the compiled Tailwind file as
   `.md\:grid-cols-\[minmax\(0\2c 320px\)_1fr\]`. The earlier "About page grid
   was single-column" finding was a false positive from the same grep bug; the
   grid measures 320px + 1fr at >=768px on the untouched live site. No rule
   added here on purpose.

   Likewise `prose-morocco` (privacy-policy wrapper, 6 pages) is undefined but
   is an inert hook: every heading, paragraph and list inside it already
   carries its own utility classes. Left unstyled deliberately. */

/* --------------------------------------------------------------------------
   2. Horizontal-scroll fixes (REPORT-qa §7).
      The footer / contact-card e-mail address is one unbreakable 34-character
      token; it overflowed its grid column at 1024 px site-wide and at 390 px
      on the six contact pages.
   -------------------------------------------------------------------------- */

/* Every e-mail link, wherever it appears: the 34-character address is one
   unbreakable token. */
a[href^="mailto:"] {
  overflow-wrap: anywhere;
  word-break: break-word;
  min-width: 0;
}

footer a[href^="mailto:"] svg,
a[href^="mailto:"].inline-flex svg {
  flex: none;
}

/* Contact-page "Reach us directly" cards: the text column is a flex child, so
   its default min-width:auto is what actually pushes the card past the
   viewport at 390 px. `:has()` targets exactly the affected wrapper. */
.flex.items-center.gap-4.rounded-2xl > div:has(> a[href^="mailto:"]),
.flex.items-center.gap-4.rounded-2xl:has(a[href^="mailto:"]) {
  min-width: 0;
}

/* Fallback for engines without :has() — the same cards, addressed by shape. */
.space-y-4 > .flex.items-center.gap-4.rounded-2xl > div {
  min-width: 0;
}

/* Grid/flex children default to min-width:auto, which is what actually lets
   the long address push the track wider than the viewport. */
footer .container-x > div,
footer ul,
footer li {
  min-width: 0;
}

/* Rebalance the footer columns from 1280 px so the address fits on one line
   instead of breaking mid-word. Measured: the contact column needs >=300 px;
   the shares below give it ~330 px at 1440 px, so it is not borderline when a
   scrollbar takes a few pixels. */
@media (min-width: 1280px) {
  footer .container-x.grid.lg\:grid-cols-4 {
    grid-template-columns: 1.05fr .72fr 1fr 1.23fr;
  }
}

/* --------------------------------------------------------------------------
   3. Desktop header overflow in ES / IT / PT / DE (REPORT-qa §8).
      Longer nav labels pushed "Get in Touch" outside the content box at
      >=1440 px on live. Let the nav shrink in the 1280–1535 px band instead
      of overflowing; >=1536 px is unchanged.
   -------------------------------------------------------------------------- */

@media (min-width: 1280px) and (max-width: 1535.98px) {
  header nav[aria-label="Primary"] {
    min-width: 0;
    flex-shrink: 1;
    column-gap: .875rem;
  }
  header nav[aria-label="Primary"] > a {
    font-size: .8125rem;
  }
  header .container-x > div:last-child,
  header .container-x > .hidden.xl\:flex {
    flex: none;
  }
}

/* --------------------------------------------------------------------------
   4. Eyebrows on dark backgrounds (REPORT-qa §5).
      `.eyebrow` sets rust and is declared after the colour utilities, so a
      hero eyebrow marked `text-cream` still rendered rust-on-ink (unreadable).
      Re-assert the utility when both classes are present.
   -------------------------------------------------------------------------- */

.eyebrow.text-cream,
.eyebrow.text-cream\/90,
.eyebrow.text-cream\/85,
.eyebrow.text-cream\/80,
.eyebrow.text-cream\/75,
.eyebrow.text-cream\/70,
.eyebrow.text-rust-soft,
.eyebrow.text-rust-light {
  color: inherit;
}
.eyebrow.text-cream          { color: rgb(247 242 234); }
.eyebrow.text-cream\/90      { color: hsla(37, 45%, 94%, .9); }
.eyebrow.text-cream\/85      { color: hsla(37, 45%, 94%, .85); }
.eyebrow.text-cream\/80      { color: hsla(37, 45%, 94%, .8); }
.eyebrow.text-cream\/75      { color: hsla(37, 45%, 94%, .75); }
.eyebrow.text-cream\/70      { color: hsla(37, 45%, 94%, .7); }
.eyebrow.text-rust-soft      { color: rgb(230 167 159); }
.eyebrow.text-rust-light     { color: rgb(168 65 58); }

.eyebrow.text-cream:before,
.eyebrow.text-cream\/90:before,
.eyebrow.text-cream\/85:before,
.eyebrow.text-cream\/80:before,
.eyebrow.text-cream\/75:before,
.eyebrow.text-cream\/70:before,
.eyebrow.text-rust-soft:before {
  background-color: currentColor;
  opacity: .85;
}

/* `before:bg-rust-soft` (3 pages) is also absent from the compiled build, so
   the rule on the line above is what actually colours those bars. Define the
   utility too, so the markup means what it says. */
.before\:bg-rust-soft:before { background-color: rgb(230 167 159); }

/* --------------------------------------------------------------------------
   5. Tours hub — "Off-road and enduro programmes" strip had no vertical
      padding because py-12 was missing from the compiled build (REPORT-qa §3).
   -------------------------------------------------------------------------- */

.py-12 { padding-top: 3rem; padding-bottom: 3rem; }

/* --------------------------------------------------------------------------
   6. Gallery mosaic (REPORT-qa §4). The 4th tile (`col-span-2 sm:col-span-1`)
      dropped onto a third row as a lone 1/3-width tile, leaving a 2/3 gap.
      Let it complete the grid as a full-width strip instead.
   -------------------------------------------------------------------------- */

@media (min-width: 640px) {
  [data-mmt-gallery] > :last-child.sm\:col-span-1 {
    grid-column: 1 / -1;
  }
  [data-mmt-gallery] > :last-child.sm\:col-span-1 .img-overlay,
  [data-mmt-gallery] > :last-child.sm\:col-span-1 > div {
    aspect-ratio: 16 / 6;
  }
}

/* ==========================================================================
   Phase 1 redesign components
   New class names introduced by the rebuilt patch. They live here rather than
   in the compiled Tailwind file because the site has no build step.
   ========================================================================== */

/* --- Meet Yassin card ---------------------------------------------------- */
.mmt-yassin {
  display: grid;
  gap: 2rem;
  align-items: start;
}
@media (min-width: 1024px) {
  .mmt-yassin {
    grid-template-columns: minmax(0, 26rem) 1fr;
    gap: 3rem;
  }
}
.mmt-yassin-card {
  width: 100%;
  max-width: 26rem;          /* 416px at 1440 */
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .mmt-yassin-card { margin-inline: 0; }
}
.mmt-yassin-photo {
  position: relative;
  aspect-ratio: 4 / 5;       /* portrait, never a face close-up crop */
  overflow: hidden;
  background: rgb(245 238 228);
}
.mmt-yassin-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 22%;
}
/* Two identical, full-width, stacked calls to action. */
.mmt-yassin-ctas {
  display: grid;
  grid-template-columns: 1fr;
  gap: .625rem;
}
.mmt-yassin-ctas > .btn {
  width: 100%;
  justify-content: center;
}

/* --- Enduro hub programme cards ------------------------------------------ */
.mmt-enduro-group + .mmt-enduro-group { margin-top: 3rem; }

.mmt-enduro-card {
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease;
}
.mmt-enduro-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px -18px rgba(21, 17, 13, .35);
}
.mmt-enduro-card-media {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: rgb(245 238 228);
}
.mmt-enduro-card-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.mmt-enduro-card:hover .mmt-enduro-card-media img { transform: scale(1.03); }

.mmt-enduro-tag {
  position: absolute;
  left: .75rem;
  top: .75rem;
  z-index: 1;
  border-radius: 9999px;
  background: rgba(21, 17, 13, .72);
  padding: .25rem .625rem;
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgb(247 242 234);
  backdrop-filter: blur(2px);
}

.mmt-enduro-more {
  margin-top: 1rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: .875rem;
  font-weight: 600;
  color: rgb(138 47 42);
}
.mmt-enduro-card:hover .mmt-enduro-more { color: rgb(168 65 58); }

/* --- Tours page: single Enduro discovery block --------------------------- */
.mmt-enduro-feature {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
}
@media (min-width: 768px) {
  .mmt-enduro-feature { grid-template-columns: minmax(0, 45%) 1fr; }
}
.mmt-enduro-feature-media {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: rgb(245 238 228);
}
@media (min-width: 768px) {
  .mmt-enduro-feature-media { aspect-ratio: auto; min-height: 20rem; }
}
.mmt-enduro-feature-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mmt-enduro-feature-body {
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 768px) {
  .mmt-enduro-feature-body { padding: 2.5rem; }
}
/* --------------------------------------------------------------------------
   Phase-2 final correction (2026-09-04): `space-y-12` is used by the Enduro
   hub programme grouping but was never emitted into the compiled Tailwind
   build. Tailwind v3 definition, so the class means what it says.
   -------------------------------------------------------------------------- */
.space-y-12 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0px * var(--tw-space-y-reverse));
}