/* ============================================================
   Sanando mi Árbol — Estilos Zona Pública
   Importa: variables → reset → typography → components → public
   ============================================================ */

@import url('variables.css');
@import url('reset.css');
@import url('typography.css');
@import url('components.css');

/* ── Body pública ────────────────────────────────────────────── */
body.page-public {
    padding-top: 0;
}

/* ── Hero páginas internas (nav fixed = 72px + breathing room) ── */
.hero-page {
    padding-top: 90px;
    padding-bottom: 40px;
    text-align: center;
    background: var(--color-fondo);
}
.hero-page h1 {
    color: var(--color-primario);
}
.hero-page .lead {
    color: var(--color-texto-claro);
    margin-top: 0.75rem;
}

/* ── Parallax Hero ───────────────────────────────────────────── */
.hero-parallax .hero-bg {
    will-change: transform;
}

/* ── Hero Slider — visibilidad de slides ─────────────────────── */
.hero-slide {
    display: none !important;
}
.hero-slide.active {
    display: flex !important;
    align-items: center;
}

/* ── Sobre mí ────────────────────────────────────────────────── */
.sobre-mi-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-12);
    align-items: center;
}
@media (min-width: 1024px) {
    .sobre-mi-grid { grid-template-columns: 1fr 1fr; }
}

.sobre-mi-img {
    width: 100%;
    aspect-ratio: 3/4;
    object-fit: cover;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

.sobre-mi-firma {
    font-family: var(--font-heading);
    font-style: italic;
    font-size: var(--text-3xl);
    color: var(--color-acento);
    margin-top: var(--space-6);
}

/* Especializaciones chips */
.chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-4);
}
.chip {
    background: var(--color-fondo-alt);
    color: var(--color-primario);
    border: 1px solid var(--color-fondo-oscuro);
    border-radius: var(--radius-full);
    padding: 0.4em 1em;
    font-size: var(--text-sm);
    font-weight: 400;
}

/* ── Servicios ───────────────────────────────────────────────── */
.servicio-detalle-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-12);
}
@media (min-width: 1024px) {
    .servicio-detalle-grid { grid-template-columns: 3fr 2fr; }
}

.servicio-sidebar {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    box-shadow: var(--shadow);
    height: fit-content;
    position: sticky;
    top: calc(80px + var(--space-6));
}

.servicio-precio {
    font-family: var(--font-heading);
    font-size: var(--text-4xl);
    color: var(--color-primario);
}

.servicio-duracion {
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: var(--space-6);
}

.modalidades {
    display: flex;
    gap: var(--space-3);
    margin-bottom: var(--space-6);
    flex-wrap: wrap;
}
.modalidad-tag {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
}
.modalidad-tag svg { color: var(--color-acento); }

/* FAQ */
.faq-item {
    border-bottom: 1px solid var(--color-fondo-alt);
    padding: var(--space-5) 0;
}
.faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    color: var(--color-primario);
    gap: var(--space-4);
    user-select: none;
}
.faq-question svg {
    flex-shrink: 0;
    transition: transform var(--transition);
    color: var(--color-acento);
}
.faq-item.open .faq-question svg { transform: rotate(45deg); }
.faq-answer {
    display: none;
    padding-top: var(--space-4);
    color: var(--color-texto-suave);
    line-height: 1.8;
}
.faq-item.open .faq-answer { display: block; }

/* ── Agenda / Reserva ────────────────────────────────────────── */

/* Layout dos columnas: form (izq) + picker (der) */
.agenda-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    align-items: start;
}
@media (min-width: 920px) {
    .agenda-layout { grid-template-columns: 1fr 360px; }
}

/* Estructura de cada paso */
.agenda-step {
    display: flex;
    gap: var(--space-6);
    align-items: flex-start;
    padding-bottom: var(--space-8);
    margin-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-fondo-alt);
}
.agenda-step:last-child { border-bottom: none; padding-bottom: 0; }

.agenda-step-header {
    width: 150px;
    min-width: 150px;
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding-top: var(--space-1);
}
.agenda-step-header h2 {
    font-size: var(--text-xl);
    font-weight: 400;
    line-height: 1.3;
    color: var(--color-primario);
}
.agenda-step-body { flex: 1; min-width: 0; }

.step-num {
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 50%;
    background: var(--color-acento-claro);
    color: var(--color-primario);
    font-size: var(--text-sm);
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3px;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .agenda-step { flex-direction: column; gap: var(--space-3); }
    .agenda-step-header { width: auto; min-width: 0; }
}

/* Radios de servicio y modalidad */
.servicios-radio-grid { display: flex; flex-direction: column; gap: var(--space-2); }

.servicio-radio {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-5);
    border: 1.5px solid #C8C5BB;
    border-radius: var(--radius);
    cursor: pointer;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
    background: var(--color-fondo-alt);
    color: var(--color-primario);
}
.servicio-radio:not(.active):hover { border-color: var(--color-primario); }
.servicio-radio.active {
    border-color: var(--color-secundario);
    background: var(--color-secundario);
    color: var(--color-texto-inverso);
}
.servicio-radio input[type="radio"] { display: none; }
/* Colores hijos — estado no seleccionado (claro) */
.servicio-radio .badge-sage {
    background: var(--color-fondo-alt);
    color: var(--color-primario);
    border-color: var(--color-fondo-oscuro);
}
.servicio-radio .servicio-radio-precio { color: var(--color-primario); }
.servicio-radio svg { stroke: var(--color-primario); }
/* Colores hijos — estado seleccionado (oscuro) */
.servicio-radio.active .badge-sage {
    background: rgba(255,255,255,.2);
    color: var(--color-texto-inverso);
    border-color: transparent;
}
.servicio-radio.active .servicio-radio-precio { color: var(--color-texto-inverso); }
.servicio-radio.active svg { stroke: var(--color-texto-inverso); }
.servicio-radio-content {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
    flex: 1;
}
.servicio-radio-precio {
    margin-left: auto;
    font-weight: 600;
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    white-space: nowrap;
}

/* Resumen */
.resumen-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-5);
    background: var(--color-fondo);
    border-radius: var(--radius-md);
    padding: var(--space-6);
}
.resumen-item { display: flex; flex-direction: column; gap: var(--space-1); }
.resumen-label {
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-texto-tenue);
}
.resumen-valor {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    color: var(--color-primario);
}

.fecha-seleccionada-label {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    align-items: center;
    text-align: center;
}
.fecha-confirma-pill {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--color-fondo-alt);
    border: 1.5px solid var(--color-acento);
    border-radius: var(--radius-full);
    padding: .5rem 1.25rem;
    font-weight: 600;
    font-size: var(--text-sm);
    letter-spacing: .04em;
    color: var(--color-primario);
    cursor: pointer;
    transition: border-color var(--transition-fast);
}
.fecha-confirma-pill:hover { border-color: var(--color-primario); }
.fecha-confirma-sub {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    padding-left: .4rem;
}
.modalidad-nota {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    font-style: italic;
    margin-top: .5rem;
}
.servicio-radio[data-disabled] {
    background: var(--color-fondo-alt);
    border-color: #C8C5BB;
    color: var(--color-texto-tenue);
    opacity: 1;
    cursor: not-allowed;
    pointer-events: none;
}
.servicio-radio[data-disabled] svg { stroke: var(--color-texto-tenue); }

/* Picker panel */
.agenda-picker-card {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
    position: sticky;
    top: calc(72px + var(--space-6));
}
.picker-tab-header {
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--color-fondo-alt);
}
.picker-tab {
    display: inline-block;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-primario);
    border-bottom: 2px solid var(--color-primario);
    padding-bottom: var(--space-2);
}
.picker-month-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) var(--space-6) var(--space-2);
}
.picker-month-nav > span {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    font-weight: 500;
}
.picker-next-dates {
    font-size: var(--text-xs);
    color: var(--color-acento-oscuro);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.picker-week-row {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: 0 var(--space-4) var(--space-4);
}
.picker-week-nav {
    width: 28px; height: 28px; min-width: 28px;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: 50%;
    font-size: var(--text-base);
    color: var(--color-primario);
    background: var(--color-blanco);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: all var(--transition-fast);
    padding: 0; line-height: 1;
}
.picker-week-nav:hover {
    background: var(--color-primario);
    color: var(--color-texto-inverso);
    border-color: var(--color-primario);
}
.picker-days {
    display: flex;
    gap: 2px;
    flex: 1;
    justify-content: space-between;
}
.picker-day {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: var(--space-2) 4px;
    border: none; background: none;
    border-radius: var(--radius);
    cursor: pointer;
    transition: all var(--transition-fast);
    min-width: 34px;
}
.picker-day:hover:not(.disabled) { background: var(--color-fondo-alt); }
.picker-day.selected { background: var(--color-primario); color: var(--color-texto-inverso); }
.picker-day.disabled { opacity: 0.3; cursor: default; }
.picker-day-name {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: inherit;
}
.picker-day-num {
    font-size: var(--text-sm);
    font-weight: 600;
    color: inherit;
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
}
.picker-slots-wrap {
    padding: 0 var(--space-6) var(--space-6);
    min-height: 100px;
}
.picker-group-label {
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-texto-tenue);
    margin: var(--space-4) 0 var(--space-3);
}
.picker-group-label:first-child { margin-top: 0; }
.picker-slots-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.picker-slot {
    padding: 0.4em 0.8em;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: var(--radius);
    font-size: var(--text-sm);
    color: var(--color-texto);
    background: var(--color-blanco);
    cursor: pointer;
    transition: all var(--transition-fast);
    min-height: 36px;
}
.picker-slot:hover { border-color: var(--color-acento); color: var(--color-primario); }
.picker-slot.selected {
    background: var(--color-primario);
    border-color: var(--color-primario);
    color: var(--color-texto-inverso);
}
.picker-placeholder, .picker-loading, .picker-empty, .picker-error {
    color: var(--color-texto-tenue);
    font-size: var(--text-sm);
    text-align: center;
    padding: var(--space-6) 0;
}
.picker-error { color: var(--color-error); }

/* ── Modal picker ────────────────────────────────────────────── */
.picker-modal {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal, 500);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}
.picker-modal[hidden] { display: none; }

.picker-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(2px);
    animation: fadeIn 0.18s ease;
}

.picker-modal-card {
    position: relative;
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 460px;
    max-height: 90vh;
    overflow-y: auto;
    animation: slideUp 0.22s ease;
}

.picker-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-5) var(--space-6);
    border-bottom: 1px solid var(--color-fondo-alt);
}

.picker-modal-title {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-primario);
    border-bottom: 2px solid var(--color-primario);
    padding-bottom: var(--space-1);
}

.picker-modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--color-texto-tenue);
    cursor: pointer;
    border-radius: var(--radius);
    transition: background var(--transition-fast);
}
.picker-modal-close:hover { background: var(--color-fondo-alt); color: var(--color-texto); }

.picker-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-6);
    border-top: 1px solid var(--color-fondo-alt);
    flex-wrap: wrap;
}

.picker-seleccion-label {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Botón outline */
.btn-outline-primario {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 var(--space-5);
    border: 2px solid var(--color-primario);
    color: var(--color-primario);
    border-radius: var(--radius-full);
    font-size: var(--text-sm);
    font-weight: 500;
    background: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
    text-decoration: none;
}
.btn-outline-primario:hover {
    background: var(--color-primario);
    color: var(--color-texto-inverso);
}

@keyframes fadeIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.agenda-card {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    box-shadow: var(--shadow);
}

/* Horarios grid */
.horarios-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}
.horario-btn {
    padding: 0.75rem;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: var(--radius);
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-texto);
    background: var(--color-blanco);
    cursor: pointer;
    transition: all var(--transition-fast);
    min-height: 44px;
}
.horario-btn:hover,
.horario-btn.selected {
    background: var(--color-primario);
    border-color: var(--color-primario);
    color: var(--color-texto-inverso);
}
.horario-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Calendario mini */
.mini-cal {
    border: 1px solid var(--color-fondo-alt);
    border-radius: var(--radius-md);
    overflow: hidden;
}
.mini-cal-header {
    background: var(--color-primario);
    color: var(--color-texto-inverso);
    padding: var(--space-4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--font-heading);
    font-size: var(--text-lg);
}
.mini-cal-nav {
    background: transparent;
    border: none;
    color: var(--color-texto-inverso);
    font-size: var(--text-lg);
    cursor: pointer;
    padding: var(--space-2);
    min-width: 36px;
    min-height: 36px;
}
.mini-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: var(--color-fondo-alt);
    gap: 1px;
}
.mini-cal-day-name {
    padding: var(--space-2);
    text-align: center;
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-texto-tenue);
    background: var(--color-fondo);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.mini-cal-day {
    background: var(--color-blanco);
    padding: var(--space-3);
    text-align: center;
    font-size: var(--text-sm);
    cursor: pointer;
    transition: all var(--transition-fast);
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mini-cal-day:hover { background: var(--color-fondo-alt); }
.mini-cal-day.selected {
    background: var(--color-primario);
    color: var(--color-texto-inverso);
    font-weight: 600;
}
.mini-cal-day.disabled { color: var(--color-texto-tenue); cursor: default; }
.mini-cal-day.today { border: 1.5px solid var(--color-acento); }
.mini-cal-day.empty { background: var(--color-fondo); cursor: default; }

/* ── Blog ────────────────────────────────────────────────────── */
.blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-top: var(--space-8);
}
@media (min-width: 640px) {
    .blog-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .blog-grid { grid-template-columns: 1fr 1fr 1fr; }
}

.blog-card-meta {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-xs);
    color: var(--color-texto-tenue);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: var(--space-2);
}

.blog-card-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-acento);
    text-decoration: none;
    margin-top: var(--space-4);
    letter-spacing: 0.03em;
    transition: gap var(--transition-fast);
}
.blog-card-link:hover { gap: var(--space-3); }

.blog-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}
@media (min-width: 1024px) {
    .blog-layout { grid-template-columns: 2fr 1fr; }
}

.blog-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.sidebar-widget {
    background: var(--color-blanco);
    border-radius: var(--radius-md);
    padding: var(--space-6);
}

.sidebar-widget-title {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-texto-tenue);
    margin-bottom: var(--space-5);
}

.sidebar-recent-post {
    display: flex;
    gap: var(--space-3);
    align-items: flex-start;
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.sidebar-recent-post:last-child { border-bottom: none; }

.sidebar-recent-img {
    width: 64px;
    height: 64px;
    min-width: 64px;
    border-radius: var(--radius);
    object-fit: cover;
}

.sidebar-recent-title {
    font-family: var(--font-heading);
    font-size: var(--text-base);
    line-height: 1.4;
    color: var(--color-primario);
}

/* Artículo completo */
.article-header {
    margin-bottom: var(--space-10);
}

.article-hero {
    width: 100%;
    aspect-ratio: 16/7;
    object-fit: cover;
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-8);
}

.article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    align-items: center;
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
}
.article-meta-sep { color: var(--color-fondo-oscuro); }

/* Comentarios */
.comment {
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.comment-author {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}
.comment-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--color-fondo-alt);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    color: var(--color-primario);
    font-size: var(--text-lg);
}
.comment-name { font-weight: 600; font-size: var(--text-sm); }
.comment-date { font-size: var(--text-xs); color: var(--color-texto-tenue); }
.comment-text { font-size: var(--text-sm); color: var(--color-texto-suave); line-height: 1.7; }

/* ── Tienda ──────────────────────────────────────────────────── */
.producto-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--space-4);
    flex-wrap: wrap;
    gap: var(--space-3);
}
.producto-precio {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
}
.precio-actual {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-acento);
    font-weight: 500;
}
.precio-original {
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    text-decoration: line-through;
}
.producto-badge {
    position: absolute;
    top: var(--space-3);
    right: var(--space-3);
    background: var(--color-acento);
    color: var(--color-primario);
    font-size: var(--text-xs);
    padding: 0.3em 0.7em;
    border-radius: var(--radius-full);
    font-weight: 600;
    z-index: 1;
}
.blog-card-img-placeholder {
    width: 100%;
    aspect-ratio: 4/3;
    background: var(--color-fondo-alt);
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card {
    background: var(--color-blanco);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: transform var(--transition), box-shadow var(--transition);
}
.product-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.product-img-wrap { position: relative; overflow: hidden; }
.product-img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    transition: transform var(--transition-slow);
}
.product-card:hover .product-img { transform: scale(1.05); }

.product-badge-digital {
    position: absolute;
    top: var(--space-3);
    right: var(--space-3);
    background: var(--color-acento);
    color: var(--color-primario);
    font-size: var(--text-xs);
    padding: 0.3em 0.7em;
    border-radius: var(--radius-full);
    font-weight: 600;
}

.product-body { padding: var(--space-5); }
.product-name {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    color: var(--color-primario);
    margin-bottom: var(--space-2);
}
.product-price { font-size: var(--text-xl); color: var(--color-acento); font-weight: 500; }
.product-price-old {
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    text-decoration: line-through;
    margin-left: var(--space-2);
}

/* Detalle de producto */
.product-detail-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-10);
}
@media (min-width: 768px) {
    .product-detail-grid { grid-template-columns: 1fr 1fr; }
}

/* Nuevo layout 2 columnas: col-main (card) + col-desc */
.producto-detalle-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 2rem;
    align-items: start;
}
@media (max-width: 900px) {
    .producto-detalle-grid { grid-template-columns: 1fr; }
}

.producto-col-main {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.producto-galeria {
    background: var(--color-fondo-alt);
    aspect-ratio: 4/3;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.galeria-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.galeria-placeholder {
    color: var(--color-texto-suave);
    font-size: var(--text-sm);
}
.galeria-thumbs {
    display: flex;
    gap: .5rem;
    padding: .75rem;
    background: var(--color-fondo-alt);
}
.galeria-thumb {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    cursor: pointer;
    opacity: .7;
    transition: opacity var(--transition-fast);
}
.galeria-thumb:hover { opacity: 1; }

.producto-info {
    padding: 1.5rem;
}
.producto-info h1 {
    font-size: var(--text-2xl);
    margin: .5rem 0 .75rem;
}
.producto-resumen {
    color: var(--color-texto-suave);
    font-size: var(--text-sm);
    margin-bottom: 1rem;
}
.producto-precio-box { margin: 1rem 0; }
.precio-original {
    text-decoration: line-through;
    color: var(--color-texto-suave);
    font-size: var(--text-sm);
    margin-right: .5rem;
}
.precio-actual { color: var(--color-primario); font-weight: 600; }
.precio-grande  { font-size: var(--text-3xl); font-family: var(--font-heading); }
.producto-stock { font-size: var(--text-sm); margin: .5rem 0; }
.stock-ok       { color: var(--color-primario); }
.stock-out      { color: #c0392b; }

.producto-acciones {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    align-items: center;
    margin-top: 1.25rem;
}
.qty-control {
    display: flex;
    align-items: center;
    gap: .25rem;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: var(--radius-full);
    padding: .2rem .4rem;
    width: fit-content;
}
.qty-input {
    width: 44px;
    text-align: center;
    border: none;
    outline: none;
    font-size: var(--text-base);
    background: transparent;
}

.producto-col-desc {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 2rem;
    min-height: 200px;
}
.producto-desc-titulo {
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin-bottom: 1.25rem;
    padding-bottom: .75rem;
    border-bottom: 2px solid var(--color-fondo-alt);
}
.producto-desc-content {
    line-height: 1.8;
    color: var(--color-texto);
}
.producto-desc-content p  { margin-bottom: 1rem; }
.producto-desc-content h2,
.producto-desc-content h3 { margin: 1.5rem 0 .75rem; color: var(--color-primario); }

.product-main-img {
    width: 100%;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.product-price-large {
    font-family: var(--font-heading);
    font-size: var(--text-4xl);
    color: var(--color-primario);
    margin: var(--space-4) 0;
}

/* Carrito */
.cart-item {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: var(--space-4);
    align-items: center;
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.cart-item-img {
    width: 80px;
    height: 80px;
    border-radius: var(--radius);
    object-fit: cover;
}
.cart-item-qty {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-3);
}
.qty-btn {
    width: 32px;
    height: 32px;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: var(--text-lg);
    background: var(--color-blanco);
    color: var(--color-primario);
    transition: all var(--transition-fast);
}
.qty-btn:hover { background: var(--color-primario); color: var(--color-texto-inverso); border-color: var(--color-primario); }

.cart-summary {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    box-shadow: var(--shadow);
    position: sticky;
    top: calc(80px + var(--space-4));
}

.cart-total-row {
    display: flex;
    justify-content: space-between;
    padding: var(--space-3) 0;
    font-size: var(--text-sm);
    border-bottom: 1px solid var(--color-fondo-alt);
}
.cart-total-row.final {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    color: var(--color-primario);
    border: none;
    padding-top: var(--space-5);
}

/* ── Eventos ─────────────────────────────────────────────────── */
.evento-card {
    display: grid;
    grid-template-columns: 1fr;
    background: var(--color-blanco);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition);
}
@media (min-width: 768px) {
    .evento-card { grid-template-columns: 280px 1fr; }
}
.evento-card:hover { box-shadow: var(--shadow-md); }

.evento-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}
@media (min-width: 768px) { .evento-img { height: 100%; } }

.evento-body { padding: var(--space-6) var(--space-8); }
.evento-fecha-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-fondo-alt);
    border-radius: var(--radius);
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-primario);
    margin-bottom: var(--space-4);
    font-weight: 500;
}
.evento-titulo {
    font-family: var(--font-heading);
    font-size: var(--text-3xl);
    color: var(--color-primario);
    margin-bottom: var(--space-3);
}
.evento-lugar {
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    margin-bottom: var(--space-4);
}
.evento-precio {
    font-size: var(--text-2xl);
    color: var(--color-acento);
    font-weight: 500;
    margin-top: auto;
}

/* ── Contacto ────────────────────────────────────────────────── */
.contacto-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-10);
}
@media (min-width: 1024px) {
    .contacto-grid { grid-template-columns: 5fr 4fr; }
}

/* Layout 2 columnas: form izquierda (700px) + imagen derecha */
.contacto-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-10);
    align-items: start;
}
@media (min-width: 1024px) {
    .contacto-layout { grid-template-columns: minmax(0, 700px) 1fr; }
}

.contacto-imagen {
    width: 100%;
    min-height: 480px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
    display: block;
    margin: 0;
}
.contacto-imagen img {
    width: 100%;
    height: 100%;
    min-height: 480px;
    object-fit: cover;
    object-position: center;
    display: block;
}
.contacto-imagen-placeholder {
    background: var(--color-fondo-alt);
    min-height: 480px;
}

.contacto-info-block {
    margin-top: var(--space-10);
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.contacto-info-card {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-6) var(--space-8);
    box-shadow: var(--shadow-sm);
}
.contacto-info-card h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin-bottom: var(--space-5);
}

.contacto-info-item {
    display: flex;
    gap: var(--space-4);
    align-items: flex-start;
    margin-bottom: var(--space-6);
}
.contacto-info-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    background: var(--color-fondo-alt);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primario);
    font-size: 1.25rem;
}

/* ── Confirmación reserva / pago ─────────────────────────────── */
.confirmacion-card {
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-12) var(--space-8);
    box-shadow: var(--shadow-md);
}

.confirmacion-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto var(--space-6);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
}
.confirmacion-icon.exito    { background: rgba(74,124,89,0.12);  color: var(--color-exito); }
.confirmacion-icon.error    { background: rgba(139,58,58,0.12);  color: var(--color-error); }

.confirmacion-detail {
    background: var(--color-fondo);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    margin: var(--space-6) 0;
    text-align: left;
}
.confirmacion-detail-row {
    display: flex;
    justify-content: space-between;
    padding: var(--space-2) 0;
    font-size: var(--text-sm);
    border-bottom: 1px solid var(--color-fondo-alt);
}
.confirmacion-detail-row:last-child { border: none; }
.confirmacion-detail-row span:first-child { color: var(--color-texto-tenue); }

/* ── Testimonios página ──────────────────────────────────────── */
.testimonios-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}
@media (min-width: 768px)  { .testimonios-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1280px) { .testimonios-grid { grid-template-columns: 1fr 1fr 1fr; } }

/* ── Error pages ─────────────────────────────────────────────── */
.error-page {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    gap: var(--space-6);
    padding: var(--space-16) var(--space-6);
}
.error-num {
    font-family: var(--font-heading);
    font-size: clamp(6rem, 20vw, 12rem);
    line-height: 1;
    color: var(--color-fondo-oscuro);
    font-weight: 300;
}

/* ── qty-ctrl: nuevo control de cantidad ─────────────────────── */
.qty-ctrl {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}
.qty-ctrl-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--color-fondo-oscuro);
    background: var(--color-blanco);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primario);
    transition: all var(--transition-fast);
    flex-shrink: 0;
    padding: 0;
}
.qty-ctrl-btn:hover {
    background: var(--color-primario);
    color: var(--color-blanco);
    border-color: var(--color-primario);
}
.qty-ctrl-btn:disabled { opacity: .4; cursor: not-allowed; }
.qty-sel { position: relative; }
.qty-sel-btn {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border: 1.5px solid var(--color-fondo-oscuro);
    border-radius: var(--radius-full);
    padding: .3rem .85rem;
    background: var(--color-blanco);
    cursor: pointer;
    min-width: 64px;
    justify-content: center;
    font-size: var(--text-base);
    font-weight: 500;
    color: var(--color-texto);
    transition: border-color var(--transition-fast);
}
.qty-sel-btn:hover { border-color: var(--color-acento); }
.qty-sel-caret {
    width: 10px;
    height: 10px;
    color: var(--color-texto-suave);
    transition: transform var(--transition-fast);
    flex-shrink: 0;
}
.qty-sel.open .qty-sel-btn { border-color: var(--color-acento); }
.qty-sel.open .qty-sel-caret { transform: rotate(180deg); }
.qty-sel-list {
    position: absolute;
    top: calc(100% + .3rem);
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-blanco);
    border: 1px solid var(--color-fondo-oscuro);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    list-style: none;
    margin: 0;
    padding: .3rem 0;
    max-height: calc(5 * 38px);
    overflow-y: auto;
    z-index: 200;
    min-width: 64px;
    display: none;
}
.qty-sel.open .qty-sel-list { display: block; }
.qty-sel-list li {
    padding: .5rem 1.25rem;
    cursor: pointer;
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-texto);
    transition: background var(--transition-fast);
}
.qty-sel-list li:hover { background: var(--color-fondo-alt); }
.qty-sel-list li.selected { background: var(--color-fondo-alt); font-weight: 600; color: var(--color-primario); }

/* ── Carrito 2 columnas ──────────────────────────────────────── */
.carrito-vacio {
    text-align: center;
    padding: 4rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    color: var(--color-texto-suave);
}

.carrito-2col {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: start;
}
@media (min-width: 900px) {
    .carrito-2col { grid-template-columns: 1fr 360px; }
}

.carrito-col-items {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.carrito-col-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--color-fondo-alt);
    font-weight: 600;
    font-size: var(--text-lg);
}
.carrito-count-badge {
    color: var(--color-acento);
    font-weight: 500;
    font-size: var(--text-sm);
}

.carrito-row {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 1rem;
    align-items: center;
    padding: 1.1rem 1.5rem;
    border-bottom: 1px solid var(--color-fondo-alt);
    transition: background var(--transition-fast);
}
.carrito-row:hover { background: var(--color-fondo); }

.carrito-row-img img,
.carrito-img-ph {
    width: 80px;
    height: 80px;
    border-radius: var(--radius);
    object-fit: cover;
    background: var(--color-fondo-alt);
    display: block;
}

.carrito-row-nombre {
    font-weight: 600;
    color: var(--color-texto);
    margin-bottom: .15rem;
}
.carrito-row-tipo {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    margin-bottom: .65rem;
}
.carrito-row-acc {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.carrito-trash {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-texto-suave);
    padding: .3rem;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    transition: color var(--transition-fast);
    flex-shrink: 0;
}
.carrito-trash:hover { color: #c0392b; }

.qty-display {
    min-width: 28px;
    text-align: center;
    font-size: var(--text-base);
    font-weight: 500;
    display: inline-block;
}

.carrito-row-precio {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: .25rem;
    min-width: 90px;
}
.carrito-subtotal {
    font-weight: 600;
    font-size: var(--text-lg);
    color: var(--color-primario);
}
.carrito-precio-unit {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
}

.carrito-col-footer {
    padding: .9rem 1.5rem;
    border-top: 1px solid var(--color-fondo-alt);
}
.btn-text-muted {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-texto-suave);
    font-size: var(--text-sm);
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .25rem .5rem;
    border-radius: var(--radius-sm);
    transition: color var(--transition-fast);
}
.btn-text-muted:hover { color: #c0392b; }

/* Cart summary header */
.cart-summary-hd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
}
.cart-summary-title {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    color: var(--color-primario);
    margin: 0;
}

/* ── Servicios (listado en cards) ─────────────────────────────── */
.servicios-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}
@media (min-width: 640px) {
    .servicios-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .servicios-grid { grid-template-columns: 1fr 1fr 1fr; }
}

.servicio-card {
    background: var(--color-blanco);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: transform var(--transition), box-shadow var(--transition);
}
.servicio-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}
.servicio-card-img { overflow: hidden; }
.servicio-card-img img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    display: block;
    transition: transform var(--transition-slow);
}
.servicio-card:hover .servicio-card-img img { transform: scale(1.05); }
.servicio-card-body { padding: var(--space-5); }
.servicio-card-body h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin: var(--space-3) 0 var(--space-2);
}
.servicio-card-body p {
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    line-height: 1.6;
    margin-bottom: var(--space-4);
}
.servicio-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--space-4);
    flex-wrap: wrap;
    gap: var(--space-3);
}
.servicio-card .servicio-precio {
    font-size: var(--text-xl);
}

/* ── Blog — artículo completo ─────────────────────────────────── */
.articulo-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    max-width: 960px;
    margin: 0 auto;
}
@media (min-width: 1024px) {
    .articulo-layout { grid-template-columns: 2fr 1fr; }
}

.articulo-imagen-wrap {
    grid-column: 1 / -1;
    margin-bottom: var(--space-4);
}
.articulo-imagen-hero { margin-bottom: var(--space-2); }
.articulo-imagen-main {
    width: 100%;
    display: block;
    aspect-ratio: 16/7;
    object-fit: cover;
    border-radius: var(--radius-lg);
}
.articulo-meta {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    margin-top: var(--space-3);
}
.articulo-resumen {
    font-size: var(--text-lg);
    color: var(--color-texto-suave);
    line-height: 1.7;
    margin-bottom: var(--space-6);
    border-left: 3px solid var(--color-acento);
    padding-left: var(--space-5);
}
.articulo-body,
.servicio-descripcion,
.pagina-contenido {
    line-height: 1.8;
    color: var(--color-texto);
    text-align: justify;
    hyphens: auto;
}
.articulo-body h2,
.servicio-descripcion h2,
.pagina-contenido h2 {
    font-family: var(--font-heading);
    font-size: var(--text-3xl);
    color: var(--color-primario);
    margin: var(--space-8) 0 var(--space-4);
}
.articulo-body h3,
.servicio-descripcion h3,
.pagina-contenido h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin: var(--space-6) 0 var(--space-3);
}
.articulo-body p,
.servicio-descripcion p,
.pagina-contenido p { margin-bottom: var(--space-4); }
.articulo-body ul, .articulo-body ol,
.servicio-descripcion ul, .servicio-descripcion ol,
.pagina-contenido ul, .pagina-contenido ol {
    padding-left: 1.5rem;
    margin-bottom: var(--space-4);
}
.articulo-body li,
.servicio-descripcion li,
.pagina-contenido li { margin-bottom: var(--space-2); }
.articulo-body a,
.servicio-descripcion a,
.pagina-contenido a { color: var(--color-acento); }
.articulo-body strong,
.servicio-descripcion strong,
.pagina-contenido strong { font-weight: 600; }
/* Preservar colores y tamaños inline del editor */
.articulo-body span[style],
.servicio-descripcion span[style],
.pagina-contenido span[style],
.articulo-body font,
.servicio-descripcion font,
.pagina-contenido font { display: inline; }

.articulo-share {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-10);
    padding-top: var(--space-6);
    border-top: 1px solid var(--color-fondo-alt);
    font-size: var(--text-sm);
    color: var(--color-texto-tenue);
    flex-wrap: wrap;
}
.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    width: 70px;
    padding: 0;
    border-radius: var(--radius-full);
    text-decoration: none;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .02em;
    line-height: 1;
    cursor: pointer;
    border: none;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    transition: background var(--transition-fast), color var(--transition-fast);
}
.share-btn:hover { background: var(--color-primario); color: var(--color-texto-inverso); }
.share-fb,
.share-x,
.share-wa,
.share-ig {
    background: var(--color-fondo-alt);
    color: var(--color-primario);
    border: 1.5px solid var(--color-fondo-oscuro);
}

.articulo-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

/* ── Sidebar compartida (blog + eventos) ──────────────────────── */
.sidebar-card {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-6) var(--space-8);
    box-shadow: var(--shadow-sm);
}
.sidebar-card h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin-bottom: var(--space-5);
}
.sidebar-lista {
    list-style: none;
    padding: 0;
    margin: 0;
}
.sidebar-lista li {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.sidebar-lista li:last-child { border-bottom: none; }
.sidebar-lista a {
    color: var(--color-primario);
    text-decoration: none;
    font-size: var(--text-sm);
    line-height: 1.4;
}
.sidebar-lista a:hover { color: var(--color-acento); }
.sidebar-lista time {
    font-size: var(--text-xs);
    color: var(--color-texto-tenue);
}
.sidebar-cta {
    background: var(--color-primario);
    color: var(--color-texto-inverso);
}
.sidebar-cta h3 { color: var(--color-texto-inverso); }
.sidebar-cta p {
    color: rgba(255,255,255,.8);
    font-size: var(--text-sm);
    margin-bottom: var(--space-5);
}

.sidebar-item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    font-size: var(--text-sm);
    color: var(--color-texto-suave);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.sidebar-item:last-child { border-bottom: none; }
.sidebar-item svg { flex-shrink: 0; margin-top: 1px; }
.sidebar-item span { line-height: 1.5; }

.sidebar-precio {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
}
.precio-label {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--color-texto-tenue);
}
.precio-valor {
    font-family: var(--font-heading);
    font-size: var(--text-3xl);
    color: var(--color-primario);
}

/* ── Comentarios (blog) ────────────────────────────────────────── */
.comentarios-lista {
    display: flex;
    flex-direction: column;
}
.comentario {
    padding: var(--space-6) 0;
    border-bottom: 1px solid var(--color-fondo-alt);
}
.comentario:last-child { border-bottom: none; }
.comentario-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-2);
}
.comentario-autor {
    font-weight: 600;
    font-size: var(--text-sm);
    color: var(--color-primario);
}
.comentario-header time {
    font-size: var(--text-xs);
    color: var(--color-texto-tenue);
}

/* ── Contacto — card de datos (full width) ────────────────────── */
.contacto-datos-card {
    background: var(--color-blanco);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    box-shadow: var(--shadow-sm);
    margin-top: var(--space-10);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}
@media (min-width: 640px) {
    .contacto-datos-card { grid-template-columns: 1fr 1fr; }
}
.contacto-datos-section h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--color-primario);
    margin-bottom: var(--space-5);
}