/* ============================================================================
PELIREINAS · FASE 2 · CEREBRO CENTRAL · UI
Aditivo y aislado. No sustituye el Design System existente.
============================================================================ */

.kb-tool-hero{
  padding:22px!important;
  margin-bottom:12px!important;
  border-radius:27px!important;
  background:linear-gradient(145deg,#FFFFFF 0%,#FFFDF9 60%,#FAF5EF 100%)!important;
  border:1px solid rgba(156,125,94,.13)!important;
  box-shadow:0 12px 34px rgba(76,55,40,.045)!important;
}
.kb-tool-hero h2{
  margin:5px 0 8px!important;
  font-family:"Fraunces",Georgia,serif!important;
  font-size:clamp(25px,5vw,35px)!important;
  line-height:1.04!important;
  font-weight:350!important;
  color:#43362D!important;
}
.kb-tool-hero p{margin:0!important;max-width:720px!important;color:#756A61!important;line-height:1.65!important}

.kb-section-search{margin:0 0 13px!important}
.kb-section-search input{
  width:100%!important;
  min-height:48px!important;
  padding:0 16px!important;
  border-radius:18px!important;
  border:1px solid rgba(156,125,94,.13)!important;
  background:rgba(255,255,255,.92)!important;
  color:#45372E!important;
  outline:none!important;
}
.kb-section-search input:focus{
  border-color:rgba(156,125,94,.36)!important;
  box-shadow:0 0 0 4px rgba(156,125,94,.07)!important;
}

.kb-section-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:11px!important;
  margin-bottom:18px!important;
}
.kb-section-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  min-width:0!important;
  padding:19px!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,#FFFFFF,#FCF7F2)!important;
  border:1px solid rgba(156,125,94,.12)!important;
  box-shadow:0 10px 28px rgba(76,55,40,.045)!important;
}
.kb-section-card h3{
  margin:5px 0 8px!important;
  font-family:"Fraunces",Georgia,serif!important;
  font-size:21px!important;
  line-height:1.08!important;
  font-weight:380!important;
  color:#46382F!important;
}
.kb-section-card>p{
  margin:0 0 14px!important;
  color:#766A61!important;
  font-size:11px!important;
  line-height:1.62!important;
}
.kb-expand-button{
  margin-top:auto!important;
  min-height:38px!important;
  padding:8px 12px!important;
  font-size:9px!important;
}
.kb-section-detail{
  width:100%!important;
  margin-top:12px!important;
}
.kb-section-detail>.kb-accordion{
  margin:0!important;
}

.kb-accordion-content h4{
  margin:16px 0 7px!important;
  color:#5B4738!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.kb-accordion-content .kb-lead{font-family:"Fraunces",Georgia,serif!important;font-size:17px!important;color:#5B4738!important}
.kb-chip-row{display:flex!important;flex-wrap:wrap!important;gap:6px!important;margin:8px 0 11px!important}
.kb-chip-row span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:28px!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  background:#F5ECE4!important;
  border:1px solid rgba(156,125,94,.10)!important;
  color:#705643!important;
  font-size:9px!important;
  font-weight:700!important;
}
.kb-meta-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-bottom:12px!important}
.kb-meta-item{
  padding:10px!important;
  border-radius:14px!important;
  background:#FBF6F1!important;
  border:1px solid rgba(156,125,94,.08)!important;
}
.kb-meta-item span{display:block!important;margin-bottom:4px!important;color:#9C7D5E!important;font-size:7.5px!important;font-weight:800!important;letter-spacing:.09em!important}
.kb-meta-item strong{display:block!important;color:#4B3C31!important;font-size:10px!important;line-height:1.35!important}
.kb-safety-note{
  margin-top:13px!important;
  padding:13px 14px!important;
  border-radius:16px!important;
  background:#F8F0E9!important;
  border:1px solid rgba(156,125,94,.12)!important;
}
.kb-safety-note strong{display:block!important;margin-bottom:4px!important;color:#745741!important;font-size:9px!important;letter-spacing:.07em!important;text-transform:uppercase!important}
.kb-safety-note p{margin:0!important;color:#6E625A!important;font-size:10.5px!important;line-height:1.58!important}

.kb-empty-state{
  grid-column:1/-1!important;
  padding:22px!important;
  border-radius:24px!important;
  background:#FFFDF9!important;
  border:1px solid rgba(156,125,94,.12)!important;
  text-align:left!important;
}
.kb-empty-state h3{margin:5px 0 7px!important;font-family:"Fraunces",Georgia,serif!important;font-weight:350!important;color:#4A3A2F!important}
.kb-empty-state p{margin:0!important;color:#786B61!important}

@media(max-width:640px){
  .kb-section-list{grid-template-columns:1fr!important}
  .kb-meta-grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:430px){
  .kb-tool-hero{padding:18px!important;border-radius:23px!important}
  .kb-section-card{padding:16px!important;border-radius:21px!important}
  .kb-section-card h3{font-size:19px!important}
  .kb-meta-grid{grid-template-columns:1fr!important}
}
/* FASE 3 · corrección móvil de vistas internas Pelicaja */
.kb-category-head{padding:16px 4px 12px!important;display:block!important;width:100%!important;max-width:none!important}
.kb-category-head .page-title{font-size:clamp(36px,9vw,58px)!important;overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
.kb-category-head .page-subtitle{max-width:720px!important;font-size:12.5px!important;line-height:1.65!important;overflow-wrap:normal!important;word-break:normal!important}
.kb-section-search{display:block!important;grid-template-columns:none!important;width:100%!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.kb-section-search input{display:block!important;width:100%!important;min-width:0!important;min-height:50px!important;padding:0 16px!important;border:1px solid rgba(156,125,94,.13)!important;border-radius:18px!important;background:rgba(255,255,255,.92)!important;font-size:12px!important}
.kb-section-list{width:100%!important;min-width:0!important}
.kb-section-card,.kb-section-card *{min-width:0!important}
.kb-section-card h3,.kb-section-card>p,.kb-accordion-content{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
#view-peli-recipes,#view-peli-ingredients,#view-peli-treatments,#view-peli-guides{width:100%!important;min-width:0!important}
@media(max-width:640px){
  .kb-section-list{grid-template-columns:1fr!important}
  .kb-section-card{width:100%!important;padding:17px!important}
  .kb-section-card h3{font-size:21px!important}
  .kb-section-card>p{font-size:11.5px!important;line-height:1.65!important}
}

/* FASE 3 · Pelicaja uniforme + Pelirutina basada en conocimiento */
#view-pelicaja .pelicaja-hub-card,
#view-pelicaja .pelicaja-hub-card:nth-child(1),
#view-pelicaja .pelicaja-hub-card:nth-child(2),
#view-pelicaja .pelicaja-hub-card:nth-child(3),
#view-pelicaja .pelicaja-hub-card:nth-child(4),
#view-pelicaja .pelicaja-hub-card:nth-child(5),
#view-pelicaja .pelicaja-hub-card:nth-child(6){
  background:linear-gradient(145deg,#FFFFFF 0%,#FFFDF9 58%,#FAF6F1 100%)!important;
  border:1px solid rgba(156,125,94,.14)!important;
  box-shadow:0 11px 30px rgba(76,55,40,.052)!important;
  text-align:left!important;
}
.routine-knowledge-card[hidden]{display:none!important}
.routine-recommendation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:15px}
.routine-recommendation-item{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:15px;border-radius:19px;background:#F8F3EE;border:1px solid rgba(156,125,94,.10)}
.routine-recommendation-item>span{font-size:8px;line-height:1.25;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#9C7D5E}
.routine-recommendation-item h3{margin:6px 0 7px;font-family:"Fraunces",Georgia,serif;font-size:19px;line-height:1.08;font-weight:380;color:#46382F;word-break:normal;overflow-wrap:normal}
.routine-recommendation-item p{margin:0;color:#6F645C;font-size:10.8px;line-height:1.58}
.routine-recommendation-item small{display:block;margin-top:8px;color:#897B70;font-size:9.5px;line-height:1.55}
.routine-recipe-item .app-button{margin-top:auto;padding-top:9px;padding-bottom:9px;font-size:8.5px}
@media(max-width:700px){.routine-recommendation-grid{grid-template-columns:1fr 1fr}}
@media(max-width:430px){.routine-recommendation-grid{grid-template-columns:1fr}.routine-recommendation-item{padding:14px}}


/* FASE 3 · destacado Compartir mi momento en Inicio y Mi Cuidado */
#view-home .home-social-close{display:none!important}
.home-final-promos,.care-final-promos{width:100%!important;margin:18px 0 4px!important}
.home-final-promos .cross-promo-banner,
.care-final-promos .cross-promo-banner{
  border-radius:28px!important;
  border:1px solid rgba(156,125,94,.13)!important;
  box-shadow:0 13px 38px rgba(72,52,36,.07)!important;
}

/* Pelirutina v3 · detalle de receta personalizada */
.routine-step-detailed{align-items:start!important;background:#FFFDFC!important}
.routine-step-body{min-width:0}
.routine-step-body>strong{font-size:9px!important;letter-spacing:.11em;text-transform:uppercase;color:#9C7D5E!important}
.routine-step-body h3{margin:5px 0 11px;font-family:"Fraunces",Georgia,serif;font-size:20px;line-height:1.08;font-weight:380;color:#46382F}
.routine-step-label{margin:12px 0 4px;font-size:8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#9C7D5E}
.routine-step-meta{display:grid;grid-template-columns:72px 1fr;gap:8px;margin-top:8px;font-size:10px;line-height:1.45;color:#71665D}
.routine-step-meta b{color:#4B3E34}
.routine-open-recipe{margin-top:12px!important}
.routine-commercial-option{width:100%;margin-top:14px;padding:13px 14px;border-radius:16px;background:#F8F3EE;border:1px solid rgba(156,125,94,.10)}
.routine-commercial-option h4{margin:5px 0 1px;font-family:"Fraunces",Georgia,serif;font-size:17px;font-weight:380;color:#46382F}
.routine-commercial-option small{display:block;margin-bottom:6px;color:#8B7A6E;font-size:9px}
.routine-commercial-option p{margin-bottom:10px!important}
@media(max-width:430px){.routine-step-detailed{grid-template-columns:30px minmax(0,1fr)!important;gap:10px!important;padding:13px!important}.routine-step-number{width:30px!important;height:30px!important}.routine-step-meta{grid-template-columns:64px minmax(0,1fr)}}