/* Colores por categoría en categoria.html (pedido de Os, 2026-10-15).
   sar-category-page.js pone <html data-sar-category="categoria-sap">; aquí cada categoría fija su paleta.
   Las mismas paletas usan formulario-*.html (scripts/generar-formularios.py). */
html[data-sar-category="categoria-sap"],html[data-sar-category="sap"]{--cat-main:#0070F2;--cat-dark:#0A2E6E;--cat-accent:#F0AB00;--cat-soft:#E6F0FE;--cat-hero-1:rgba(6,30,74,.90);--cat-hero-2:rgba(0,92,200,.55);--cat-hero-3:rgba(0,112,242,.25)}
html[data-sar-category="categoria-logistica"],html[data-sar-category="logistica"]{--cat-main:#7E22B5;--cat-dark:#3B1263;--cat-accent:#D2A6F5;--cat-soft:#F2E7F8;--cat-hero-1:rgba(40,12,70,.90);--cat-hero-2:rgba(110,34,165,.55);--cat-hero-3:rgba(142,63,208,.25)}
html[data-sar-category="categoria-inocuidad"],html[data-sar-category="inocuidad"]{--cat-main:#0E8F86;--cat-dark:#0A4A45;--cat-accent:#7FE6D9;--cat-soft:#E2F6F4;--cat-hero-1:rgba(6,52,48,.90);--cat-hero-2:rgba(14,143,134,.55);--cat-hero-3:rgba(19,168,158,.25)}
html[data-sar-category="categoria-iso"],html[data-sar-category="iso"]{--cat-main:#0B4EA2;--cat-dark:#0A2A5E;--cat-accent:#8DB8F2;--cat-soft:#E7EFFA;--cat-hero-1:rgba(8,28,66,.90);--cat-hero-2:rgba(11,78,162,.55);--cat-hero-3:rgba(11,78,162,.25)}

/* Foto de cada categoría (si Arcanum no trae una propia) */
html[data-sar-category$="sap"] .sar-category-hero-media{background-image:linear-gradient(90deg,var(--cat-hero-1) 0%,var(--cat-hero-2) 43%,var(--cat-hero-3) 100%),url('../img/categories/catsap.webp')}
html[data-sar-category$="logistica"] .sar-category-hero-media{background-image:linear-gradient(90deg,var(--cat-hero-1) 0%,var(--cat-hero-2) 43%,var(--cat-hero-3) 100%),url('../img/categories/catlog.webp')}
html[data-sar-category$="inocuidad"] .sar-category-hero-media{background-image:linear-gradient(90deg,var(--cat-hero-1) 0%,var(--cat-hero-2) 43%,var(--cat-hero-3) 100%),url('../img/categories/catino.webp')}
html[data-sar-category$="iso"] .sar-category-hero-media{background-image:linear-gradient(90deg,var(--cat-hero-1) 0%,var(--cat-hero-2) 43%,var(--cat-hero-3) 100%),url('../img/categories/catiso.webp')}

html[data-sar-category] .sar-category-hero{background:var(--cat-dark,#123f70)}
html[data-sar-category] .sar-category-title-accent{color:var(--cat-accent,#7eb8f1)}
html[data-sar-category] .sar-category-summary-title{color:var(--cat-dark,#123f70)}
html[data-sar-category] .sar-category-metric strong{color:var(--cat-main,#086ee7)}
html[data-sar-category] .sar-category-eyebrow{color:var(--cat-main,#2773c9)}
html[data-sar-category] .sar-category-intro h2 strong{color:var(--cat-main,#275D90)}
html[data-sar-category] .sar-category-primary{background:var(--cat-main,#0b65c8);box-shadow:0 12px 26px rgba(0,0,0,.14)}
html[data-sar-category] .sar-category-primary:hover{background:var(--cat-dark,#21325B)}
html[data-sar-category] .sar-category-secondary{color:var(--cat-main,#275D90)!important;border-color:var(--cat-main,rgba(39,93,144,.28))}
html[data-sar-category] .sar-category-learn li:before,html[data-sar-category] .sar-category-benefit i{background:var(--cat-soft,#e1f0ff);color:var(--cat-main,#1470d4)}
html[data-sar-category] .sar-category-offer-badge,html[data-sar-category] .sar-category-course-tag{background:var(--cat-soft,#e6f1ff);color:var(--cat-main,#0b65c8)}
html[data-sar-category] .sar-category-offer-btn,html[data-sar-category] .sar-course-buy{background:linear-gradient(90deg,var(--cat-dark,#0d5bb3),var(--cat-main,#0878ed));border-color:var(--cat-main,#275D90)}
html[data-sar-category] .sar-course-outline{border-color:var(--cat-main,#275D90);color:var(--cat-main,#275D90)!important}
html[data-sar-category] .sar-course-outline:hover{background:var(--cat-soft,#eef5fb)}

/* SAP: logo arriba del título y detalle dorado */
html[data-sar-category$="sap"] .sar-category-focus:before{content:'';display:block;width:260px;height:128px;margin:0 auto;background:url('../img/sap/sap-logo.svg') center/contain no-repeat;filter:drop-shadow(0 10px 24px rgba(0,0,0,.25))}
html[data-sar-category$="sap"] .sar-category-offer{border-top:4px solid var(--cat-accent)}
html[data-sar-category$="sap"] .sar-category-summary-signoff{color:#9a6b00}
/* El logo ya dice SAP: el título queda solo para lectores de pantalla y buscadores */
html[data-sar-category$="sap"] .sar-category-focus h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:767px){html[data-sar-category$="sap"] .sar-category-focus:before{margin-left:0;width:190px;height:93px}}

/* Tarjetas de curso: descripción a 2 líneas y etiqueta chica (auditoría UI 2026-10-15). */
.sar-category-course-tag{align-self:flex-start}
.sar-category-course-card p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* En celular, los cursos van justo después del resumen y antes del texto de respaldo. */
@media (max-width:767px){
  html[data-sar-category] main{display:flex;flex-direction:column}
  html[data-sar-category] main>.sar-category-hero{order:1}
  html[data-sar-category] main>.sar-category-summary{order:2}
  html[data-sar-category] main>.sar-category-courses{order:3}
  html[data-sar-category] main>.sar-category-content{order:4}
  html[data-sar-category] main>.sar-category-benefits{order:5}
}
