/* Solo portada: el cambio de mes no modifica el diseño global ni carga recursos remotos. */
.home-page .hero-badge { max-width: 100%; white-space: normal; line-height: 1.55; }
.monthly-focus { --monthly-accent: #6fe0c1; position: relative; width: 100%; padding: 34px; color: #eff6ff; background: linear-gradient(135deg, #123862, #092447); border: 1px solid #4e6b88; border-radius: 24px; box-shadow: 0 24px 64px rgba(0, 12, 35, .22); }
.monthly-focus--commerce { --monthly-accent: #ffcd8b; }
.monthly-focus--security { --monthly-accent: #7fd9ef; }
.monthly-focus--productivity { --monthly-accent: #b9c5ff; }
.monthly-focus--automation { --monthly-accent: #6fe0c1; }
.monthly-focus--planning { --monthly-accent: #b5e3bc; }
.monthly-focus__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding-bottom: 22px; border-bottom: 1px solid #426080; font-size: .76rem; }
.monthly-focus__top span:first-child { font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.monthly-focus__top span:last-child { padding: 5px 10px; color: #092447; background: var(--monthly-accent); border-radius: 20px; font-weight: 750; }
.monthly-focus h2 { margin: 25px 0 12px; color: #fff; font-size: clamp(1.65rem, 2.5vw, 2.2rem); line-height: 1.2; letter-spacing: -.025em; }
.monthly-focus__intro { margin: 0 0 18px; color: #c8d8e9; font-size: .95rem; line-height: 1.6; }
.monthly-focus__links { margin: 0; padding: 0; list-style: none; }
.monthly-focus__links li + li { border-top: 1px solid #426080; }
.monthly-focus__links a { display: flex; align-items: center; gap: 15px; padding: 19px 0; color: #fff; text-decoration: none; }
.monthly-focus__number { flex: 0 0 24px; color: var(--monthly-accent); font-weight: 750; font-size: .8rem; }
.monthly-focus__copy { flex: 1; min-width: 0; }
.monthly-focus__copy small { display: block; margin-bottom: 4px; color: #bad0e6; font-size: .76rem; }
.monthly-focus__copy strong { font-size: 1rem; font-weight: 750; line-height: 1.4; }
.monthly-focus__links .icon { flex: 0 0 18px; width: 18px; height: 18px; color: var(--monthly-accent); }
.monthly-focus__links a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.monthly-focus__links a:focus-visible { outline: 3px solid var(--monthly-accent); outline-offset: 4px; border-radius: 6px; }
.monthly-focus__note { margin: 18px 0 0; padding-top: 18px; border-top: 1px solid #426080; color: #c8d8e9; font-size: .76rem; line-height: 1.7; }
@media (max-width: 600px) { .monthly-focus { padding: 24px; border-radius: 18px; } .monthly-focus__links a { gap: 12px; } }