/* assets/css/base.css */

/* ─── Variables de color (incluye tus dos colores) ─── */
:root{
    --rosa: rgba(252, 210, 232, 0.58);
    --verd: rgba(223, 243, 164, 0.57);
    --text-dark: #2C3E50;
    --text-light:#6C757D;
    --primary: #8B4513;
    --secondary:#D2B48C;
    --accent:#228B22;
}

/* ─── Tipografías base ───
   Títulos: Zen Antique Soft (serif, calma/zen)
   Texto: Zen Kaku Gothic New (sans legible y limpio)
*/
html,body{
    font-family: "Zen Kaku Gothic New", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    color: var(--text-dark);
    line-height: 1.6;
}

/* Títulos más “zen” */
h1,h2,h3,h4,h5,h6{
    font-family: "Zen Antique Soft", Georgia, serif;
    letter-spacing: 0.2px;
    color: var(--primary);
    margin-bottom: .6rem;
}

/* Navbar y footer (comunes) */
.navbar{
    background: rgba(255,255,255,.95) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
.navbar-brand{
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary) !important;
}
.nav-link{
    color: var(--text-dark) !important;
    font-weight: 500;
    margin: 0 10px;
}
.nav-link:hover, .nav-link.active{ color: var(--primary) !important; }

.footer{
    background: var(--text-dark);
    color:#fff;
    padding: 50px 0 20px;
}

/* Botón primario coherente */
.btn-primary{
    background: var(--primary);
    border-color: var(--primary);
    border-radius: 999px;
    padding: 12px 30px;
}
.btn-primary:hover{
    box-shadow: 0 5px 15px rgba(139,69,19,.35);
    transform: translateY(-2px);
}

/* Tarjetas genéricas */
.card-soft{
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(0,0,0,.08);
}

/* Título de sección */
.section-title{
    font-size: clamp(1.8rem, 3.2vw, 2.6rem);
    text-align: center;
    position: relative;
    margin-bottom: 36px;
}
.section-title::after{
    content:"";
    display:block;
    width:80px; height:3px;
    background: var(--accent);
    margin: 14px auto 0;
}