/* ============================================================
   Feithdoor - Condiciones de Uso
   Hoja de estilos 100% responsive (rem, em, %, clamp).
   Mantiene tipografía y paleta de account-status-info.html.
   ============================================================ */

* {
    box-sizing: border-box;
}

html {
    /* Tipografía base fluida: ~14px (móvil) -> ~16px (desktop) */
    font-size: clamp(0.875rem, 0.78rem + 0.45vw, 1rem);
}

body {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: #fafafa;
    color: #262626;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ----------- Contenedor principal ----------- */
.conditions-page {
    max-width: 58.4375rem;
    width: 100%;
    margin: 1.25rem auto;
    padding: clamp(1rem, 2vw + 0.5rem, 2rem);
    background-color: #fff;
    border: 0.0625rem solid #dbdbdb;
    border-radius: 0.1875rem;
    min-height: calc(100vh - 2.5rem);
    display: flex;
    flex-direction: column;
}

/* ----------- Encabezado ----------- */
.status-header {
    margin-bottom: 2rem;
    border-bottom: 0.0625rem solid #dbdbdb;
    padding-bottom: 1rem;
}

.header-content h1 {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: #262626;
}

.header-content p {
    margin: 0.5rem 0 0;
    color: #8e8e8e;
    font-size: 0.875rem;
}

/* ----------- Intro ----------- */
.intro-section {
    margin-bottom: 2rem;
}

.intro-text {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #262626;
}

/* ----------- Secciones ----------- */
.status-section {
    margin-bottom: 2rem;
}

.status-section h2 {
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
    color: #262626;
}

.info-section {
    color: #262626;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.main-text {
    margin: 0 0 1rem;
    color: #262626;
}

.action-text {
    margin: 1rem 0 0;
    color: #262626;
}

/* ----------- Listas ----------- */
.features-list {
    margin: 0;
    padding-left: 1.5rem;
}

.features-list li {
    margin-bottom: 0.5rem;
    color: #262626;
}

.features-list li:last-child {
    margin-bottom: 0;
}

.features-list li strong {
    color: #262626;
    font-weight: 600;
}

/* ----------- Bloque de pautas ----------- */
.guidelines-content {
    margin: 1rem 0 0;
    padding: clamp(0.75rem, 1.2vw + 0.25rem, 1rem);
    background-color: #fafafa;
    border-radius: 0.5rem;
}

.guideline-text {
    margin: 0 0 1.25rem;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.guideline-text:last-child {
    margin-bottom: 0;
}

.guideline-text strong {
    color: #262626;
    display: block;
    margin-bottom: 0.375rem;
    font-weight: 600;
}

/* ----------- Enlaces ----------- */
.link-text {
    color: #4f5feb;
    text-decoration: none;
    font-weight: 600;
}

.link-text:hover {
    text-decoration: underline;
}

a {
    color: #4f5feb;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ----------- Texto monoespaciado para correos institucionales ----------- */
.mono {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
    font-size: 0.875em;
    background-color: #f3f4f6;
    padding: 0.0625rem 0.375rem;
    border-radius: 0.25rem;
    color: #262626;
    word-break: break-all;
}

/* ----------- Footer ----------- */
.copyright {
    margin-top: auto;
    text-align: center;
    color: #8e8e8e;
    font-size: 0.75rem;
    padding-top: 1rem;
    border-top: 0.0625rem solid #dbdbdb;
}

.copyright p {
    margin: 0.25rem 0;
}

/* ============================================================
   Responsive
   ============================================================ */

/* Tablet */
@media (max-width: 56.25em) {
    .conditions-page {
        margin: 0;
        border: none;
        border-radius: 0;
        min-height: 100vh;
    }
}

/* Móvil pequeño */
@media (max-width: 30em) {
    .conditions-page {
        padding: 1rem;
    }

    .status-header {
        margin-bottom: 1.25rem;
        padding-bottom: 0.75rem;
    }

    .header-content h1 {
        font-size: 1.25rem;
        letter-spacing: -0.015em;
    }

    .status-section {
        margin-bottom: 1.5rem;
    }

    .status-section h2 {
        font-size: 0.9375rem;
    }

    .info-section,
    .intro-text,
    .guideline-text {
        font-size: 0.875rem;
    }

    .features-list {
        padding-left: 1.25rem;
    }
}

/* Pantallas grandes: ligero "respiro" extra */
@media (min-width: 90em) {
    html {
        font-size: 1.0625rem;
    }
}
