@charset "UTF-8";
/* MOBILE — camada compartilhada. Todos os ajustes ficam dentro de media
 * queries para preservar o desktop, inclusive quando este CSS é aberto só.
 * !important restrito a conflitos com regras legadas/estilos inline. */
@media screen and (max-width: 1024px) {
    /* O global reduzia a raiz para 80,5% e 74,5% (~12px no celular). */
    html { font-size: 100%; }

    header nav#menu-principal {
        height: 100vh;
        height: 100dvh;
        max-height: 100dvh;
    }
    header nav#menu-principal > ul { min-height: 0; }
    header nav#menu-principal .submenu-columns { min-width: 0; }
    header nav#menu-principal .submenu-toggle { padding-right: 3rem; }

    /* Não atingir campos hidden, botões ou o textarea invisível do reCAPTCHA. */
    :is(main, footer, .sc-modal, #modal-rd-home) form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="number"], select, textarea:not([name="g-recaptcha-response"])) {
        font-size: 16px !important;
        min-height: 48px !important;
        max-width: 100%;
        box-sizing: border-box;
        scroll-margin-block: 6rem;
    }
    :is(main, footer, .sc-modal, #modal-rd-home) form textarea:not([name="g-recaptcha-response"]) {
        min-height: 128px !important;
        resize: vertical;
    }
    :is(main, footer, .sc-modal, #modal-rd-home) form :is(button[type="submit"], input[type="submit"]),
    footer #newsletter button { min-height: 48px; }
    :is(main, footer, .sc-modal, #modal-rd-home) form :is(input, select, textarea, button):focus-visible {
        outline: 2px solid #e6223d;
        outline-offset: 3px;
    }
    main .contact .container .right form label:has(input[type="checkbox"]) {
        min-height: 44px;
        font-size: 14px;
        line-height: 1.6;
        align-items: flex-start;
    }
    main .contact .container .right form input[type="checkbox"] {
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        margin-top: 3px;
    }
    /* Uma estrutura única para desktop/mobile, sem depender do user-agent
     * armazenado no cache do WordPress. */
    main .contact .container .right .contact-submit {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
        margin-top: 1.5rem;
    }
    main .contact .container .right .contact-submit > .g-recaptcha { width: auto !important; }
    main .contact .container .right .contact-submit > button {
        width: 100% !important;
        max-width: none;
        margin: 0 !important;
        border-radius: 100px;
        font-size: 15px;
    }
    main .contact .contact-privacy { font-size: 14px !important; line-height: 1.6; }
}

@media screen and (max-width: 768px) {
    footer { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
    main { min-width: 0; }
    main :is(h1, h2, h3, h4, h5, h6, p, li) { overflow-wrap: anywhere; }
    main :is(.container, .left, .right) { min-width: 0; }

    /* Títulos fluidos, sem crescer demais após restaurar a fonte-base. */
    main[id] h1 {
        font-size: clamp(1.875rem, 7vw, 2.5rem) !important;
        line-height: 1.2 !important;
        letter-spacing: -.035em;
        max-width: 100%;
    }
    main[id] h2 {
        font-size: clamp(1.5rem, 5.5vw, 2rem) !important;
        line-height: 1.3 !important;
    }
    main[id] :is(.article, .post-content, .contact) p {
        font-size: 1rem;
        line-height: 1.7;
    }
    main[id] .page-hero {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-top: 7.5rem !important;
        padding-bottom: 3rem !important;
    }
    main[id] .page-hero .container { height: auto; }
    #im.im-page .page-hero { padding-top: 7.5rem !important; }
    main[id] :is(.hm-hero, .labs-hero, .desafio-hero, .prognos-hero, .blog-hero, .bl-intro) {
        height: auto;
        min-height: 0;
        padding-top: 7.5rem;
        padding-bottom: 3rem;
    }
    main[id] :is(.hm-hero__actions, .qs-hero__actions) {
        flex-wrap: wrap;
        gap: .75rem;
    }
    main[id] :is(.hm-hero__actions, .qs-hero__actions) > a {
        min-height: 48px;
        max-width: 100%;
        white-space: normal;
    }

    /* Contato: leitura alinhada, menos vazio e campos com alvo de toque real. */
    main[id] .contact { padding: 3rem 0 !important; margin-top: 0 !important; }
    main[id] .contact .container { gap: 1.5rem; }
    main[id] .contact .container .left { text-align: left; margin-bottom: 0; }
    main[id] .contact .container .right { max-width: none; }
    main[id] .contact .container .left :is(h4, .contact-title) {
        font-size: 1.5rem;
        line-height: 1.4;
    }
    main[id] .contact .container .right form label { font-size: 1rem; }
    main[id] .contact .container .right form label input:not([type="checkbox"]):not([type="hidden"]) {
        padding: .625rem .25rem;
        height: auto;
    }
    #contato .email { padding: 2.5rem 1rem; }
    #contato .email .contact-email { font-size: clamp(1.125rem, 5vw, 1.5rem); line-height: 1.5; }
    main[id] .uni-cta__box {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 1.5rem !important;
        gap: 2rem !important;
    }
    main[id] .uni-field > span { font-size: 14px !important; letter-spacing: .04em; }
    main[id] .uni-form__spam { font-size: 14px !important; line-height: 1.6; }
    .sc-modal .sc-modal__box,
    #modal-rd-home.rd-popup-container {
        width: calc(100% - 24px);
        max-height: calc(100dvh - 32px);
        padding: 1.5rem 1rem;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .sc-modal .sc-modal__close,
    #modal-rd-home .rd-popup-close { min-width: 44px; min-height: 44px; }

    /* Segmentos: os estilos inline mantinham duas colunas e recuos de 100px. */
    #segmentos .article .bottom { flex-direction: column; }
    #segmentos .article .bottom .list {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100%;
        max-width: none;
        margin: 1.5rem 0 0;
        gap: 1rem;
    }
    #segmentos .article .bottom .list .row { min-height: 0 !important; }
    #segmentos .applications .container { gap: 1.25rem; }
    #segmentos .applications .container > h5 {
        margin-left: 0 !important;
        font-size: 1.5rem;
        line-height: 1.4;
    }
    #segmentos .applications .container > ul { margin-right: 0 !important; width: 100%; }
    #segmentos .applications .container li { width: 100%; }
    #segmentos :is(.about, .solutions-content) { margin-top: 2rem; padding-block: 3rem; }

    /* Apenas embeds de vídeo: nunca redimensionar iframes do reCAPTCHA. */
    main[id] iframe:is(.iframe-solucao, [src*="youtube.com"], [src*="youtube-nocookie.com"], [src*="player.vimeo.com"]) {
        display: block;
        width: 100% !important;
        max-width: 100%;
        height: auto !important;
        aspect-ratio: 16 / 9;
        margin-inline: 0;
    }
    #blog-interna .post-content .container .text { min-width: 0; max-width: 100%; }
    #blog-interna .post-content article :is(p, li) {
        font-size: 1rem !important;
        line-height: 1.75 !important;
        text-align: left;
    }
    #blog-interna .post-content article :is(table, pre) {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    #blog-interna .page-hero .menu-categorias ul { flex-wrap: wrap; gap: .5rem; }
    #blog-interna .page-hero .menu-categorias a { white-space: normal; }
    #blog-home .bl-ordenar select,
    #blog .mobile-categories select { min-height: 48px; font-size: 16px; max-width: 100%; }
    #blog-home .bl-todos__cabeca { flex-wrap: wrap; gap: 1rem; }
    #blog .podcast-grid { grid-template-columns: minmax(0, 1fr); }
    #blog .podcast-grid .item { min-width: 0; }

    /* Flutuantes do tema: deixar espaço para o botão externo à esquerda.
     * Não alterar o widget do RD Station nem seu mecanismo de conversão. */
    body .chat-fixed {
        left: auto;
        right: 12px;
        bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        max-width: calc(100vw - 100px);
        min-height: 48px;
        font-size: 14px;
        line-height: 1.4;
        padding: 12px 18px;
        white-space: normal;
    }
    body #btn-topo {
        /* 44px de botão a 28px da base e da borda: o centro fica a 50px,
           na mesma linha do centro do botão do WhatsApp (60px a 20px). */
        right: 28px;
        bottom: 28px;
        width: 44px;
        height: 44px;
    }
    body.menu-aberto :is(.chat-fixed, #btn-topo),
    body:has(form :is(input:not([type="checkbox"]):focus, textarea:focus, select:focus)) :is(.chat-fixed, #btn-topo) {
        visibility: hidden;
        pointer-events: none;
    }

    /* Rodapé legível, sem reduzir links e consentimento a ~10px. */
    footer .container { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1rem; }
    footer .column.newsletter,
    footer .column:last-child { grid-column: 1 / -1; }
    footer .column.newsletter form { max-width: none; }
    footer .column .footer-title { font-size: 1rem; line-height: 1.4; }
    footer .column a { min-height: 44px; padding-block: .5rem; font-size: .9375rem; overflow-wrap: anywhere; }
    footer .column .foot-block p a { min-height: 0; padding: 0; }
    footer .column .foot-block p:not(.footer-title),
    footer .column .foot-block p a { font-size: .9375rem; }
    footer .column.newsletter form label { font-size: .875rem; line-height: 1.6; min-height: 44px; }
    footer .column.newsletter form input[type="checkbox"] { width: 20px; height: 20px; flex-basis: 20px; }
    footer .foot-legal { flex-wrap: wrap; }
    footer .foot-legal a { min-height: 44px; display: inline-flex; align-items: center; font-size: .875rem; }
    footer .foot-bottom { font-size: .875rem; }
}

@media screen and (max-width: 360px) {
    header .container { padding-inline: 12px; }
    main .container { padding-inline: 12px; }
    footer .container { grid-template-columns: minmax(0, 1fr); }
    /* Widget externo de 304px: ajuste apenas em telas muito estreitas.
     * Não esconder o desafio nem alterar sua validação. */
    main .g-recaptcha { transform: scale(.8); transform-origin: left top; }
}
