/* ===== Kinedu Blog Brand 2026 — hoja compartida ===== */
@font-face { font-family:'Proxima Nova'; src:url('/fonts/proxima-nova/proximanova-regular-webfont.woff2') format('woff2'); font-weight:100 500; font-style:normal; font-display:swap; }
@font-face { font-family:'Proxima Nova'; src:url('/fonts/proxima-nova/proximanova-bold-webfont.woff2') format('woff2'); font-weight:600 900; font-style:normal; font-display:swap; }

:root {
  --font: 'Proxima Nova', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --bg: #FBFAF8;
  --blue-tint: #F3F1EC;
}
body { background: #FBFAF8; }

/* --- chip de categoría del artículo --- */
.kb-art-cat {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--kcat-soft, #EAF4FD); color: var(--kcat-dark, #1E6FBD) !important;
  padding: 6px 14px; border-radius: 999px;
}
.kb-art-cat::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--kcat, #2B8BE4); }

/* --- acentos del cuerpo del artículo --- */
.kb-art-body h2 { position: relative; padding-left: 18px; }
.kb-art-body h2::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 5px; border-radius: 4px;
  background: linear-gradient(180deg, var(--kcat, #2B8BE4), var(--kcat-soft, #EAF4FD)); }
.kb-art-body ol li::marker { color: var(--kcat, #2B8BE4); font-weight: 700; }
body .kb-art-body ul li::before { background: var(--kcat, #34C989); }
body blockquote { border-left-color: var(--kcat, #2B8BE4); }

/* --- tarjetas: acento superior por categoría (hubs con data-cat) --- */
.kb-card { border-top: 3px solid var(--kcat, transparent); }
.kb-card[data-cat="physical"] { border-top-color: #32AFE0; }
.kb-card[data-cat="physical"] .kb-card-cat-chip { background: #E3F4FB; color: #1273A0; }
.kb-card[data-cat="exercise"] { border-top-color: #32AFE0; }
.kb-card[data-cat="exercise"] .kb-card-cat-chip { background: #E3F4FB; color: #1273A0; }
.kb-card[data-cat="linguistic"] { border-top-color: #F99848; }
.kb-card[data-cat="linguistic"] .kb-card-cat-chip { background: #FDEBD8; color: #B4610E; }
.kb-card[data-cat="socialandemotional"] { border-top-color: #D1296D; }
.kb-card[data-cat="socialandemotional"] .kb-card-cat-chip { background: #FBE3ED; color: #D1296D; }
.kb-card[data-cat="cognitive"] { border-top-color: #3EB646; }
.kb-card[data-cat="cognitive"] .kb-card-cat-chip { background: #E4F6E7; color: #23803A; }
.kb-card[data-cat="stimulation"] { border-top-color: #3EB646; }
.kb-card[data-cat="stimulation"] .kb-card-cat-chip { background: #E4F6E7; color: #23803A; }
.kb-card[data-cat="health-guide"] { border-top-color: #EC4D4D; }
.kb-card[data-cat="health-guide"] .kb-card-cat-chip { background: #FDE7E7; color: #C22F2F; }
.kb-card[data-cat="health"] { border-top-color: #EC4D4D; }
.kb-card[data-cat="health"] .kb-card-cat-chip { background: #FDE7E7; color: #C22F2F; }
.kb-card[data-cat="well-being"] { border-top-color: #EC4D4D; }
.kb-card[data-cat="well-being"] .kb-card-cat-chip { background: #FDE7E7; color: #C22F2F; }
.kb-card[data-cat="healthyhabits"] { border-top-color: #EC4D4D; }
.kb-card[data-cat="healthyhabits"] .kb-card-cat-chip { background: #FDE7E7; color: #C22F2F; }
.kb-card[data-cat="sleep"] { border-top-color: #0E3687; }
.kb-card[data-cat="sleep"] .kb-card-cat-chip { background: #E7ECF8; color: #0E3687; }
.kb-card[data-cat="breastfeeding"] { border-top-color: #913FA3; }
.kb-card[data-cat="breastfeeding"] .kb-card-cat-chip { background: #F3E8F8; color: #6E2F7C; }
.kb-card[data-cat="bottlefeeding"] { border-top-color: #913FA3; }
.kb-card[data-cat="bottlefeeding"] .kb-card-cat-chip { background: #F3E8F8; color: #6E2F7C; }
.kb-card[data-cat="solid-foods"] { border-top-color: #913FA3; }
.kb-card[data-cat="solid-foods"] .kb-card-cat-chip { background: #F3E8F8; color: #6E2F7C; }
.kb-card[data-cat="nutrition"] { border-top-color: #913FA3; }
.kb-card[data-cat="nutrition"] .kb-card-cat-chip { background: #F3E8F8; color: #6E2F7C; }
.kb-card[data-cat="feeding"] { border-top-color: #913FA3; }
.kb-card[data-cat="feeding"] .kb-card-cat-chip { background: #F3E8F8; color: #6E2F7C; }
.kb-card[data-cat="safety"] { border-top-color: #E57339; }
.kb-card[data-cat="safety"] .kb-card-cat-chip { background: #FBEADF; color: #B4531F; }
.kb-card[data-cat="diapers"] { border-top-color: #E57339; }
.kb-card[data-cat="diapers"] .kb-card-cat-chip { background: #FBEADF; color: #B4531F; }
.kb-card[data-cat="pottytraining"] { border-top-color: #E57339; }
.kb-card[data-cat="pottytraining"] .kb-card-cat-chip { background: #FBEADF; color: #B4531F; }
.kb-card[data-cat="health-pregnancy"] { border-top-color: #E37EA7; }
.kb-card[data-cat="health-pregnancy"] .kb-card-cat-chip { background: #FBEAF1; color: #C4527F; }
.kb-card[data-cat="general-pregnancy"] { border-top-color: #E37EA7; }
.kb-card[data-cat="general-pregnancy"] .kb-card-cat-chip { background: #FBEAF1; color: #C4527F; }
.kb-card[data-cat="prenatal"] { border-top-color: #E37EA7; }
.kb-card[data-cat="prenatal"] .kb-card-cat-chip { background: #FBEAF1; color: #C4527F; }

/* --- páginas de categoría: hero tintado con su color --- */
.hero { background: linear-gradient(180deg, var(--kcat-soft, #F5F4F0) 0%, #FBFAF8 100%); border-bottom-color: #EBE6DF; }
.hero .count, .count { background: var(--kcat-soft, #EAF4FD); color: var(--kcat-dark, #1E6FBD); }
.hero h1 { position: relative; display: inline-block; }
.hero h1::after { content: ""; position: absolute; left: 2px; right: -6px; bottom: 4px; height: 14px;
  background: var(--kcat, #2B8BE4); opacity: .28; border-radius: 8px; z-index: -1; }

/* --- calculadora gestacional: paleta "no born yet" --- */
.kbcalc { background: linear-gradient(135deg, #FDF0F5 0%, #F6EEFA 55%, #EDF8FD 100%) !important; border-color: #F3D3E1 !important; }
.kbcalc-eyebrow { background: #FBE3ED !important; color: #D1296D !important; }
.kbcalc-field input:focus { outline-color: #D1296D !important; border-color: #D1296D !important; }
.kbcalc-btn { background: #D1296D !important; }
.kbcalc-btn:hover { background: #B02360 !important; }
.kbcalc-bar { background: #FBE3ED !important; }
.kbcalc-bar-fill { background: linear-gradient(90deg, #E37EA7, #BC8BC7, #84CFEC) !important; }
.kbcalc-res em { color: #D1296D !important; }
.kbcalc-out { border-color: #F3D3E1 !important; }
.kbcalc-links a { color: #D1296D; }

/* --- hubs del blog: hero con firma + chips trending de colores --- */
.kb-hero-b { background: linear-gradient(180deg, #F5F4F0 0%, #FBFAF8 100%) !important; }
.kb-hero-b-title em { position: relative; display: inline-block; padding-bottom: .06em; }
.kb-hero-b-title em::after { content: ""; position: absolute; left: 1%; right: 3%; bottom: -6px; height: 13px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 14' preserveAspectRatio='none'%3E%3Cpath d='M4 10 Q 40 2, 75 8 T 150 8 T 225 8 T 296 6' fill='none' stroke='%23FFBD15' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.kb-trend-chip { border: 1.5px solid transparent; font-weight: 700; }
.kb-trend-chip:nth-of-type(5n+1) { background: #E7ECF8; color: #0E3687; }
.kb-trend-chip:nth-of-type(5n+2) { background: #F3E8F8; color: #6E2F7C; }
.kb-trend-chip:nth-of-type(5n+3) { background: #FDEBD8; color: #B4610E; }
.kb-trend-chip:nth-of-type(5n+4) { background: #FBE3ED; color: #D1296D; }
.kb-trend-chip:nth-of-type(5n+5) { background: #E4F6E7; color: #23803A; }

/* --- hubs: etapas estilo pastel + emoji (pilot look) --- */
.kb-stage { aspect-ratio: auto; min-height: 225px; align-items: center; justify-content: center; text-align: center; padding: 26px 14px 22px; overflow: visible; }
.kb-stage img.bg { display: none; }
.kb-stage::after { content: none; }
.kb-stage::before { content: ""; width: 66px; height: 66px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 30px; box-shadow: 0 3px 10px rgba(8,27,70,.10); margin-bottom: 14px; position: static; inset: auto; }
.kb-stage:nth-child(1) { background: #FBEAF1; }
.kb-stage:nth-child(1)::before { content: "🤰"; }
.kb-stage:nth-child(1) .age-range { color: #A23C67; }
.kb-stage:nth-child(2) { background: #E3F4FB; }
.kb-stage:nth-child(2)::before { content: "👶"; }
.kb-stage:nth-child(2) .age-range { color: #0E5C80; }
.kb-stage:nth-child(3) { background: #FFF3D6; }
.kb-stage:nth-child(3)::before { content: "🍼"; }
.kb-stage:nth-child(3) .age-range { color: #7C5A05; }
.kb-stage:nth-child(4) { background: #E4F6E7; }
.kb-stage:nth-child(4)::before { content: "🧸"; }
.kb-stage:nth-child(4) .age-range { color: #1B6A2F; }
.kb-stage:nth-child(5) { background: #F3E8F8; }
.kb-stage:nth-child(5)::before { content: "🎨"; }
.kb-stage:nth-child(5) .age-range { color: #6E2F7C; }
.kb-stage > * { color: #0E1B2C; }
.kb-stage h4 { color: #0E1B2C; font-size: 19px; }
.kb-stage .age-range { opacity: 1; font-size: 11px; letter-spacing: .07em; margin-bottom: 3px; }
.kb-stage .count { color: #5E6C80; opacity: 1; background: none; }
.kb-stage:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(8,27,70,.12); }

/* --- category pages: chips y hero playful con el color del tema --- */
.kb-card-cat-chip { background: var(--kcat-soft, #fff); color: var(--kcat-dark, inherit); }
.hero { position: relative; overflow: hidden; }
.hero > * { position: relative; z-index: 1; }
.hero::before { content: ""; position: absolute; right: -70px; top: -90px; width: 300px; height: 300px; border-radius: 50%; background: var(--kcat, #2B8BE4); opacity: .13; z-index: 0; }
.hero::after { content: ""; position: absolute; right: 190px; top: 110px; width: 70px; height: 70px; border-radius: 50%; background: var(--kcat-dark, #1E6FBD); opacity: .12; z-index: 0; }
.hero-back { background: var(--kcat-soft, #EAF4FD) !important; color: var(--kcat-dark, #1E6FBD) !important; }
.crumb a { color: var(--kcat-dark, #1E6FBD) !important; }

/* --- editores polish: tarjetas destacadas --- */
.kb-card-over { border-radius: 22px; overflow: hidden; transition: transform .18s, box-shadow .18s; }
.kb-card-over:hover { transform: translateY(-4px) rotate(-.3deg); box-shadow: 0 16px 34px rgba(8,27,70,.16); }
.kb-card-over::after { background: linear-gradient(180deg, rgba(8,27,70,0) 30%, rgba(8,27,70,.88) 100%) !important; }
.kb-card-over h3 { font-size: 19px; letter-spacing: -.02em; line-height: 1.25; }
.kb-card-over .meta { opacity: .85; font-size: 12.5px; }

/* --- app CTA del artículo: navy premium con acentos de marca (adiós gradiente azul-verde) --- */
.kb-app-cta { background: #081B46 !important; position: relative; overflow: hidden; }
.kb-app-cta::before { content: ""; position: absolute; width: 320px; height: 320px; border-radius: 50%; background: #087BF3; opacity: .18; top: -120px; right: -80px; }
.kb-app-cta::after { content: ""; position: absolute; width: 140px; height: 140px; border-radius: 50%; background: #F7567C; opacity: .14; bottom: -50px; left: 30%; }
.kb-app-cta > * { position: relative; z-index: 1; }
.kb-app-cta-tag { background: rgba(255,255,255,.12) !important; border-radius: 999px; padding: 6px 14px !important; }
.kb-app-cta-stat { background: rgba(255,255,255,.07) !important; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 18px !important; backdrop-filter: none !important; }
.kb-app-cta-stat:nth-child(1) strong, .kb-app-cta-stat:nth-child(1) .num { color: #84CFEC !important; }
.kb-app-cta-stat:nth-child(2) strong, .kb-app-cta-stat:nth-child(2) .num { color: #8AD28F !important; }
.kb-app-cta-stat:nth-child(3) strong, .kb-app-cta-stat:nth-child(3) .num { color: #FBC08F !important; }
.kb-app-cta-stat:nth-child(4) strong, .kb-app-cta-stat:nth-child(4) .num { color: #E37EA7 !important; }

/* --- artículos relacionados: tarjetas al sistema (color de la categoría de la página) --- */
.kb-grid-3 .kb-card { border-radius: 22px; overflow: hidden; border: 1px solid #EBE6DF; background: #fff; transition: transform .18s, box-shadow .18s; }
.kb-grid-3 .kb-card:hover { transform: translateY(-4px) rotate(-.3deg); box-shadow: 0 16px 34px rgba(8,27,70,.14); }
.kb-grid-3 .kb-card .kb-card-img img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
.kb-grid-3 .kb-card .kb-card-excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.kb-grid-3 .kb-card:hover .kb-card-title { color: var(--kcat-dark, #1E6FBD); }

/* --- hub: aire antes del footer + fade de destacados --- */
section:has(.kb-card-over) { padding-bottom: 110px !important; }
.kb-card-over { transition: opacity .45s ease; }
.kb-card-over.kbfade { opacity: 0; }

/* --- search-wrap fix: el panel de resultados anclado al buscador (paridad EN/ES/PT) --- */
.kb-search-wrap { position: relative; max-width: 660px; margin: 0 auto; }
.kb-search-panel { max-height: 440px; overflow-y: auto; box-shadow: 0 18px 44px rgba(8,27,70,.16); }
.kb-sp-item:hover { background: #F5F4F0; }
