/* FOOD N TOURS · branding from actual logo (forest green / leaf green / sunset orange).
   Additive and scoped; no tour cards or photos are changed. */
#wrapper.ft-vp.ftx-home {
  --ftx-deep: #113a29;
  --ftx-dark: #143d2b;
  --ftx-ink: #18392c;
  --ftx-muted: #65766c;
  --ftx-sage: #b6d0b9;
  --ftx-lime: #f6a449;
  --ftx-gold: #f28a2b;
  --ftx-cream: #faf8f3;
  --ftx-cream-dark: #edf2e9;
  --vp-orange: #f28a2b;
  --vp-green: #457b54;
  --vp-green-dark: #285c3b;
}
#wrapper.ft-vp.ftx-home.ftx-catalog {--ftc-cream:#faf8f3;--ftc-ink:#18392c;--ftc-forest:#113a29;--ftc-sage:#ffc27b;}
#wrapper.ft-vp.ftx-home #header.ftx-header,
#wrapper.ft-vp.ftx-home #header.ftx-header.is-scrolled,
#wrapper.ft-vp.ftx-home.ftx-catalog #header.ftc-header,
#wrapper.ft-vp.ftx-home.ftx-catalog #header.ftc-header.is-scrolled {background:#113a29 !important;border-bottom:1px solid rgba(255,255,255,.14);backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
#wrapper.ft-vp.ftx-home #header .ft-vp-header-cta,
#wrapper.ft-vp.ftx-home #header.is-scrolled .ft-vp-header-cta,
#wrapper.ft-vp.ftx-home .ftx-button--lime {background:#f6a449!important;border-color:#f6a449!important;color:#193528!important;}
#wrapper.ft-vp.ftx-home #header .ft-vp-header-cta:hover,
#wrapper.ft-vp.ftx-home .ftx-button--lime:hover {background:#ffcb85!important;border-color:#ffcb85!important;}
#wrapper.ft-vp.ftx-home .ftx-display em,
#wrapper.ft-vp.ftx-home .ftx-intro__lead em {color:#457b54;}
#wrapper.ft-vp.ftx-home .ftx-hero .title-slide em,
body.ft-vitour-preview-request #wrapper.ft-vp.ftx-home .ftx-hero .title-slide em {color:#ffd18d!important;}
#wrapper.ft-vp.ftx-home .ftx-dot {background:#f28a2b;}
#wrapper.ft-vp.ftx-home .ftx-head-rule {background:#f28a2b;}
#wrapper.ft-vp.ftx-home.ftx-catalog .ftc-hero h1 em,
#wrapper.ft-vp.ftx-home.ftx-catalog .ftc-hero__counter strong {color:#ffc27b;}
#wrapper.ft-vp.ftx-home #header .ft-vp-nav .ft-brand-blog-link{display:inline-flex;align-items:center;padding:14px 2px;color:#fff;font:650 12px/1.4 Arial,sans-serif;letter-spacing:.075em;text-transform:uppercase;white-space:nowrap;}
#wrapper.ft-vp.ftx-home #header .ft-vp-nav .ft-brand-blog-link:hover{color:#ffc27b;}
@media(min-width:992px){#wrapper.ft-vp.ftx-home #header .ft-vp-nav{align-items:center;gap:clamp(10px,1.25vw,24px);}}
@media(max-width:991px){#wrapper.ft-vp.ftx-home #header .ft-vp-nav .ft-brand-blog-link{display:block;color:#113a29!important;padding:13px 4px;border-top:1px solid #e0e6dc;}}

/* Interior / legacy Drupal pages: color only; respect their existing layout. */
#wrapper.ft-home-shell #header.ftv-site-header {background:#113a29;color:#fff;}
#wrapper.ft-home-shell #header .ftv-nav a:hover {color:#f6a449;}
#wrapper.ft-home-shell .ft-menu-toggle {border-color:#f6a449;}
#wrapper.ft-home-shell .ft-menu-toggle span {background:#f6a449;}
#wrapper.ft-home-shell #footer.ftv-footer {background:#113a29;}
#wrapper.ft-home-shell #header .ft-brand-blog-link {display:inline-flex;align-items:center;color:inherit;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:12px 6px;}

/* FT_HEADER_CREMA_20261104
   Identidad Food N Tours: cabecera marfil, tipografia verde oscuro y CTA naranja.
   No cambia el Hero, las tarjetas de tours, el blog, ni el menu Drupal.
   Se aplica a Home, Catalogo, Tour individual y Blog; preserva breakpoints. */
:root {
  --ft-header-paper: #faf8f3;
  --ft-header-ink: #254331;
  --ft-header-accent: #f28a2b;
  --ft-header-accent-hover: #ffb466;
  --ft-header-edge: #e8e2d5;
}

/* Home y catalogo: sustituir la franja verde opaca por fondo crema. */
#wrapper.ft-vp.ftx-home #header.ftx-header,
#wrapper.ft-vp.ftx-home #header.ftx-header.is-scrolled,
#wrapper.ft-vp.ftx-home.ftx-catalog #header.ftc-header,
#wrapper.ft-vp.ftx-home.ftx-catalog #header.ftc-header.is-scrolled {
  background: var(--ft-header-paper) !important;
  background-image: none !important;
  color: var(--ft-header-ink) !important;
  border-bottom: 1px solid var(--ft-header-edge) !important;
  box-shadow: 0 4px 18px rgba(30, 41, 29, .07) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Menus del escritorio: alto contraste sobre el fondo claro. */
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav a,
#wrapper.ft-vp.ftx-home #header.ftx-header.is-scrolled nav.ft-vp-nav a,
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav .tbm-link.level-1,
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav .ft-brand-blog-link {
  color: var(--ft-header-ink) !important;
  text-shadow: none !important;
}
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav a:hover,
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav a:focus-visible,
#wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav .ft-brand-blog-link:hover {
  color: #b45a11 !important;
}

/* CTA conserva el naranja original del logotipo. */
#wrapper.ft-vp.ftx-home #header.ftx-header a.ft-vp-header-cta,
#wrapper.ft-vp.ftx-home #header.ftx-header.is-scrolled a.ft-vp-header-cta {
  background: var(--ft-header-accent) !important;
  border-color: var(--ft-header-accent) !important;
  color: #182a21 !important;
}
#wrapper.ft-vp.ftx-home #header.ftx-header a.ft-vp-header-cta:hover,
#wrapper.ft-vp.ftx-home #header.ftx-header a.ft-vp-header-cta:focus-visible {
  background: var(--ft-header-accent-hover) !important;
  border-color: var(--ft-header-accent-hover) !important;
}

/* Menu movil: icono oscuro sobre crema, sin volver al boton verde gigante. */
@media (max-width: 991px) {
  #wrapper.ft-vp.ftx-home #header.ftx-header button.ft-vp-menu-toggle {
    background: #fff !important;
    border: 1px solid #d6d8ca !important;
    box-shadow: none !important;
    color: var(--ft-header-ink) !important;
  }
  #wrapper.ft-vp.ftx-home #header.ftx-header button.ft-vp-menu-toggle span {
    background: var(--ft-header-ink) !important;
  }
  #wrapper.ft-vp.ftx-home #header.ftx-header nav.ft-vp-nav {
    background: #fffdf9 !important;
    border-color: var(--ft-header-edge) !important;
  }
}

/* Paginas interiores Drupal: la misma identidad visual que Home/Blog/Tours. */
#wrapper.ft-home-shell #header.ftv-site-header,
#wrapper.ft-home-shell #header.ftv-site-header.is-scrolled {
  background: var(--ft-header-paper) !important;
  background-image: none !important;
  color: var(--ft-header-ink) !important;
  border-bottom: 1px solid var(--ft-header-edge) !important;
  box-shadow: 0 4px 18px rgba(30, 41, 29, .07) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#wrapper.ft-home-shell #header.ftv-site-header nav.ftv-nav a,
#wrapper.ft-home-shell #header.ftv-site-header nav.ftv-nav .ft-brand-blog-link,
#wrapper.ft-home-shell #header.ftv-site-header #block-food-and-tours-site-branding .site-name a {
  color: var(--ft-header-ink) !important;
  text-shadow: none !important;
}
#wrapper.ft-home-shell #header.ftv-site-header nav.ftv-nav a:hover,
#wrapper.ft-home-shell #header.ftv-site-header nav.ftv-nav a:focus-visible {
  color: #b45a11 !important;
}
#wrapper.ft-home-shell #header.ftv-site-header button.ft-menu-toggle {
  border-color: #d6d8ca !important;
  background: #fff !important;
  color: var(--ft-header-ink) !important;
}
#wrapper.ft-home-shell #header.ftv-site-header button.ft-menu-toggle span {
  background: var(--ft-header-ink) !important;
}


/* FT_FINISHING_V5: unified layout for Home, Catalog, Blog and tour details.
   Keep TB Mega Menu/Drupal markup, photos and the 12 approved cards intact.
   Fix header clipping and interior desktop navigation after viewport changes. */
:root {
  --ft-paper-v5:#faf8f3;
  --ft-ink-v5:#254331;
  --ft-orange-v5:#f28a2b;
  --ft-orange-soft-v5:#fff1df;
  --ft-edge-v5:#e7e4d9;
}
/* Header stays aligned to its own viewport, never shifted to the side. */
body #wrapper.ft-vp.ftx-home #header.ftv-site-header,
body #wrapper.ft-home-shell #header.ftv-site-header {
  inset-inline:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  margin-inline:0 !important;
  transform:none !important;
  translate:none !important;
  background:#faf8f3 !important;
  background-color:#faf8f3 !important;
  background-image:none !important;
  color:#254331 !important;
  border-bottom:1px solid var(--ft-edge-v5) !important;
  box-shadow:0 3px 16px rgba(20,42,31,.065) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
/* Own a stable centered row, including legacy interior pages with grid CSS. */
body #wrapper.ft-vp.ftx-home #header .ft-vp-header-inner,
body #wrapper.ft-home-shell #header .header-layout {
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:nowrap !important;
  gap:clamp(14px,2vw,28px) !important;
  width:min(1280px, calc(100% - 44px)) !important;
  max-width:1280px !important;
  min-width:0 !important;
  min-height:80px !important;
  height:auto !important;
  margin-inline:auto !important;
  padding:8px 0 !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
  translate:none !important;
  box-sizing:border-box !important;
}
body #wrapper.ft-vp.ftx-home #header .ft-vp-brand,
body #wrapper.ft-home-shell #header .header-branding-region {
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  max-width:168px !important;
  margin:0 auto 0 0 !important;
  left:auto !important;
  transform:none !important;
}
body #wrapper.ft-vp.ftx-home #header .ft-vp-brand img,
body #wrapper.ft-home-shell #header .header-branding-region img {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:158px !important;
  max-height:58px !important;
  object-fit:contain !important;
}
/* Interior pages use a compact CTA just like the Home; no content is replaced. */
body #wrapper.ft-home-shell #header .ft-interior-cta {
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  min-height:44px !important;
  margin:0 !important;
  padding:0 19px !important;
  border:1px solid var(--ft-orange-v5) !important;
  border-radius:3px !important;
  background:var(--ft-orange-v5) !important;
  color:#163326 !important;
  font:750 11px/1.3 Arial,sans-serif !important;
  text-transform:uppercase !important;
  letter-spacing:.07em !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}
body #wrapper.ft-home-shell #header .ft-interior-cta:hover,
body #wrapper.ft-home-shell #header .ft-interior-cta:focus-visible {
  background:#ffc177 !important;
  border-color:#ffc177 !important;
}
@media (min-width:992px) {
  body #wrapper.ft-vp.ftx-home #header nav#menu,
  body #wrapper.ft-home-shell #header nav#menu {
    position:static !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    flex:0 1 auto !important;
    gap:clamp(12px,1.5vw,25px) !important;
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    max-height:none !important;
    margin:0 0 0 auto !important;
    padding:0 !important;
    overflow:visible !important;
    visibility:visible !important;
    opacity:1 !important;
    transform:none !important;
    translate:none !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  /* Drupal TB Mega Menu may remain collapsed after a viewport resize. */
  body #wrapper.ft-vp.ftx-home #header nav#menu .tbm-collapse,
  body #wrapper.ft-home-shell #header nav#menu .tbm-collapse,
  body #wrapper.ft-vp.ftx-home #header nav#menu .region-menu,
  body #wrapper.ft-home-shell #header nav#menu .region-menu {
    position:static !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    visibility:visible !important;
    opacity:1 !important;
    transform:none !important;
    background:transparent !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu .tbm-nav.level-0,
  body #wrapper.ft-home-shell #header nav#menu .tbm-nav.level-0,
  body #wrapper.ft-vp.ftx-home #header nav#menu ul.menu,
  body #wrapper.ft-home-shell #header nav#menu ul.menu {
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:clamp(6px,1vw,18px) !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu .tbm-item.level-1,
  body #wrapper.ft-home-shell #header nav#menu .tbm-item.level-1 {
    display:block !important;
    flex:0 0 auto !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  body #wrapper.ft-vp.ftx-home #header button.ft-vp-menu-toggle,
  body #wrapper.ft-home-shell #header button.ft-menu-toggle {
    display:none !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu a,
  body #wrapper.ft-home-shell #header nav#menu a {
    color:var(--ft-ink-v5) !important;
    text-shadow:none !important;
    white-space:nowrap !important;
    opacity:1 !important;
  }
  body #wrapper.ft-home-shell #header nav#menu .tbm-link.level-1,
  body #wrapper.ft-home-shell #header nav#menu .menu-item > a {
    padding:0 10px !important;
    min-height:42px !important;
    border-radius:4px !important;
  }
}
/* On phones/tablets: keep logo and menu control in view with no side clipping. */
@media (max-width:991px) {
  body #wrapper.ft-vp.ftx-home #header .ft-vp-header-inner,
  body #wrapper.ft-home-shell #header .header-layout {
    width:calc(100% - 32px) !important;
    min-height:72px !important;
    gap:12px !important;
    padding:8px 0 !important;
  }
  body #wrapper.ft-vp.ftx-home #header .ft-vp-brand,
  body #wrapper.ft-home-shell #header .header-branding-region {
    max-width:140px !important;
    margin-right:auto !important;
  }
  body #wrapper.ft-vp.ftx-home #header .ft-vp-brand img,
  body #wrapper.ft-home-shell #header .header-branding-region img {
    max-width:130px !important;
    max-height:51px !important;
  }
  body #wrapper.ft-vp.ftx-home #header button.ft-vp-menu-toggle,
  body #wrapper.ft-home-shell #header button.ft-menu-toggle {
    display:inline-flex !important;
    position:relative !important;
    flex:0 0 44px !important;
    order:3 !important;
    width:44px !important;
    height:44px !important;
    margin:0 0 0 auto !important;
    padding:0 !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    background:#fff !important;
    border:1px solid #d7dccc !important;
    border-radius:9px !important;
    color:var(--ft-ink-v5) !important;
    box-shadow:none !important;
    z-index:2 !important;
  }
  body #wrapper.ft-vp.ftx-home #header button.ft-vp-menu-toggle span,
  body #wrapper.ft-home-shell #header button.ft-menu-toggle span {
    display:block !important;
    width:18px !important;
    height:2px !important;
    flex:0 0 2px !important;
    margin:0 !important;
    border-radius:3px !important;
    background:var(--ft-ink-v5) !important;
  }
  body #wrapper.ft-vp.ftx-home #header .ft-vp-header-cta,
  body #wrapper.ft-home-shell #header .ft-interior-cta {
    display:none !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu,
  body #wrapper.ft-home-shell #header nav#menu {
    display:none !important;
    position:absolute !important;
    top:100% !important;
    left:auto !important;
    right:0 !important;
    width:min(365px,calc(100vw - 32px)) !important;
    max-width:calc(100vw - 32px) !important;
    max-height:min(70vh,540px) !important;
    overflow:auto !important;
    background:#fffdf9 !important;
    border:1px solid var(--ft-edge-v5) !important;
    box-shadow:0 22px 54px rgba(24,47,32,.18) !important;
    border-radius:0 0 9px 9px !important;
    padding:12px 18px !important;
    visibility:hidden !important;
    opacity:0 !important;
    transform:none !important;
    z-index:960 !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu.is-open,
  body #wrapper.ft-home-shell #header nav#menu.is-open {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu .tbm-collapse,
  body #wrapper.ft-home-shell #header nav#menu .tbm-collapse,
  body #wrapper.ft-vp.ftx-home #header nav#menu .region-menu,
  body #wrapper.ft-home-shell #header nav#menu .region-menu {
    display:block !important;
    position:static !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    visibility:visible !important;
    opacity:1 !important;
    background:transparent !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu ul.menu,
  body #wrapper.ft-home-shell #header nav#menu ul.menu,
  body #wrapper.ft-vp.ftx-home #header nav#menu .tbm-nav.level-0,
  body #wrapper.ft-home-shell #header nav#menu .tbm-nav.level-0 {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:0 !important;
    padding:0 !important;
    margin:0 !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu a,
  body #wrapper.ft-home-shell #header nav#menu a {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-height:44px !important;
    padding:10px 7px !important;
    color:var(--ft-ink-v5) !important;
    background:transparent !important;
    text-shadow:none !important;
    border:0 !important;
    border-radius:3px !important;
    font-size:13px !important;
    box-sizing:border-box !important;
  }
  body #wrapper.ft-vp.ftx-home #header nav#menu a:hover,
  body #wrapper.ft-home-shell #header nav#menu a:hover {
    color:#ad560f !important;
    background:var(--ft-orange-soft-v5) !important;
  }
}
/* Finish: understated hover/focus states on main site navigation. */
body #wrapper.ft-vp.ftx-home #header nav#menu a:focus-visible,
body #wrapper.ft-home-shell #header nav#menu a:focus-visible {
  outline:2px solid var(--ft-orange-v5) !important;
  outline-offset:3px !important;
}
@media (min-width:992px) {
  body #wrapper.ft-vp.ftx-home #header nav#menu a:hover,
  body #wrapper.ft-home-shell #header nav#menu a:hover {
    color:#b3560e !important;
  }
}
/* Section treatments for editorial blog + individual tour pages ONLY. */
.ft-editorial--blog .ft-editorial__blog-list {
  padding-block:clamp(64px,7vw,102px);
}
.ft-editorial--blog .ft-editorial__blog-card {
  border-color:#e6e6dc;
  border-radius:5px;
  box-shadow:0 12px 35px rgba(28,47,37,.05);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.ft-editorial--blog .ft-editorial__blog-card:hover,
.ft-editorial--blog .ft-editorial__blog-card:focus-within {
  border-color:#e4c7a6;
  box-shadow:0 20px 48px rgba(28,47,37,.11);
  transform:translateY(-3px);
}
.ft-editorial--blog .ft-editorial__blog-card h3 a:hover,
.ft-editorial--blog .ft-editorial__readmore:hover {
  color:#a45113;
}
.ft-editorial--blog .ft-editorial__blog-copy {
  padding:clamp(22px,2.5vw,30px);
}
.ft-editorial--blog .ft-editorial__blog-copy p {
  line-height:1.75;
}
.ft-editorial--tour .ft-editorial__meta {
  border-bottom:2px solid #e9e5d9;
}
.ft-editorial--tour .ft-editorial__sidebar {
  border-color:#e8e3d9;
  border-top:3px solid var(--ft-orange-v5);
  box-shadow:0 18px 48px rgba(26,52,35,.08);
}
.ft-editorial--tour .ft-editorial__main h2 {
  text-wrap:balance;
}
.ft-editorial--tour .ft-editorial__steps li {
  line-height:1.7;
}
.ft-editorial--tour .ft-editorial__related-card {
  border-radius:5px;
  box-shadow:0 12px 35px rgba(28,47,37,.07);
  transition:transform .22s ease,box-shadow .22s ease;
}
.ft-editorial--tour .ft-editorial__related-card:hover,
.ft-editorial--tour .ft-editorial__related-card:focus-visible {
  transform:translateY(-3px);
  box-shadow:0 18px 45px rgba(28,47,37,.12);
}
@media (max-width:650px) {
  .ft-editorial--tour .ft-editorial__content,
  .ft-editorial--blog .ft-editorial__blog-list {
    width:calc(100% - 34px);
  }
  .ft-editorial--tour .ft-editorial__hero h1,
  .ft-editorial--blog .ft-editorial__blog-hero h1 {
    font-size:clamp(42px,11vw,62px);
    overflow-wrap:break-word;
  }
  .ft-editorial--tour .ft-editorial__sidebar {
    padding:25px 22px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .ft-editorial--blog .ft-editorial__blog-card,
  .ft-editorial--tour .ft-editorial__related-card {
    transition:none !important;
    transform:none !important;
  }
}
