/*
 * Chupinazo context image
 *
 * This close, human photograph needs enough vertical room to read as an
 * editorial moment rather than a decorative strip. The rule is deliberately
 * limited to its unique image class so other enquiry landings retain their
 * compact supporting-media treatment.
 */
.tsf-service-landing--chupinazo .tsf-understand-moment__intro-media--chupinazo {
  height: clamp(220px, 17vw, 280px);
  max-width: none;
}

.tsf-service-landing--chupinazo .tsf-understand-moment__intro-media--chupinazo img {
  height: 100%;
  object-position: center 48%;
}

/* Encierro: the aerial scene has enough detail to work as a proper wide
 * editorial photograph, not a shallow strip beneath the introduction. */
.tsf-understand-moment__intro-media--encierro {
  height: clamp(210px, 16vw, 270px);
  max-width: none;
  width: 100%;
}

.tsf-understand-moment__intro-media--encierro img {
  height: 100%;
  object-position: center 52%;
}

/* Tours: this is a proper wide editorial scene, so it reads as a composed
 * photograph below the introductory copy instead of a shallow thumbnail. */
.tsf-service-landing--tours .tsf-understand-moment__intro-media--tours {
  height: clamp(205px, 15vw, 260px);
  max-width: none;
  width: 100%;
}

.tsf-service-landing--tours .tsf-understand-moment__intro-media--tours img {
  height: 100%;
  object-position: center;
}

/* Accommodation: give the wide bedroom-and-balcony scene enough room to
 * establish the practical, calm side of the stay without becoming a strip. */
.tsf-service-landing--alojamiento .tsf-understand-moment__intro-media--alojamiento {
  height: clamp(190px, 14vw, 250px);
  max-width: none;
  width: 100%;
}

.tsf-service-landing--alojamiento .tsf-understand-moment__intro-media--alojamiento img {
  height: 100%;
  object-position: center;
}

/* Feria del Toro: the landscape is part of the explanation, so it receives
 * a full, horizontal editorial frame rather than the generic thumbnail. */
.tsf-service-landing--feria .tsf-understand-moment__intro-media--feria {
  height: clamp(205px, 15vw, 260px);
  max-width: none;
  width: 100%;
}

.tsf-service-landing--feria .tsf-understand-moment__intro-media--feria img {
  height: 100%;
  object-position: center;
}

/* Tailor-made territorial experiences use the same centered, compact banner
 * rhythm as the rest of the enquiry landings. */
.tsf-territory-experience__hero {
  align-items: center;
  background: linear-gradient(90deg, rgba(12, 22, 19, .73), rgba(12, 22, 19, .4)), var(--tsf-territory-hero) center / cover;
  color: #fffaf2;
  display: flex;
  min-height: clamp(370px, 31vw, 470px);
  padding: clamp(58px, 5.5vw, 86px) 0;
  text-align: center;
}

.tsf-territory-experience__hero .container-fluid { align-items: center; display: flex; flex-direction: column; max-width: 1540px; width: 100%; }
.tsf-territory-experience__hero .tsf-label { color: #ffd9c7; margin-bottom: 14px; }
.tsf-territory-experience__hero h1 { color: #fffaf2; font-size: clamp(44px, 3.9vw, 64px); line-height: .92; margin: 0; max-width: min(920px, 100%); }
.tsf-territory-experience__hero h1 em { color: var(--red, #c6192e); }
.tsf-territory-experience__hero p:last-child { font-size: clamp(15px, 1.2vw, 18px); line-height: 1.55; margin: 24px 0 0; max-width: 620px; }

.tsf-territory-experience__choices { border: 0; display: flex; flex-wrap: wrap; gap: 9px 12px; margin: 2px 0 7px; padding: 0; }
.tsf-territory-experience__choices legend { display: block; font-size: 13px; font-weight: 700; margin-bottom: 10px; width: 100%; }
.tsf-territory-experience__choices label { align-items: center; cursor: pointer; display: inline-flex; gap: 7px; margin: 0; width: auto; }
.tsf-territory-experience__choices input { accent-color: var(--red, #c6192e); height: 15px; margin: 0; width: 15px; }
.tsf-territory-experience__choices span { font-size: 12px; line-height: 1.2; }

.tsf-territory-experience .tsf-understand-moment__intro-media--territory { height: clamp(190px, 14vw, 250px); max-width: none; width: 100%; }
.tsf-territory-experience .tsf-understand-moment__intro-media--territory img { height: 100%; object-position: center; }

/* Pobre de mí: the portrait follows the same text measure for a quieter,
 * centered reading rhythm; the supporting candle image remains legible in
 * the compact context panel. */
.tsf-service-landing--pobre-de-mi .tsf-story-flow__image--text-aligned {
  justify-self: start;
  max-width: 680px;
  width: 100%;
}

.tsf-service-landing--pobre-de-mi .tsf-understand-moment__intro-media--pobre-de-mi {
  height: clamp(180px, 15vw, 240px);
  max-width: none;
}

.tsf-service-landing--pobre-de-mi .tsf-understand-moment__intro-media--pobre-de-mi img {
  height: 100%;
  object-position: center 48%;
}

/* FAQ photography on balcony landings is an editorial counterpart to the
 * accordion, not a thumbnail. Give vertical selections the full left-column
 * measure so the same rule can support future enquiry landings. */
.tsf-balcony-landing .tsf-faq-intro .tsf-faq-photo,
.tsf-service-landing .tsf-faq-intro .tsf-faq-photo {
  height: clamp(380px, 30vw, 500px);
  max-width: none;
  width: 100%;
}

.tsf-balcony-landing .tsf-faq-intro .tsf-faq-photo img,
.tsf-service-landing .tsf-faq-intro .tsf-faq-photo img {
  height: 100%;
  object-position: center 52%;
  width: 100%;
}

/* The Experiences FAQ uses a deliberately horizontal balcony scene. Keep the
 * full left-column width while giving the image its natural, wider rhythm. */
.tsf-service-landing--experiencias .tsf-faq-intro .tsf-faq-photo {
  height: clamp(230px, 18vw, 310px);
}

.tsf-service-landing--experiencias .tsf-faq-intro .tsf-faq-photo img {
  object-position: center 50%;
}

/* Territory FAQs use purpose-made square photographs, so retain the full
 * composition instead of treating them as the taller editorial portraits. */
.tsf-territory-experience .tsf-faq-intro .tsf-faq-photo {
  aspect-ratio: 1;
  height: auto;
}

@media (max-width: 767px) {
  .tsf-service-landing--chupinazo .tsf-understand-moment__intro-media--chupinazo {
    height: clamp(190px, 58vw, 270px);
  }

  .tsf-understand-moment__intro-media--encierro {
    height: clamp(210px, 58vw, 285px);
  }

  .tsf-service-landing--tours .tsf-understand-moment__intro-media--tours {
    height: clamp(205px, 57vw, 270px);
  }

  .tsf-service-landing--alojamiento .tsf-understand-moment__intro-media--alojamiento {
    height: clamp(190px, 56vw, 260px);
  }

  .tsf-service-landing--feria .tsf-understand-moment__intro-media--feria {
    height: clamp(205px, 57vw, 270px);
  }

  .tsf-territory-experience__hero { min-height: 390px; padding: 72px 0 58px; }
  .tsf-territory-experience__hero h1 { font-size: clamp(40px, 11vw, 54px); }
  .tsf-territory-experience .tsf-understand-moment__intro-media--territory { height: clamp(190px, 56vw, 260px); }

  .tsf-service-landing--pobre-de-mi .tsf-understand-moment__intro-media--pobre-de-mi {
    height: clamp(180px, 55vw, 255px);
  }

  .tsf-balcony-landing .tsf-faq-intro .tsf-faq-photo,
  .tsf-service-landing .tsf-faq-intro .tsf-faq-photo {
    height: clamp(300px, 90vw, 440px);
  }

  .tsf-service-landing--experiencias .tsf-faq-intro .tsf-faq-photo {
    height: clamp(205px, 56vw, 280px);
  }

  .tsf-territory-experience .tsf-faq-intro .tsf-faq-photo {
    height: auto;
  }
}