/* Ajustes visuales finales: paleta estable, sin cambios de contenido de catálogo. */
:root{--selection-accent:var(--purple)}
body[data-current-view="home"]{--selection-accent:var(--purple)}
body[data-current-view="catalogo"]{--selection-accent:var(--pink)}
body[data-current-view="marcas"]{--selection-accent:var(--blue)}
body[data-current-view="thunderbaby"]{--selection-accent:#f28ac1}
body[data-current-view="thunderbike"]{--selection-accent:#78ddff}

/* Misma altura y padding: ambos mensajes caben en una sola línea. */
.announcement{display:flex;align-items:center;justify-content:center;gap:50px;background:linear-gradient(105deg,var(--lime) 0%,var(--blue) 33%,var(--purple) 66%,var(--pink) 100%);color:#000}
.announcement span{display:inline;margin:0}
.announcement-message,.announcement-shipping{white-space:nowrap}

/* Texto discreto anclado al extremo inferior derecho del encabezado. */
#favoritos .section-top{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;row-gap:10px}
#favoritos .section-top>div:first-child{grid-column:1;grid-row:1/3;min-width:0}
#favoritos .section-top>.favorites-arrows{grid-column:2;grid-row:1;align-self:end;justify-self:end;margin-bottom:0}
#favoritos .section-top>p{display:block;grid-column:2;grid-row:2;align-self:end;justify-self:end;text-align:right;max-width:320px;margin:0 0 30px}

/* Acento de Comunidad aplicado solo a la palabra existente. */
.community-editorial .community-heading h2 em{color:var(--pink)}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .community-editorial .community-heading h2 em{background:linear-gradient(100deg,var(--lime) 0%,var(--blue) 26%,var(--purple) 56%,var(--pink) 82%,var(--pink) 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
}

/* Un solo bloque compartido, sin acordeón y fuera de las vistas ocultables. */
.about-thunder.shared-brand{margin:25px 5% 0;padding:20px 0 35px}
.shared-brand h2{font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.5;letter-spacing:0;margin:0;text-transform:uppercase}
.shared-brand p{margin-bottom:0}

/* Cada destino conserva su propio acento tanto en escritorio como en móvil. */
[data-route="home"]{--nav-accent:var(--purple)}
[data-route="catalogo"]{--nav-accent:var(--pink)}
[data-route="marcas"]{--nav-accent:var(--blue)}
[data-route="thunderbaby"]{--nav-accent:#f28ac1}
[data-route="thunderbike"]{--nav-accent:#78ddff}
.site-header .desktop-nav a[data-route],.mobile-menu nav a[data-route]{transition:color 160ms ease,box-shadow 160ms ease}
.site-header .desktop-nav a[data-route].active,.mobile-menu nav a[data-route].active{color:var(--nav-accent)}
.site-header .desktop-nav a[data-route].active::after{background:var(--nav-accent)}
.mobile-menu nav a[data-route].active{box-shadow:inset 0 -2px var(--nav-accent)}
.site-header .desktop-nav a[href*="instagram.com"],.mobile-menu nav a[href*="instagram.com"]{color:var(--pink)}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .site-header .desktop-nav a[href*="instagram.com"],.mobile-menu nav a[href*="instagram.com"]{background:linear-gradient(100deg,#b78afa,var(--pink));background-clip:text;-webkit-background-clip:text;color:transparent}
}

/* Solo indicadores de selección; nunca se toca el color real de las prendas. */
#filters button.active{background:var(--selection-accent);border-color:var(--selection-accent);color:#000;box-shadow:inset 0 -2px #0005}
#brandFilters button.active,#bikeMoreOptions button.active{border-color:var(--selection-accent);color:var(--selection-accent);box-shadow:inset 0 -2px var(--selection-accent)}
#productDialog.baby-dialog{--selection-accent:#f28ac1}
body[data-current-view="thunderbike"] #productDialog:not(.baby-dialog){--selection-accent:#78ddff}
#productDialog .garment-options button.selected,#productDialog .sizes button.selected,#productDialog.baby-dialog .sizes button.selected{background:var(--selection-accent);border-color:var(--selection-accent);color:#000;box-shadow:inset 0 -2px #0005}
#productDialog .gallery-thumbs button.selected{border-color:var(--selection-accent);box-shadow:inset 0 -2px var(--selection-accent)}
#filters button,#brandFilters button,#bikeMoreOptions button,#productDialog .garment-options button,#productDialog .sizes button,#productDialog .gallery-thumbs button{transition:color 160ms ease,border-color 160ms ease,background-color 160ms ease}
.site-header [data-route]:focus-visible,.mobile-menu [data-route]:focus-visible{outline-color:var(--nav-accent)}
#filters button:focus-visible,#brandFilters button:focus-visible,#bikeMoreOptions button:focus-visible,#productDialog .garment-options button:focus-visible,#productDialog .sizes button:focus-visible{outline-color:var(--selection-accent)}
@media(hover:hover) and (pointer:fine){
 .site-header .desktop-nav a[data-route]:not(.active):hover,.mobile-menu nav a[data-route]:not(.active):hover{color:var(--nav-accent);color:color-mix(in srgb,var(--nav-accent) 75%,#eee)}
 #filters button:not(.active):hover,#brandFilters button:not(.active):hover,#bikeMoreOptions button:not(.active):hover,#productDialog .garment-options button:not(.selected):hover,#productDialog .sizes button:not(.selected):hover{color:var(--selection-accent);color:color-mix(in srgb,var(--selection-accent) 70%,#ddd);border-color:var(--selection-accent);border-color:color-mix(in srgb,var(--selection-accent) 70%,#ddd)}
}
@media(max-width:900px){.announcement{gap:16px}}
@media(max-width:600px){
 .announcement{gap:8px;letter-spacing:0}
 .announcement span{display:inline;margin:0}
 #favoritos .section-top{grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:0}
 #favoritos .section-top>div:first-child{grid-column:1/-1;grid-row:1}
 #favoritos .section-top>.favorites-arrows{grid-column:1;grid-row:2;margin-bottom:20px}
 #favoritos .section-top>p{grid-column:2;grid-row:2;max-width:100%;margin:0 0 20px;overflow-wrap:break-word}
 .about-thunder.shared-brand{margin-top:20px;padding-bottom:28px}
}
@media(prefers-reduced-motion:reduce){.site-header .desktop-nav a[data-route],.mobile-menu nav a[data-route],#filters button,#brandFilters button,#bikeMoreOptions button,#productDialog .garment-options button,#productDialog .sizes button,#productDialog .gallery-thumbs button{transition:none}}

/* Universo Thunder: fotos completas y contenido integrado, sin marcos de tarjeta. */
#familia .subbrand-grid{gap:clamp(24px,3.3vw,48px);align-items:center}
#familia .subbrand-card{min-width:0;column-gap:18px;border:0;background:#000;box-shadow:none}
#familia .subbrand-card:hover{outline:none}
#familia .subbrand-card:focus-visible{outline:2px solid var(--selection-accent);outline-offset:6px}
#familia .subbrand-copy{padding:20px 0}
@media(max-width:900px){
 #familia .subbrand-card{column-gap:14px}
 #familia .subbrand-copy{padding:16px 0}
}
@media(max-width:600px){
 #familia .subbrand-grid{gap:28px}
 #familia .subbrand-card{column-gap:16px}
}

/* Talleres y Clubes: fotografía original completa, integrada sobre negro. */
#familia:has(+ #talleres.clubs-editorial){border-bottom:0}
#talleres.clubs-editorial{position:relative;isolation:isolate;display:block;width:100%;height:clamp(720px,64vw,920px);min-height:0;margin:20px 0 12px;padding:0;border:0;overflow:hidden;background:#000}
#talleres.clubs-editorial .clubs-photo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;grid-row:auto}
#talleres.clubs-editorial::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0006 0%,#0000 32%),linear-gradient(0deg,#000 0%,#0000 8%)}
#talleres.clubs-editorial .clubs-copy{position:relative;z-index:2;width:90%;max-width:none;padding:32px 0 45px;margin-inline:auto;grid-column:auto;text-align:center}
#talleres.clubs-editorial .eyebrow{justify-content:center}
#talleres.clubs-editorial h2 br{display:none}
#talleres.clubs-editorial h2 em{display:inline-block;margin-left:.18em}
#talleres.clubs-editorial .eyebrow{color:#d4c8e4}
#talleres.clubs-editorial h2{margin:18px 0 24px;color:#fff;font-size:clamp(42px,4.5vw,65px)}
#talleres.clubs-editorial p{max-width:500px;margin:0 auto 24px;color:#e2dfe7}
#talleres.clubs-editorial .primary{width:300px;max-width:100%;min-height:52px;margin-inline:auto;background:#25b968;color:#071c10;gap:16px;transition:background-color 160ms ease}
#talleres.clubs-editorial .clubs-whatsapp-icon{width:23px;height:23px;flex-shrink:0}
#talleres.clubs-editorial .primary:focus-visible{outline-color:#b2ebcb}
@media(hover:hover) and (pointer:fine){#talleres.clubs-editorial .primary:hover{background:#48ca81}}
@media(max-width:1000px){
 #talleres.clubs-editorial{height:760px}
 #talleres.clubs-editorial .clubs-copy{width:90%;padding-top:24px}
 #talleres.clubs-editorial::after{background:linear-gradient(180deg,#000c 0%,#0006 24%,#0000 43%),linear-gradient(0deg,#000 0%,#0000 8%)}
}
@media(max-width:600px){
 #talleres.clubs-editorial{height:clamp(650px,158vw,790px);margin:12px 0 0}
 #talleres.clubs-editorial .clubs-photo{object-position:center bottom}
 #talleres.clubs-editorial .clubs-copy{width:90%;max-width:none;padding:24px 0 0;margin-inline:5%;text-align:left}
 #talleres.clubs-editorial .eyebrow{justify-content:flex-start}
 #talleres.clubs-editorial h2 br{display:revert}
 #talleres.clubs-editorial h2 em{margin-left:0}
 #talleres.clubs-editorial h2{font-size:42px;line-height:.98;margin:14px 0}
 #talleres.clubs-editorial p{max-width:320px;font-size:12px;line-height:1.65;margin:0 0 18px}
 #talleres.clubs-editorial .primary{width:285px;min-height:48px;margin-left:0;padding:14px 18px}
 #talleres.clubs-editorial::after{background:linear-gradient(180deg,#000a 0%,#0003 29%,#0000 43%),linear-gradient(0deg,#000 0%,#0000 7%)}
}
@media(prefers-reduced-motion:reduce){#talleres.clubs-editorial .primary{transition:none}}

/* Encuadre panorámico exclusivo de escritorio; móvil y tablet conservan su composición. */
@media(min-width:1001px){
 #talleres.clubs-editorial{width:90%;max-width:1600px;height:65vh;min-height:640px;max-height:760px;margin:20px auto 12px}
 #talleres.clubs-editorial .clubs-photo{object-fit:cover;object-position:50% 47%}
 #talleres.clubs-editorial .clubs-copy{width:90%;max-width:850px;margin-left:5%;margin-right:0;padding:32px 0 30px;text-align:left}
 #talleres.clubs-editorial .eyebrow{justify-content:flex-start}
 #talleres.clubs-editorial h2{font-size:clamp(42px,4vw,58px);margin:14px 0}
 #talleres.clubs-editorial p{margin:0 0 18px}
 #talleres.clubs-editorial .primary{margin-left:0;padding:15px 22px}
 #talleres.clubs-editorial::after{background:linear-gradient(135deg,#000d 0%,#0008 28%,#0000 65%),linear-gradient(0deg,#000a 0%,#0000 15%)}
}