/* =============================================
   Cruzeiro Engenharia — Hub de Licenciamento Sanitário
   Estilos exclusivos do hub (/licenciamento-sanitario/*).
   Complementa style.css — nunca sobrescreve componentes globais.
   Mobile-first | BEM naming | prefixo .san-
   ============================================= */

/* ----- Layout com coluna lateral (desktop) ----- */
.san-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
    align-items: start;
}
@media (min-width: 1024px) {
    .san-layout { grid-template-columns: minmax(0, 1fr) 340px; }
}
.san-main { min-width: 0; }
.san-aside { min-width: 0; }
@media (min-width: 1024px) {
    .san-aside { position: sticky; top: 96px; }
}

/* ----- Card de lead (lateral) ----- */
.san-lead {
    background: var(--primary);
    color: var(--white);
    border-radius: var(--border-radius-lg);
    padding: var(--space-xl);
    box-shadow: var(--shadow-lg, 0 10px 30px rgba(10,37,64,.25));
}
.san-lead__kicker {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #FFC79E;
    margin-bottom: var(--space-sm);
}
.san-lead h2, .san-lead h3 {
    color: var(--white);
    font-size: 1.25rem;
    margin-bottom: var(--space-sm);
}
.san-lead p { color: rgba(255,255,255,.88); font-size: 0.9375rem; margin-bottom: var(--space-md); }
.san-lead .btn { width: 100%; margin-bottom: var(--space-sm); }
.san-lead__tel {
    display: block;
    text-align: center;
    color: var(--white);
    font-weight: 700;
    font-size: 1.125rem;
    margin-top: var(--space-sm);
}
.san-lead__list { margin: var(--space-md) 0 0; font-size: 0.875rem; }
.san-lead__list li { padding: 4px 0 4px 26px; position: relative; color: rgba(255,255,255,.9); }
.san-lead__list li::before {
    content: '';
    position: absolute; left: 0; top: 8px;
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/70% no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/70% no-repeat;
}
.san-aside__nav {
    margin-top: var(--space-lg);
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    padding: var(--space-lg);
}
.san-aside__nav h3 { font-size: 0.9375rem; margin-bottom: var(--space-sm); color: var(--primary); }
.san-aside__nav a {
    display: block;
    padding: 6px 0;
    font-size: 0.875rem;
    color: var(--text-light);
    border-bottom: 1px dashed var(--gray-200);
}
.san-aside__nav a:last-child { border-bottom: 0; }
.san-aside__nav a:hover { color: var(--accent); }

/* ----- Faixa CTA laranja no meio da página ----- */
.san-band {
    background: linear-gradient(120deg, var(--accent) 0%, #F0803F 100%);
    color: var(--white);
    border-radius: var(--border-radius-lg);
    padding: var(--space-xl);
    margin: var(--space-2xl) 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}
@media (min-width: 768px) {
    .san-band { flex-direction: row; align-items: center; justify-content: space-between; }
}
.san-band h3 { color: var(--white); font-size: 1.25rem; margin-bottom: 4px; }
.san-band p { color: rgba(255,255,255,.92); margin: 0; font-size: 0.9375rem; }
.san-band__actions { display: flex; gap: var(--space-sm); flex-wrap: wrap; flex-shrink: 0; }
.san-band .btn--white { background: var(--white); color: var(--accent); border-color: var(--white); }
.san-band .btn--white:hover { background: var(--primary); color: var(--white); border-color: var(--primary); }
.san-band .btn--outline-white { border-color: rgba(255,255,255,.8); color: var(--white); }
.san-band .btn--outline-white:hover { background: rgba(255,255,255,.15); }

/* ----- KPIs (números de confiança) ----- */
.san-kpis {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md);
    margin: var(--space-xl) 0;
}
@media (min-width: 768px) { .san-kpis { grid-template-columns: repeat(4, 1fr); } }
.san-kpi {
    background: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    padding: var(--space-md);
    text-align: center;
}
.san-kpi__num { display: block; font-family: var(--font-heading); font-weight: 700; font-size: 1.5rem; color: var(--accent); }
.san-kpi__label { font-size: 0.8125rem; color: var(--text-light); }

/* ----- Chips (cidades / serviços / temas) ----- */
.san-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.san-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid var(--gray-200);
    border-radius: 100px;
    background: var(--white);
    color: var(--primary);
    font-size: 0.8125rem;
    font-weight: 600;
    transition: all var(--transition);
}
.san-chip:hover, .san-chip--active { border-color: var(--accent); color: var(--accent); background: var(--accent-light); }
.san-chip--muted { color: var(--text-muted); font-weight: 400; }

/* ----- Caixa informativa ----- */
.san-box {
    background: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-left: 4px solid var(--accent);
    border-radius: var(--border-radius-lg);
    padding: var(--space-lg);
    margin: var(--space-lg) 0;
}
.san-box--azul { border-left-color: var(--primary); }
.san-box--verde { border-left-color: var(--success); }
.san-box--alerta { border-left-color: var(--warning); background: #FFFBEB; }
.san-box h3, .san-box h4 { font-size: 1rem; margin-bottom: var(--space-sm); color: var(--primary); }
.san-box p:last-child { margin-bottom: 0; }
.san-box ul { padding-left: 1.25rem; list-style: disc; }
.san-box li { margin-bottom: 4px; }

/* ----- Ficha da Vigilância Sanitária local ----- */
.san-visa {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
}
@media (min-width: 768px) { .san-visa { grid-template-columns: 1fr 1fr; } }
.san-visa__item { background: var(--white); border: 1px solid var(--gray-200); border-radius: var(--border-radius); padding: var(--space-md); }
.san-visa__label { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); margin-bottom: 4px; }
.san-visa__value { font-weight: 600; color: var(--primary); word-break: break-word; }
.san-visa__value a { color: var(--accent); text-decoration: underline; }

/* ----- Lista de documentos / checklist ----- */
.san-check { list-style: none; padding: 0; margin: 0 0 var(--space-lg); }
.san-check li {
    position: relative;
    padding: 8px 0 8px 32px;
    border-bottom: 1px solid var(--gray-100);
}
.san-check li::before {
    content: '';
    position: absolute; left: 0; top: 10px;
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--accent-light);
    border: 2px solid var(--accent);
}
.san-check li::after {
    content: '';
    position: absolute; left: 6px; top: 14px;
    width: 8px; height: 5px;
    border-left: 2px solid var(--accent);
    border-bottom: 2px solid var(--accent);
    transform: rotate(-45deg);
}

/* ----- Fontes consultadas ----- */
.san-fontes {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    padding: var(--space-lg);
    margin-top: var(--space-xl);
    font-size: 0.875rem;
}
.san-fontes h3 { font-size: 1rem; color: var(--primary); margin-bottom: var(--space-sm); }
.san-fontes ol { padding-left: 1.5rem; list-style: decimal; margin: 0; }
.san-fontes li { margin-bottom: 6px; color: var(--text-light); }
.san-fontes a { color: var(--accent); text-decoration: underline; }
.san-fontes__dl {
    display: inline-block;
    margin-left: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 1px 8px;
    border-radius: 100px;
    background: var(--accent-light);
    color: var(--accent);
    text-decoration: none !important;
}

/* ----- Tabela de legislação ----- */
.san-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: var(--space-lg) 0; }
.san-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; min-width: 640px; }
.san-table th, .san-table td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--gray-200); }
.san-table th { background: var(--primary); color: var(--white); font-weight: 600; font-size: 0.8125rem; }
.san-table tr:nth-child(even) td { background: var(--gray-50); }
.san-table a { color: var(--accent); text-decoration: underline; }
.san-tag { display: inline-block; padding: 2px 8px; border-radius: 100px; font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.san-tag--federal { background: #E6F0FF; color: #1D4ED8; }
.san-tag--estadual { background: #ECFDF5; color: #047857; }
.san-tag--municipal { background: var(--accent-light); color: var(--accent); }
.san-tag--conselho { background: #F3E8FF; color: #6D28D9; }
.san-tag--tecnica { background: #FEF3C7; color: #B45309; }

/* ----- Cards de download ----- */
.san-docs { display: grid; grid-template-columns: 1fr; gap: var(--space-md); }
@media (min-width: 768px) { .san-docs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .san-docs { grid-template-columns: repeat(3, 1fr); } }
.san-doc {
    display: flex;
    gap: var(--space-md);
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    padding: var(--space-md);
    transition: all var(--transition);
}
.san-doc:hover { border-color: var(--accent); box-shadow: var(--shadow-md, 0 4px 14px rgba(0,0,0,.08)); }
.san-doc__icon { flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--border-radius); background: var(--accent-light); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 0.6875rem; font-weight: 800; letter-spacing: .05em; }
.san-doc__title { font-size: 0.9375rem; font-weight: 700; color: var(--primary); margin-bottom: 2px; }
.san-doc__meta { font-size: 0.75rem; color: var(--text-muted); margin-bottom: 6px; }
.san-doc__links a { font-size: 0.8125rem; font-weight: 600; color: var(--accent); margin-right: 10px; }

/* ----- Grade de cidades ----- */
.san-regiao { margin-bottom: var(--space-2xl); }
.san-regiao h3 { font-size: 1.125rem; color: var(--primary); margin-bottom: var(--space-md); padding-bottom: 6px; border-bottom: 2px solid var(--accent-light); }
.san-cidades { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
@media (min-width: 640px) { .san-cidades { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .san-cidades { grid-template-columns: repeat(4, 1fr); } }
.san-cidade {
    display: block;
    padding: 10px 12px;
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius);
    background: var(--white);
    color: var(--primary);
    font-size: 0.875rem;
    font-weight: 600;
    transition: all var(--transition);
}
.san-cidade:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }
.san-cidade small { display: block; font-weight: 400; color: var(--text-muted); font-size: 0.75rem; }

/* ----- Busca do FAQ ----- */
.san-search { position: relative; max-width: 720px; margin: 0 auto var(--space-xl); }
.san-search input {
    width: 100%;
    padding: 14px 18px 14px 48px;
    border: 2px solid var(--gray-300);
    border-radius: 100px;
    font-size: 1rem;
    color: var(--gray-800, #333333);
    background: var(--white);
}
.san-search input::placeholder { color: var(--text-muted, #666666); }
.san-search input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(232,97,26,.12); }
.san-search svg { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: var(--text-muted); }
.san-search__status { text-align: center; font-size: 0.875rem; color: var(--text-muted); margin-top: 8px; min-height: 1.2em; }
.san-faq-tema { margin-bottom: var(--space-2xl); }
.san-faq-tema h2 { font-size: 1.375rem; margin-bottom: var(--space-md); }
.san-faq-tema[hidden] { display: none; }
.faq__item[hidden] { display: none; }
.san-faq-fonte { font-size: 0.8125rem; color: var(--text-muted); margin-top: 8px; }
.san-faq-fonte a { color: var(--accent); text-decoration: underline; }

/* ----- Serviços em cards compactos ----- */
.san-serv {
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--border-radius-lg);
    padding: var(--space-lg);
    color: inherit;
    transition: all var(--transition);
    height: 100%;
}
.san-serv:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: var(--shadow-lg, 0 10px 30px rgba(0,0,0,.08)); }
.san-serv__num { font-size: 0.75rem; font-weight: 800; color: var(--accent); letter-spacing: .1em; }
.san-serv__title { font-size: 1.0625rem; font-weight: 700; color: var(--primary); }
.san-serv__desc { font-size: 0.875rem; color: var(--text-light); flex: 1; }
.san-serv__link { font-size: 0.875rem; font-weight: 700; color: var(--accent); }
.san-serv--destaque { border-color: var(--accent); background: linear-gradient(180deg, #FFF8F3 0%, var(--white) 100%); }

/* ----- Fluxo "6 etapas" do hub ----- */
.san-fluxo { display: grid; grid-template-columns: 1fr; gap: var(--space-md); counter-reset: fluxo; }
@media (min-width: 768px) { .san-fluxo { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .san-fluxo { grid-template-columns: repeat(3, 1fr); } }
.san-fluxo__item { position: relative; background: var(--white); border: 1px solid var(--gray-200); border-radius: var(--border-radius-lg); padding: var(--space-lg) var(--space-lg) var(--space-lg) 68px; }
.san-fluxo__item::before {
    counter-increment: fluxo;
    content: counter(fluxo);
    position: absolute; left: 20px; top: 20px;
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--accent); color: var(--white);
    font-weight: 800; display: flex; align-items: center; justify-content: center;
}
.san-fluxo__item h3 { font-size: 1rem; margin-bottom: 4px; }
.san-fluxo__item p { font-size: 0.875rem; color: var(--text-light); margin: 0; }
.san-fluxo__item a { color: var(--accent); font-weight: 600; }

/* ----- Aviso de conteúdo verificado ----- */
.san-verif { font-size: 0.8125rem; color: var(--text-muted); margin-top: var(--space-md); }

/* ----- Hero do hub: badges com destaque ----- */
.san-hero-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-lg); }
.san-hero-badges span { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: var(--white); padding: 6px 12px; border-radius: 100px; font-size: 0.8125rem; font-weight: 600; }