/* ============================================================
   PLANTILLA SIRes - UNIVERSIDAD SANTO TOMÁS (ESTILO MINIMAL)
   Ajustes: Título 3 Zen, Viñeta Circular y Efecto Mostaza
   ============================================================ */

/* Contenedor principal */
.sires-page { 
    max-width: 1100px; 
    margin: 0 auto; 
    font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
    color: #444;
    line-height: 1.6;
}

/* TITULO 1: Principal - Refinado y con autoridad */
.sires-page .db-section-title {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 2.2rem;
    font-weight: 700;
    color: #0C4767;
    margin: 1rem 0 1.5rem;
    display: inline-block;
    position: relative;
    letter-spacing: -0.2px;
    padding-bottom: 10px;
}

.sires-page .db-section-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45px;
    height: 3px;
    background-color: #E36414;
    border-radius: 2px;
}

.sires-page .db-section-title::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 1px;
    width: 100%;
    height: 1px;
    background-color: #E36414;
    opacity: 0.3;
}

/* TITULO 2: Subtítulo con línea de gradiente */
.sires-page .db-section-subtitle {
    font-size: 1.75rem;
    font-weight: 300;
    color: #0C4767;
    margin: 2.8rem 0 1.2rem;
    display: flex;
    align-items: center;
}

.sires-page .db-section-subtitle strong {
    font-weight: 700;
    color: #E36414;
    margin-right: 8px;
}

.sires-page .db-section-subtitle::after {
    content: "";
    height: 2px;
    flex-grow: 1;
    background: linear-gradient(to right, #E36414 0%, #F2C36B 30%, transparent 100%);
    margin-left: 15px;
    border-radius: 2px;
}

/* TITULO 3: Propuesta Minimalista (Sin cápsula) */
.sires-page .db-section-third-title {
    font-size: 1.4rem;
    font-weight: 600;
    color: #555;
    margin: 2.2rem 0 1rem 0;
    display: flex;
    align-items: center;
    text-transform: none;
    letter-spacing: 0.3px;
    padding-left: 5px; /* Pequeño aire respecto al borde */
}

.sires-page .db-section-third-title::before {
    content: "";
    width: 12px;
    height: 12px;
    background-color: #F2C36B; /* Viñeta mostaza sólida */
    border-radius: 50%;
    margin-right: 15px;
    display: inline-block;
    flex-shrink: 0; /* Evita que el punto se deforme */
    box-shadow: 0 0 8px rgba(242, 195, 107, 0.4);
}

/* GRID DE COLUMNAS */
.sires-page .db-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.8rem;
    margin: 1rem 0 2.5rem 0;
}

@media (max-width: 900px) {
    .sires-page .db-grid { grid-template-columns: 1fr; }
}

/* TARJETAS PREMIUM */
.sires-page .db-card {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-left: 6px solid #0C4767;
    border-radius: 14px;
    padding: 1.8rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden;
    position: relative;
}

.sires-page .db-card-full {
    grid-column: span 2;
}

/* EFECTO HOVER: Relieve con resplandor Mostaza Suave */
.sires-page .db-card:hover {
    transform: translateY(-5px);
    border-color: #F2C36B;
    border-left-color: #E36414;
    box-shadow: 
        0 12px 25px rgba(242, 195, 107, 0.2), 
        inset 0 0 35px rgba(242, 195, 107, 0.15); 
}

/* LOGOS */
.sires-page .db-card-logo {
    flex: 0 0 160px;
    height: 95px;
    margin-right: 1.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sires-page .db-card-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.sires-page .db-card:hover .db-card-logo img {
    transform: scale(1.05);
}

/* TEXTO DE TARJETA */
.sires-page .db-card-body {
    flex: 1;
}

.sires-page .db-card-body strong {
    color: #0C4767;
    font-size: 1.6rem;
    display: block;
    margin-bottom: 8px;
    line-height: 1.2;
}

.sires-page .db-card-body p {
    font-size: 1.35rem;
    line-height: 1.7;
    margin: 0 0 18px 0;
    color: #333;
}

/* BOTÓN INSTITUCIONAL */
.sires-page .db-btn {
    background: linear-gradient(135deg, #EC9F05, #E36414);
    color: #ffffff !important; 
    font-weight: 700;
    padding: 0.8rem 1.8rem;
    border-radius: 35px;
    font-size: 1.15rem;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    border: none;
}

.sires-page .db-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(227, 100, 20, 0.3);
}