/* Responsive first screen: preserve content and let secondary detail follow it. */
:root {
  --eh-hero-gap: clamp(.75rem, 2vw, 1.5rem);
}
html body:has([data-eh-hero]) [data-eh-hero] {
  box-sizing: border-box;
  min-height: 0 !important;
  height: auto !important;
  margin-block: .75rem 1.5rem !important;
  padding: clamp(1rem, 2.5vw, 2rem) !important;
  gap: var(--eh-hero-gap) !important;
  overflow: visible;
  width: min(calc(100% - 2rem), 80rem) !important;
  max-width: 80rem !important;
  margin-inline: auto !important;
}
html body:has([data-eh-hero]) [data-eh-hero] h1 {
  max-width: none !important;
  margin: 0 !important;
  font-size: clamp(1.75rem, 2.9vw, 2.75rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.03em !important;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-copy, .experience-hero) {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: .75rem;
  min-width: 0;
  order: initial !important;
  grid-column: auto !important;
  grid-row: auto !important;
}
html body:has([data-eh-hero]) [data-eh-hero] .hero-copy > *,
html body:has([data-eh-hero]) [data-eh-hero].article-hero > div:first-child > * {
  order: initial !important;
  margin-block: 0 !important;
}
html body:has([data-eh-hero]) [data-eh-hero] p {
  font-size: 1rem !important;
  line-height: 1.5 !important;
}
html body:has([data-eh-hero]) [data-eh-hero] .kicker {
  font-size: .75rem !important;
  line-height: 1.4 !important;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-actions, .product-journey) {
  display: flex !important;
  flex-wrap: wrap;
  align-items: stretch !important;
  gap: .5rem !important;
  margin-block: .75rem 0 !important;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-actions, .product-journey) > .btn {
  flex: 1 1 10rem;
  width: auto !important;
  min-width: 0;
  min-height: 44px;
  padding: .65rem .8rem !important;
  font-size: .875rem;
  line-height: 1.3;
  text-align: center;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-showcase, .article-hero-image-card) {
  align-self: center;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  padding: .5rem !important;
  display: flex !important;
  flex-direction: column;
}
html body:has([data-eh-hero]) [data-eh-hero] picture {
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  width: 100%;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-product-image, .article-hero-image, img) {
  display: block;
  width: 100% !important;
  height: min(32svh, 22rem) !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
}
html body:has([data-eh-hero]) [data-eh-hero] .article-hero-image-card > span {
  display: block;
  padding: .5rem !important;
  font-size: .8125rem !important;
  line-height: 1.3 !important;
}
html body:has([data-eh-hero]) [data-eh-hero] :is(.international-hero-copy, .international-hero-media) { order: initial !important; }
html body:has([data-eh-hero]) [data-eh-hero] .international-hero-media-label { position: static !important; }
html body:has([data-eh-hero]) [data-eh-hero] .international-hero-media-link { display: block; width: 100%; }
html body main > article > [data-eh-hero] { width: 100% !important; margin-inline: 0 !important; }
html body .product-detail-hero[data-eh-hero] {
  background: var(--eh3-paper, #fbfbf9) !important;
}
html body .product-detail-hero[data-eh-hero] .breadcrumbs {
  margin: 0 0 .75rem !important;
  font-size: .75rem;
  line-height: 1.4;
  gap: .25rem !important;
}
html body .product-detail-hero[data-eh-hero] .product-detail-grid {
  display: grid !important;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
  grid-template-areas: "image summary" "image price" "image actions";
  align-content: center;
  align-items: start;
  gap: .75rem 1.5rem !important;
}
html body .product-detail-hero[data-eh-hero] .product-buy-panel {
  display: contents !important;
}
html body .product-detail-hero[data-eh-hero] .product-decision-title {
  grid-area: summary;
  min-width: 0;
}
html body .product-detail-hero[data-eh-hero] .product-decision-title .kicker {
  margin: 0 0 .5rem !important;
}
html body .product-detail-hero[data-eh-hero] .detail-price {
  grid-area: price;
  margin: 0 !important;
  font-size: 1.6rem !important;
  line-height: 1.2;
}
html body .product-detail-hero[data-eh-hero] .product-journey {
  grid-area: actions;
  margin: 0 !important;
}
html body .product-detail-hero[data-eh-hero] .product-detail-image-panel {
  grid-area: image;
  position: relative;
  inset: auto;
  aspect-ratio: auto;
  align-self: center;
  min-width: 0;
  min-height: 0 !important;
  height: auto !important;
  padding: .5rem !important;
}
html body .product-detail-hero[data-eh-hero] .product-detail-image {
  display: block;
  width: 100% !important;
  height: min(38svh, 24rem) !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
}
html body .product-purchase-details,
html body .hero-context {
  padding: clamp(1rem, 2.5vw, 2rem);
  margin-block: 1rem 2rem !important;
  border: 1px solid var(--eh3-line, #ccd6d1);
  background: var(--eh3-white, #fff);
}
html body .product-purchase-details > * + * { margin-top: 1rem; }
html body .product-purchase-details .product-route-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
html body .hero-context .comfort-panel { min-height: 0 !important; }
html body .hero-context .eh-calc-hero-note { width: auto; }
/* Constrain the grid track itself so the table's own scrollport stays reachable. */
html body .article-content { min-width: 0; grid-template-columns: minmax(0, 1fr); }
html body .article-content > * { min-width: 0; max-width: 100%; }
html body main.not-found[data-eh-hero] {
  width: min(calc(100% - 2rem), 48rem) !important;
  margin-inline: auto !important;
}
html body main#contenido-principal.not-found[data-eh-hero] {
  display: flex;
  flex-direction: column;
  gap: .5rem !important;
  width: min(calc(100% - 2rem), 48rem) !important;
  padding: 1rem !important;
}
html body main#contenido-principal.not-found[data-eh-hero] > * { margin: 0 !important; }
html body main#contenido-principal.not-found[data-eh-hero] .not-found-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
html body main#contenido-principal.not-found[data-eh-hero] .not-found-actions a { min-height: 44px; }
html body main#contenido-principal > button.btn {
  margin-inline: max(1rem, calc((100% - 80rem) / 2));
}
/* Keep the hero's contextual actions clear while they are on screen. */
html body:has([data-eh-hero]) .sticky-mobile-cta[hidden] { display: none !important; }
html body:has([data-eh-hero]) .sticky-mobile-cta:not([data-static-visibility-bound]) { display: none !important; }
@media (max-width: 1023px) {
  html body:has([data-eh-hero]) [data-eh-hero]:is(.hero, .article-hero) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body .site-header { min-height: 3.5rem !important; padding-block: .35rem !important; }
  html body .experience-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: .375rem !important;
    min-height: 0 !important;
    padding: .3rem .75rem !important;
  }
  html body .experience-bar :is(strong, button, a) { font-size: .6875rem !important; line-height: 1.3; }
  html body .experience-bar :is(button, a) { padding: .3rem .4rem !important; white-space: nowrap; }
  html body .experience-bar small { display: none; }
  html body .breadcrumbs > span:last-child:has(strong) { display: none !important; }
  html body .breadcrumbs > strong { display: none !important; }
  html body .breadcrumbs { margin-block: .5rem !important; }
}
@media (max-width: 359px) {
  html body .experience-bar { grid-template-columns: minmax(0, 1fr) auto; }
  html body .experience-bar > a { grid-column: 1 / -1; justify-content: center; }
}
html body .product-detail-hero[data-eh-hero] .sold-out-badge {
  left: .25rem;
  right: auto;
  top: .25rem;
  max-width: calc(100% - .5rem);
  padding: .25rem .375rem !important;
  font-size: .625rem !important;
  white-space: normal;
}
html body main:has(.seo-decision-grid) > .hero[data-eh-hero] {
  padding: clamp(1rem, 2.5vw, 2rem) !important;
  gap: var(--eh-hero-gap) !important;
}
html body .product-detail-hero[data-eh-hero] .product-detail-grid { margin: 0 !important; }
html body:has([data-eh-hero]) .eh-calc-hero > div:first-child {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
html body:has([data-eh-hero]) .eh-calc-hero > div:first-child > * { margin: 0 !important; }
html body:has([data-eh-hero]) .eh-calc-hero .eh-calc-kicker { font-size: .75rem !important; line-height: 1.4 !important; }
@media (max-width: 1023px) {
  html body .experience-bar button {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 44px !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
  html body .experience-bar a { min-height: 44px; display: inline-flex; align-items: center; }
  html body main#contenido-principal > .breadcrumbs { margin-block: .375rem !important; }
}
@media (max-width: 767px) {
  html body:has([data-eh-hero]) [data-eh-hero] { margin-block: .5rem 1rem !important; padding: .875rem !important; gap: .75rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] h1 { font-size: 1.75rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-product-image, .article-hero-image, img) { height: min(18svh, 9rem) !important; }
  html body:has([data-eh-hero]) [data-eh-hero] .floating-card { position: static !important; margin-top: .5rem; }
  html body .product-detail-hero[data-eh-hero] .product-detail-grid {
    grid-template-columns: minmax(0, .38fr) minmax(0, .62fr) !important;
    grid-template-areas: "image summary" "price summary" "actions actions";
    gap: .5rem .75rem !important;
  }
  html body .product-detail-hero[data-eh-hero] h1 { font-size: 1.5rem !important; }
  html body .product-detail-hero[data-eh-hero] .product-detail-image { height: 7rem !important; }
  html body .product-detail-hero[data-eh-hero] .detail-price { font-size: 1.25rem !important; }
  html body .product-detail-hero[data-eh-hero] .product-journey > .btn { flex-basis: 100%; }
}
@media (max-height: 500px) and (min-width: 540px) {
  html body:has([data-eh-hero]) [data-eh-hero] { padding: .5rem !important; margin-block: .375rem !important; gap: .375rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] h1 { font-size: 1.25rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] p { line-height: 1.4 !important; }
  html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-copy, .experience-hero) { gap: .5rem; }
  html body:has([data-eh-hero]) [data-eh-hero]:is(.hero, .article-hero):has(img) {
    grid-template-columns: minmax(0, 1fr) minmax(6rem, .28fr) !important;
  }
  html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-product-image, .article-hero-image, .product-detail-image) { height: 6rem !important; }
  html body .product-detail-hero[data-eh-hero] .product-detail-grid {
    grid-template-columns: minmax(0, .25fr) minmax(0, .75fr) !important;
    grid-template-areas: "image summary" "price actions";
  }
  html body .product-detail-hero[data-eh-hero] .product-journey > .btn { flex-basis: 8rem; }
  html body .site-header { min-height: 3rem !important; padding-block: .125rem !important; }
  html body .site-chrome { position: relative !important; }
  html body .experience-bar { flex-wrap: nowrap !important; }
  html body main#contenido-principal .breadcrumbs,
  html body .product-detail-hero[data-eh-hero] .breadcrumbs { display: none !important; }
  html body main:has(.seo-decision-grid) > .hero[data-eh-hero] { padding: .5rem !important; gap: .375rem !important; }
  html body:has([data-eh-hero]) .product-detail-hero[data-eh-hero] .product-detail-image { height: 4rem !important; }
  html body:has([data-eh-hero]) .product-detail-hero[data-eh-hero] h1 { font-size: 1.375rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] :is(.hero-product-image, .article-hero-image, img) { height: 4rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] .article-hero-image-card { padding: .25rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] .article-hero-image-card > span { padding: .25rem !important; font-size: .75rem !important; }
}
@media (max-width: 359px) {
  html body:has([data-eh-hero]) [data-eh-hero] { gap: .5rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero] h1 { font-size: 1.5rem !important; }
  html body:has([data-eh-hero]) .article-hero[data-eh-hero] > .article-hero-image-card { display: contents !important; }
  html body:has([data-eh-hero]) .article-hero[data-eh-hero] > .article-hero-image-card > picture { grid-column: 2; grid-row: 1 / 3; }
  html body:has([data-eh-hero]) .article-hero[data-eh-hero] > .article-hero-image-card > span { grid-column: 1 / -1; }
  html body .product-detail-hero[data-eh-hero] .product-detail-grid {
    grid-template-columns: minmax(0, .4fr) minmax(0, .6fr) !important;
    grid-template-areas: "image price" "summary summary" "actions actions";
  }
  html body:has([data-eh-hero]) .product-detail-hero[data-eh-hero] h1 { font-size: 1.375rem !important; }
  html body .product-detail-hero[data-eh-hero] .product-detail-image { height: 4rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero]:is(.hero, .article-hero):has(img) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 4.5rem !important;
  }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) :is(.hero-copy, .experience-hero),
  html body:has([data-eh-hero]) .article-hero:has(img) > div:first-child {
    display: contents !important;
  }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) h1 { grid-column: 1; grid-row: 2; font-size: 1.5rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) .kicker { grid-column: 1; grid-row: 1; }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) :is(.hero-showcase, .article-hero-image-card) { grid-column: 2; grid-row: 1 / 3; align-self: start; width: 100%; }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) :is(.hero-product-image, .article-hero-image, img) { height: 4rem !important; }
  html body:has([data-eh-hero]) [data-eh-hero]:has(img) :is(p:not(.kicker), .hero-actions) { grid-column: 1 / -1; }
  html body:has([data-eh-hero]) [data-eh-hero] .experience-hint { font-size: .75rem !important; }
}

/* Focus the product decision on a short, scannable set of verified features. */
html body .product-detail-hero:has(.product-quick-summary) .product-detail-grid {
  grid-template-areas:
    "image summary"
    "image price"
    "image social"
    "image highlights"
    "image actions" !important;
}
html body .product-detail-hero .product-monthly-purchases {
  grid-area: social;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .2rem .45rem;
  width: fit-content;
  max-width: 100%;
  margin: 0 !important;
  padding: .5rem .75rem;
  border: 1px solid #f6c08e;
  border-radius: 999px;
  background: #fff4e8;
  color: #56351f;
  font-size: .95rem;
  font-weight: 650;
  line-height: 1.3;
}
html body .product-detail-hero .product-monthly-purchases strong {
  color: #b94c0e;
  font-variant-numeric: tabular-nums;
  font-size: 1.2rem;
  white-space: nowrap;
}
html body .product-detail-hero:has(.product-quick-summary) .detail-price {
  color: #245fe8;
  font-size: clamp(1.9rem, 3vw, 2.45rem) !important;
  font-weight: 800;
  line-height: 1.08;
  white-space: nowrap;
}
html body .product-detail-hero .product-quick-summary {
  grid-area: highlights;
  min-width: 0;
  margin: 0 !important;
  padding: .9rem 1rem;
  border: 1px solid var(--eh3-line, #ccd6d1);
  border-radius: 12px;
  background: var(--eh3-white, #fff);
  color: var(--eh3-ink, #26352f);
}
html body .product-detail-hero .product-quick-summary h2 {
  margin: 0 0 .45rem !important;
  color: inherit;
  font-size: .95rem !important;
  font-weight: 750;
  letter-spacing: -.015em;
  line-height: 1.3;
}
html body .product-detail-hero .product-quick-summary ul {
  display: grid;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
html body .product-detail-hero .product-quick-summary li {
  position: relative;
  display: -webkit-box;
  overflow: hidden;
  padding-left: .95rem;
  color: inherit;
  font-size: .875rem;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
html body .product-detail-hero .product-quick-summary li::before {
  position: absolute;
  top: .48em;
  left: .12rem;
  width: .36rem;
  height: .36rem;
  border-radius: 50%;
  background: var(--eh-forest, #236049);
  content: "";
}
@media (max-width: 767px) {
  html body .product-detail-hero:has(.product-quick-summary) .product-detail-grid {
    grid-template-columns: minmax(0, .38fr) minmax(0, .62fr) !important;
    grid-template-areas:
      "image summary"
      "price price"
      "social social"
      "highlights highlights"
      "actions actions" !important;
    gap: .6rem .75rem !important;
  }
  html body .product-detail-hero .product-quick-summary { padding: .8rem .9rem; }
  html body .product-detail-hero .product-monthly-purchases { font-size: .9rem; }
  html body .product-detail-hero .product-monthly-purchases strong { font-size: 1.15rem; }
  html body .product-detail-hero:has(.product-quick-summary) .detail-price { font-size: 1.85rem !important; }
}
@media (max-width: 359px) {
  html body .product-detail-hero:has(.product-quick-summary) .product-detail-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "image"
      "summary"
      "price"
      "social"
      "highlights"
      "actions" !important;
  }
  html body .product-detail-hero:has(.product-quick-summary) .product-detail-image { height: 8rem !important; }
  html body .product-detail-hero:has(.product-quick-summary) .detail-price { font-size: 1.8rem !important; }
}

html body .product-purchase-details .product-commerce-summary {
  display: grid;
  gap: .55rem;
  margin: 0;
}
html body .product-purchase-details .product-commerce-summary p {
  margin: 0;
  padding: .65rem .8rem;
  border-left: 3px solid var(--eh-gold, #e6aa00);
  border-radius: 0 8px 8px 0;
  background: #fff9e9;
  color: var(--eh3-ink, #26352f);
  line-height: 1.5;
}
html body .product-purchase-details .product-commerce-summary .product-delivery-note {
  font-size: 1.05rem !important;
  font-weight: 750;
}
html body .product-purchase-details .product-commerce-summary .product-payment-note {
  font-size: .95rem !important;
}
/* Keep consent visible until a choice is made. */
html body #eh-consent-banner {
  position: fixed !important;
  inset: auto 0 0 !important;
  width: min(calc(100% - 2rem), 80rem);
  max-height: 85svh;
  overflow-y: auto;
  margin: 0 auto !important;
  padding: 1rem 1rem max(1rem, env(safe-area-inset-bottom));
  color: #45544b;
  font-size: 1rem;
  line-height: 1.5;
  box-shadow: none;
  border: 1px solid var(--eh3-line, #ccd6d1);
}
html body.eh-consent-visible .sticky-mobile-cta { display: none !important; }

/* Inline links belong to the same text flow as the availability sentence. */
html body .availability-note {
  display: block;
  position: relative;
  padding-inline-start: 2.5rem !important;
  overflow-wrap: anywhere;
}
html body .availability-note::before {
  position: absolute;
  inset: 1.2rem auto auto 1rem;
  margin: 0;
}
html body [data-product-commercial-notes] > * + *,
html body .stock-recovery > * + * { margin-block-start: 1rem; }
html body .stock-recovery .availability-note + .btn { margin-block-start: 1rem; }
html body .product-purchase-details :is(.feature-list, .delivery-box) { margin-block: 1.25rem; }
html body .product-purchase-details .feature-list,
html body .product-detail-section .detail-card > ul {
  display: block;
  padding-inline-start: 1.5rem;
  list-style: disc outside;
}
html body .product-purchase-details .feature-list > li,
html body .product-detail-section .detail-card > ul > li {
  display: list-item;
  margin-block: .5rem;
  padding-inline-start: .25rem;
}

/* These sections have dark surfaces and need an explicit foreground. */
html body :is(.online-funding, .online-final, .online-locker-address) :is(h2, h3, p) {
  color: #fff !important;
}
html body .online-locker-address strong { color: #ffd469; }
html body main#contenido-principal #cotizar .quote-form-aside {
  background: var(--eh-forest, #0d281e) !important;
  padding: clamp(1.5rem, 3vw, 2.5rem) !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.25rem;
}
html body main#contenido-principal #cotizar .quote-form-aside :is(h2, p, li) { color: #fff !important; }
html body main#contenido-principal #cotizar .quote-form-aside .kicker { color: #ffd469 !important; }
html body .article-product-card .article-product-card-cta,
html body .article-product-card:hover .article-product-card-cta {
  background: var(--eh-forest, #0d281e);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-block-start: .75rem;
  text-decoration: none;
  white-space: normal;
}
html body .related-card .related-card-cta { font-weight: 700; margin-top: .5rem; }
html body .hero .floating-card span { color: #45544b !important; }
html body .hero .floating-card strong { color: #0d281e !important; }
html body :is(.cta-box, .online-route-card--featured) :is(h2, h3) { color: #fff !important; }
html body .checklist-result .kicker { color: #ffd469 !important; }
html body .checklist-assumptions summary { color: #0d281e !important; }
html body .download-card p { color: #45544b !important; }
html body :is(.rating-stars, .review-rating) { color: #886000 !important; }
html body .productos-count strong { color: #795700 !important; }
html body .price-badge { color: #795700 !important; }
html body .product-card .price-now {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.25;
}