/* =====================================================================
   Base de identidad v2 — Fase 2 (propagación). Solo páginas públicas (html.ar-v2;
   el admin Filament usa su propio layout y NO lleva esta clase).
   Fundamentos: fondo neutro/blanco + tipografía y color del CONTENIDO. La
   cabecera/footer global y los componentes de cada pantalla se rediseñan en sus
   propias fases. NO recolorea enlaces de la cabecera (queda para su fase).
   ===================================================================== */

/* Cabecera global: sombra sutil (la deja "flotar" sobre el contenido al hacer
   scroll). Es sticky en todas las páginas. */
/* Sombra sutil pero perceptible bajo la cabecera (sticky en todas las páginas). */
html.ar-v2 .site-header,
html.ar-v2 body.site-header-scrolled .site-header {
    box-shadow: 0 4px 14px rgba(16, 24, 32, .32) !important;
}

/* Fondo de página blanco (la cabecera y el footer mantienen su fondo propio). */
html.ar-v2 body {
    background: #ffffff;
    color: var(--ui-text);
    font-family: var(--ui-font);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* Tipografía sobria del área de contenido (entre cabecera y footer). */
html.ar-v2 .site-main {
    color: var(--ui-text);
    font-size: var(--ui-text-base);
    line-height: var(--ui-leading-normal);
}

html.ar-v2 .site-main h1,
html.ar-v2 .site-main h2,
html.ar-v2 .site-main h3,
html.ar-v2 .site-main h4 {
    color: var(--ui-text-strong);
    letter-spacing: var(--ui-tracking-tight);
    font-weight: var(--ui-w-semi);
    line-height: var(--ui-leading-tight);
}

/* =====================================================================
   Breadcrumb (global): una sola línea con scroll horizontal oculto. Si cabe
   entero queda a la izquierda; si no, ar-breadcrumb.js lo desplaza al final
   para mostrar los últimos elementos (página actual y su entorno).
   ===================================================================== */
html.ar-v2 .ar-breadcrumb,
html.ar-v2 .property-breadcrumb {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}
html.ar-v2 .ar-breadcrumb::-webkit-scrollbar,
html.ar-v2 .property-breadcrumb::-webkit-scrollbar { display: none !important; }
html.ar-v2 .ar-breadcrumb > *,
html.ar-v2 .property-breadcrumb > * { flex: 0 0 auto; white-space: nowrap; }


/* ===== Identidad v2 (contenido/legales) — fusionado desde ar-content-v2.css ===== */
/* =====================================================================
   Identidad v2 — Páginas de CONTENIDO y LEGALES. Scope: html.ar-v2 +
   .legal-page / .portal-page. Tokens --ui-*. Sobrio, blanco, verde acento.
   ===================================================================== */

/* ===================== LEGALES (.legal-page) ======================== */
html.ar-v2 .legal-page {
    max-width: 1080px !important;
    margin: 0 auto !important;
    padding: var(--ui-space-12) var(--ui-gutter) var(--ui-space-16) !important;
    color: var(--ui-text);
    font-size: var(--ui-text-base);
    line-height: var(--ui-leading-relaxed);
    box-sizing: border-box;
}
html.ar-v2 .legal-page > h1 {
    font-size: var(--ui-text-3xl, 28px);
    font-weight: var(--ui-w-bold);
    color: var(--ui-text-strong);
    letter-spacing: var(--ui-tracking-tight);
    line-height: var(--ui-leading-tight);
    margin: 0 0 var(--ui-space-2);
}
html.ar-v2 .legal-page > .muted {
    color: var(--ui-text-muted) !important;
    font-size: var(--ui-text-sm);
    margin: 0 0 var(--ui-space-8);
}

/* Secciones: sin caja, separación por línea muy sutil */
html.ar-v2 .legal-page .property-section {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: var(--ui-space-8) 0 !important;
    margin: 0 !important;
}
html.ar-v2 .legal-page .property-section + .property-section {
    border-top: 1px solid rgba(16, 24, 32, .06) !important;
}

html.ar-v2 .legal-page h2 {
    font-size: var(--ui-text-xl);
    font-weight: var(--ui-w-semi);
    color: var(--ui-text-strong);
    letter-spacing: var(--ui-tracking-tight);
    margin: 0 0 var(--ui-space-3);
}
html.ar-v2 .legal-page h3 {
    font-size: var(--ui-text-md);
    font-weight: var(--ui-w-semi);
    color: var(--ui-text-strong);
    margin: var(--ui-space-5) 0 var(--ui-space-2);
}
html.ar-v2 .legal-page p { color: var(--ui-text); margin: 0 0 var(--ui-space-4); }
html.ar-v2 .legal-page p:last-child { margin-bottom: 0; }
html.ar-v2 .legal-page ul,
html.ar-v2 .legal-page ol { margin: 0 0 var(--ui-space-4); padding-left: var(--ui-space-5); }
html.ar-v2 .legal-page li { margin-bottom: var(--ui-space-2); color: var(--ui-text); }
html.ar-v2 .legal-page a { color: var(--ui-accent); text-decoration: underline; text-underline-offset: 2px; }
html.ar-v2 .legal-page a:hover { color: var(--ui-accent-strong); }
html.ar-v2 .legal-page strong { color: var(--ui-text-strong); font-weight: var(--ui-w-semi); }

/* Pares clave/valor (Responsable, Email, etc.) en dos columnas */
html.ar-v2 .legal-page dl {
    display: grid;
    grid-template-columns: minmax(140px, auto) 1fr;
    gap: var(--ui-space-2) var(--ui-space-6);
    margin: 0;
}
html.ar-v2 .legal-page dt { color: var(--ui-text-soft); }
html.ar-v2 .legal-page dt strong { color: var(--ui-text-strong); font-weight: var(--ui-w-medium); }
html.ar-v2 .legal-page dd { margin: 0; color: var(--ui-text); }
@media (max-width: 560px) {
    html.ar-v2 .legal-page dl { grid-template-columns: 1fr; gap: 2px var(--ui-space-2); }
    html.ar-v2 .legal-page dd { margin: 0 0 var(--ui-space-3); }
}