/* Roentgen header — rediseño 4-oct-2026. Banda 950 (logo, buscador nativo, servicio) + fila 800 (categorías nativas, navegación, cuenta, carrito).
   Paleta oficial 50–950; el 600 (#1693A5) vive en lupa, WhatsApp, filo entre bandas e iconos sobre blanco. Todo scoped a #header. */
/* Fuentes de iconos compartidas con otras áreas (reseñas, ficha de producto, mensaje de entrega): se conservan aquí porque este CSS carga en todas las páginas. */
@font-face { font-family: 'RTG Line Awesome'; src: url('../fonts/la-solid-900.woff2') format('woff2'); font-style: normal; font-weight: 900; font-display: swap; }
@font-face { font-family: 'RTG Font Awesome Brands'; src: url('../fonts/fa-brands-400.woff2') format('woff2'); font-style: normal; font-weight: 400; font-display: swap; }
.rtg-la-solid { font-family: 'RTG Line Awesome'; font-weight: 900; font-style: normal; line-height: 1; }
.rtg-fa-brand { font-family: 'RTG Font Awesome Brands'; font-weight: 400; font-style: normal; line-height: 1; }

/* Ancho del contenido = caja interior del header (1392 − 2×24). Lo consumen hero, home, pie, reseñas y breadcrumb. */
:root { --rtg-shell-max: 1344px; --rtg-shell-gutter: 48px; --rtg-shell-width: min(calc(100% - var(--rtg-shell-gutter)), var(--rtg-shell-max)); }
@media (max-width: 991px) { :root { --rtg-shell-gutter: 32px; } }
/* Official Roentgen palette «Eastern Blue» for the whole page (header, cards, sections), not only #header (25-oct). */
:root {
  --rtg-50: #EEFDFD; --rtg-100: #D3F9FA; --rtg-200: #ACF2F5; --rtg-300: #73E7ED; --rtg-400: #33D2DD; --rtg-500: #17B6C3;
  --rtg-600: #1693A5; --rtg-700: #197585; --rtg-800: #1D5F6D; --rtg-900: #1C505D; --rtg-950: #0D343F;
  --rtg-radius: 14px; /* official corner radius (the product photos'), 12px on phones; Carlos 25-oct */
  /* Prices (25-oct research): prices in petrol 950; the crossed-out list price in neutral grey (4.8:1). Every promotion
     and discount indicator in promotion red with white type, the one colour outside the palette (Carlos 25-oct);
     #C62828 keeps white text at 5.6:1. */
  --rtg-price-sale: #c62828;
  --rtg-price-was: #6b7280;
  /* Standard vertical margins between sections (Carlos 26-oct): --rtg-section-gap (the banners → «Dental Units» logo
     gap) above a section's first element, and 1.5 times it below its last one. */
  /* Add to cart (Carlos 26-oct): the palette's brightest teal with petrol ink, reserved for that one action so it reads
     as the call to buy; it never appears on any other control. */
  --rtg-cart-action: var(--rtg-400);
  --rtg-cart-action-hover: var(--rtg-500);
  --rtg-cart-action-ink: var(--rtg-950);
  --rtg-section-gap: 72px;
  --rtg-section-end-ratio: 1.5;
  --rtg-section-gap-end: calc(var(--rtg-section-gap) * var(--rtg-section-end-ratio));
}
@media (max-width: 767px) { :root { --rtg-radius: 12px; } }
#header {
  --rtg-50: #EEFDFD; --rtg-100: #D3F9FA; --rtg-200: #ACF2F5; --rtg-300: #73E7ED; --rtg-400: #33D2DD; --rtg-500: #17B6C3;
  --rtg-600: #1693A5; --rtg-700: #197585; --rtg-800: #1D5F6D; --rtg-900: #1C505D; --rtg-950: #0D343F;
  --rtg-shell-max: 1392px; --rtg-gut: 24px;
  font-family: 'RTG Montserrat', Montserrat, Arial, sans-serif; color: #fff; line-height: 1.3;
}
#header.header { position: relative; top: auto; background: var(--rtg-950); box-shadow: none; z-index: 1025; }
#header.header:has(.offcanvas.show) { z-index: 1055; }
#header .rtg-shell { max-width: var(--rtg-shell-max); margin-inline: auto; padding: 0 var(--rtg-gut); }
#header .rtg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
#header .rtg-ic { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
#header .rtg-band-1 a, #header .rtg-band-2 a, #header .rtg-panel a { color: inherit; text-decoration: none; }
#header .rtg-band-1 ul, #header .rtg-band-2 ul, #header .rtg-panel ul { list-style: none; margin: 0; padding: 0; }
#header .rtg-band-1 p, #header .rtg-band-2 p { margin: 0; }
#header .rtg-band-1 button, #header .rtg-band-2 button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
#header .rtg-brand h1 { margin: 0; line-height: 1; font-size: inherit; }
#header :is(.rtg-band-1, .rtg-band-2) :is(a, button):focus-visible, #header .ps-mainmenu--mobile .offcanvas-header :is(a, button):focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
#header :is(.rtg-panel, .ps-mainmenu--mobile .ps-mainmenu__mobile, .ps-searchbar, .ps-searchbar__dropdown) :is(a, button):focus-visible { outline: 2px solid var(--rtg-950); outline-offset: -2px; }
#header .rtg-full { display: inline; } #header .rtg-alt { display: none; }

/* ===== Banda 1 ===== */
#header .rtg-band-1 { background: var(--rtg-950); }
#header .rtg-row1 { display: flex; align-items: center; gap: 20px; min-height: 88px; }
#header .rtg-logo { display: flex; align-items: center; flex: none; min-height: 44px; color: #fff; border-radius: 6px; }
#header .rtg-logo svg { display: block; width: 239px; height: 47px; fill: currentColor; }
#header .rtg-two { display: flex; align-items: center; gap: 8px; line-height: 1.2; white-space: nowrap; border-radius: 6px; }
#header .rtg-two .rtg-ic { width: 22px; height: 22px; color: var(--rtg-300); }
#header .rtg-two small { display: block; font-size: 12px; font-weight: 500; color: var(--rtg-100); }
#header .rtg-two b { display: flex; align-items: center; gap: 2px; font-size: 13px; font-weight: 700; }
#header .rtg-two:hover b { color: var(--rtg-300); text-decoration: underline; text-underline-offset: 3px; }
#header .rtg-services { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; }
#header .rtg-services--desktop { flex: 0 0 auto; }
#header .rtg-services--mobile { display: none; }
#header .rtg-services .rtg-service { min-width: 0; min-height: 44px; white-space: normal; }
#header .rtg-services .rtg-service > span { min-width: 0; }
#header .rtg-services .rtg-service b { display: block; line-height: 1.3; }
#header .rtg-service-city { white-space: nowrap; }

/* Buscador nativo (ps_searchbar) como pill blanca con lupa 600 */
#header .rtg-native-search-menu { flex: 1 1 360px; min-width: 0; display: flex; justify-content: center; align-items: center; }
#header .rtg-native-search-menu .ps-mainmenu--desktop, #header .rtg-native-search-menu .ps-mainmenu__mobile-toggle, #header .ps-searchbar--mobile { display: none !important; }
#header #rtg_ps_searchbar, #header #_desktop_ps_searchbar { display: flex !important; flex: 1 1 auto; width: 100%; max-width: 640px; margin: 0 !important; padding: 0; }
#header .ps-searchbar { position: relative; width: 100%; min-width: 0; margin: 0; overflow: visible; }
#header .ps-searchbar__form { position: relative; display: flex; align-items: center; height: 52px; margin: 0; background: #fff; border: 0; border-radius: 26px; box-shadow: 0 1px 2px rgba(13, 52, 63, .25); }
#header .ps-searchbar__form:focus-within { box-shadow: 0 0 0 2px var(--rtg-950), 0 0 0 4px var(--rtg-600); }
#header .ps-searchbar__input { order: 1; flex: 1 1 auto; min-width: 0; height: 100%; margin: 0; padding: 0 10px 0 22px; border: 0; background: none; box-shadow: none; font: inherit; font-size: 16px; color: var(--rtg-950); border-radius: 26px 0 0 26px; -webkit-appearance: none; appearance: none; }
#header .ps-searchbar__input:focus { outline: none; box-shadow: none; }
#header .ps-searchbar__input::placeholder { color: var(--rtg-800); opacity: 1; }
#header .ps-searchbar__clear { order: 2; position: static; flex: none; margin: 0 6px 0 0; color: var(--rtg-800); }
#header .ps-searchbar__magnifier { order: 3; position: static; transform: none; flex: none; display: grid; place-items: center; width: 58px; height: 52px; margin: 0; padding: 0; background: var(--rtg-600); color: #fff; border-radius: 0 26px 26px 0; font-size: 26px; cursor: pointer; }
#header .ps-searchbar__magnifier:hover { background: var(--rtg-700); }
#header .ps-searchbar__dropdown { position: absolute; top: calc(100% + 6px); left: 0; right: 0; width: auto; max-width: none; z-index: 1045; background: #fff; color: var(--rtg-950); border: 1px solid var(--rtg-200); border-radius: 14px; box-shadow: 0 10px 24px rgba(13, 52, 63, .18); }
#header .ps-searchbar__result-name { color: var(--rtg-950); }

#header .rtg-burger, #header .rtg-mob-acts { display: none; }

/* ===== Banda 2 ===== */
#header .rtg-band-2 { background: var(--rtg-800); border-top: 3px solid var(--rtg-600); border-bottom: 1px solid var(--rtg-700); }
#header .rtg-row2 { position: relative; display: flex; align-items: center; gap: 20px; min-height: 52px; }
#header .rtg-nav { flex: 1 1 auto; min-width: 0; display: flex; justify-content: flex-start; }
#header .rtg-nav > ul { display: flex; align-items: center; gap: 0; }
#header .rtg-nav > ul > li { position: relative; }
#header .rtg-nav > ul > li.rtg-mega { position: static; }
#header .rtg-nav > ul > li > :is(a, button) { display: inline-flex; align-items: center; gap: 4px; height: 52px; padding: 0 7px; font-size: 13px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap; color: #fff; border-radius: 6px; }
#header .rtg-nav > ul > li > :is(a, button):hover, #header .rtg-has-menu.is-open > button { color: #fff; text-decoration: underline; text-decoration-color: var(--rtg-400); text-decoration-thickness: 2px; text-underline-offset: 5px; }
#header .rtg-cats { font-weight: 700; }
#header .rtg-nav > ul > li > a.rtg-promo-link { height: 30px; margin: 0 5px; padding: 0 12px; border-radius: 15px; background: var(--rtg-300); color: var(--rtg-950); font-weight: 700; }
#header .rtg-nav > ul > li > a.rtg-promo-link:hover { background: var(--rtg-400); color: var(--rtg-950); text-decoration: none; }
#header .rtg-chev, #header .rtg-two b .rtg-ic, #header .rtg-two-tg .rtg-ic { width: 18px; height: 18px; stroke-width: 2; }
#header .rtg-cats > .rtg-ic:first-child { width: 22px; height: 22px; }

/* Desplegables (Nosotros, cuenta) */
#header .rtg-panel { display: none; position: absolute; top: 100%; left: 0; z-index: 1040; min-width: 256px; padding: 8px 0; background: #fff; color: var(--rtg-950); border: 1px solid var(--rtg-200); border-top: 0; border-radius: 0 0 12px 12px; box-shadow: 0 10px 24px rgba(13, 52, 63, .12); text-align: left; }
#header .rtg-has-menu:hover > .rtg-panel, #header .rtg-has-menu.is-open > .rtg-panel { display: block; }
#header .rtg-has-menu.is-closed > .rtg-panel { display: none; }
#header .rtg-panel--right { left: auto; right: 0; }
#header .rtg-panel > li > a { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 8px 20px; font-size: 14px; font-weight: 600; white-space: nowrap; color: var(--rtg-950); }
#header .rtg-panel > li > a .rtg-ic { width: 20px; height: 20px; color: var(--rtg-600); }
#header .rtg-panel > li > a:hover { background: var(--rtg-50); color: var(--rtg-700); }
#header .rtg-ph { margin-top: 6px; padding: 10px 20px 2px; border-top: 1px solid var(--rtg-100); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rtg-700); }

/* Mega menú: lista de categorías nativas con iconos + panel de subcategorías */
#header .rtg-mega-panel { left: 0; right: 0; width: auto; min-width: 0; padding: 0; border-radius: 0 0 14px 14px; overflow: hidden; }
#header .rtg-mega:hover > .rtg-mega-panel, #header .rtg-mega.is-open > .rtg-mega-panel { display: flex; align-items: stretch; }
#header .rtg-mega.is-closed > .rtg-mega-panel { display: none; }
#header .rtg-mega-list { flex: 0 0 300px; padding: 8px 0; border-right: 1px solid var(--rtg-100); background: #fff; }
#header .rtg-mega-item > a { display: flex; align-items: center; gap: 12px; min-height: 42px; padding: 4px 16px 4px 22px; font-size: 14px; font-weight: 600; line-height: 1.2; color: var(--rtg-950); }
#header .rtg-mega-item > a .rtg-ic { width: 22px; height: 22px; color: var(--rtg-600); }
#header .rtg-mega-item > a .rtg-chev-r { width: 16px; height: 16px; margin-left: auto; color: var(--rtg-800); transform: rotate(-90deg); }
#header .rtg-mega-item.is-active > a, #header .rtg-mega-item > a:hover { background: var(--rtg-50); color: var(--rtg-700); }
#header .rtg-mega-fly { flex: 1 1 auto; min-width: 0; padding: 22px 28px 20px; background: #fff; }
#header .rtg-mega-fly[hidden] { display: none; }
#header .rtg-mega-fly__title { display: inline-block; margin: 0 0 10px; font-size: 16px; font-weight: 800; color: var(--rtg-950); }
#header .rtg-mega-fly__title:hover { color: var(--rtg-700); text-decoration: underline; text-underline-offset: 3px; }
#header .rtg-mega-fly__links { columns: 3; column-gap: 28px; }
#header .rtg-mega-fly__links li { break-inside: avoid; }
#header .rtg-mega-fly__links a { display: block; padding: 6px 0; font-size: 13px; font-weight: 500; color: var(--rtg-800); }
#header .rtg-mega-fly__links a:hover { color: var(--rtg-700); text-decoration: underline; }
#header .rtg-mega-fly__all { display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--rtg-700); }
#header .rtg-mega-fly__all:hover { color: var(--rtg-700); text-decoration: underline; }

/* Cuenta y carrito */
#header .rtg-acts { order: 10; flex: none; display: flex; align-items: center; gap: 16px; margin-left: 28px; }
#header .rtg-acts > li { position: relative; display: flex; align-items: center; min-height: 52px; }
#header .rtg-two-tg { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-left: 2px; border-radius: 6px; color: inherit; }
#header .rtg-two-tg:hover, #header .rtg-has-menu.is-open > .rtg-two-tg { background: var(--rtg-700); }
#header .rtg-shoppingcart, #header .blockcart { display: block; }
#header .rtg-cart { display: flex; align-items: center; gap: 8px; min-height: 52px; font-size: 13px; font-weight: 700; white-space: nowrap; color: #fff; border-radius: 6px; }
#header .rtg-cart:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--rtg-400); text-underline-offset: 3px; }
#header .rtg-cart-ic { position: relative; display: block; }
#header .rtg-cart-ic .rtg-ic { width: 26px; height: 26px; }
#header .rtg-badge { position: absolute; top: -9px; left: 14px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--rtg-400); color: var(--rtg-950); font-size: 12px; font-weight: 800; line-height: 20px; text-align: center; }
#header .rtg-row2 > .rtg-place { order: 5; }

/* ===== Densidad de escritorio (992–1499) ===== */
@media (max-width: 1439px) { #header .rtg-acct > .rtg-two > .rtg-ic { display: none; } }
@media (max-width: 1199px) {
  #header .rtg-logo svg { width: 213px; height: 42px; }
  #header .rtg-acts { margin-left: 20px; }
  #header .rtg-row2 { gap: 14px; }
}
@media (max-width: 1099px) { #header .rtg-cats > .rtg-ic:first-child { display: none; } }

/* ===== Móvil y tablet (≤991): hamburguesa, buscador en fila propia, carrito con contador, fila 2 de una línea ===== */
@media (max-width: 991px) {
  #header { --rtg-gut: 16px; }
  #header .rtg-row1 { flex-wrap: wrap; gap: 0 6px; min-height: 0; padding: 6px var(--rtg-gut) 10px; }
  #header .rtg-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: -6px; border-radius: 10px; color: #fff; }
  #header .rtg-burger .rtg-ic { width: 26px; height: 26px; stroke-width: 2; }
  #header .rtg-burger:hover, #header .rtg-mob-btn:hover, #header .rtg-cart-slot--mobile .rtg-cart:hover { background: var(--rtg-800); }
  #header .rtg-logo { padding: 0 4px; }
  #header .rtg-logo svg { width: 152px; height: 30px; }
  #header .rtg-services--desktop, #header .rtg-nav, #header .rtg-acts { display: none; }
  #header .rtg-band-1 .rtg-mob-acts { display: flex; align-items: center; gap: 2px; margin-left: auto; margin-right: 6px; } /* Include the cart badge when matching the hamburger's edge inset. */
  #header .rtg-mob-btn, #header .rtg-cart-slot--mobile .rtg-cart { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-height: 0; border-radius: 10px; color: #fff; }
  #header .rtg-mob-btn .rtg-ic, #header .rtg-cart-slot--mobile .rtg-cart-ic .rtg-ic { width: 26px; height: 26px; }
  #header .rtg-cart-slot--mobile .rtg-cart-label { display: none; }
  #header .rtg-cart-slot--mobile .rtg-badge { top: -8px; left: 15px; }
  #header .rtg-native-search-menu { order: 10; flex: 1 1 100%; margin: 6px 0 0; }
  #header #rtg_ps_searchbar, #header #_desktop_ps_searchbar { max-width: none; }
  #header .ps-searchbar__form { height: 42px; border-radius: 21px; }
  #header .ps-searchbar__input { border-radius: 21px 0 0 21px; }
  #header .ps-searchbar__magnifier { width: 46px; border-radius: 0 21px 21px 0; }
  #header .rtg-row2 { min-height: 40px; justify-content: center; gap: 12px; }
  #header .rtg-services--mobile { display: flex; width: 100%; justify-content: center; padding: 0; }
  #header .rtg-services--mobile .rtg-service { gap: 8px; min-height: 40px; }
  #header .rtg-services--mobile .rtg-ic { width: 22px; height: 22px; }
  #header .rtg-services--mobile .rtg-service :is(small, b) { display: inline; font-size: 12px; }
}
@media (max-width: 479px) { #header .rtg-full { display: none; } #header .rtg-alt { display: inline; } }
@media (max-width: 359px) { #header .rtg-row1 { gap: 0; } #header .rtg-logo svg { width: 128px; height: 25px; } #header .rtg-mob-btn, #header .rtg-cart-slot--mobile .rtg-cart { width: 42px; } }

/* ===== Menú móvil nativo (#mobileMenu) con el look del drawer ===== */
#header .ps-mainmenu--mobile { --bs-offcanvas-width: min(95vw, 370px); background: #fff; color: var(--rtg-950); font-family: 'RTG Montserrat', Montserrat, Arial, sans-serif; }
#header .ps-mainmenu--mobile .offcanvas-header { min-height: 50px; padding: 0 10px 0 20px; background: #fff; }
#header .ps-mainmenu--mobile .js-back-button { color: #fff; font-weight: 600; }
#header .ps-mainmenu--mobile .btn-close { width: 44px; height: 44px; margin: 0; padding: 0; border-radius: 10px; opacity: 1; background-size: 18px; }
#header .ps-mainmenu--mobile .menu__list > li { border-bottom: 1px solid #e5e5e5; }
#header .ps-mainmenu--mobile #menu-mobile > .menu__list > li { min-height: 51px; display: flex; align-items: center; }
#header .ps-mainmenu--mobile #menu-mobile > .menu__list > li .menu__link { flex: 1 1 auto; }
#header .ps-mainmenu--mobile .menu__link { display: flex; align-items: center; gap: 8px; min-height: 53px; padding-inline: 20px; color: var(--rtg-900); font-size: 16px; font-weight: 600; text-decoration: none; }
#header .ps-mainmenu--mobile .menu__link .rtg-ic { width: 22px; height: 22px; color: var(--rtg-600); }
#header .ps-mainmenu--mobile .menu__link:is(:hover, :focus-visible) { background: var(--rtg-50); color: var(--rtg-950); }
#header .ps-mainmenu--mobile .menu__toggle-child { width: 51px; min-height: 51px; margin: 0; border: 0; color: var(--rtg-800); }
#header .ps-mainmenu--mobile .rtg-drawer-title { margin: 0 auto 0 0; font-size: 16px; font-weight: 700; text-transform: uppercase; color: var(--rtg-600); }
#header .ps-mainmenu--mobile .ps-mainmenu__additionnals { display: none; }
#header .ps-mainmenu--mobile .ps-mainmenu__mobile { padding: 0; }
/* The offcanvas is viewport-high with overflow hidden: the list scrolls itself, or the last categories are unreachable on a phone. */
#header .ps-mainmenu--mobile .ps-mainmenu__mobile { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
/* Acordeón móvil: subcategorías cerradas al entrar; abrir una no oculta el resto del menú. */
#header .rtg-menu-accordion .ps-mainmenu__back-button { display: none; }
#header .rtg-menu-accordion #menu-mobile { display: block; padding: 0; }
#header .rtg-menu-accordion #menu-mobile .menu__list > li { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; }
#header .rtg-menu-accordion #menu-mobile .menu__link { grid-column: 1; min-width: 0; padding-block: 10px; }
#header .rtg-menu-accordion #menu-mobile .menu__link:last-child { grid-column: 1 / -1; }
#header .rtg-menu-accordion .menu__link .rtg-ic { flex-shrink: 0; }
#header .rtg-menu-accordion .rtg-drawer-toggle { grid-column: 2; width: 44px; min-height: 51px; align-self: stretch; }
#header .rtg-menu-accordion .rtg-drawer-toggle[aria-expanded="true"] .material-icons { transform: rotate(90deg); }
#header .rtg-menu-accordion .rtg-drawer-children { grid-column: 1 / -1; width: 100%; margin: 0; padding: 0; list-style: none; border-top: 1px solid #e5e5e5; }
#header .rtg-menu-accordion .rtg-drawer-children[hidden] { display: none !important; }
#header .rtg-menu-accordion #menu-mobile .rtg-drawer-children .menu__link { min-height: 53px; padding-inline: 20px; font-size: 15px; font-weight: 500; color: #7a7a7a; }
#header .rtg-menu-accordion .rtg-drawer-children > li:last-child { border-bottom: 0; }

/* ===== Breadcrumb ===== */
/* One breadcrumb style on every page that shows it: account, sign-in, contact and the rest use the same
   pattern as categories and products (Carlos 25-oct). Checkout, CMS, blog and home don't render it. */
body .breadcrumb__wrapper {
  margin: 0;
  padding: 6px 0;
  background: #f8fafb;
  border-bottom: 1px solid #edf1f3;
}
body:not(#product) .breadcrumb__wrapper { margin-bottom: 24px; }
body .breadcrumb__wrapper > .container {
  width: var(--rtg-shell-width);
  max-width: var(--rtg-shell-max);
  margin-inline: auto;
  padding-inline: 0;
}
body .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  list-style: none;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .01em;
  white-space: normal;
}
body .breadcrumb-item {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 32px;
  padding: 0;
  color: var(--rtg-900);
  font-weight: 500;
  overflow-wrap: anywhere;
}
body .breadcrumb-item + .breadcrumb-item::before {
  content: '';
  float: none;
  flex: 0 0 5px;
  width: 5px;
  height: 5px;
  margin: 0 13px 0 11px;
  padding: 0;
  border: solid #9aabb2;
  border-width: 1px 1px 0 0;
  transform: rotate(45deg);
}
body .breadcrumb-link {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  color: #70818a;
  font-weight: 400;
  text-decoration: none;
  transition: color .15s ease;
}
body .breadcrumb-link:hover { color: var(--rtg-700); text-decoration: underline; text-underline-offset: 3px; }
body .breadcrumb-link:focus-visible { color: var(--rtg-700); outline: 2px solid var(--rtg-600); outline-offset: 2px; border-radius: 3px; }

/* ===== ESQUEMA DE COLOR elegido por Carlos (4-oct-2026): banda del logo 600 con logo blanco, barra de navegación 50, acentos 950. Sobrescribe la base 950/800 de arriba. ===== */
/* Variante "blanco": todo blanco con orden fuerte. Filo superior 950, logo 600, hairlines 200, buscador con borde 950 y lupa 950, textos 950, acentos 600. */
/* Nota: el CSS de variante se inyecta en <head> ANTES de header-base.css (que carga en el body), así que cada regla duplica el id (#header) para ganar por especificidad. Al pasarlo a la base basta un solo #header. */
#header { color: var(--rtg-950); }
#header.header { background: #fff; border-top: 4px solid var(--rtg-950); box-shadow: 0 1px 0 var(--rtg-200), 0 6px 16px -10px rgba(13, 52, 63, .22); }
#header :is(.rtg-band-1, .rtg-band-2) :is(a, button):focus-visible, #header .ps-mainmenu--mobile .offcanvas-header :is(a, button):focus-visible { outline-color: var(--rtg-950); }

/* Banda 1 */
#header .rtg-band-1 { background: #fff; }
/* Más aire arriba y abajo del logo sin crecerlo (23-oct): 104 de banda para 47 de logo; buscador al centro y Show Room a su derecha. */
@media (min-width: 992px) { #header .rtg-row1 { min-height: 88px; gap: 32px; } #header #rtg_ps_searchbar, #header #_desktop_ps_searchbar { max-width: 560px; } }
#header .rtg-logo { color: var(--rtg-600); }
#header .rtg-two .rtg-ic { color: var(--rtg-600); }
#header .rtg-two small { color: var(--rtg-800); }
#header .rtg-two b { color: var(--rtg-950); font-weight: 800; }
#header .rtg-two:hover b { color: var(--rtg-700); }

/* Buscador estándar (25-oct, Carlos): como en las tiendas grandes, campo blanco de 48 que se despega de la banda con una
   sombra leve y un botón de buscar explícito; a lo Roentgen, píldora como «Catálogo» y botón petróleo con la lupa blanca. */
#header .ps-searchbar__form { height: 48px; padding: 4px; background: #fff; border: 0; border-radius: 24px; box-shadow: 0 1px 2px rgba(5, 40, 48, .18), 0 6px 18px rgba(5, 40, 48, .12); transition: box-shadow .2s ease; }
#header .ps-searchbar__form:focus-within { box-shadow: 0 0 0 3px rgba(255, 255, 255, .6), 0 6px 18px rgba(5, 40, 48, .16); }
#header .ps-searchbar__input { padding: 0 12px 0 18px; color: var(--rtg-950); font-size: 15px; border-radius: 20px 0 0 20px; }
#header .ps-searchbar__input::placeholder { color: #5b7178; }
#header .ps-searchbar__magnifier { width: 56px; height: 100%; margin: 0; background: var(--rtg-950); color: #fff; font-size: 20px; border-radius: 20px; transition: background-color .2s ease; }
#header .ps-searchbar__magnifier:hover { background: var(--rtg-800); color: #fff; }
#header .ps-searchbar__magnifier:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 991px) {
  #header .ps-searchbar__form { height: 44px; padding: 3px; border-radius: 22px; }
  #header .ps-searchbar__input { padding-left: 16px; border-radius: 19px 0 0 19px; }
  #header .ps-searchbar__magnifier { width: 50px; font-size: 19px; border-radius: 19px; }
}
@media (prefers-reduced-motion: reduce) { #header :is(.ps-searchbar__form, .ps-searchbar__magnifier) { transition: none; } }

/* Banda 2: blanca, hairline 200 arriba */
#header .rtg-band-2 { background: #fff; border-top: 1px solid var(--rtg-200); border-bottom: 0; }
#header .rtg-nav > ul > li > :is(a, button) { color: var(--rtg-950); font-weight: 600; }
#header .rtg-nav > ul > li > :is(a, button):hover, #header .rtg-has-menu.is-open > button { color: var(--rtg-950); text-decoration-color: var(--rtg-600); }
#header .rtg-cats { font-weight: 800; }
#header .rtg-cats > .rtg-ic:first-child { color: var(--rtg-600); }
#header .rtg-nav > ul > li > a.rtg-promo-link { background: var(--rtg-950); color: #fff; }
#header .rtg-nav > ul > li > a.rtg-promo-link:hover { background: var(--rtg-800); color: #fff; }
/* Divisor fino tras "Todas las categorías": separa el índice de la navegación */
#header .rtg-nav > ul > li.rtg-mega { display: flex; align-items: center; }
#header .rtg-nav > ul > li.rtg-mega::after { content: ''; width: 1px; height: 24px; margin: 0 6px 0 8px; background: var(--rtg-200); }
#header .rtg-two-tg:hover, #header .rtg-has-menu.is-open > .rtg-two-tg { background: var(--rtg-50); }
#header .rtg-cart { color: var(--rtg-950); font-weight: 800; }
#header .rtg-cart:hover { color: var(--rtg-950); text-decoration-color: var(--rtg-600); }
#header .rtg-cart-ic .rtg-ic { color: var(--rtg-950); }
#header .rtg-badge { background: var(--rtg-700); color: #fff; box-shadow: 0 0 0 2px #fff; }

/* Mega menú y desplegables: hairline 200 que los separa de la barra blanca; ítem activo con filo 600 */
#header .rtg-panel { border-top: 1px solid var(--rtg-200); }
#header .rtg-mega-item.is-active > a, #header .rtg-mega-item > a:hover { box-shadow: inset 3px 0 0 var(--rtg-600); }

/* Móvil */
@media (max-width: 991px) {
  #header .rtg-burger, #header .rtg-mob-btn, #header .rtg-cart-slot--mobile .rtg-cart { color: var(--rtg-950); }
  #header .rtg-burger:hover, #header .rtg-mob-btn:hover, #header .rtg-cart-slot--mobile .rtg-cart:hover { background: var(--rtg-50); }
  #header .ps-searchbar__magnifier { height: 100%; }
}

/* Cabecera móvil de producción: título y cierre. */
#header .ps-mainmenu--mobile .offcanvas-header { background: #fff; color: var(--rtg-950); border-top: 0; border-bottom: 1px solid #e5e5e5; }
#header .ps-mainmenu--mobile .js-back-button { color: var(--rtg-950); }
#header .ps-mainmenu--mobile .btn-close { filter: none; }
#header .ps-mainmenu--mobile .btn-close:hover { background-color: var(--rtg-50); }

/* === Inversión B: toda la banda del logo en 600 con logo y textos blancos; la barra de navegación sigue blanca === */
#header.header { border-top: 0; }
#header .rtg-band-1 { background: var(--rtg-600); }
#header .rtg-logo { color: #fff; }
#header .rtg-band-1 .rtg-two .rtg-ic { color: #fff; }
#header .rtg-band-1 .rtg-two small, #header .rtg-band-1 .rtg-two b { color: #fff; }
#header .rtg-band-1 :is(.rtg-burger, .rtg-mob-btn, .rtg-cart-slot--mobile .rtg-cart) { color: #fff; }

/* === Barra de navegación en 50 (tinte claro) con texto 950 === */
#header .rtg-band-2 { background: var(--rtg-50); border-top: 0; border-bottom: 1px solid var(--rtg-200); }
/* Logo siempre blanco sobre la banda verde, también en móvil (una regla móvil del esquema blanco lo pintaba en 950). */
#header .rtg-band-1 .rtg-logo, #header .rtg-band-1 .rtg-logo:hover { color: #fff; }
/* Acento en "Todas las categorías" (pastilla 950, texto blanco); Promociones vuelve a ser un link normal de la barra. */
#header .rtg-nav > ul > li > button.rtg-cats { height: 36px; margin-right: 4px; padding: 0 14px 0 12px; border-radius: var(--rtg-radius); background: var(--rtg-950); color: #fff; }
#header .rtg-nav > ul > li > button.rtg-cats .rtg-ic { color: #fff; }
#header .rtg-nav > ul > li > button.rtg-cats:hover, #header .rtg-mega.is-open > button.rtg-cats { background: var(--rtg-800); color: #fff; text-decoration: none; }
#header .rtg-nav > ul > li > a.rtg-promo-link, #header .rtg-nav > ul > li > a.rtg-promo-link:hover { height: 52px; margin: 0; padding: 0 7px; border-radius: 6px; background: none; color: var(--rtg-950); font-weight: 600; }
#header .rtg-nav > ul > li > a.rtg-promo-link:hover { color: var(--rtg-700); text-decoration: underline; text-decoration-color: var(--rtg-600); text-decoration-thickness: 2px; text-underline-offset: 5px; }
/* "OFF!" flag on Promociones (25-oct-2026, Carlos), the production idea: a small red tag above the word with a
   corner pointing down to it. Decorative; the link text stays "Promociones". */
#header .rtg-nav > ul > li > a.rtg-promo-link { position: relative; }
#header .rtg-promo-tag { position: absolute; top: 3px; left: 50%; padding: 2px 5px 1px; border-radius: 3px 3px 3px 0; background: var(--rtg-price-sale); color: #fff; font-size: 9px; font-weight: 700; line-height: 1.2; letter-spacing: .04em; white-space: nowrap; pointer-events: none; }
#header .rtg-promo-tag::after { content: ""; position: absolute; top: 100%; left: 0; border-top: 5px solid var(--rtg-price-sale); border-right: 5px solid transparent; }

/* ===== ANCHO DEL SITIO (25-oct-2026, Carlos): un solo contenedor estándar, el nativo de Bootstrap 5 / Hummingbird
   en ≥1400px (1320px − 2×12px = 1296px de contenido); fluido debajo con 30px por lado, 16px por lado en móvil.
   Lo leen header, breadcrumb, hero, home, reseñas, pie, categoría, producto y el contenedor nativo de las demás
   páginas (carrito, checkout, CMS, cuenta). Ningún otro archivo fija un ancho de página. ===== */
:root { --rtg-shell-max: 1296px; --rtg-shell-gutter: 60px; --rtg-shell-width: min(calc(100% - var(--rtg-shell-gutter)), var(--rtg-shell-max)); }
@media (max-width: 767px) { :root { --rtg-shell-gutter: 32px; } }
#header .rtg-shell { max-width: none; width: var(--rtg-shell-width); padding-inline: 0; }
/* Native page container: its content box is the site width; it keeps Bootstrap's gutter for the rows inside. */
#wrapper .columns-container.container { width: min(100%, calc(var(--rtg-shell-width) + var(--bs-gutter-x, 1.5rem))); max-width: none; }
@media (max-width: 991px) { #header .rtg-row1 { padding-inline: 0; } }
/* Carrito oficial Roentgen (carrito con diente, img/cms/carrito-roentgen.svg) en lugar del icono genérico. 600 sobre la barra clara; blanco sobre la banda verde en móvil. */
#header .rtg-cart-oficial { display: block; width: 40px; height: 28px; fill: var(--rtg-600); }
#header .rtg-cart-slot--mobile .rtg-cart-oficial { width: 36px; height: 25px; fill: #fff; }
#header .rtg-cart-ic .rtg-badge { top: -10px; left: 32px; } /* starts right of the tooth (x 23–31 of the 40px icon), Carlos 25-oct */
#header .rtg-cart .rtg-cart-label { margin-left: 4px; } /* room for the badge's corner */
#header .rtg-cart-slot--mobile .rtg-cart-ic .rtg-badge { top: -9px; left: 23px; }
/* Contador del carrito: color sólido translúcido (tratamiento de la prueba "degradado"): 600 al 22 % con borde 600 al 45 % y número 950 (≈10:1).
   En móvil, sobre la banda verde: 950 al 40 % con número blanco (≈6:1). */
#header .rtg-badge { background: rgba(22, 147, 165, .17); color: var(--rtg-950); box-shadow: inset 0 0 0 1px rgba(22, 147, 165, .45); -webkit-backdrop-filter: blur(2.5px); backdrop-filter: blur(2.5px); font-weight: 800; } /* more see-through: the cart shows behind it (Carlos 25-oct) */
#header .rtg-cart-slot--mobile .rtg-badge { background: rgba(13, 52, 63, .4); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35); }
/* Mega menú en cuatro columnas (recuperado de la muestra Amazon): categorías con icono y subcategorías, ordenadas por columnas; pie de contacto. */
#header .rtg-mega:hover > .rtg-mega-panel, #header .rtg-mega.is-open > .rtg-mega-panel { display: block; }
#header .rtg-mega.is-closed > .rtg-mega-panel { display: none; }
#header .rtg-mega-panel { padding: 26px 32px 0; border-radius: 0 0 14px 14px; }
/* Keep the desktop panel usable on short screens (1366x657): cap it at the
   visible height under the header and let it scroll inside. */
#header .rtg-mega-panel { max-height: calc(100dvh - 156px); overflow-y: auto; overscroll-behavior: contain; }
#header .rtg-mega-cols { columns: 4; column-gap: 36px; }
#header .rtg-mega-cat { break-inside: avoid; padding-bottom: 18px; }
#header .rtg-mega-cat__title { display: flex; align-items: center; gap: 12px; min-height: 32px; font-size: 15px; font-weight: 700; color: var(--rtg-950); }
#header .rtg-mega-cat__title .rtg-ic { width: 24px; height: 24px; color: var(--rtg-600); }
#header .rtg-mega-cat__title:hover { color: var(--rtg-700); text-decoration: underline; text-underline-offset: 3px; }
#header .rtg-mega-cat__links { margin: 2px 0 0; padding: 0 0 0 36px; list-style: none; }
#header .rtg-mega-cat__links a { display: block; padding: 4px 0; font-size: 13px; font-weight: 500; color: var(--rtg-800); }
#header .rtg-mega-cat__links a:hover { color: var(--rtg-700); text-decoration: underline; }
#header .rtg-mega-cat__links a.rtg-mega-cat__all { font-weight: 700; color: var(--rtg-700); }
#header .rtg-mega-foot { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 4px 0 0; padding: 16px 0 18px; border-top: 1px solid var(--rtg-100); }
#header .rtg-mega-foot__item { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--rtg-800); }
#header .rtg-mega-foot__item .rtg-ic { width: 20px; height: 20px; color: var(--rtg-600); }
#header a.rtg-mega-foot__item:hover { color: var(--rtg-700); text-decoration: underline; }
@media (max-width: 1199px) { #header .rtg-mega-cols { columns: 3; } }
#header .rtg-mega-panel ul.rtg-mega-cat__links { padding-left: 36px; }
/* Mega menú: lo controla el JS (hover con retardo + clic fijo). El botón ocupa todo el alto de la barra y un puente invisible
   cubre el espacio entre la barra y el panel, para que el menú no se cierre al bajar el mouse. */
#header .rtg-mega:hover > .rtg-mega-panel { display: none; }
#header .rtg-mega.is-open > .rtg-mega-panel { display: block; }
#header .rtg-nav > ul > li.rtg-mega { align-self: stretch; }
#header .rtg-mega-panel::before { content: ''; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }

/* 992-1199px: the nav list is wider than its slot and "Nosotros" ran into the Show Room link (21-oct review). */
@media (min-width: 768px) and (max-width: 1199px) { #header .rtg-row2 { gap: 10px; } }
@media (min-width: 768px) and (max-width: 1099px) {
  #header .rtg-acct .rtg-two small { display: none; }
}

/* Long product names in the trail wrap instead of widening the page (339px at 320). */
body .breadcrumb-item > span { white-space: normal; }
body.page-customer-account .breadcrumb { flex-wrap: wrap; overflow-x: visible; }
body.page-customer-account .breadcrumb-item > span { white-space: normal; }

@media (max-width: 991.98px), (min-width: 992px) and (max-height: 760px) { :root { --rtg-section-gap: 56px; } }
@media (max-width: 767.98px) { :root { --rtg-section-gap: 44px; } }

/* Avisos breves del formulario de cliente, también durante el checkout. */
#customer-form .form-check:has(.rtg-legal-link) { font-size: 13px; line-height: 1.5; }
#customer-form .rtg-legal-link { display: inline-block; margin-left: 4px; padding-block: 2px; color: var(--rtg-700); font-size: 11px; font-weight: 500; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
#customer-form .rtg-legal-link:focus-visible { outline: 2px solid var(--rtg-600); outline-offset: 2px; }

/* Model references in product titles move to the next line as a complete word. */
.rtg-model-nowrap { display: inline-block; white-space: nowrap; overflow-wrap: normal; word-break: normal; hyphens: none; }

/* Delivery destination shared across browsing and the checkout. */
#header .rtg-postcode { position: relative; order: 9; flex: 0 0 auto; margin-left: auto; }
#header .rtg-postcode[hidden], #header .rtg-postcode__panel[hidden] { display: none; }
#header .rtg-postcode .rtg-postcode__toggle { display: flex; align-items: center; gap: 8px; min-height: 44px; color: var(--rtg-950); line-height: 1.2; text-align: left; white-space: nowrap; }
#header .rtg-postcode__toggle .rtg-ic { width: 22px; height: 22px; color: var(--rtg-600); }
#header .rtg-postcode__label small { display: block; font-size: 12px; font-weight: 500; color: var(--rtg-800); }
#header .rtg-postcode__label b { display: block; font-size: 13px; font-weight: 800; color: var(--rtg-950); }
#header .rtg-postcode__panel { position: absolute; z-index: 1050; top: calc(100% + 3px); right: 0; width: 290px; padding: 18px; border: 1px solid var(--rtg-200); border-radius: 12px; background: #fff; box-shadow: 0 10px 24px rgba(13,52,63,.16); color: var(--rtg-950); }
#header .rtg-postcode__panel strong { font-size: 15px; }
#header .rtg-postcode__panel p { margin: 8px 0 12px; font-size: 13px; line-height: 1.4; color: #526c74; }
#header .rtg-postcode__panel form { display: flex; gap: 8px; }
#header .rtg-postcode__panel input { min-width: 0; flex: 1; padding: 9px; border: 1px solid #a1b5ba; border-radius: 8px; font: inherit; }
#header .rtg-postcode__panel form button { padding: 8px 12px; border-radius: 8px; background: var(--rtg-600); color: #fff; font-weight: 600; }
#header .rtg-postcode__panel a { color: var(--rtg-700); text-decoration: underline; font-size: 13px; }
#header .rtg-postcode__panel .rtg-postcode__status:empty { display: none; }
@media (max-width: 991px) {
  #header .rtg-row2 { justify-content: space-between; }
  #header .rtg-services--mobile { width: auto; flex: 1; justify-content: flex-start; }
  #header .rtg-postcode { margin-left: 0; }
  #header .rtg-postcode__label small, #header .rtg-postcode__label b { font-size: 12px; }
}
@media (max-width: 359px) { #header .rtg-services--mobile .rtg-service :is(small,b) { font-size: 10px; } #header .rtg-postcode__label small, #header .rtg-postcode__label b { font-size: 11px; } }

/* Compact desktop utilities: short context above the main label, as in retail navigation. */
@media (min-width: 992px) {
  #header .rtg-acts { gap: 12px; margin-left: 16px; }
  #header .rtg-acts > li, #header .rtg-cart { min-height: 44px; }
  #header .rtg-postcode .rtg-postcode__toggle, #header .rtg-acct > .rtg-two { gap: 6px; }
  #header .rtg-postcode__toggle .rtg-ic, #header .rtg-acct > .rtg-two > .rtg-ic { width: 19px; height: 19px; }
  #header .rtg-postcode__label small, #header .rtg-acct .rtg-two small { font-size: 11px; line-height: 1.25; }
  #header .rtg-postcode__label b, #header .rtg-acct .rtg-two b { font-size: 12px; font-weight: 700; line-height: 1.25; }
  #header .rtg-acct .rtg-two small { max-width: 145px; overflow: hidden; text-overflow: ellipsis; }
  #header .rtg-two-tg { width: 24px; height: 32px; margin-left: 1px; }
  #header .rtg-two-tg .rtg-ic { width: 15px; height: 15px; }
  #header .rtg-cart-slot--desktop .rtg-cart { gap: 6px; font-size: 12px; font-weight: 700; }
  #header .rtg-cart-slot--desktop .rtg-cart-oficial { width: 32px; height: 23px; }
  #header .rtg-cart-slot--desktop .rtg-cart-ic .rtg-badge { top: -8px; left: 25px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; font-size: 10px; line-height: 17px; }
  #header .rtg-cart-slot--desktop .rtg-cart-label { margin-left: 3px; }
}