/* CLT Finanças — estilos complementares do blog (não sobrescreve o CSS
   compilado do tema base; só adiciona o que os novos componentes precisam). */

/* Remove o destaque de toque padrão do Safari/Chrome mobile em inputs,
   botões e links — em elementos com border-radius grande (pills) esse
   destaque nativo aparece como uma caixa retangular grande e "quebrada"
   por cima do elemento ao tocar. */
a, button, input, .wp-block-search__button, .wp-block-button__link {
    -webkit-tap-highlight-color: transparent;
}

/* ===================================================================
   HEADER — construído do zero, com classes próprias (clt-header__*),
   sem depender de nenhuma classe/regra do tema original (é por isso
   que nada do CSS/JS deles — incluindo o header sticky — pode
   interferir aqui). Mobile-first: as regras abaixo já valem pro
   celular; a media query no fim só ajusta pro desktop.
   =================================================================== */
.clt-header {
    width: 100%;
}
.clt-header__top {
    padding: 18px 0;
    align-items: center;
    row-gap: 12px;
}
.clt-header__logo img {
    width: 130px;
    height: auto;
    display: block;
}
.clt-header__nav .wp-block-navigation__responsive-container-open {
    color: #fff;
}
.clt-header__search-row {
    padding-bottom: 18px;
}
.clt-header__search.wp-block-search {
    width: 100%;
}
.clt-header__search .wp-block-search__inside-wrapper {
    width: 100%;
    max-width: 100%;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.25);
    box-sizing: border-box;
}
.clt-header__search input.wp-block-search__input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    background: transparent;
    color: #fff;
}
.clt-header__search input.wp-block-search__input::placeholder {
    color: rgba(255,255,255,.6);
}
.clt-header__search .wp-block-search__button {
    background: var(--wp--preset--color--primary);
    flex-shrink: 0;
}

@media (min-width: 783px) {
    .clt-header__top {
        flex-wrap: nowrap;
        padding: 26px 0;
    }
    .clt-header__logo img {
        width: 170px;
    }
    .clt-header__search-row {
        padding-bottom: 26px;
    }
    .clt-header__search.wp-block-search {
        max-width: 420px;
        margin: 0 auto;
    }
}

/* ===================================================================
   FOOTER — mesma lógica: classes próprias (clt-footer__*), mobile-first.
   =================================================================== */
.clt-footer__grid {
    row-gap: 40px;
    column-gap: 32px;
}
.clt-footer__col {
    flex: 1 1 220px;
    min-width: 0;
}
.clt-footer__col--about {
    flex-basis: 100%;
}
.clt-footer__logo img {
    width: 140px;
    height: auto;
    display: block;
}
.clt-footer__text {
    opacity: .85;
    margin-top: 12px;
}
.clt-footer__social {
    margin-top: 16px;
}
.clt-footer__heading {
    margin-bottom: 14px;
}
.clt-footer__nav {
    row-gap: 10px !important;
}
.clt-footer__categories ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.clt-footer__newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}
.clt-footer__newsletter-form input[type="email"] {
    height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.25);
    background: rgba(255,255,255,.06);
    color: #fff;
    box-sizing: border-box;
    appearance: none;
    -webkit-appearance: none;
}
.clt-footer__newsletter-form input[type="email"]::placeholder {
    color: rgba(255,255,255,.6);
}
.clt-footer__newsletter-form button {
    height: 44px;
    border-radius: 999px;
    border: none;
    background: var(--wp--preset--color--primary);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}
.clt-footer__separator {
    margin-top: 48px;
    opacity: .15;
}
.clt-footer__bottom {
    padding-top: 20px;
    row-gap: 8px;
    opacity: .8;
}
.clt-footer__copy,
.clt-footer__disclaimer {
    margin: 0;
}

@media (min-width: 783px) {
    .clt-footer__col--about {
        flex-basis: 280px;
    }
    .clt-footer__bottom {
        justify-content: space-between;
    }
}

/* ===================================================================
   BANNER DE COOKIES — <div> solto injetado via wp_footer (PHP), fora de
   qualquer bloco/template. position:fixed simples, sem depender de
   nenhum layout flex/grid do resto do site.
   =================================================================== */
.clt-cookie-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 20px;
    background: #0B1220;
    color: #fff;
    box-shadow: 0 -8px 24px rgba(0,0,0,.25);
    box-sizing: border-box;
    font-size: 14px;
    line-height: 1.5;
    transition: opacity .25s ease, transform .25s ease;
}
.clt-cookie-banner.is-dismissed {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
}
.clt-cookie-banner__text {
    margin: 0;
}
.clt-cookie-banner__text a {
    color: var(--wp--preset--color--primary);
    text-decoration: underline;
}
.clt-cookie-banner__actions {
    display: flex;
    gap: 10px;
}
.clt-cookie-banner__btn {
    flex: 1 1 auto;
    height: 42px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.25);
    background: transparent;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.clt-cookie-banner__btn--accept {
    background: var(--wp--preset--color--primary);
    border-color: var(--wp--preset--color--primary);
}

@media (min-width: 783px) {
    .clt-cookie-banner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 18px 32px;
    }
    .clt-cookie-banner__text {
        max-width: 720px;
    }
    .clt-cookie-banner__actions {
        flex-shrink: 0;
    }
    .clt-cookie-banner__btn {
        flex: 0 0 auto;
    }
}

.clt-breadcrumbs-nav,
.clt-breadcrumbs {
    color: #6b7280;
}
.clt-breadcrumbs-nav a {
    color: #6b7280;
    text-decoration: none;
}
.clt-breadcrumbs-nav a:hover {
    color: var(--wp--preset--color--primary);
}
.clt-breadcrumbs-sep {
    opacity: .5;
    margin: 0 2px;
}

.clt-category-badge .wp-block-post-terms__separator {
    display: none;
}
.clt-category-badge a,
p.clt-category-badge {
    display: inline-block;
    background: color-mix(in srgb, var(--wp--preset--color--primary) 12%, transparent);
    color: var(--wp--preset--color--primary) !important;
    padding: 4px 12px;
    border-radius: 999px;
    font-weight: 600;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: .02em;
    margin-bottom: 12px;
}

.clt-post-meta,
.clt-card-meta {
    color: #6b7280;
    align-items: center;
}
.clt-post-meta > *,
.clt-card-meta > * {
    color: #6b7280;
}
.clt-reading-time,
.clt-reading-time-value {
    color: #6b7280;
}

/* Grid de cards de posts */
.clt-post-card__inner {
    height: 100%;
    padding: 18px 18px 24px;
    box-shadow: 0 1px 2px rgba(17,17,17,.06), 0 8px 20px rgba(17,17,17,.05);
    transition: transform .18s ease, box-shadow .18s ease;
}
.clt-post-card__inner:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(17,17,17,.10);
}
.clt-post-card__inner img {
    border-radius: 12px;
    width: 100%;
    height: auto;
    display: block;
}
.clt-post-card__inner h2 a {
    text-decoration: none;
}
.clt-post-card__inner h2 a:hover {
    color: var(--wp--preset--color--primary);
}

@media (max-width: 782px) {
    .clt-blog-grid.wp-block-post-template {
        grid-template-columns: 1fr !important;
    }
}

/* Caixa de autor */
.clt-author-box .wp-block-post-author-biography {
    margin: 0;
}

/* Posts relacionados */
.clt-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 16px;
}
.clt-related-card {
    display: block;
    text-decoration: none;
    color: inherit;
}
.clt-related-card__thumb {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 8px;
}
.clt-related-card__thumb img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
}
.clt-related-card__title {
    font-weight: 600;
}
.clt-related-card:hover .clt-related-card__title {
    color: var(--wp--preset--color--primary);
}
@media (max-width: 782px) {
    .clt-related-grid {
        grid-template-columns: 1fr;
    }
}

/* Formulário de newsletter (footer + faixa da home) */
.clt-newsletter-form {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.clt-newsletter-form input[type="email"] {
    flex: 1 1 180px;
    min-width: 0;
    box-sizing: border-box;
    height: 44px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.25);
    background: rgba(255,255,255,.06);
    color: #fff;
    appearance: none;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
}
.clt-newsletter-form input[type="email"]::placeholder {
    color: rgba(255,255,255,.6);
}
.clt-newsletter-form button {
    height: 44px;
    padding: 0 20px;
    box-sizing: border-box;
    border-radius: 999px;
    border: none;
    background: var(--wp--preset--color--primary);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
}
.clt-newsletter-form button:hover {
    filter: brightness(1.08);
}
.clt-newsletter-band .clt-newsletter-form input[type="email"] {
    color: #12161C;
    background: #fff;
    border: 1px solid #d8dbe0;
}
.clt-newsletter-band .clt-newsletter-form input[type="email"]::placeholder {
    color: #6b7280;
}
.clt-newsletter-form--centered {
    justify-content: center;
}

/* Hero */
.clt-eyebrow {
    text-align: center;
    letter-spacing: .08em;
    font-weight: 700;
}

/* Anúncios / códigos customizados (posições estilo SmartMag) */
.clt-ad-wrap {
    margin: 20px auto;
    text-align: center;
    overflow: hidden;
}
.clt-ad-wrap--bg {
    padding: 16px;
    border-radius: 8px;
}
.clt-ad-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #9aa1ab;
    margin-bottom: 8px;
}
.clt-ad-show-md,
.clt-ad-show-sm,
.clt-ad-show-lg {
    display: none;
}
@media (min-width: 961px) {
    .clt-ad-show-lg { display: block; }
}
@media (min-width: 601px) and (max-width: 960px) {
    .clt-ad-show-md { display: block; }
}
@media (max-width: 600px) {
    .clt-ad-show-sm { display: block; }
}

/* ===================================================================
   Ajustes mobile — tamanhos de fonte fixos (fluid:false no theme.json)
   não encolhem sozinhos, e a logo/nav/header não tinham sido revisados
   para telas pequenas.
   =================================================================== */
@media (max-width: 782px) {
    /* Tipografia: os presets xx-large/x-large são fixos (38px/60px) e
       ficam grandes demais / quebram feio em telas de celular. */
    .has-xx-large-font-size {
        font-size: 34px !important;
        line-height: 1.15 !important;
    }
    .has-x-large-font-size {
        font-size: 26px !important;
    }
    .clt-hero {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
    .clt-eyebrow {
        font-size: 11px !important;
    }

    /* Meta do post (autor · data · leitura): quebra em várias linhas com
       gap pequeno em vez do gap padrão de 40px herdado do tema. */
    .clt-post-meta {
        row-gap: 6px !important;
        column-gap: 14px !important;
        font-size: 13px;
    }

    /* Card do blog: imagem menor, padding mais enxuto. */
    .clt-post-card__inner {
        padding: 14px 14px 18px;
    }

    /* Newsletter da home: botão abaixo do campo em telas estreitas. */
    .clt-newsletter-form {
        flex-direction: column;
        align-items: stretch;
    }
    .clt-newsletter-form button {
        width: 100%;
    }

    /* Título/breadcrumb do post: menos respiro vertical. */
    .hostinger-ai-page-title {
        padding-top: 20px !important;
        padding-bottom: 12px !important;
    }
}

@media (max-width: 480px) {
    .has-xx-large-font-size {
        font-size: 28px !important;
    }
    .clt-hero .wp-block-button__link {
        width: 100%;
        text-align: center;
    }
    .clt-related-card__thumb img {
        height: 110px;
    }
}