/* ============================================================
   CATÁLOGO MODULAR — Frontend
============================================================ */

.catmod, .catmod-single {
    box-sizing:border-box;
    /* Escala dos espaçamentos verticais — reduz em mobile */
    --catmod-spacing-scale:1;
}

/* Estado vazio dos shortcodes — mensagem simples */
.catmod-empty {
    margin:0;
    padding:14px 0;
    color:#6b7280;
    font-size:14px;
    font-style:italic;
}
.catmod *, .catmod-single * { box-sizing:border-box; }

/* Espaçamentos por bloco (definidos inline em --catmod-mt / --catmod-mb) */
.catmod-blk-wrap {
    margin-top:    calc(var(--catmod-mt, 0px) * var(--catmod-spacing-scale, 1));
    margin-bottom: calc(var(--catmod-mb, 0px) * var(--catmod-spacing-scale, 1));
}

@media (max-width: 1024px) {
    .catmod-single { --catmod-spacing-scale:0.8; }
}
@media (max-width: 640px) {
    .catmod-single { --catmod-spacing-scale:0.6; }
}

/* Remove sublinhado de QUALQUER link/botão do plugin */
.catmod a, .catmod-single a, .catmod button, .catmod-single button,
.catmod a:hover, .catmod-single a:hover { text-decoration:none !important; }

.catmod-btn {
    display:inline-flex; align-items:center; justify-content:center;
    padding:12px 28px; border-radius:4px; font-weight:600;
    text-decoration:none !important; transition:transform .15s, opacity .15s;
    border:1px solid transparent; font-size:14px;
}
.catmod-btn:hover { transform:translateY(-1px); opacity:.92; }
.catmod-btn-red   { background:#e2231a; color:#fff !important; }
.catmod-btn-dark  { background:transparent; color:#fff !important; border-color:rgba(255,255,255,.4); }
.catmod-btn-light { background:#fff; color:#111 !important; }

/* ============================================================
   1) SOLUÇÕES — grid 3 colunas com card destacado
============================================================ */
/* Wrapper externo: escapa de containers estreitos do builder/tema */
.catmod-solucoes-wrap {
    position:relative;
    left:50%; right:50%;
    margin-left:-50vw; margin-right:-50vw;
    width:100vw; max-width:100vw;
    box-sizing:border-box;
    padding:0 20px;
    overflow:hidden;
}
.catmod-solucoes {
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:18px !important;
    background:transparent;
    padding:0;
    border-radius:0;
    box-sizing:border-box;
    width:100%;
    max-width:1400px;
    margin:0 auto;
}
.catmod-solucoes > .catmod-sol-card {
    transition:opacity .25s, transform .25s;
}
/* hover dim: ao passar mouse sobre o grupo, escurece todos; o card sob o cursor permanece */
.catmod-solucoes:hover > .catmod-sol-card { opacity:.35; }
.catmod-solucoes:hover > .catmod-sol-card:hover { opacity:1; transform:translateY(-3px); }
.catmod-solucoes .catmod-sol-card {
    position:relative;
    display:block;
    min-height:520px;
    aspect-ratio:3/4;
    border-radius:10px;
    overflow:hidden;
    background:#1f1f1f;
    text-decoration:none !important;
    color:#fff !important;
    box-shadow:none;
    transition:transform .25s;
}
.catmod-solucoes .catmod-sol-card.no-image {
    background:linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
}
.catmod-solucoes .catmod-sol-card.is-highlight {
    background:#e2231a;
}
.catmod-solucoes .catmod-sol-card.is-highlight.no-image {
    background:linear-gradient(135deg, #e2231a 0%, #8a1410 100%);
}
.catmod-solucoes .catmod-sol-card.is-highlight .catmod-sol-overlay {
    background:linear-gradient(180deg, rgba(226,35,26,.35) 0%, rgba(150,20,15,.95) 100%);
}
.catmod-solucoes .catmod-sol-btn.is-red {
    background:#fff; color:#e2231a; border-color:#fff;
}
.catmod-solucoes .catmod-sol-card.is-highlight:hover .catmod-sol-btn,
.catmod-solucoes .catmod-sol-card.is-highlight:hover .catmod-sol-btn.is-red {
    background:transparent; border-color:rgba(255,255,255,.7); color:#fff;
}
.catmod-solucoes .catmod-sol-card:hover { transform:translateY(-3px); }
.catmod-solucoes .catmod-sol-bg {
    position:absolute; inset:0;
    background-size:cover; background-position:center;
    z-index:1;
}
.catmod-solucoes .catmod-sol-overlay {
    position:absolute; inset:0; z-index:2;
    background:linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.88) 100%);
}
.catmod-solucoes .catmod-sol-content {
    position:absolute; left:0; right:0; bottom:0;
    padding:24px; z-index:3;
    display:flex; flex-direction:column; align-items:flex-start; gap:10px;
}
.catmod-solucoes .catmod-sol-title {
    display:block; color:#fff; font-size:20px; font-weight:700; line-height:1.25; margin:0;
}
.catmod-solucoes .catmod-sol-desc {
    display:block; color:rgba(255,255,255,.85); font-size:13px; line-height:1.5; margin:0;
}
.catmod-solucoes .catmod-sol-btn {
    display:inline-block;
    margin-top:6px;
    padding:10px 22px;
    border-radius:4px;
    font-size:13px; font-weight:600;
    text-align:center;
    background:transparent;
    color:#fff;
    border:1px solid rgba(255,255,255,.45);
    transition:background .2s, border-color .2s;
}
.catmod-solucoes .catmod-sol-card:hover .catmod-sol-btn {
    background:#e2231a;
    border-color:#e2231a;
}

@media (max-width:900px) { .catmod-solucoes { grid-template-columns:repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width:560px) { .catmod-solucoes { grid-template-columns:1fr !important; } }

/* ============================================================
   2) PRODUTOS — slider 2 colunas com card sobreposto
============================================================ */
.catmod-produtos-slider { position:relative; overflow:hidden; padding:10px 0 60px; }
.catmod-prod-track {
    display:flex; gap:20px; transition:transform .4s ease;
    will-change:transform;
}
.catmod-prod-slide {
    position:relative; flex:0 0 calc(50% - 10px); border-radius:12px; overflow:hidden;
}
.catmod-prod-image {
    height:380px; background-size:cover; background-position:center; background-color:#ddd;
}
.catmod-prod-card {
    position:absolute; left:18px; right:18px; bottom:18px;
    background:#fff; border-radius:10px; padding:16px 18px;
    box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.catmod-prod-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.catmod-prod-card h4 { margin:0; font-size:19px; color:#111; line-height:1.3; font-weight:700; }
.catmod-prod-link {
    color:#111; font-size:14px; text-decoration:none !important; white-space:nowrap;
    display:inline-flex; align-items:center; gap:6px; font-weight:500;
    transition:color .2s;
}
.catmod-prod-link:hover { color:#e2231a; }
.catmod-prod-icon { stroke:currentColor; flex-shrink:0; }
.catmod-prod-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; color:#666; font-size:13px; }

.catmod-prod-nav {
    position:relative; right:auto; bottom:auto;
    display:flex; gap:14px; justify-content:center; margin-top:30px;
}
.catmod-prod-nav button {
    width:52px !important; height:52px !important; border-radius:50% !important;
    background:#fff !important; border:1px solid #d8d8d8 !important; color:#222 !important;
    font-size:18px !important; cursor:pointer;
    transition:background .2s, color .2s, border-color .2s, transform .15s;
    outline:0 !important; box-shadow:none !important;
    display:inline-flex; align-items:center; justify-content:center;
    padding:0;
}
.catmod-prod-nav button:hover  { background:#111 !important; color:#fff !important; border-color:#111 !important; transform:translateY(-2px); }
.catmod-prod-nav button:focus,
.catmod-prod-nav button:active { outline:0 !important; box-shadow:none !important; background:#111 !important; color:#fff !important; border-color:#111 !important; }

@media (max-width:800px) { .catmod-prod-slide { flex:0 0 100%; } }

/* ============================================================
   3) VITRINE — cards brancos
============================================================ */
.catmod-vitrine {
    display:grid; grid-template-columns:repeat(3, 1fr); gap:24px;
    padding:24px 0;
}
.catmod-vit-card {
    background:#fff; border-radius:10px; padding:18px;
    box-shadow:0 2px 8px rgba(0,0,0,.06);
    display:flex; flex-direction:column;
    transition:transform .2s, box-shadow .2s;
}
.catmod-vit-card:hover { transform:translateY(-4px); box-shadow:0 8px 20px rgba(0,0,0,.1); }
.catmod-vit-image {
    position:relative; width:100%;
    padding-bottom:75%; /* aspect ratio 4:3 — funciona em qualquer navegador */
    border-radius:8px; overflow:hidden; background:#f0f0f0; margin-bottom:18px;
}
.catmod-vit-image img {
    position:absolute; inset:0;
    width:100% !important; height:100% !important;
    object-fit:cover !important; display:block;
    max-width:none !important;
}
.catmod-vit-card h3 { text-align:center; font-size:22px; margin:0 0 14px; color:#111; font-weight:700; }
.catmod-vit-card p { text-align:center; color:#666; font-size:15px; line-height:1.6; margin:0 0 22px; flex:1; }
.catmod-vit-link {
    align-self:center; display:inline-flex; align-items:center; gap:10px;
    color:#111; text-decoration:none; font-size:12px; font-weight:600;
    letter-spacing:1.5px; text-transform:uppercase;
}
.catmod-vit-arrow {
    width:32px; height:32px; border-radius:50%; border:1px solid #ccc;
    display:inline-flex; align-items:center; justify-content:center;
    transition:all .2s;
}
.catmod-vit-link:hover .catmod-vit-arrow { background:#111; color:#fff; border-color:#111; }

@media (max-width:900px) { .catmod-vitrine { grid-template-columns:repeat(2, 1fr); } }
@media (max-width:600px) { .catmod-vitrine { grid-template-columns:1fr; } }

/* ============================================================
   SINGLE — Blocos modulares
============================================================ */
.catmod-single { display:flex; flex-direction:column; gap:0; }
.catmod-blk { padding:60px 24px; }
.catmod-blk h2 { font-size:32px; margin:0 0 24px; line-height:1.2; color:#111; }
.catmod-blk h3 { font-size:22px; margin:0 0 12px; }

/* HERO */
.catmod-blk-hero {
    position:relative; background-size:cover; background-position:center;
    min-height:520px; color:#fff; padding:80px 40px;
    display:flex; align-items:center;
}
.catmod-blk-hero.has-color { background-image:none; }
.catmod-blk-hero.has-color .catmod-hero-overlay { display:none; }
.catmod-hero-divider {
    display:block; height:3px; margin:0 0 22px 0;
}
.catmod-hero-overlay {
    position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.3) 100%);
}
.catmod-hero-inner { position:relative; max-width:560px; }
.catmod-hero-inner h1 { color:#fff; font-size:42px; line-height:1.15; margin:0 0 20px; }
.catmod-hero-sub { font-size:16px; line-height:1.55; margin:0 0 24px; color:rgba(255,255,255,.92); }
.catmod-hero-bullets { list-style:none; padding:0; margin:0 0 28px; }
.catmod-hero-bullets li {
    padding:6px 0 6px 24px; position:relative; color:rgba(255,255,255,.92);
}
.catmod-hero-bullets li::before {
    content:""; position:absolute; left:0; top:14px;
    width:8px; height:8px; background:#e2231a; border-radius:50%;
}

/* TEXT + IMAGEM — card branco sobreposto sobre a imagem */
.catmod-blk-txtimg { padding:80px 24px; background:#f6f6f6; }
.catmod-txtimg-inner {
    position:relative; max-width:1140px; margin:0 auto;
    min-height:420px;
}
.catmod-txtimg-img {
    width:65%; margin-left:auto;
}
.catmod-blk-txtimg.is-left .catmod-txtimg-img { margin-left:auto; margin-right:0; }
.catmod-blk-txtimg.is-right .catmod-txtimg-img { margin-left:0; margin-right:auto; }
.catmod-txtimg-img img {
    width:100%; height:100%; min-height:420px; object-fit:cover;
    border-radius:var(--catmod-img-radius, 8px); display:block;
}
.catmod-txtimg-card {
    position:absolute; top:50%; transform:translateY(-50%);
    width:45%; max-width:440px;
    background:#fff; padding:40px;
    border-radius:6px;
    box-shadow:0 12px 40px rgba(0,0,0,.10);
}
.catmod-blk-txtimg.is-left .catmod-txtimg-card { left:0; }
.catmod-blk-txtimg.is-right .catmod-txtimg-card { right:0; }
.catmod-txtimg-line {
    display:block; width:50px; height:3px; background:#e2231a; margin-bottom:18px;
}
.catmod-txtimg-card h2 { font-size:24px; margin:0 0 14px; color:#111; line-height:1.25; }
.catmod-txtimg-body p { color:#666; line-height:1.65; font-size:14px; margin:0 0 12px; }
.catmod-txtimg-body p:last-child { margin:0; }

@media (max-width:900px) {
    .catmod-txtimg-inner { min-height:0; }
    .catmod-txtimg-img { width:100%; }
    .catmod-txtimg-img img { min-height:280px; }
    .catmod-txtimg-card {
        position:relative; top:auto; transform:none;
        width:calc(100% - 32px); max-width:none;
        margin:-60px auto 0;
    }
    .catmod-blk-txtimg.is-left .catmod-txtimg-card,
    .catmod-blk-txtimg.is-right .catmod-txtimg-card { left:auto; right:auto; }
}

/* STEPS — números grandes outlined */
.catmod-blk-steps { max-width:1140px; margin:0 auto; padding:80px 24px; }
.catmod-steps-intro { text-align:center; margin-bottom:60px; }
.catmod-steps-eyebrow {
    display:block; color:#e2231a; font-size:13px; font-weight:600;
    letter-spacing:2px; text-transform:uppercase; margin-bottom:12px;
}
.catmod-steps-intro h2 {
    font-size:36px; margin:0; line-height:1.2; color:#111;
    position:relative; display:inline-block;
}
.catmod-steps-intro h2::after {
    content:""; display:block; width:60px; height:3px;
    background:#e2231a; margin:14px auto 0;
}
.catmod-steps-list {
    list-style:none; padding:0; margin:0;
    display:grid; grid-template-columns:repeat(3, 1fr); gap:48px;
}
.catmod-steps-list > li { text-align:left; }
.catmod-step-num {
    display:block; font-size:130px; font-weight:800; line-height:.9;
    color:transparent;
    -webkit-text-stroke:1.5px #d4d4d4;
    margin-bottom:32px;
}
.catmod-steps-list h4 { margin:0 0 14px; font-size:18px; color:#111; font-weight:700; }
.catmod-steps-list > li > p { margin:0; color:#555; font-size:14px; line-height:1.6; }
.catmod-step-items { list-style:none; padding:0; margin:0; }
.catmod-step-items li {
    position:relative; padding:8px 0 8px 28px;
    color:#444; font-size:14px; line-height:1.55;
}
.catmod-step-items li::before {
    content:"✓"; position:absolute; left:0; top:8px;
    color:#888; font-weight:700; font-size:14px;
}

@media (max-width:900px) { .catmod-steps-list { grid-template-columns:repeat(2, 1fr); gap:32px; } .catmod-step-num { font-size:100px; } }
@media (max-width:600px) { .catmod-steps-list { grid-template-columns:1fr; gap:40px; } .catmod-step-num { font-size:90px; margin-bottom:20px; } .catmod-steps-intro h2 { font-size:28px; } }

/* VARIATIONS */
.catmod-blk-variations { max-width:1200px; margin:0 auto; }
.catmod-var-intro { max-width:760px; margin:0 0 40px; }
.catmod-var-intro p { color:#555; line-height:1.65; }
.catmod-var-items { display:flex; flex-direction:column; gap:40px; }
.catmod-var-item {
    display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center;
    background:#fff; padding:24px; border-radius:12px;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}
.catmod-var-item.is-right { direction:rtl; }
.catmod-var-item.is-right > * { direction:ltr; }
.catmod-var-img img { width:100%; border-radius:var(--catmod-img-radius, 8px); display:block; }
.catmod-var-text p { color:#555; line-height:1.65; }

@media (max-width:800px) { .catmod-var-item { grid-template-columns:1fr; direction:ltr !important; } }

/* FAQ */
.catmod-blk-faq { max-width:900px; margin:0 auto; }
.catmod-faq-list { display:flex; flex-direction:column; gap:8px; }
.catmod-faq-item {
    background:#f6f6f6; border-radius:6px; padding:0;
    transition:background .15s;
}
.catmod-faq-item[open] { background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.catmod-faq-item summary {
    list-style:none; cursor:pointer; padding:18px 22px;
    display:flex; align-items:center; justify-content:space-between;
    font-weight:600; color:#111;
}
.catmod-faq-item summary::-webkit-details-marker { display:none; }
.catmod-faq-icon {
    width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center;
    color:#e2231a; font-size:20px; transition:transform .2s;
}
.catmod-faq-item[open] .catmod-faq-icon { transform:rotate(45deg); }
.catmod-faq-answer { padding:0 22px 20px; color:#555; line-height:1.65; }

/* TEXT + TITLE */
.catmod-blk-text-title { max-width:900px; margin:0 auto; text-align:center; }
.catmod-blk-text-title p { color:#555; line-height:1.7; font-size:15px; }

/* CTA */
.catmod-blk-cta { padding:0; }
.catmod-cta-inner {
    padding:60px 40px; text-align:center; max-width:900px; margin:0 auto;
    border-radius:12px;
}
.catmod-cta-vermelho .catmod-cta-inner { background:#e2231a; color:#fff; }
.catmod-cta-vermelho h2, .catmod-cta-vermelho p { color:#fff; }
.catmod-cta-preto    .catmod-cta-inner { background:#111; color:#fff; }
.catmod-cta-preto h2, .catmod-cta-preto p { color:#fff; }
.catmod-cta-branco   .catmod-cta-inner { background:#f6f6f6; }
.catmod-cta-inner h2 { font-size:30px; margin:0 0 14px; }
.catmod-cta-inner p { margin:0 0 24px; font-size:16px; line-height:1.55; }

/* CTA em modo full-width: o background colorido vai pro wrapper externo, o card interno vira centralizado sem border-radius */
.catmod-blk-wrap.is-full-width .catmod-blk-cta { padding:0; }
.catmod-blk-wrap.is-full-width.has-cta-vermelho { background:#e2231a; }
.catmod-blk-wrap.is-full-width.has-cta-preto    { background:#111; }
.catmod-blk-wrap.is-full-width.has-cta-branco   { background:#f6f6f6; }
.catmod-blk-wrap.is-full-width .catmod-cta-inner { background:transparent !important; border-radius:0; max-width:1140px; padding:70px 24px; }

/* FEATURES */
.catmod-blk-features { max-width:1200px; margin:0 auto; }
.catmod-features-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
.catmod-features-cols-3 { grid-template-columns:repeat(3, 1fr); }
.catmod-features-cols-4 { grid-template-columns:repeat(4, 1fr); }
.catmod-features-cols-5 { grid-template-columns:repeat(5, 1fr); }
.catmod-features-cols-6 { grid-template-columns:repeat(6, 1fr); }
.catmod-feature {
    background:#fff; border-radius:var(--catmod-img-radius, 10px); overflow:hidden;
    box-shadow:0 2px 10px rgba(0,0,0,.06);
    display:flex; flex-direction:column;
}
.catmod-feature-img { position:relative; aspect-ratio:4/3; background:#f0f0f0; }
.catmod-feature-img img { width:100%; height:100%; object-fit:cover; display:block; }
.catmod-feature-label {
    position:absolute; left:14px; bottom:14px;
    background:#e2231a; color:#fff; font-size:12px; font-weight:600;
    padding:6px 12px; border-radius:3px; text-transform:uppercase; letter-spacing:.5px;
}
.catmod-feature h4 { margin:18px 18px 8px; font-size:17px; color:#111; }
.catmod-feature p { margin:0 18px 20px; color:#666; line-height:1.55; font-size:14px; }

/* Responsivo das features — escala conforme a contagem de colunas escolhida */
@media (max-width:1100px) {
    .catmod-features-cols-5, .catmod-features-cols-6 { grid-template-columns:repeat(4, 1fr); }
}
@media (max-width:900px) {
    .catmod-features-grid, .catmod-features-cols-3 { grid-template-columns:repeat(2, 1fr); }
    .catmod-features-cols-4, .catmod-features-cols-5, .catmod-features-cols-6 { grid-template-columns:repeat(3, 1fr); }
}
@media (max-width:680px) {
    .catmod-features-cols-4, .catmod-features-cols-5, .catmod-features-cols-6 { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:600px) {
    .catmod-features-grid, .catmod-features-cols-3,
    .catmod-features-cols-4, .catmod-features-cols-5, .catmod-features-cols-6 { grid-template-columns:1fr; }
}

/* Botão de download opcional dentro de cada feature.
   Fica colado no rodapé do card pra alinhar entre features de alturas diferentes. */
.catmod-feature .catmod-catalog-dl.catmod-feature-dl {
    margin:auto 18px 20px; text-align:left;
}
.catmod-feature .catmod-feature-dl .catmod-catalog-dl-btn,
.catmod-feature .catmod-feature-dl .at-btn {
    padding:11px 20px !important; font-size:13px !important;
}

/* ============================================================
   ACABAMENTOS
   Grid de amostras: etiqueta (nome) em "aba" sobre a imagem.
   Cores da etiqueta: --catmod-acab-bg / --catmod-acab-fg do bloco,
   sobrescritas por item via style inline.
============================================================ */
.catmod-blk-acabamentos { max-width:1200px; margin:0 auto; padding:0 24px; }
.catmod-acab-intro { margin:0 0 32px; }
.catmod-acab-intro h2 { font-size:32px; line-height:1.2; margin:0 0 12px; }
.catmod-acab-intro p { margin:0; line-height:1.65; color:#555; }

.catmod-acab-grid { display:grid; gap:28px 22px; }
.catmod-acab-cols-3 { grid-template-columns:repeat(3, 1fr); }
.catmod-acab-cols-4 { grid-template-columns:repeat(4, 1fr); }
.catmod-acab-cols-5 { grid-template-columns:repeat(5, 1fr); }
.catmod-acab-cols-6 { grid-template-columns:repeat(6, 1fr); }

.catmod-acab-item { margin:0; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.catmod-acab-label {
    display:inline-block; max-width:100%;
    background:var(--catmod-acab-bg, #ffcc00);
    color:var(--catmod-acab-fg, #111);
    font-size:13px; font-weight:700; line-height:1.2;
    padding:7px 14px; border-radius:4px 4px 0 0;
    word-break:break-word;
}
.catmod-acab-img {
    width:100%; aspect-ratio:4/3; overflow:hidden;
    background:#f0f0f0;
    border-radius:0 var(--catmod-img-radius, 4px) var(--catmod-img-radius, 4px) var(--catmod-img-radius, 4px);
}
.catmod-acab-img img { width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:1000px) {
    .catmod-acab-cols-5, .catmod-acab-cols-6 { grid-template-columns:repeat(4, 1fr); }
}
@media (max-width:768px) {
    .catmod-acab-cols-4, .catmod-acab-cols-5, .catmod-acab-cols-6 { grid-template-columns:repeat(3, 1fr); }
    .catmod-acab-intro h2 { font-size:26px; }
}
@media (max-width:520px) {
    .catmod-acab-grid { gap:20px 14px; }
    .catmod-acab-cols-3, .catmod-acab-cols-4,
    .catmod-acab-cols-5, .catmod-acab-cols-6 { grid-template-columns:repeat(2, 1fr); }
    .catmod-acab-label { font-size:12px; padding:6px 11px; }
}

/* ============================================================
   TABS / PERFORMANCE
============================================================ */
.catmod-blk-tabs { padding:80px 24px; }
.catmod-blk-tabs.is-dark { background:#0d0d0d; color:#fff; }
.catmod-blk-tabs.is-dark h2 { color:#fff; }
.catmod-blk-tabs.is-light { background:#f6f6f6; }
.catmod-tabs-inner {
    max-width:1200px; margin:0 auto;
    display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start;
}
.catmod-tabs-left h2 { font-size:32px; line-height:1.2; margin:0 0 16px; }
.catmod-tabs-left p { line-height:1.65; opacity:.85; }
.catmod-tabs-nav { display:flex; flex-direction:column; gap:6px; }
/* O "Alinhamento da intro" aplica text-align na section inteira. A coluna das
   abas (nav + painéis) NÃO deve herdar isso — mantém sempre alinhada à esquerda.
   O botão de download fica fora de .catmod-tabs-right, então continua seguindo
   o alinhamento escolhido. */
.catmod-blk-tabs .catmod-tabs-right { text-align:left; }
.catmod-tab-btn {
    width:100%; text-align:left; padding:18px 22px;
    background:#1a1a1a !important;
    color:#fff !important;
    border:0 !important; outline:0 !important; box-shadow:none !important;
    cursor:pointer;
    font-size:15px; font-weight:600; border-radius:4px;
    display:flex; justify-content:space-between; align-items:center;
    transition:background .2s;
}
.catmod-tab-btn:hover { background:#2a2a2a !important; color:#fff !important; }
.catmod-tab-btn:focus, .catmod-tab-btn:active { background:#1a1a1a !important; color:#fff !important; outline:0 !important; }
.catmod-tab-btn.is-active { background:#e2231a !important; color:#fff !important; }
.catmod-tab-btn.is-active:hover { background:#c81e15 !important; }
.catmod-tab-btn *, .catmod-tab-btn:hover *, .catmod-tab-btn.is-active * { color:#fff !important; }
.catmod-blk-tabs.is-light .catmod-tab-btn { background:#fff !important; color:#111 !important; box-shadow:0 1px 3px rgba(0,0,0,.08) !important; }
.catmod-blk-tabs.is-light .catmod-tab-btn * { color:#111 !important; }
.catmod-blk-tabs.is-light .catmod-tab-btn:hover { background:#f0f0f0 !important; }
.catmod-blk-tabs.is-light .catmod-tab-btn.is-active { background:#e2231a !important; color:#fff !important; }
.catmod-blk-tabs.is-light .catmod-tab-btn.is-active * { color:#fff !important; }
.catmod-tab-arrow { transition:transform .2s; opacity:.7; }
.catmod-tab-btn.is-active .catmod-tab-arrow { transform:rotate(180deg); }
.catmod-tab-panel { display:none; padding:16px 22px 8px; }
.catmod-tab-panel.is-active { display:block; }
.catmod-tab-panel ul { list-style:none; padding:0; margin:0; }
.catmod-tab-panel li {
    padding:8px 0 8px 22px; position:relative; line-height:1.55;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.catmod-blk-tabs.is-light .catmod-tab-panel li { border-bottom-color:rgba(0,0,0,.08); }
.catmod-tab-panel li::before {
    content:"✓"; position:absolute; left:0; color:#e2231a; font-weight:700;
}

@media (max-width:800px) { .catmod-tabs-inner { grid-template-columns:1fr; gap:32px; } }

/* ============================================================
   GRID DE CARDS (cards cinza)
============================================================ */
.catmod-blk-cards-grid { padding:80px 24px; background:#fafafa; }
.catmod-cards-intro { max-width:1200px; margin:0 auto 40px; text-align:center; }
.catmod-cards-intro h2 { font-size:32px; margin:0 0 14px; }
.catmod-cards-intro p { color:#555; line-height:1.65; max-width:760px; margin:0 auto; }
.catmod-cards-grid { max-width:1200px; margin:0 auto; display:grid; gap:18px; }
.catmod-cards-grid.catmod-cols-2 { grid-template-columns:repeat(2, 1fr); }
.catmod-cards-grid.catmod-cols-3 { grid-template-columns:repeat(3, 1fr); }
.catmod-cards-grid.catmod-cols-4 { grid-template-columns:repeat(4, 1fr); }
.catmod-card-item {
    background:#e8e8e8; border-radius:8px; padding:24px;
    transition:background .2s, transform .2s;
}
.catmod-card-item:hover { background:#dcdcdc; transform:translateY(-2px); }
.catmod-card-item h4 { margin:0 0 8px; font-size:15px; color:#111; line-height:1.3; }
.catmod-card-item p { margin:0; color:#555; font-size:13px; line-height:1.55; }

@media (max-width:900px) {
    .catmod-cards-grid.catmod-cols-3,
    .catmod-cards-grid.catmod-cols-4 { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:600px) {
    .catmod-cards-grid.catmod-cols-2,
    .catmod-cards-grid.catmod-cols-3,
    .catmod-cards-grid.catmod-cols-4 { grid-template-columns:1fr; }
}

/* Single — sem quebra de container por padrão, respeita tema */
.catmod-single { width:100%; }
.catmod-blk-wrap { width:100%; }

/* Quando o bloco tem 100% largura ativado no admin: background quebra pra 100vw */
.catmod-blk-wrap.is-full-width {
    position:relative;
    left:50%; right:50%;
    margin-left:-50vw; margin-right:-50vw;
    width:100vw; max-width:100vw;
    box-sizing:border-box;
    overflow:hidden;
}
/* Conteúdo interno fica centralizado, NÃO ocupa 100vw */
.catmod-blk-wrap.is-full-width .catmod-hero-inner,
.catmod-blk-wrap.is-full-width .catmod-tabs-inner,
.catmod-blk-wrap.is-full-width .catmod-tabs-dl,
.catmod-blk-wrap.is-full-width .catmod-cta-inner,
.catmod-blk-wrap.is-full-width .catmod-cards-intro,
.catmod-blk-wrap.is-full-width .catmod-cards-grid,
.catmod-blk-wrap.is-full-width .catmod-features-grid,
.catmod-blk-wrap.is-full-width .catmod-acab-intro,
.catmod-blk-wrap.is-full-width .catmod-acab-grid,
.catmod-blk-wrap.is-full-width .catmod-var-intro,
.catmod-blk-wrap.is-full-width .catmod-var-items,
.catmod-blk-wrap.is-full-width .catmod-steps-list,
.catmod-blk-wrap.is-full-width > .catmod-blk > h2 {
    max-width:1140px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}
/* Hero full-width: conteúdo deixa de ser left-aligned */
.catmod-blk-wrap.is-full-width .catmod-blk-hero {
    padding-left:24px; padding-right:24px;
    justify-content:center;
}
.catmod-blk-wrap.is-full-width .catmod-hero-inner {
    width:100%;
}

/* ============================================================
   RESPONSIVO FINAL
============================================================ */
@media (max-width:768px) {
    .catmod-blk { padding:50px 20px !important; }
    .catmod-blk h2 { font-size:24px !important; }
    .catmod-hero-inner h1 { font-size:30px !important; }
    .catmod-blk-hero { min-height:380px !important; padding:50px 20px !important; }
    .catmod-cta-inner { padding:40px 24px; }
    .catmod-cta-inner h2 { font-size:24px; }
    .catmod-blk-tabs { padding:50px 20px !important; }
    .catmod-blk-cards-grid { padding:50px 20px !important; }
}
@media (max-width:480px) {
    .catmod-blk h2 { font-size:22px !important; }
    .catmod-hero-inner h1 { font-size:26px !important; }
    .catmod-vit-card h3 { font-size:17px; }
    .catmod-solucoes .catmod-sol-card { min-height:420px; aspect-ratio:auto; }
}

/* Centralizar títulos de FAQ e Features (e respeitar text-align via style inline) */
.catmod-blk-faq, .catmod-blk-features { text-align:center; }
.catmod-blk-faq > h2, .catmod-blk-features > h2 { text-align:inherit; margin-left:auto; margin-right:auto; }
.catmod-blk-faq .catmod-faq-list { text-align:left; }
.catmod-blk-features .catmod-features-grid { text-align:left; }
.catmod-blk-features .catmod-feature { text-align:left; }

/* ============================================================
   BLOCO DOWNLOAD
============================================================ */
.catmod-blk-download { padding:80px 24px; background:#f6f6f6; }
.catmod-download-card {
    max-width:1140px; margin:0 auto;
    display:grid; grid-template-columns:1fr 1.4fr; gap:0;
    background:#fff; border-radius:var(--catmod-img-radius, 10px); overflow:hidden;
    box-shadow:0 8px 30px rgba(0,0,0,.06);
}
.catmod-download-img { background:#f0f0f0; min-height:280px; }
.catmod-download-img img { width:100%; height:100%; min-height:280px; object-fit:cover; display:block; }
.catmod-download-content {
    padding:40px 44px;
    display:flex; flex-direction:column; justify-content:center;
}
.catmod-download-content h3 { margin:0 0 12px; font-size:24px; color:#111; line-height:1.25; }
.catmod-download-content p { margin:0 0 22px; color:#555; line-height:1.65; font-size:15px; }
.catmod-download-btn {
    display:inline-flex; align-items:center; gap:10px;
    padding:14px 26px; border-radius:5px;
    color:#fff !important; text-decoration:none !important;
    font-weight:600; font-size:14px;
    align-self:flex-start;
    transition:opacity .2s, transform .15s;
}
.catmod-download-btn:hover { opacity:.92; transform:translateY(-2px); }
.catmod-download-btn svg { stroke:#fff; flex-shrink:0; }

@media (max-width:800px) {
    .catmod-download-card { grid-template-columns:1fr; }
    .catmod-download-img, .catmod-download-img img { min-height:220px; }
    .catmod-download-content { padding:30px 28px; }
}

/* ============================================================
   BOTÃO DE DOWNLOAD DE CATÁLOGO (Hero + Tabs)
   Cores personalizáveis via --catmod-dl-bg / --catmod-dl-fg.
   Quando usa a Área Técnica, o botão do shortcode ([area_tecnica_botao],
   classe .at-btn) abre o popup de lead — reestilizamos pra herdar as cores.
============================================================ */
.catmod-catalog-dl { margin-top:16px; }
.catmod-catalog-dl-btn {
    display:inline-flex; align-items:center; gap:10px;
    padding:13px 26px; border-radius:5px;
    font-weight:600; font-size:14px;
    text-decoration:none !important;
    transition:opacity .2s, transform .15s;
}
.catmod-catalog-dl-btn:hover { opacity:.92; transform:translateY(-2px); }
.catmod-catalog-dl-btn svg { flex-shrink:0; stroke:currentColor; }

/* Botão vindo do shortcode da Área Técnica dentro do nosso wrap */
.catmod-catalog-dl-at { display:inline-block; }
.catmod-catalog-dl-at .at-btn,
.catmod-catalog-dl-at .at-btn:hover,
.catmod-catalog-dl-at .at-btn:focus,
.catmod-catalog-dl-at .at-btn:active {
    display:inline-flex !important; align-items:center; gap:10px;
    background:var(--catmod-dl-bg, #e2231a) !important;
    color:var(--catmod-dl-fg, #fff) !important;
    border:0 !important; box-shadow:none !important; outline:0 !important;
    padding:13px 26px !important; border-radius:5px !important;
    font-weight:600 !important; font-size:14px !important;
    cursor:pointer; text-decoration:none !important;
    transition:opacity .2s, transform .15s;
}
.catmod-catalog-dl-at .at-btn:hover { opacity:.92; transform:translateY(-2px); }
.catmod-catalog-dl-at .at-btn * { color:var(--catmod-dl-fg, #fff) !important; }

/* Posicionamento específico do Hero (abaixo do botão principal) */
.catmod-hero-inner .catmod-catalog-dl.catmod-hero-dl { margin-top:14px; }

/* Posicionamento específico das Tabs (abaixo das abas, alinhado ao container) */
.catmod-tabs-dl { max-width:1200px; margin:36px auto 0; }

/* HTML livre dentro do painel de uma aba */
.catmod-tab-html { line-height:1.6; }
.catmod-tab-html img { max-width:100%; height:auto; }
.catmod-tab-html > *:first-child { margin-top:0; }
.catmod-tab-panel ul + .catmod-tab-html { margin-top:12px; }

/* ============================================================
   PROPAGAÇÃO DA COR CONFIGURADA NO BLOCO
   Quando o usuário configura "Cor do texto" no bloco, o PHP
   define a custom property --catmod-text na <section>. Estas
   regras propagam essa cor pros títulos e parágrafos que de
   outra forma estariam fixos em #111 / #555 / #666 / #fff.
   Especificidade (0,2,1) > a maioria das regras nominais.
============================================================ */
.catmod-blk[style*="--catmod-text"],
.catmod-blk[style*="--catmod-text"] h1,
.catmod-blk[style*="--catmod-text"] h2,
.catmod-blk[style*="--catmod-text"] h3,
.catmod-blk[style*="--catmod-text"] h4,
.catmod-blk[style*="--catmod-text"] h5,
.catmod-blk[style*="--catmod-text"] h6,
.catmod-blk[style*="--catmod-text"] p,
.catmod-blk[style*="--catmod-text"] li,
.catmod-blk[style*="--catmod-text"] strong,
.catmod-blk[style*="--catmod-text"] .catmod-hero-sub,
.catmod-blk[style*="--catmod-text"] .catmod-txtimg-card h2,
.catmod-blk[style*="--catmod-text"] .catmod-txtimg-body p,
.catmod-blk[style*="--catmod-text"] .catmod-steps-list h4,
.catmod-blk[style*="--catmod-text"] .catmod-steps-list > li > p,
.catmod-blk[style*="--catmod-text"] .catmod-step-items li,
.catmod-blk[style*="--catmod-text"] .catmod-var-intro p,
.catmod-blk[style*="--catmod-text"] .catmod-var-text p,
.catmod-blk[style*="--catmod-text"] .catmod-faq-answer,
.catmod-blk[style*="--catmod-text"] .catmod-faq-item summary,
.catmod-blk[style*="--catmod-text"] .catmod-feature h4,
.catmod-blk[style*="--catmod-text"] .catmod-feature p,
.catmod-blk[style*="--catmod-text"] .catmod-cards-intro p,
.catmod-blk[style*="--catmod-text"] .catmod-card-item h4,
.catmod-blk[style*="--catmod-text"] .catmod-card-item p,
.catmod-blk[style*="--catmod-text"] .catmod-download-content h3,
.catmod-blk[style*="--catmod-text"] .catmod-download-content p {
    color: var(--catmod-text);
}

/* Tabs: tema escuro/claro tem CSS com !important — precisamos manter consistência */
.catmod-blk-tabs[style*="--catmod-text"] h2 { color: var(--catmod-text) !important; }
.catmod-blk-tabs[style*="--catmod-text"] .catmod-tabs-left p { color: var(--catmod-text); }

/* CTA: as classes .catmod-cta-vermelho/preto têm h2,p { color:#fff } — quando o user
   define cor_texto, queremos vencer essas regras. */
.catmod-blk-cta[style*="--catmod-text"] h2,
.catmod-blk-cta[style*="--catmod-text"] p {
    color: var(--catmod-text) !important;
}

/* Bullets do hero usam rgba alpha — quando user configura cor, usa cor pura */
.catmod-blk-hero[style*="--catmod-text"] .catmod-hero-bullets li { color: var(--catmod-text); }

/* ============================================================
   BLOCO PRODUTOS VINCULADOS — grid 3 colunas no single de Solução
============================================================ */
/* ============================================================
   GRID PRODUTOS VINCULADOS — totalmente isolado (.catmod-lp-*)
   pra evitar conflitos com .catmod-op-card e regras do tema
============================================================ */
.catmod-blk-lp {
    background: #fff;
    padding: 56px 24px 64px;
    width: 100%;
    box-sizing: border-box;
}
.catmod-blk-lp *,
.catmod-blk-lp *::before,
.catmod-blk-lp *::after { box-sizing: border-box; }

.catmod-lp-inner {
    max-width: 1140px;
    margin: 0 auto;
    width: 100%;
}

.catmod-lp-title {
    font-size: 40px;
    font-weight: 800;
    color: #111;
    margin: 0 0 40px;
    line-height: 1.1;
    letter-spacing: -0.5px;
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
}
.catmod-lp-title::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 56px; height: 3px;
    background: #e2231a;
}

.catmod-lp-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
}
@media (min-width: 768px) {
    .catmod-lp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
    .catmod-lp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.catmod-lp-card {
    display: flex !important;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px;
    text-decoration: none !important;
    color: inherit !important;
    transition: transform .25s ease, box-shadow .25s ease;
    min-width: 0;
    overflow: hidden;
}
.catmod-lp-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(16, 24, 40, .08);
}

.catmod-lp-image {
    position: relative;
    width: 100%;
    padding-bottom: 75%; /* aspect 4:3 robusto */
    height: 0;
    background: linear-gradient(135deg, #f4f5f7 0%, #e5e7eb 100%);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 18px;
}
.catmod-lp-image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .4s ease;
}
.catmod-lp-card:hover .catmod-lp-image img { transform: scale(1.04); }
.catmod-lp-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(226, 35, 26, .35);
    font-size: 48px;
    font-weight: 800;
    text-transform: uppercase;
}

.catmod-lp-card-title {
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    color: #111;
    margin: 0 0 10px;
    line-height: 1.3;
}
.catmod-lp-card-desc {
    text-align: center;
    font-size: 13px;
    color: #6b7280;
    line-height: 1.55;
    margin: 0 0 18px;
    flex: 1;
}
.catmod-lp-cta {
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin: auto 0 8px;
    font-size: 12px;
    font-weight: 700;
    color: #111;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}
.catmod-lp-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    border: 1px solid #d1d5db;
    font-size: 14px;
    line-height: 1;
    transition: all .2s ease;
}
.catmod-lp-card:hover .catmod-lp-cta { color: #e2231a; }
.catmod-lp-card:hover .catmod-lp-arrow {
    background: #e2231a;
    border-color: #e2231a;
    color: #fff;
}

@media (max-width: 600px) {
    .catmod-blk-lp { padding: 40px 18px; }
    .catmod-lp-title { font-size: 28px; }
}

/* ============================================================
   BLOCO OUTROS PRODUTOS — sidebar com filtros + grid de cards
   Espelhado no screenshot enviado pelo usuário
============================================================ */
.catmod-blk-op {
    --catmod-op-accent: #e2231a;
    background: #f4f5f7;
    padding: 56px 24px 64px;
    width: 100%;
    box-sizing: border-box;
}
.catmod-op-inner {
    max-width: 1140px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

/* Título "Outros Produtos" com sublinhado vermelho curto */
.catmod-op-title {
    font-size: 40px;
    font-weight: 800;
    color: #111;
    margin: 0;
    line-height: 1.1;
    letter-spacing: -.5px;
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
}
.catmod-op-title::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 56px; height: 3px;
    background: var(--catmod-op-accent);
}

.catmod-op-grid {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 56px;
    margin-top: 40px;
    align-items: start;
}
.catmod-op-grid.no-sidebar {
    grid-template-columns: 1fr;
}

/* ============================================================
   Sidebar
============================================================ */
.catmod-op-sidebar {
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-width: 0;
}
.catmod-op-cats,
.catmod-op-downloads { min-width: 0; }

/* ---- Botões de categoria ---- */
.catmod-op-cats {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.catmod-op-cat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 13px 16px;
    /* !important pra neutralizar estilos de <button> herdados do tema (ex.: cor rosa) */
    background: #fff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: #1f2937 !important;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
    text-align: left;
    font-family: inherit;
    box-shadow: none !important;
}
/* Subcategoria: indentada (padding-left inline) + traço de acento à esquerda */
.catmod-op-cat.catmod-op-cat-child {
    border-left: 3px solid var(--catmod-op-accent) !important;
}
.catmod-op-cat.catmod-op-cat-child:not(.is-active) { font-weight: 600; }
/* Label da categoria: pode quebrar em 2 linhas em vez de estourar o botão */
.catmod-op-cat > span:first-child {
    min-width: 0;
    flex: 1 1 auto;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.25;
    color: inherit !important;
}
.catmod-op-cat:hover {
    border-color: #9ca3af !important;
    background: #f7f8fa !important;
    color: #111 !important;
}
.catmod-op-cat.is-active,
.catmod-op-cat.is-active:hover {
    background: var(--catmod-op-accent) !important;
    border-color: var(--catmod-op-accent) !important;
    color: #fff !important;
}
.catmod-op-cat.is-active > span:first-child { color: #fff !important; }
.catmod-op-cat.is-active .catmod-op-arrow { color: #fff !important; }
.catmod-op-arrow {
    flex-shrink: 0;
    color: #9ca3af;
    font-size: 18px;
    line-height: 1;
    font-weight: 400;
    transition: color .15s ease;
}
/* Guarda de alta especificidade — impede qualquer estilo de <button>/<a> do tema
   (cores rosa/brand) de vazar para a sidebar de categorias e downloads. */
.catmod-blk-op .catmod-op-sidebar .catmod-op-cat:not(.is-active) {
    background: #fff !important;
    border-color: #d1d5db !important;
    color: #1f2937 !important;
}
.catmod-blk-op .catmod-op-sidebar .catmod-op-cat:not(.is-active) > span:first-child { color: #1f2937 !important; }
.catmod-blk-op .catmod-op-sidebar .catmod-op-dl-link:not(.is-disabled) { color: #1f2937 !important; }
.catmod-blk-op .catmod-op-sidebar .catmod-op-dl-title { color: #1f2937 !important; }

/* ---- Categorias: empty state ---- */
.catmod-op-cats-empty {
    padding: 18px 20px;
    background: #fff;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    text-align: left;
}
.catmod-op-cats-empty h4 {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
    color: #1f2937;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.catmod-op-cats-empty p {
    margin: 0 0 8px;
    font-size: 13px;
    color: #6b7280;
    line-height: 1.5;
}
.catmod-op-cats-empty-cta {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    color: var(--catmod-op-accent);
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.catmod-op-cats-empty-cta:hover { text-decoration: underline !important; }

/* ---- Bloco "Downloads" ---- */
.catmod-op-downloads { color: #1f2937; }
.catmod-op-downloads h4 {
    margin: 0 0 16px;
    font-size: 18px;
    font-weight: 700;
    color: #111;
    padding-bottom: 8px;
    position: relative;
    display: inline-block;
}
.catmod-op-downloads h4::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 48px; height: 3px;
    background: var(--catmod-op-accent);
}
.catmod-op-downloads ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.catmod-op-dl-item {
    margin: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    transition: border-color .15s ease;
}
.catmod-op-dl-item:hover { border-color: #d1d5db; }

.catmod-op-dl-link {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 10px 14px;
    color: #1f2937 !important;
    text-decoration: none !important;
    font-size: 12px;
    line-height: 1.3;
    box-sizing: border-box;
}
.catmod-op-dl-doc {
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}
.catmod-op-dl-doc svg { width: 14px; height: 14px; }
.catmod-op-dl-title {
    flex: 1 1 auto;
    min-width: 0;
    /* Quebra em até 2 linhas em vez de estourar o bloco */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.35;
    color: inherit !important;
}
.catmod-op-dl-icon {
    color: #1f2937;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}
.catmod-op-dl-icon svg { width: 14px; height: 14px; }
.catmod-op-dl-link:hover { color: var(--catmod-op-accent); }
.catmod-op-dl-link:hover .catmod-op-dl-icon { color: var(--catmod-op-accent); }
.catmod-op-dl-link.is-disabled { opacity: .6; cursor: default; }

/* Quando o botão é do plugin Área Técnica — o JS do AT engancha em .at-btn[data-at-id].
   Neutralizamos o estilo padrão (fundo vermelho, padding, span extra) e tratamos como
   se fosse um link normal da nossa lista. */
.catmod-op-dl-link.at-btn,
.catmod-op-dl-link.at-btn:hover,
.catmod-op-dl-link.at-btn:focus,
.catmod-op-dl-link.at-btn:active {
    background: transparent !important;
    color: inherit !important;
    border: 0 !important;
    box-shadow: none !important;
    font: inherit !important;
    filter: none !important;
    width: 100%;
    text-align: left;
    cursor: pointer;
}
/* Esconde o span ↓ que o shortcode area_tecnica_botao adiciona automaticamente
   (não usamos mais o shortcode, mas se houver caso, garante neutro) */
.catmod-op-dl-link.at-btn > span[style*="margin-left"] { display: none !important; }

/* ============================================================
   Main (lado direito)
============================================================ */
.catmod-op-main { min-width: 0; }

.catmod-op-main-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.catmod-op-count {
    font-size: 14px;
    color: #6b7280;
    font-weight: 400;
}
.catmod-op-count strong { color: #111; font-weight: 700; }

/* Filtros ativos */
.catmod-op-filters {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 26px;
}
.catmod-op-filters-label {
    font-size: 13px;
    color: #6b7280;
}
.catmod-op-filters-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.catmod-op-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 7px 8px 7px 16px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #1f2937;
}
.catmod-op-chip-x {
    width: 22px; height: 22px;
    border: 0;
    background: transparent;
    color: #1f2937;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 2px;
    transition: all .15s ease;
}
.catmod-op-chip-x:hover { background: #f3f4f6; color: var(--catmod-op-accent); }
.catmod-op-reset {
    margin-left: auto;
    background: transparent;
    border: 0;
    color: #1f2937;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    cursor: pointer;
    padding: 4px 0;
    border-bottom: 1px solid #1f2937;
    line-height: 1;
}
.catmod-op-reset:hover { color: var(--catmod-op-accent); border-color: var(--catmod-op-accent); }

/* ---- Slider de cards (2 colunas) ---- */
.catmod-op-slider {
    position: relative;
    overflow: hidden;
}
.catmod-op-cards {
    display: flex;
    gap: 24px;
    transition: transform .4s ease;
    will-change: transform;
}
.catmod-op-card {
    flex: 0 0 calc(50% - 12px);
    max-width: calc(50% - 12px);
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: flex;
    flex-direction: column;
    padding: 16px;
    box-sizing: border-box;
}
.catmod-op-card.is-hidden { display: none; }

/* Nav (setas prev/next) */
.catmod-op-nav {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 32px;
}
.catmod-op-nav button {
    width: 48px; height: 48px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #d8d8d8;
    color: #222;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background .2s, color .2s, border-color .2s, transform .15s;
    outline: 0;
    box-shadow: none;
}
.catmod-op-nav button:hover:not(:disabled) {
    background: #111;
    color: #fff;
    border-color: #111;
    transform: translateY(-2px);
}
.catmod-op-nav button:disabled {
    opacity: .3;
    cursor: not-allowed;
}
.catmod-op-nav button:focus,
.catmod-op-nav button:active {
    outline: 0;
    box-shadow: none;
}
.catmod-op-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(16,24,40,.08);
}
.catmod-op-card-link {
    display: flex;
    flex-direction: column;
    text-decoration: none !important;
    color: inherit !important;
    height: 100%;
}
.catmod-op-card-image {
    aspect-ratio: 4 / 3;
    background: #f4f5f7;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 28px;
}
.catmod-op-card-image img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.catmod-op-card:hover .catmod-op-card-image img { transform: scale(1.04); }
.catmod-op-card-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #f4f5f7 0%, #e5e7eb 100%);
    color: rgba(226,35,26,.35);
    font-weight: 800;
    font-size: 56px;
    text-transform: uppercase;
}
.catmod-op-card-title {
    text-align: center;
    margin: 0 0 14px;
    padding: 0 16px;
    font-size: 22px;
    font-weight: 700;
    color: #111;
    line-height: 1.3;
}
.catmod-op-card-desc {
    text-align: center;
    margin: 0 0 28px;
    padding: 0 20px;
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
    flex: 1;
}
.catmod-op-card-cta {
    align-self: center;
    margin: 0 0 18px;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 12px;
    font-weight: 700;
    color: #111;
    text-transform: uppercase;
    letter-spacing: 1.8px;
}
.catmod-op-card-arrow {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid #d1d5db;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 1;
    transition: all .2s ease;
}
.catmod-op-card-link:hover .catmod-op-card-cta { color: var(--catmod-op-accent); }
.catmod-op-card-link:hover .catmod-op-card-arrow {
    background: var(--catmod-op-accent);
    border-color: var(--catmod-op-accent);
    color: #fff;
}

/* Estado vazio */
.catmod-blk-op-empty .catmod-op-empty-msg {
    margin: 28px 0 0;
    color: #6b7280;
    font-size: 14px;
}

/* ---- Responsivo ---- */
@media (max-width: 1024px) {
    .catmod-op-grid { grid-template-columns: 240px 1fr; gap: 36px; }
}
@media (max-width: 768px) {
    .catmod-blk-op { padding: 40px 18px; }
    .catmod-op-grid { grid-template-columns: 1fr; gap: 28px; }
    .catmod-op-title { font-size: 28px; }
    .catmod-op-cats { flex-direction: row; flex-wrap: wrap; }
    .catmod-op-cat { flex: 1 1 calc(50% - 4px); }
    .catmod-op-card {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .catmod-op-card-title { font-size: 18px; }
}
