/**
 * Template Legal & Editorial - Grupo Casanova
 * 
 * Estilização completa e fiel ao Figma "Privacidade v4" para páginas legais e de conteúdo
 * com suporte a controle de largura pelo editor Gutenberg (Blocos de Grupo, Alinhamento Amplo/Total).
 * 
 * @package GrupoCasaNova
 */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,400;0,600;0,700;1,400;1,600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,400;1,600&display=swap');

/* ==========================================================================
   1. Container Principal e Fundo Papel Oficial
   ========================================================================== */
body.page-template-template-legal,
body.page-template-default.page {
    background-color: #F6F1E8;
}

.site-main--legal {
    position: relative;
    width: 100%;
    background-color: #F6F1E8;
    isolation: isolate;
    min-height: calc(100vh - 88px - 397px);
}

.section-legal {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: clamp(48px, 6vw, 64px) clamp(20px, 5vw, 64px) clamp(80px, 10vw, 128px);
    isolation: isolate;
    box-sizing: border-box;
    background-color: #F6F1E8;
    overflow: hidden;
}

/* ==========================================================================
   2. Background Pattern & Fade Radial (Figma: BG/SectionBG)
   ========================================================================== */
.section-legal__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.section-legal__pattern {
    position: absolute;
    inset: 0;
    background-image: url('../images/pattern-casanova.svg');
    background-repeat: repeat;
    background-position: center center;
    background-size: 240px 240px;
    opacity: 0.15;
}

.section-legal__fade {
    position: absolute;
    inset: 0;
    background: radial-gradient(50% 50% at 50% 50%, rgba(246, 241, 232, 0) 0%, rgba(246, 241, 232, 0.3) 60%, #F6F1E8 100%);
}

/* ==========================================================================
   3. Coluna Externa de Conteúdo (Suporte a 720px padrão, 1152px amplo e grupos personalizados)
   ========================================================================== */
.section-legal__column {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    gap: 48px;
    width: 100%;
    max-width: 1152px;
    margin: 0 auto;
    box-sizing: border-box;
}

/* ==========================================================================
   4. SectionTitle Editorial (Figma: centralizado, 720px, gap 24px)
   ========================================================================== */
.section-legal__header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
    gap: 24px;
    width: 100%;
    max-width: 720px;
    text-align: center;
    box-sizing: border-box;
    margin: 0 auto;
}

/* Régua (Figma: 48px x 3px, #880922) */
.section-legal__ruler {
    width: 48px;
    height: 3px;
    background-color: #880922;
    border-radius: 2px;
    flex: none;
    margin: 0 auto;
}

/* Grupo de texto do cabeçalho (Figma: gap 12px) */
.section-legal__titles {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
}

/* Overline (Figma: Source Sans 3, 600, 14px, line 20px, letter-spacing 0.02em, #751320) */
.section-legal__overline {
    display: block;
    width: 100%;
    max-width: 720px;
    font-family: 'Source Sans 3', sans-serif !important;
    font-style: normal;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    text-align: center !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
    color: #751320 !important;
    margin: 0;
    padding: 0;
}

/* Título Principal (Figma: Source Serif Pro, 600, 44px, line 106%, letter-spacing -0.015em, #30090C) */
.section-legal__title {
    display: block;
    width: 100%;
    max-width: 720px;
    font-family: 'Source Serif Pro', 'Source Serif 4', Georgia, serif !important;
    font-style: normal;
    font-weight: 600 !important;
    font-size: clamp(32px, 4vw, 44px) !important;
    line-height: 106% !important;
    text-align: center !important;
    letter-spacing: -0.015em !important;
    text-transform: uppercase !important;
    color: #30090C !important;
    margin: 0;
    padding: 0;
}

/* Subtítulo (Figma: Source Sans 3, 400, 22px, line 150%, #3A3733) */
.section-legal__subtitle {
    display: block;
    width: 100%;
    max-width: 720px;
    font-family: 'Source Sans 3', sans-serif !important;
    font-style: normal;
    font-weight: 400 !important;
    font-size: clamp(18px, 2vw, 22px) !important;
    line-height: 150% !important;
    text-align: center !important;
    color: #3A3733 !important;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   5. Conteúdo Editorial & Controle de Largura no Gutenberg
   ========================================================================== */
.section-legal__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
}

.section-legal__body {
    width: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* 5.1 Largura Padrão Editorial (720px Centralizado para elementos soltos) */
.section-legal__body > p,
.section-legal__body > h2,
.section-legal__body > h3,
.section-legal__body > h4,
.section-legal__body > h5,
.section-legal__body > h6,
.section-legal__body > ul,
.section-legal__body > ol,
.section-legal__body > blockquote,
.section-legal__body > table,
.section-legal__body > .wp-block-heading,
.section-legal__body > .wp-block-paragraph,
.section-legal__body > .wp-block-list,
.section-legal__body > .wp-block-table,
.section-legal__body > .wp-block-quote {
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* 5.2 Bloco de Grupo (Group) e Contêineres: Liberdade para o Usuário */
.section-legal__body > .wp-block-group,
.section-legal__body > .wp-block-columns,
.section-legal__body > .wp-block-cover,
.section-legal__body > .wp-block-image {
    width: 100%;
    max-width: 720px; /* Padrão se não alterado */
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* Alinhamento Amplo do Gutenberg (alignwide: até 1152px) */
.section-legal__body .alignwide,
.section-legal__body > .alignwide {
    width: 100% !important;
    max-width: 1152px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Alinhamento Total do Gutenberg (alignfull: 100%) */
.section-legal__body .alignfull,
.section-legal__body > .alignfull {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Suporte à largura personalizada definida inline no Bloco de Grupo pelo Gutenberg */
.section-legal__body .wp-block-group[style*="max-width"],
.section-legal__body > .wp-block-group[style*="max-width"],
.section-legal__body .wp-block-group[style*="width"],
.section-legal__body > .wp-block-group[style*="width"] {
    margin-left: auto;
    margin-right: auto;
}

/* Elementos dentro do Bloco de Grupo preenchem a largura do grupo configurada pelo usuário */
.section-legal__body .wp-block-group > p,
.section-legal__body .wp-block-group > h2,
.section-legal__body .wp-block-group > h3,
.section-legal__body .wp-block-group > h4,
.section-legal__body .wp-block-group > ul,
.section-legal__body .wp-block-group > ol,
.section-legal__body .wp-block-group > table,
.section-legal__body .wp-block-group > blockquote,
.section-legal__body .wp-block-group .wp-block-heading,
.section-legal__body .wp-block-group .wp-block-paragraph,
.section-legal__body .wp-block-group .wp-block-list {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Quando o Grupo está no modo "Inner blocks use content width" (.is-layout-constrained) */
.section-legal__body .wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    margin-left: auto !important;
    margin-right: auto !important;
}



/* Título de Tópico / H2 (Figma: Source Serif Pro, 600, 32px, line 112%, letter-spacing -0.01em, #30090C) */
.section-legal__body h2,
.section-legal__body .wp-block-heading,
.section-legal__content h2 {
    font-family: 'Source Serif Pro', 'Source Serif 4', Georgia, serif !important;
    font-style: normal;
    font-weight: 600 !important;
    font-size: clamp(24px, 3vw, 32px) !important;
    line-height: 112% !important;
    letter-spacing: -0.01em !important;
    color: #30090C !important;
    margin-top: 48px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    text-align: left !important;
}

.section-legal__body > h2:first-child,
.section-legal__content > h2:first-child {
    margin-top: 0 !important;
}

/* H3 Editorial */
.section-legal__body h3,
.section-legal__content h3 {
    font-family: 'Source Serif Pro', 'Source Serif 4', Georgia, serif !important;
    font-style: normal;
    font-weight: 600 !important;
    font-size: clamp(20px, 2.5vw, 24px) !important;
    line-height: 120% !important;
    letter-spacing: -0.005em !important;
    color: #30090C !important;
    margin-top: 32px !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
    text-align: left !important;
}

/* Parágrafos de Texto (Figma: Source Sans 3, 400, 18px, line 150%, #3A3733) */
.section-legal__body p {
    font-family: 'Source Sans 3', sans-serif !important;
    font-style: normal;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 150% !important;
    color: #3A3733 !important;
    margin-top: 0;
    margin-bottom: 16px;
}

.section-legal__body p:last-child {
    margin-bottom: 0;
}

/* Remove quebras de linha acidentais no início dos parágrafos do editor */
.section-legal__body p > br:first-child,
.section-legal__content p > br:first-child {
    display: none;
}

/* Listas Não Ordenadas (Figma: bullets circulares limpos, recuo de 20px) */
.section-legal__body ul,
.section-legal__body .wp-block-list {
    list-style-type: disc !important;
    padding-left: 20px !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    box-sizing: border-box;
}

.section-legal__body ul li,
.section-legal__body .wp-block-list li {
    font-family: 'Source Sans 3', sans-serif !important;
    font-style: normal;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 150% !important;
    color: #3A3733 !important;
    margin-bottom: 8px;
    padding-left: 4px;
}

.section-legal__body ul li:last-child {
    margin-bottom: 0;
}

/* Listas Ordenadas (Numéricas) */
.section-legal__body ol {
    padding-left: 24px !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    box-sizing: border-box;
}

.section-legal__body ol li {
    font-family: 'Source Sans 3', sans-serif !important;
    font-style: normal;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 150% !important;
    color: #3A3733 !important;
    margin-bottom: 8px;
}

/* Negritos com tom escuro premium (#30090C) */
.section-legal__body strong,
.section-legal__body b {
    font-weight: 600 !important;
    color: #30090C !important;
}

/* Links editoriais */
.section-legal__body a {
    color: #880922 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.section-legal__body a:hover,
.section-legal__body a:focus {
    color: #751320 !important;
    text-decoration-color: #751320 !important;
}

/* Citações / Blockquotes */
.section-legal__body blockquote {
    border-left: 3px solid #880922 !important;
    padding: 8px 0 8px 24px !important;
    margin: 24px auto !important;
    font-family: 'Source Serif Pro', 'Source Serif 4', Georgia, serif !important;
    font-style: italic !important;
    font-size: clamp(17px, 2vw, 20px) !important;
    line-height: 150% !important;
    color: #510C15 !important;
}

/* Tabelas / Dados */
.section-legal__body table {
    border-collapse: collapse;
    margin: 24px auto;
    font-family: 'Source Sans 3', sans-serif !important;
    font-size: 16px;
    line-height: 150%;
}

.section-legal__body th,
.section-legal__body td {
    padding: 12px 16px;
    border-bottom: 1px solid #E8E2D6;
    text-align: left;
}

.section-legal__body th {
    font-weight: 600;
    color: #30090C;
    border-bottom: 2px solid #880922;
}

/* ==========================================================================
   6. Responsividade (Mobile First e Fluid Clamp)
   ========================================================================== */
@media (max-width: 768px) {
    .section-legal {
        padding-top: 40px;
        padding-bottom: 64px;
    }

    .section-legal__column {
        gap: 32px;
    }

    .section-legal__header {
        gap: 20px;
    }

    .section-legal__body > p:first-of-type,
    .section-legal__intro {
        margin-bottom: 32px !important;
    }

    .section-legal__body h2,
    .section-legal__body .wp-block-heading,
    .section-legal__content h2 {
        margin-top: 32px !important;
    }
}