/* =====================================================
   PÁGINAS — Design system
   Paleta: blancos cálidos, azul profundo, dorado.
   Tipografía: Fraunces (serif display) + Manrope (sans body).
   Estética: estudio editorial, minimalismo refinado.
   ===================================================== */

:root {
    /* — paleta — */
    --azul-profundo: #0B2447;
    --azul-medio: #19376D;
    --azul-claro: #576CBC;
    --azul-pastel: #E8EEF8;
    --dorado: #B89348;
    --dorado-suave: #D8B96A;
    --dorado-pastel: #F4EAD2;
    --blanco: #FFFFFF;
    --hueso: #FAF7F1;
    --hueso-2: #F2EEE3;
    --gris-1: #E8E5DC;
    --gris-2: #B8B3A6;
    --gris-texto: #5A574F;
    --negro: #1A1A1A;
    --verde-ok: #2F7D5D;
    --rojo-err: #B3322F;

    /* — tipografía — */
    --serif: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
    --sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* — métricas — */
    --rad-sm: 4px;
    --rad: 8px;
    --rad-lg: 14px;
    --shadow-sm: 0 1px 2px rgba(11,36,71,.06);
    --shadow: 0 4px 20px -8px rgba(11,36,71,.15);
    --shadow-lg: 0 16px 50px -12px rgba(11,36,71,.18);
    --max-w: 1180px;
    --header-h: 72px;
}

/* — base — */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
    font-family: var(--sans);
    color: var(--negro);
    background: var(--hueso);
    font-size: 16px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 { font-family: var(--serif); font-weight: 500; line-height: 1.15; letter-spacing: -.01em; color: var(--azul-profundo); }
h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 400; }
h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }
h5 { font-size: .85rem; text-transform: uppercase; letter-spacing: .12em; font-family: var(--sans); font-weight: 600; color: var(--azul-medio); }

a { color: var(--azul-medio); text-decoration: none; }
a:hover { color: var(--azul-profundo); }
p { color: var(--gris-texto); }

img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; border: 0; background: transparent; }

/* — TOPBAR — */
.topbar {
    height: var(--header-h);
    background: var(--blanco);
    border-bottom: 1px solid var(--gris-1);
    display: flex;
    align-items: center;
    padding: 0 24px;
    gap: 32px;
    position: sticky;
    top: 0;
    z-index: 50;
}
.brand { display: flex; align-items: baseline; gap: 8px; }
.brand-mark { font-family: var(--serif); font-size: 28px; color: var(--dorado); font-weight: 600; line-height: 1; }
.brand-text { font-family: var(--serif); font-size: 22px; color: var(--azul-profundo); font-weight: 500; letter-spacing: -.02em; }

.nav-main { display: flex; gap: 28px; margin-left: 16px; }
.nav-main a { color: var(--gris-texto); font-size: 14.5px; font-weight: 500; }
.nav-main a:hover { color: var(--azul-profundo); }

.nav-auth { margin-left: auto; display: flex; gap: 10px; align-items: center; }

@media (max-width: 720px) {
    .topbar { padding: 0 16px; gap: 12px; }
    .nav-main { display: none; }
    .brand-text { display: none; }
}

/* — BUTTONS — */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 8px;
    font-family: var(--sans);
    font-size: 14.5px; font-weight: 600;
    padding: 11px 20px;
    border-radius: var(--rad);
    transition: all .18s ease;
    cursor: pointer;
    border: 1px solid transparent;
    white-space: nowrap;
}
.btn-primary { background: var(--azul-profundo); color: var(--blanco); }
.btn-primary:hover { background: var(--azul-medio); color: var(--blanco); transform: translateY(-1px); }
.btn-gold { background: var(--dorado); color: var(--blanco); }
.btn-gold:hover { background: #a47e36; color: var(--blanco); }
.btn-ghost { color: var(--azul-profundo); }
.btn-ghost:hover { background: var(--hueso-2); }
.btn-outline { background: transparent; color: var(--azul-profundo); border-color: var(--azul-profundo); }
.btn-outline:hover { background: var(--azul-profundo); color: var(--blanco); }
.btn-lg { padding: 14px 28px; font-size: 15.5px; }
.btn-sm { padding: 7px 14px; font-size: 13px; }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none !important; }

/* — INPUTS — */
.input, .select, .textarea {
    font-family: var(--sans); font-size: 15px;
    width: 100%;
    padding: 12px 14px;
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    color: var(--negro);
    transition: border-color .15s ease;
}
.input:focus, .select:focus, .textarea:focus {
    outline: none; border-color: var(--azul-medio);
    box-shadow: 0 0 0 3px rgba(25,55,109,.10);
}
.textarea { min-height: 100px; resize: vertical; line-height: 1.5; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-size: 13.5px; font-weight: 600; color: var(--azul-profundo); }
.field .hint { font-size: 12.5px; color: var(--gris-2); }

/* — CONTENEDOR — */
.container {
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 0 24px;
}

/* — HERO — */
.hero {
    background: linear-gradient(180deg, var(--hueso) 0%, var(--hueso-2) 100%);
    padding: 80px 24px 100px;
    text-align: center;
    border-bottom: 1px solid var(--gris-1);
    position: relative;
    overflow: hidden;
}
.hero::before {
    content: '';
    position: absolute;
    top: -30%; left: 50%;
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(184,147,72,.12) 0%, transparent 70%);
    transform: translateX(-50%);
    pointer-events: none;
}
.hero-inner { max-width: 820px; margin: 0 auto; position: relative; }
.hero h1 { margin-bottom: 18px; }
.hero h1 em { font-style: italic; color: var(--dorado); font-weight: 400; }
.hero p { font-size: 1.15rem; max-width: 580px; margin: 0 auto 36px; color: var(--gris-texto); }

/* — BUSCADOR HERO — */
.buscador {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 8px;
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 8px;
    box-shadow: var(--shadow);
    max-width: 720px;
    margin: 0 auto;
}
.buscador select, .buscador input {
    border: 0;
    padding: 14px 16px;
    background: transparent;
    font-size: 15px;
    border-radius: var(--rad);
    font-family: var(--sans);
}
.buscador select:focus, .buscador input:focus { outline: none; background: var(--hueso); }
.buscador .btn { border-radius: var(--rad); }

@media (max-width: 640px) {
    .buscador { grid-template-columns: 1fr; }
}

/* — SECCIONES — */
.section { padding: 80px 24px; }
.section-title {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 36px;
}
.section-title .label {
    font-size: 13px; text-transform: uppercase; letter-spacing: .15em;
    color: var(--dorado); font-weight: 600; margin-bottom: 8px;
}

/* — GRID DE PROFESIONALES — */
.pros-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
.pro-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 24px;
    transition: all .2s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    display: flex; flex-direction: column;
    position: relative;
}
.pro-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
    border-color: var(--azul-claro);
}
.pro-card .foto {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: var(--hueso-2);
    object-fit: cover;
    margin-bottom: 16px;
    border: 2px solid var(--gris-1);
}
.pro-card .foto.placeholder {
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif); font-size: 24px; color: var(--azul-medio);
}
.pro-card h3 { font-size: 1.2rem; margin-bottom: 4px; }
.pro-card .especialidad {
    font-size: 13px; text-transform: uppercase; letter-spacing: .1em;
    color: var(--dorado); font-weight: 600; margin-bottom: 10px;
}
.pro-card .ubicacion { font-size: 13.5px; color: var(--gris-texto); margin-bottom: 14px; }
.pro-card .meta {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 14px;
    border-top: 1px solid var(--gris-1);
    margin-top: auto;
}
.pro-card .tarifa { font-family: var(--serif); font-size: 1.3rem; color: var(--azul-profundo); font-weight: 500; }
.pro-card .rating { font-size: 13.5px; color: var(--gris-texto); }
.pro-card .rating .star { color: var(--dorado); }

.badge-disponible {
    position: absolute; top: 16px; right: 16px;
    background: var(--verde-ok); color: var(--blanco);
    font-size: 11px; font-weight: 700;
    padding: 4px 10px; border-radius: 999px;
    text-transform: uppercase; letter-spacing: .08em;
    display: flex; align-items: center; gap: 5px;
}
.badge-disponible::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%;
    background: var(--blanco);
    animation: pulse 2s infinite;
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }

/* — CATEGORÍAS — */
.cats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
}
.cat-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    padding: 24px 16px;
    text-align: center;
    transition: all .15s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}
.cat-card:hover { background: var(--azul-profundo); color: var(--blanco); border-color: var(--azul-profundo); }
.cat-card:hover .cat-emoji { transform: scale(1.1); }
.cat-emoji { font-size: 28px; margin-bottom: 8px; display: block; transition: transform .2s; }
.cat-name { font-size: 14px; font-weight: 600; }

/* — CÓMO FUNCIONA — */
.pasos {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
}
.paso { text-align: left; }
.paso .num {
    font-family: var(--serif); font-size: 3rem; font-weight: 400;
    color: var(--dorado); line-height: 1; margin-bottom: 12px;
}
.paso h4 { margin-bottom: 8px; color: var(--azul-profundo); }
.paso p { font-size: 14.5px; }
@media (max-width: 720px) { .pasos { grid-template-columns: 1fr; } }

/* — CTA PROFESIONALES — */
.cta-pro {
    background: var(--azul-profundo);
    color: var(--blanco);
    padding: 80px 24px;
    text-align: center;
}
.cta-pro h2 { color: var(--blanco); margin-bottom: 16px; }
.cta-pro p { color: rgba(255,255,255,.75); max-width: 580px; margin: 0 auto 28px; font-size: 1.05rem; }
.cta-pro .btn-gold { padding: 14px 32px; }

/* — FOOTER — */
.footer {
    background: var(--azul-profundo);
    color: rgba(255,255,255,.7);
    padding: 60px 24px 30px;
}
.footer-inner {
    max-width: var(--max-w); margin: 0 auto;
    display: grid; grid-template-columns: 1fr 2fr;
    gap: 48px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}
.footer .brand-mark, .footer .brand-text { color: var(--blanco); }
.footer-tag { color: rgba(255,255,255,.55); margin-top: 8px; font-size: 14px; max-width: 280px; }
.footer-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.footer-cols h5 { color: var(--dorado); margin-bottom: 14px; }
.footer-cols a { display: block; color: rgba(255,255,255,.6); font-size: 14px; margin-bottom: 8px; }
.footer-cols a:hover { color: var(--blanco); }
.footer-bottom { max-width: var(--max-w); margin: 24px auto 0; font-size: 13px; color: rgba(255,255,255,.4); }
@media (max-width: 720px) {
    .footer-inner { grid-template-columns: 1fr; }
    .footer-cols { grid-template-columns: 1fr 1fr; }
}

/* — VISTAS GENÉRICAS — */
.view-pad { padding: 56px 24px; max-width: var(--max-w); margin: 0 auto; }
.view-pad h1 { margin-bottom: 8px; }
.view-pad .lead { color: var(--gris-texto); font-size: 1.1rem; margin-bottom: 36px; }

/* — TARJETAS DE FORMULARIO — */
.form-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 36px;
    max-width: 560px;
    margin: 0 auto;
}
.form-card h2 { margin-bottom: 8px; }
.form-card .subtitle { color: var(--gris-texto); margin-bottom: 28px; font-size: .95rem; }
.form-card .field { margin-bottom: 16px; }
.form-card .actions { margin-top: 24px; display: flex; justify-content: flex-end; gap: 10px; }

/* — FILTROS DE BÚSQUEDA — */
.filtros-bar {
    display: flex; flex-wrap: wrap; gap: 10px;
    background: var(--blanco);
    padding: 14px;
    border-radius: var(--rad);
    border: 1px solid var(--gris-1);
    margin-bottom: 28px;
}
.filtros-bar .select, .filtros-bar .input { width: auto; min-width: 160px; padding: 9px 12px; font-size: 14px; }
.filtros-bar .chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: 999px;
    background: var(--hueso-2); color: var(--gris-texto);
    font-size: 13px; font-weight: 500;
    cursor: pointer; border: 1px solid var(--gris-1);
    transition: all .12s ease;
}
.filtros-bar .chip.active { background: var(--azul-profundo); color: var(--blanco); border-color: var(--azul-profundo); }
.filtros-bar .chip:hover { border-color: var(--azul-medio); }

/* — PERFIL PROFESIONAL — */
.perfil-hero {
    background: var(--blanco);
    border-bottom: 1px solid var(--gris-1);
    padding: 56px 24px;
}
.perfil-hero-inner {
    max-width: var(--max-w); margin: 0 auto;
    display: grid; grid-template-columns: auto 1fr auto;
    gap: 32px; align-items: center;
}
.perfil-hero .foto {
    width: 140px; height: 140px; border-radius: 50%;
    background: var(--hueso-2); object-fit: cover;
    border: 3px solid var(--gris-1);
}
.perfil-hero .foto.placeholder {
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif); font-size: 56px; color: var(--azul-medio);
}
.perfil-hero h1 { font-size: 2.4rem; margin-bottom: 6px; }
.perfil-hero .especialidad { font-size: 14px; text-transform: uppercase; letter-spacing: .12em; color: var(--dorado); font-weight: 600; margin-bottom: 12px; }
.perfil-hero .meta-pro { display: flex; gap: 18px; font-size: 14px; color: var(--gris-texto); }
.perfil-hero .precio-box { text-align: right; }
.perfil-hero .precio-box .tarifa { font-family: var(--serif); font-size: 2.2rem; color: var(--azul-profundo); }
.perfil-hero .precio-box .por { font-size: 13px; color: var(--gris-2); margin-bottom: 16px; }
@media (max-width: 720px) {
    .perfil-hero-inner { grid-template-columns: 1fr; text-align: center; }
    .perfil-hero .meta-pro { justify-content: center; flex-wrap: wrap; }
}

.perfil-cuerpo {
    max-width: var(--max-w); margin: 0 auto;
    display: grid; grid-template-columns: 2fr 1fr; gap: 40px;
    padding: 56px 24px;
}
@media (max-width: 720px) { .perfil-cuerpo { grid-template-columns: 1fr; } }
.perfil-bloque { margin-bottom: 36px; }
.perfil-bloque h3 { margin-bottom: 14px; }
.perfil-bloque p { line-height: 1.7; }

/* — AGENDA — */
.agenda-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 24px;
    position: sticky; top: calc(var(--header-h) + 16px);
}
.agenda-card h4 { margin-bottom: 16px; }
.dias-row {
    display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 16px;
}
.dia-chip {
    flex: 0 0 auto;
    padding: 10px 12px;
    border-radius: var(--rad);
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    cursor: pointer;
    text-align: center;
    min-width: 64px;
    font-size: 13px;
    transition: all .12s;
}
.dia-chip:hover { border-color: var(--azul-medio); }
.dia-chip.active { background: var(--azul-profundo); color: var(--blanco); border-color: var(--azul-profundo); }
.dia-chip .num { display: block; font-family: var(--serif); font-size: 20px; }

.horas-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
    margin-bottom: 18px;
}
.hora-chip {
    padding: 10px 0;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all .12s;
}
.hora-chip:hover { border-color: var(--azul-medio); }
.hora-chip.active { background: var(--azul-profundo); color: var(--blanco); border-color: var(--azul-profundo); }
.hora-chip:disabled { opacity: .35; cursor: not-allowed; }
.dia-chip:disabled { opacity: .3; cursor: not-allowed; }
.dia-chip:disabled:hover { border-color: var(--gris-1); }

.agenda-vacia {
    text-align: center;
    padding: 24px 12px;
    color: var(--gris-texto);
}
.agenda-vacia-icon { font-size: 36px; opacity: .5; margin-bottom: 10px; }
.agenda-vacia p { margin-bottom: 4px; color: var(--gris-texto); }
.agenda-vacia p strong { color: var(--azul-profundo); }

/* — DASHBOARD — CTA Agenda — */
.dash-cta-agenda {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 20px 24px;
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.dash-cta-agenda.urgente {
    background: var(--dorado-pastel);
    border-color: var(--dorado-suave);
}
.dash-cta-agenda .dash-cta-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--dorado);
    font-weight: 600;
    margin-bottom: 4px;
}
.dash-cta-agenda.urgente .dash-cta-label { color: #8a6b1f; }
.dash-cta-agenda .dash-cta-titulo {
    font-family: var(--serif);
    font-size: 1.3rem;
    color: var(--azul-profundo);
    margin-bottom: 4px;
}
.dash-cta-agenda p {
    margin: 0;
    font-size: 14px;
    color: var(--gris-texto);
    max-width: 520px;
}

/* — MI AGENDA — */
.mi-agenda-wrap { max-width: 1100px; }
.mi-agenda-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.mi-agenda-head h1 { margin-bottom: 8px; }
.mi-agenda-head .lead { margin-bottom: 0; }

.mi-agenda-aviso {
    background: var(--dorado-pastel);
    border-left: 3px solid var(--dorado);
    border-radius: var(--rad);
    padding: 14px 18px;
    margin-bottom: 24px;
    font-size: 14.5px;
    color: var(--gris-texto);
}
.mi-agenda-aviso strong { color: var(--azul-profundo); }

.mi-agenda-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.mi-agenda-leyenda {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    color: var(--gris-2);
}
.mi-agenda-leyenda .agenda-slot.ejemplo {
    width: 18px; height: 18px;
    display: inline-block;
    border-radius: 3px;
    vertical-align: middle;
    margin-right: 4px;
    cursor: default;
    pointer-events: none;
}

.agenda-grid-wrap {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 16px;
    overflow-x: auto;
    margin-bottom: 18px;
}
.agenda-grid {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    gap: 3px;
    min-width: 640px;
}
.agenda-grid-corner { /* esquina vacía arriba-izquierda */ }
.agenda-grid-head {
    background: transparent;
    color: var(--azul-profundo);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 8px 0;
    border-radius: var(--rad-sm);
    cursor: pointer;
    border: 1px solid transparent;
    transition: all .12s;
}
.agenda-grid-head:hover { background: var(--hueso-2); }
.agenda-grid-head.activo {
    background: var(--azul-profundo);
    color: var(--blanco);
    border-color: var(--azul-profundo);
}
.agenda-grid-hora {
    font-size: 11px;
    color: var(--gris-2);
    text-align: right;
    padding-right: 8px;
    align-self: center;
    font-variant-numeric: tabular-nums;
}
.agenda-slot {
    height: 22px;
    background: var(--hueso-2);
    border: 1px solid var(--gris-1);
    border-radius: 3px;
    cursor: pointer;
    transition: background .1s, border-color .1s;
}
.agenda-slot:hover { background: var(--azul-pastel); border-color: var(--azul-claro); }
.agenda-slot.active {
    background: var(--azul-profundo);
    border-color: var(--azul-profundo);
}
.agenda-slot.active:hover { background: var(--azul-medio); }

.mi-agenda-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 40px;
}

.mi-agenda-bloqueos {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 24px;
    margin-bottom: 40px;
}
.mi-agenda-bloqueos h3 { margin-bottom: 10px; }

.mi-agenda-bloqueo-form {
    display: grid;
    grid-template-columns: 180px 180px 1fr auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 18px;
}
.mi-agenda-bloqueo-form .field { margin-bottom: 0; }
@media (max-width: 720px) {
    .mi-agenda-bloqueo-form { grid-template-columns: 1fr 1fr; }
    .mi-agenda-bloqueo-form .field:nth-child(3) { grid-column: 1 / -1; }
    .mi-agenda-bloqueo-form .btn { grid-column: 1 / -1; }
}

.bloqueos-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.bloqueo-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
}
.bloqueo-item strong { color: var(--azul-profundo); }

/* — EDITAR PERFIL — */
.ep-alerta {
    background: #F4D9D8;
    border-left: 3px solid var(--rojo-err);
    border-radius: var(--rad);
    padding: 14px 18px;
    margin-bottom: 20px;
    font-size: 14px;
    color: var(--gris-texto);
}
.ep-alerta strong { color: var(--rojo-err); }
.ep-alerta-motivo {
    margin-top: 6px;
    font-size: 13px;
    color: var(--gris-texto);
}
.ep-foto-actual {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
}
.ep-foto-thumb {
    width: 64px; height: 64px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--hueso-2);
    border: 2px solid var(--gris-1);
}
.ep-foto-thumb.placeholder {
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif); font-size: 24px; color: var(--azul-medio);
}
.input:disabled, .select:disabled, .textarea:disabled {
    background: var(--hueso);
    color: var(--gris-2);
    cursor: not-allowed;
}

/* — LOYALTY (Páginas Pro) — */
.loyalty-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 20px 24px;
    margin-bottom: 36px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.loyalty-card.pro {
    background: linear-gradient(135deg, var(--azul-profundo) 0%, var(--azul-medio) 100%);
    color: var(--blanco);
    border-color: var(--azul-medio);
}
.loyalty-card.pro .loyalty-label,
.loyalty-card.pro .loyalty-titulo { color: var(--dorado-suave); }
.loyalty-card.pro p { color: rgba(255,255,255,.8); }
.loyalty-icono { font-size: 56px; }
.loyalty-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--dorado);
    font-weight: 600;
    margin-bottom: 4px;
}
.loyalty-titulo {
    font-family: var(--serif);
    font-size: 1.4rem;
    color: var(--azul-profundo);
}
.loyalty-bar {
    width: 100%;
    height: 8px;
    background: var(--gris-1);
    border-radius: 999px;
    overflow: hidden;
}
.loyalty-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--dorado) 0%, var(--dorado-suave) 100%);
    border-radius: 999px;
    transition: width .3s ease;
}
.badge-pro {
    display: inline-flex;
    align-items: center;
    background: var(--azul-profundo);
    color: var(--dorado-suave);
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* — SALA — */
.sala-wrap {
    display: grid; grid-template-columns: 280px 1fr; height: calc(100vh - var(--header-h));
    min-height: 0;
}
.sala-aside {
    background: var(--blanco);
    border-right: 1px solid var(--gris-1);
    padding: 24px;
    overflow-y: auto;
}
.sala-main {
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 0;
    background: var(--hueso);
}
/* Cuando el panel de video está visible, parte la pantalla 60/40 */
.sala-main:has(.sala-video-panel:not([hidden])) {
    grid-template-rows: minmax(320px, 1fr) minmax(220px, 40%);
}
.sala-video-panel {
    background: var(--negro);
    position: relative;
    min-height: 0;
    display: flex;
}
.sala-video-iframe {
    width: 100%;
    height: 100%;
    border: 0;
    flex: 1;
}
.sala-video-cerrar {
    position: absolute;
    top: 10px; right: 10px;
    z-index: 2;
    width: 32px; height: 32px;
    background: rgba(0,0,0,.55);
    color: var(--blanco);
    border-radius: 50%;
    font-size: 16px;
    line-height: 32px;
    border: 0;
    cursor: pointer;
    transition: background .15s;
}
.sala-video-cerrar:hover { background: rgba(0,0,0,.85); }
.sala-video-warn {
    background: var(--dorado-pastel);
    border-left: 3px solid var(--dorado);
    border-radius: var(--rad);
    padding: 12px 14px;
    font-size: 13px;
    color: var(--gris-texto);
    line-height: 1.5;
}
.sala-video-warn strong { color: var(--azul-profundo); }

.sala-chat { display: flex; flex-direction: column; background: var(--hueso); min-height: 0; }
.sala-chat-header {
    padding: 16px 24px;
    border-bottom: 1px solid var(--gris-1);
    background: var(--blanco);
}
.sala-mensajes {
    flex: 1; overflow-y: auto; padding: 24px;
    display: flex; flex-direction: column; gap: 12px;
    min-height: 0;
}
.msg {
    max-width: 70%; padding: 10px 14px;
    border-radius: 16px;
    font-size: 14.5px; line-height: 1.45;
    background: var(--blanco); border: 1px solid var(--gris-1);
}
.msg.mio { align-self: flex-end; background: var(--azul-profundo); color: var(--blanco); border-color: var(--azul-profundo); }
.msg .hora { font-size: 11px; opacity: .55; margin-top: 4px; }
.sala-input {
    display: flex; gap: 8px; padding: 16px;
    background: var(--blanco); border-top: 1px solid var(--gris-1);
}
.sala-input .input { flex: 1; }
@media (max-width: 720px) {
    .sala-wrap { grid-template-columns: 1fr; }
    .sala-aside { display: none; }
    .sala-main:has(.sala-video-panel:not([hidden])) {
        grid-template-rows: 50vh 1fr;
    }
}

/* — REVIEWS — */
.review {
    padding: 18px 0;
    border-bottom: 1px solid var(--gris-1);
}
.review .stars { color: var(--dorado); margin-bottom: 4px; }
.review .autor { font-size: 13px; color: var(--gris-2); margin-bottom: 6px; }

/* — TOASTS — */
.toast-host { position: fixed; bottom: 24px; right: 24px; z-index: 1000; display: flex; flex-direction: column; gap: 10px; }
.toast {
    padding: 14px 18px;
    background: var(--azul-profundo);
    color: var(--blanco);
    border-radius: var(--rad);
    box-shadow: var(--shadow);
    font-size: 14px;
    max-width: 360px;
    border-left: 3px solid var(--dorado);
    animation: toastIn .25s ease;
}
.toast.ok { border-left-color: var(--verde-ok); }
.toast.err { border-left-color: var(--rojo-err); }
@keyframes toastIn { from { transform: translateX(20px); opacity: 0; } to { transform: none; opacity: 1; } }

/* — MODALS — */
.modal-host { position: fixed; inset: 0; background: rgba(11,36,71,.5); display: flex; align-items: center; justify-content: center; z-index: 500; padding: 24px; }
.modal-host[hidden] { display: none; }
.modal {
    background: var(--blanco); border-radius: var(--rad-lg);
    max-width: 480px; width: 100%; padding: 32px;
    box-shadow: var(--shadow-lg);
}
.modal h3 { margin-bottom: 12px; }
.modal .actions { margin-top: 24px; display: flex; justify-content: flex-end; gap: 10px; }

/* — STEPPER (registro profesional) — */
.stepper {
    display: flex; gap: 8px; margin-bottom: 28px;
}
.stepper .step {
    flex: 1; height: 4px; background: var(--gris-1); border-radius: 999px;
}
.stepper .step.done { background: var(--dorado); }
.stepper .step.active { background: var(--azul-profundo); }

/* — TABLA — */
.tbl { width: 100%; border-collapse: collapse; background: var(--blanco); border-radius: var(--rad); overflow: hidden; box-shadow: var(--shadow-sm); }
.tbl th, .tbl td { padding: 14px 16px; text-align: left; font-size: 14px; }
.tbl th { background: var(--hueso-2); font-weight: 600; color: var(--azul-profundo); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.tbl tr:not(:last-child) td { border-bottom: 1px solid var(--gris-1); }

.estado-tag { padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.estado-pendiente { background: var(--dorado-pastel); color: #8a6b1f; }
.estado-aprobado, .estado-completada, .estado-pagada { background: #D7EBDF; color: var(--verde-ok); }
.estado-rechazado, .estado-cancelada { background: #F4D9D8; color: var(--rojo-err); }

/* — UTIL — */
.text-muted { color: var(--gris-2); }
.text-center { text-align: center; }
.mt-1 { margin-top: 8px; } .mt-2 { margin-top: 16px; } .mt-3 { margin-top: 24px; } .mt-4 { margin-top: 32px; }
.mb-2 { margin-bottom: 16px; }
.flex { display: flex; } .flex-col { flex-direction: column; } .gap-2 { gap: 16px; }
.hidden { display: none !important; }
.spinner {
    width: 32px; height: 32px;
    border: 3px solid var(--gris-1);
    border-top-color: var(--azul-profundo);
    border-radius: 50%;
    animation: spin .8s linear infinite;
    margin: 24px auto;
}
@keyframes spin { to { transform: rotate(360deg); } }
.empty {
    text-align: center; padding: 48px 24px;
    color: var(--gris-2);
}
.empty .icon { font-size: 40px; opacity: .5; margin-bottom: 12px; }


/* =====================================================
   ETAPA 9 — PERFIL COMPLETO + VERIFICACIONES
   ===================================================== */

/* — Editar perfil: shell y tabs — */
.ep-wrap { max-width: 1080px; }
.ep-head {
    display: flex; justify-content: space-between; align-items: flex-start;
    gap: 24px; margin-bottom: 20px; flex-wrap: wrap;
}
.ep-head h1 { margin-bottom: 6px; }
.ep-head .lead { margin-bottom: 0; }

.ep-alerta {
    background: #F4D9D8;
    border-left: 3px solid var(--rojo-err);
    border-radius: var(--rad);
    padding: 14px 18px; margin-bottom: 18px;
    font-size: 14px; color: var(--gris-texto);
}
.ep-alerta strong { color: var(--rojo-err); }
.ep-alerta-info {
    background: var(--dorado-pastel);
    border-left: 3px solid var(--dorado);
    border-radius: var(--rad);
    padding: 14px 18px; margin-bottom: 18px;
    font-size: 14px; color: var(--gris-texto);
}
.ep-alerta-info strong { color: var(--azul-profundo); }

.ep-tabs {
    display: flex; gap: 4px;
    border-bottom: 1px solid var(--gris-1);
    margin-bottom: 28px;
    overflow-x: auto;
}
.ep-tab {
    background: transparent;
    color: var(--gris-texto);
    font-size: 14.5px; font-weight: 600;
    padding: 12px 18px;
    border: 0;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color .12s, border-color .12s;
    white-space: nowrap;
    display: inline-flex; align-items: center; gap: 8px;
}
.ep-tab:hover { color: var(--azul-profundo); }
.ep-tab.activo {
    color: var(--azul-profundo);
    border-bottom-color: var(--dorado);
}
.ep-tab-badge {
    display: inline-flex; align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px; font-weight: 700;
    letter-spacing: .04em;
}
.ep-tab-badge.ok  { background: #D7EBDF; color: var(--verde-ok); }
.ep-tab-badge.mid { background: var(--dorado-pastel); color: #8a6b1f; }
.ep-tab-badge.low { background: #F4D9D8; color: var(--rojo-err); }

.ep-panel { animation: fadeIn .18s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.ep-pill {
    display: inline-block;
    background: var(--azul-pastel);
    color: var(--azul-medio);
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    vertical-align: middle;
    margin-left: 6px;
}

/* — Listas de trayectoria — */
.ep-list-head {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 16px; gap: 14px;
}
.ep-list-head h3 { margin: 0; }

.ep-list {
    display: flex; flex-direction: column;
    gap: 10px;
}
.ep-item {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 18px 22px;
    display: flex; gap: 24px;
    align-items: flex-start;
    transition: border-color .12s, box-shadow .12s;
}
.ep-item:hover {
    border-color: var(--azul-claro);
    box-shadow: var(--shadow-sm);
}
.ep-item-body { flex: 1; min-width: 0; }
.ep-item-body h4 {
    font-family: var(--serif); font-size: 1.15rem;
    color: var(--azul-profundo); margin: 0 0 4px;
    font-weight: 500;
}
.ep-item-sub { font-size: 14px; color: var(--gris-texto); margin-bottom: 4px; }
.ep-item-periodo {
    font-size: 12.5px; color: var(--gris-2);
    text-transform: uppercase; letter-spacing: .08em;
    font-weight: 600; margin-bottom: 8px;
}
.ep-item-desc {
    font-size: 14px; color: var(--gris-texto);
    line-height: 1.6; margin: 8px 0 0;
}
.ep-item-link {
    display: inline-block;
    font-size: 13.5px;
    color: var(--azul-medio);
    margin-top: 8px;
}
.ep-item-actions {
    display: flex; flex-direction: column;
    gap: 6px; flex-shrink: 0;
}
@media (max-width: 720px) {
    .ep-item { flex-direction: column; gap: 12px; }
    .ep-item-actions { flex-direction: row; flex-wrap: wrap; }
}

/* — Tab Verificaciones — */
.ver-intro {
    background: var(--hueso-2);
    border-radius: var(--rad);
    padding: 14px 18px;
    margin-bottom: 20px;
    font-size: 14px;
    color: var(--gris-texto);
}
.ver-card {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 28px 30px;
    margin-bottom: 18px;
}
.ver-card-head {
    display: flex; justify-content: space-between; align-items: center;
    gap: 14px; margin-bottom: 8px;
}
.ver-card-head h3 { margin: 0; }

.badge-verif {
    display: inline-flex; align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 11.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .08em;
}
.badge-verif.none { background: var(--gris-1); color: var(--gris-2); }
.badge-verif.pend { background: var(--dorado-pastel); color: #8a6b1f; }
.badge-verif.ok   { background: #D7EBDF; color: var(--verde-ok); }
.badge-verif.err  { background: #F4D9D8; color: var(--rojo-err); }

.ver-rechazo {
    background: #F4D9D8;
    border-left: 3px solid var(--rojo-err);
    border-radius: var(--rad);
    padding: 12px 16px;
    margin: 14px 0;
    font-size: 14px;
    color: var(--gris-texto);
}
.ver-rechazo strong { color: var(--rojo-err); }
.ver-rechazo-tag {
    display: inline-block;
    background: rgba(179,50,47,.18);
    color: var(--rojo-err);
    font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 8px;
}

.ver-qr-info {
    display: flex; align-items: center; gap: 14px;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    padding: 14px 18px;
    margin: 14px 0;
}
.ver-qr-info.exact, .ver-qr-info.subset { border-color: var(--verde-ok); background: #ECF5F0; }
.ver-qr-info.partial { border-color: var(--dorado); background: var(--dorado-pastel); }
.ver-qr-icon {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--blanco);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 700;
    color: var(--verde-ok);
    flex-shrink: 0;
}
.ver-qr-info.partial .ver-qr-icon { color: #8a6b1f; }

.ver-upload {
    margin-top: 16px;
    padding: 22px;
    background: var(--hueso);
    border: 2px dashed var(--gris-1);
    border-radius: var(--rad);
    text-align: center;
    transition: border-color .15s, background .15s;
}
.ver-upload:hover {
    border-color: var(--azul-medio);
    background: var(--hueso-2);
}
.ver-upload-label {
    display: inline-block;
    padding: 11px 22px;
    background: var(--azul-profundo);
    color: var(--blanco);
    border-radius: var(--rad);
    cursor: pointer;
    font-weight: 600;
    font-size: 14.5px;
    transition: background .15s, transform .15s;
}
.ver-upload-label:hover { background: var(--azul-medio); transform: translateY(-1px); }
.ver-upload-hint {
    margin-top: 10px;
    font-size: 12.5px;
    color: var(--gris-2);
}

.ver-preview {
    margin-top: 14px;
    padding: 14px;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
}
.ver-preview-pdf {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px;
    background: var(--blanco);
    border-radius: var(--rad-sm);
    font-size: 14px;
}
.ver-preview-img {
    max-width: 100%; max-height: 280px;
    display: block;
    border-radius: var(--rad-sm);
    margin: 0 auto;
}

/* — MICROCOREOGRAFÍA QR (la pieza emocional) — */
.ver-coreografia {
    margin-top: 14px;
}
.ver-fase {
    padding: 24px 22px;
    border-radius: var(--rad-lg);
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    text-align: center;
    transition: background .25s ease, border-color .25s ease;
}
.ver-fase.scanning {
    background: var(--hueso-2);
    border-color: var(--gris-1);
}
.ver-fase.ok {
    background: #ECF5F0;
    border-color: rgba(47,125,93,.3);
}
.ver-fase.warn {
    background: var(--dorado-pastel);
    border-color: var(--dorado-suave);
}
.ver-fase.err {
    background: #F4D9D8;
    border-color: rgba(179,50,47,.3);
}
.ver-fase-texto {
    margin-top: 14px;
    font-size: 14.5px;
    color: var(--gris-texto);
    min-height: 1.2em;
}
.ver-fase-titulo {
    font-family: var(--serif);
    font-size: 1.4rem;
    color: var(--azul-profundo);
    font-weight: 500;
    margin-top: 8px;
    margin-bottom: 6px;
}
.ver-fase.err .ver-fase-titulo { color: var(--rojo-err); }
.ver-fase.warn .ver-fase-titulo { color: #8a6b1f; }
.ver-fase p { color: var(--gris-texto); font-size: 14px; line-height: 1.55; margin-bottom: 14px; }

.ver-spinner-grande {
    width: 48px; height: 48px;
    border: 4px solid var(--gris-1);
    border-top-color: var(--azul-profundo);
    border-radius: 50%;
    animation: spin .9s linear infinite;
    margin: 0 auto;
}

.ver-check-grande {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: var(--verde-ok);
    color: var(--blanco);
    font-size: 32px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto;
    transform-origin: center;
    animation: checkBounce 300ms cubic-bezier(.34, 1.56, .64, 1);
}
.ver-check-grande.warn { background: var(--dorado); }
@keyframes checkBounce {
    0%   { transform: scale(0); opacity: 0; }
    60%  { transform: scale(1.15); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

.ver-shake {
    animation: verShake 200ms ease-in-out;
}
@keyframes verShake {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(5px); }
    75%  { transform: translateX(-5px); }
    100% { transform: translateX(0); }
}

.ver-datos-cascada {
    display: flex; flex-direction: column;
    gap: 10px;
    margin-top: 22px;
    text-align: left;
}
.ver-dato {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    padding: 12px 16px;
    opacity: 0;
    transform: translateY(8px);
    animation: fadeUp 400ms ease forwards;
}
@keyframes fadeUp {
    to { opacity: 1; transform: translateY(0); }
}
.ver-dato.compara {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 14px;
    align-items: center;
}
.ver-dato-col { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ver-dato-label {
    font-size: 11px;
    color: var(--gris-2);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
}
.ver-dato-valor {
    font-size: 14px;
    color: var(--azul-profundo);
    font-weight: 600;
    word-break: break-word;
}
.ver-dato-valor.link { color: var(--azul-medio); text-decoration: underline; font-weight: 400; font-size: 12.5px; }
.ver-dato-link {
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700;
    flex-shrink: 0;
}
.ver-dato-link.ok   { background: #D7EBDF; color: var(--verde-ok); }
.ver-dato-link.warn { background: var(--dorado-pastel); color: #8a6b1f; }

.ver-dato.fila {
    display: flex; justify-content: space-between; gap: 14px; align-items: center;
}
@media (max-width: 540px) {
    .ver-dato.compara { grid-template-columns: 1fr; text-align: left; }
    .ver-dato-link { margin: 0; }
}

.ver-confirm {
    margin-top: 22px;
}
.ver-btn-pulse {
    animation: pulseSuave 1.8s ease-in-out infinite;
}
@keyframes pulseSuave {
    0%, 100% { box-shadow: 0 0 0 0 rgba(11,36,71,.35); }
    50%      { box-shadow: 0 0 0 12px rgba(11,36,71,0); }
}

/* — Dashboard: card verificaciones — */
.dash-card-verif {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 20px 24px;
    margin-bottom: 28px;
}
.dash-card-verif.ok {
    background: linear-gradient(135deg, #ECF5F0 0%, var(--blanco) 100%);
    border-color: rgba(47,125,93,.3);
}
.dash-card-verif-head {
    display: flex; justify-content: space-between; align-items: center;
    gap: 16px; margin-bottom: 16px; flex-wrap: wrap;
}
.dash-card-verif-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}
.dash-card-verif-item {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 14px;
    background: var(--hueso);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    font-size: 14px;
    font-weight: 500;
}
.dash-card-verif-item.ok   { background: #ECF5F0; border-color: rgba(47,125,93,.3); color: var(--verde-ok); }
.dash-card-verif-item.err  { background: #F4D9D8; border-color: rgba(179,50,47,.3); color: var(--rojo-err); }
.dash-card-verif-item.pend { background: var(--dorado-pastel); border-color: var(--dorado-suave); color: #8a6b1f; }
.dash-card-verif-item.none { color: var(--gris-2); }
.dash-verif-icon {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--blanco);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
}
.dash-card-verif-rechazos {
    margin-top: 16px;
    padding: 12px 14px;
    background: var(--hueso-2);
    border-radius: var(--rad);
    font-size: 13.5px;
    color: var(--gris-texto);
    line-height: 1.6;
}
.dash-card-verif-rechazos a {
    color: var(--azul-medio);
    font-weight: 600;
}

/* — Perfil público: badges verificación arriba — */
.badges-verif {
    display: flex; gap: 8px; flex-wrap: wrap;
    margin-top: 14px;
}
.badge-verif-pub {
    display: inline-flex; align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 11.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
}
.badge-verif-pub.identidad { background: #D7EBDF; color: var(--verde-ok); }
.badge-verif-pub.titulo    { background: var(--dorado-pastel); color: #8a6b1f; }
.badge-verif-pub.matricula { background: var(--azul-pastel); color: var(--azul-medio); }

/* — Perfil público: trayectoria (CV) — */
.cv-list {
    list-style: none;
    display: flex; flex-direction: column;
    gap: 0;
}
.cv-item {
    padding: 18px 0;
    border-bottom: 1px solid var(--gris-1);
}
.cv-item:last-child { border-bottom: 0; }
.cv-titulo {
    font-family: var(--serif);
    font-size: 1.15rem;
    color: var(--azul-profundo);
    font-weight: 500;
    margin-bottom: 4px;
}
.cv-pill {
    display: inline-block;
    background: var(--azul-pastel);
    color: var(--azul-medio);
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 10.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    margin-left: 4px;
    vertical-align: middle;
    font-family: var(--sans);
}
.cv-sub { font-size: 14px; color: var(--gris-texto); margin-bottom: 4px; }
.cv-per {
    font-size: 12px;
    color: var(--gris-2);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
}
.cv-desc {
    font-size: 14px;
    color: var(--gris-texto);
    line-height: 1.6;
    margin: 8px 0 0;
}
.cv-link {
    display: inline-block;
    font-size: 13.5px;
    color: var(--azul-medio);
    margin-top: 6px;
}

/* — Admin: verificaciones pendientes — */
.ver-admin-tabs {
    display: flex; gap: 4px;
    border-bottom: 1px solid var(--gris-1);
    margin-bottom: 18px;
    overflow-x: auto;
}
.ver-admin-tab {
    background: transparent;
    color: var(--gris-texto);
    font-size: 13.5px; font-weight: 600;
    padding: 10px 16px;
    border: 0;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color .12s, border-color .12s;
    white-space: nowrap;
}
.ver-admin-tab:hover { color: var(--azul-profundo); }
.ver-admin-tab.activo {
    color: var(--azul-profundo);
    border-bottom-color: var(--dorado);
}

.ver-admin-fila {
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad-lg);
    padding: 18px 22px;
    margin-bottom: 10px;
    display: flex; align-items: flex-start; gap: 22px;
    flex-wrap: wrap;
}
.ver-admin-info { flex: 1; min-width: 240px; }
.ver-admin-info strong { display: block; color: var(--azul-profundo); margin-bottom: 2px; }
.ver-admin-qr {
    margin-top: 10px;
    padding: 10px 12px;
    background: var(--hueso);
    border-left: 3px solid var(--azul-medio);
    border-radius: var(--rad-sm);
    font-size: 12.5px;
    color: var(--gris-texto);
}
.ver-admin-qr.ok   { border-left-color: var(--verde-ok); background: #ECF5F0; }
.ver-admin-qr.warn { border-left-color: var(--dorado); background: var(--dorado-pastel); }
.ver-admin-qr strong { display: inline; color: var(--azul-profundo); }

.ver-admin-acciones {
    display: flex; flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
}
.ver-pill {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10.5px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    margin-left: 6px;
    vertical-align: middle;
}
.ver-pill.warn { background: var(--dorado-pastel); color: #8a6b1f; }
@media (max-width: 720px) {
    .ver-admin-acciones { flex-direction: row; flex-wrap: wrap; width: 100%; }
}

/* — Registro: pantalla "acelerá tu verificación" — */
.rp-acelerar {
    margin-top: 26px;
    padding: 22px 24px;
    background: var(--hueso-2);
    border-radius: var(--rad-lg);
    text-align: left;
}
.rp-checklist {
    display: flex; flex-direction: column;
    gap: 8px;
    margin: 14px 0;
}
.rp-check-item {
    padding: 10px 14px;
    background: var(--blanco);
    border: 1px solid var(--gris-1);
    border-radius: var(--rad);
    font-size: 14px;
    color: var(--azul-profundo);
}

/* — Accesibilidad: reducir animaciones si el sistema lo pide — */
@media (prefers-reduced-motion: reduce) {
    .ver-check-grande,
    .ver-shake,
    .ver-dato,
    .ver-btn-pulse,
    .ep-panel,
    .badge-disponible::before {
        animation: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
    .ver-spinner-grande, .spinner { animation-duration: 1.4s !important; }
}
