@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
/* 1. ESTO CORRIGE EL BLOQUE COMPLETO Y LO CENTRA EN LA PANTALLA */
.content-wrapper {
    font-family: Domine, 'Times New Roman', serif; /* Se añade Times New Roman como respaldo si Domine no carga */
    width: 100%;
    
    /* CAMBIO CLAVE: Cambiamos el fondo a gris para que se vea por detrás de la hoja */
    background-image: url('img/fondoradio2.png'); /* Fondo gris de la imagen original */
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center; /* Centra el contenido horizontalmente */
    width: 100%;
    /* AGREGADO: Centra la hoja verticalmente si hay espacio de sobra y le da altura completa */
    align-items: center;     
    min-height: 100vh;       
    
    padding: 60px 20px;      /* Aumentamos un poco el espacio arriba y abajo para que luzca el fondo */
    box-sizing: border-box;  /* Evita que el padding altere el ancho total */
}

/* 2. ESTO CONTROLA EL TEXTO DEL AVISO PARA QUE NO SE EXTENDA AL INFINITO */
.document-container {
    max-width: 780px;        /* El ancho perfecto para que un texto legal sea legible */
    width: 100%;             /* Se adapta a pantallas más chicas o celulares */
    
    /* CAMBIO CLAVE: Ahora el contenedor es la "hoja blanca" donde vive tu texto */
    background-image: url('img/fondoradio1.png'); /* Fondo blanco de la hoja */
    padding: 50px 40px;      /* Espaciado interno para que los textos respiren dentro de la hoja */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;    
    /* AGREGADO: El marco perimetral y la sombra que le da volumen sobre el fondo gris */
    border: 1px solid #d1d1d1; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); 
    
    border-radius: 4px;      /* Suaviza ligeramente las esquinas de tu documento */
    box-sizing: border-box;
    max-width: 780px;
    width: 90%; /* Ajuste para que tenga aire en los costados en celular */
    margin: 40px auto; /* Centrado en la página */
    
    /* CAMBIO: Fondo semitransparente (Blanco con 85% de opacidad) */
    background-image: linear-gradient(rgba(255, 255, 255, 0.85), rgba(206, 206, 206, 0.85)), url('img/fondoradio1.png'); 
    
    /* EFECTO PRO: Desenfoque del fondo (Glassmorphism) */
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px); /* Compatibilidad con Safari */
    
    padding: 50px 40px;
    border: 1px solid rgba(255, 255, 255, 0.3); /* Borde sutil */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    box-sizing: border-box;
    text-align: center;
}

/* 3. FORMATO INDIVIDUAL DEL TEXTO */
.main-title {
    text-align: center;      /* Fuerza a que el título principal de la página esté centrado */
    margin-top: 0;           /* AGREGADO: Quita espacio muerto al inicio del documento */
    margin-bottom: 30px;
    font-size: 28px;
}

/* Corrección para los subtítulos legales (como el punto 3 de la imagen) */
.seccion-titulo {
    font-size: 22px;
    font-weight: bold;
    text-align: center;        /* Los subtítulos de las secciones van alineados a la izquierda */
    text-transform: uppercase; /* Asegura las mayúsculas de la imagen original */
    margin-top: 10px;
    margin-bottom: 20px;
    color: #000000;

}


p {
    text-align: center;     /* Hace que los párrafos queden alineados como en un libro */
    line-height: 1.6;        /* Separa las líneas para que no se canse la vista */
    margin-bottom: 22px;     /* Separa un párrafo del siguiente */
    font-weight: normal;
    font-size: 16px;
    color: #000000;          /* Asegura el color negro puro de imprenta */
    font-family: Mon;

}