/*
 * Geometry fixes - layout geometry and spacing rhythm corrections.
 * Loaded after theme + composer styles. Scoped by body class because
 * composer block ids (tdi_*) are reused across page templates.
 */

/* Header: align logo column to the 64px master grid */
@media (min-width: 1019px) {
    body .td-header-desktop-wrap .vc_column.tdi_39 {
        padding-left: 64px !important;
    }
}

/* Home hero: restore 12-column grid (50/25/25) with uniform 48px inner gutters */
@media (min-width: 1019px) {
    body.home .tdi_200 {
        padding-right: 24px !important;
    }
    body.home .tdi_205 {
        width: 25% !important;
        padding-right: 24px !important;
    }
    body.home .tdi_208 {
        width: 25% !important;
    }
}

/* Home main section: canonical span8/span4 with 48px gutter */
@media (min-width: 1019px) {
    body.home .tdi_350 {
        width: 66.66666667% !important;
        padding-right: 24px !important;
    }
    body.home .tdi_353 {
        width: 33.33333333% !important;
    }
}

/* Story grids: remove side bleed, add real 12px gutters, equal card heights */
body.home .tdi_202 .td_block_inner,
body.home .tdi_203 .td_block_inner,
body.home .tdi_351 .td_block_inner {
    margin-left: 0 !important;
    margin-right: 0 !important;
    gap: 12px !important;
}

body.home .tdi_351 .td_block_inner {
    display: flex !important;
    flex-wrap: wrap !important;
}

@media (min-width: 768px) {
    body.home .tdi_202 .td_module_flex,
    body.home .tdi_203 .td_module_flex {
        width: calc(50% - 6px) !important;
        margin-bottom: 0 !important;
    }
}

@media (min-width: 1019px) {
    body.home .tdi_351 .td_module_flex {
        width: calc(33.33333% - 8px) !important;
        margin-bottom: 12px !important;
    }
}

body.home .tdi_202 .td-module-title a,
body.home .tdi_203 .td-module-title a,
body.home .tdi_351 .td-module-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Numbered sidebar list: 7.5px rhythm to the 4px scale */
body.home .tdi_214 .td_module_flex {
    margin-bottom: 8px !important;
}

/* Section rhythm: footer top 80 -> 60, title row gap 30 -> 60 */
@media (min-width: 768px) {
    body .td-footer-wrap .vc_row.tdi_367 {
        padding-top: 60px !important;
    }
    body.home .tdi_277 {
        padding-bottom: 30px !important;
    }
}

/* Footer: equal 25% columns, 48px gutters, content on the 64px master grid */
@media (min-width: 1019px) {
    body .td-footer-wrap .vc_column.tdi_369 {
        padding-left: 64px !important;
        padding-right: 64px !important;
    }
    body .td-footer-wrap .vc_column_inner.tdi_385 {
        width: 25% !important;
        padding-left: 24px !important;
    }
    body .td-footer-wrap .vc_column_inner.tdi_390 {
        width: 25% !important;
    }
    body .td-footer-wrap .vc_column_inner.tdi_395 {
        width: 25% !important;
    }
    body .td-footer-wrap .vc_row.tdi_401 > .vc_column {
        padding-left: 64px !important;
        padding-right: 64px !important;
    }
    body .td-footer-wrap .vc_row.tdi_401 {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

/* Single post: row padding 60 -> 40 so content lands on the 64px master grid */
@media (min-width: 768px) {
    body.single .tdi_198 {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
    /* Keep the composer's full-bleed hero image and sidebar inside the master grid */
    body.single .tdi_201 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    body.single .tdi_221 {
        margin-right: 0 !important;
    }
}

/* Tablet: stack hero and main columns, 2x2 grid section, no overflow */
@media (min-width: 768px) and (max-width: 1018px) {
    body.home .tdi_198 {
        flex-wrap: wrap !important;
    }
    body.home .tdi_198 > .vc_column,
    body.home .tdi_348 > .vc_column {
        flex: 0 0 100% !important;
        width: 100% !important;
        padding-right: 24px !important;
    }
    body.home .tdi_286 {
        flex-wrap: wrap !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    body.home .tdi_286 > .vc_column_inner {
        flex: 0 0 50% !important;
        width: 50% !important;
    }
}

/* Card title scale: unify 15/16/18px card titles to 16px, hero keeps 20px */
body.home .td_module_flex .td-module-title a {
    font-size: 16px !important;
    line-height: 1.25 !important;
}

body.home .tdi_206 .td_module_wrap:first-child .td-module-title a {
    font-size: 20px !important;
    line-height: 1.2 !important;
}

/* Meta labels: 11px with 1.0 line-height clips accents */
body .td-module-meta-info {
    line-height: 13px !important;
}

/* ===== WCAG contrast fixes (AA: 4.5:1 text, 3:1 large/non-text) =====
   Accent #e52e2e is 4.41:1 on white and 3.64:1 on navy. #d62a30 reaches
   4.97:1 on white / 3.24:1 on navy; on-navy text needs the lighter #ff5a5e. */
:root {
    --td_theme_color: #d62a30 !important;
    --accent-color-1: #d62a30 !important;
}

/* Composer blocks hardcode #e52e2e on category labels (4.41:1 on white) */
html body .td_block_wrap .td-post-category {
    color: #d62a30 !important;
}

/* Header sits on the navy canvas: date/weather were black on navy (1.3:1) */
body .td-header-desktop-wrap .tdb_header_date,
body .td-header-desktop-wrap .tdb_header_weather {
    color: #ffffff !important;
}

/* Menu active/hover red on navy: #e52e2e is 3.64:1; #ff5a5e is 5.25:1 */
body .td-header-desktop-wrap .tdb_header_menu .tdb-menu > li.current-menu-item > a,
body .td-header-desktop-wrap .tdb_header_menu .tdb-menu > li > a:hover,
body .td-header-desktop-sticky-wrap .tdb_header_menu .tdb-menu > li.current-menu-item > a,
body .td-header-desktop-sticky-wrap .tdb_header_menu .tdb-menu > li > a:hover {
    color: #ff5a5e !important;
}

/* Header buttons (Suscribirse/Buscar): white text on #d62a30 = 4.97:1 */
body .td-header-desktop-wrap .tds-button1,
body .td-header-desktop-wrap .tdb-search-form-btn {
    background-color: #d62a30 !important;
}

/* Dollar widget: red #ff3035 is 4.38:1 on white and on navy */
body .gcc-dollar-block-title {
    color: #d62a30 !important;
}

body .gcc-dollar-hero span {
    color: #ff5a5e !important;
}

body .gcc-dollar-trend.is-up strong {
    color: #d62a30 !important;
}

body .gcc-dollar-trend.is-down strong {
    color: #087a33 !important;
}

/* Visible focus indicator: #d62a30 passes 3:1 on white and on navy */
body a:focus-visible,
body button:focus-visible,
body input:focus-visible {
    outline: 2px solid #d62a30 !important;
    outline-offset: 2px;
}