/* Inicio funcionalidad Estilo editorial general */
:root {
    --gold: #c99a36;
    --gold-dark: #9b6a18;
    --blue: #0c5d9c;
    --green: #174f36;
    --wine: #8b1e2d;
    --paper: #f4ead6;
    --ink: #2d2418;
    --cream: #fff8ea;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: Georgia, 'Times New Roman', serif;
    color: var(--ink);
    background: var(--paper);
    overflow-x: hidden;
}
a { transition: all .2s ease; }
.section { padding: 90px 0; }
.main-navbar {
    background: rgba(21, 34, 29, .94);
    box-shadow: 0 6px 20px rgba(0,0,0,.25);
}
.navbar-brand { font-weight: 700; letter-spacing: .08em; }
.nav-link { font-family: Arial, sans-serif; font-size: .92rem; }
.section-title { margin-bottom: 45px; }
.section-title span {
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: var(--gold-dark);
    font-family: Arial, sans-serif;
    font-weight: 700;
    font-size: .78rem;
    margin-bottom: 10px;
}
.section-title h2 {
    font-size: 2.35rem;
    font-weight: 700;
}
.light-title span, .light-title h2 { color: #fff; }
.paper-section {
    background: radial-gradient(circle at top left, rgba(255,255,255,.55), rgba(244,234,214,.96)), url('assets/contraportada.jpg');
    background-size: cover;
    background-attachment: fixed;
    background-blend-mode: screen;
}
/* Fin funcionalidad Estilo editorial general */

/* Inicio funcionalidad Botones */
.btn { border-radius: 40px; padding: 12px 22px; font-family: Arial, sans-serif; font-weight: 700; border: 0; }
.btn i { margin-right: 6px; }
.btn-gold { background: linear-gradient(135deg, #e3bd5d, var(--gold-dark)); color: #fff; }
.btn-gold:hover { color:#fff; transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0,0,0,.22); }
.btn-wine { background: linear-gradient(135deg, #a73140, var(--wine)); color: #fff; }
.btn-wine:hover { color:#fff; transform: translateY(-2px); }
.btn-green { background: linear-gradient(135deg, #26704f, var(--green)); color: #fff; }
.btn-green:hover { color:#fff; transform: translateY(-2px); }
.disabled { opacity: .55; pointer-events: none; }
/* Fin funcionalidad Botones */

/* Inicio funcionalidad Hero */
.hero-section {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 130px 0 70px;
    background: linear-gradient(135deg, rgba(9,73,128,.92), rgba(22,83,49,.78)), url('assets/portada.png') center/cover no-repeat;
    color: #fff;
}
.hero-overlay {
    position:absolute; inset:0;
    background: radial-gradient(circle at 75% 45%, rgba(255,255,255,.16), transparent 24%), rgba(0,0,0,.18);
}
.hero-content { position: relative; z-index: 2; }
.eyebrow {
    text-transform: uppercase;
    letter-spacing: .24em;
    color: #ffe0a1;
    font-family: Arial, sans-serif;
    font-weight: 700;
}
.hero-section h1 {
    font-size: clamp(3rem, 7vw, 6rem);
    text-transform: uppercase;
    line-height: .95;
    color: #f5c85f;
    text-shadow: 0 5px 20px rgba(0,0,0,.45);
}
.hero-section h2 {
    font-size: clamp(1.5rem, 3vw, 2.5rem);
    color: #fff;
    margin: 18px 0;
}
.hero-section .lead { font-size: 1.18rem; max-width: 620px; }
.hero-buttons .btn { margin: 8px 8px 0 0; }
.book-3d-wrapper { perspective: 1200px; display: inline-block; }
.book-3d {
    width: min(360px, 76vw);
    position: relative;
    transform: rotateY(-17deg) rotateX(2deg);
    transform-style: preserve-3d;
    transition: transform .5s ease;
    filter: drop-shadow(30px 25px 25px rgba(0,0,0,.45));
}
.book-3d:hover { transform: rotateY(-8deg) rotateX(0deg) translateY(-6px); }
.book-3d img { width: 100%; border-radius: 6px; display:block; }
.book-3d:before {
    content:"";
    position:absolute;
    top: 10px; bottom: 10px; right: -28px;
    width: 28px;
    background: linear-gradient(90deg, #6a4516, #e4bd66, #7a4e14);
    transform: rotateY(90deg);
    transform-origin: left;
    border-radius: 0 5px 5px 0;
}
.book-3d:after {
    content:"";
    position:absolute;
    left: 8px; right: -22px; bottom: -28px;
    height: 28px;
    background: rgba(0,0,0,.24);
    filter: blur(12px);
    transform: rotateX(90deg);
}
/* Fin funcionalidad Hero */

/* Inicio funcionalidad Tarjetas editoriales */
.editorial-card, .meaning-card, .form-card, .buy-card {
    background: rgba(255,248,234,.95);
    border: 1px solid rgba(112,75,25,.18);
    border-radius: 22px;
    box-shadow: 0 20px 50px rgba(61,38,14,.16);
    padding: 34px;
}
.editorial-card p { font-size: 1.2rem; line-height: 1.85; }
.backcover-section { background: linear-gradient(135deg, #fff8ea, #ead9b8); }
.backcover-img {
    width: 100%;
    border-radius: 18px;
    box-shadow: 0 20px 40px rgba(0,0,0,.22);
    border: 8px solid #fff8ea;
}
.meaning-card h3 { color: var(--wine); font-weight:700; }
.icon-list { list-style:none; padding:0; margin:20px 0; }
.icon-list li { display:flex; gap:14px; margin-bottom:15px; line-height:1.55; }
.icon-list i { color: var(--gold-dark); font-size:1.2rem; width:24px; margin-top:5px; }
blockquote {
    border-left: 4px solid var(--gold);
    padding-left: 18px;
    font-style: italic;
    font-size: 1.1rem;
    color: var(--green);
}
/* Fin funcionalidad Tarjetas editoriales */

/* Inicio funcionalidad Compra */
.buy-section {
    background: linear-gradient(135deg, rgba(20,69,48,.95), rgba(10,70,112,.92)), url('assets/contraportada.jpg') center/cover no-repeat;
}
.buy-card { height:100%; text-align:center; }
.buy-card i { font-size: 3rem; color: var(--gold-dark); margin-bottom: 18px; }
.buy-card h3 { font-weight:700; color: var(--green); }
/* Fin funcionalidad Compra */

/* Inicio funcionalidad Formularios */
.form-control {
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,.18);
    min-height: 46px;
    font-family: Arial, sans-serif;
}
label { font-family: Arial, sans-serif; font-weight:700; font-size:.92rem; }
.ajax-message { margin-top: 14px; font-family: Arial, sans-serif; font-weight: 700; }
.ajax-message.success { color: #18613d; }
.ajax-message.error { color: #9b1a2a; }
code { color: var(--wine); }
/* Fin funcionalidad Formularios */

/* Inicio funcionalidad Foro */
.forum-section { background: #fff8ea; }
.forum-layout {
    display: grid;
    grid-template-columns: 270px 1fr;
    min-height: 520px;
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 20px 50px rgba(61,38,14,.13);
    overflow: hidden;
}
.topic-list { background: #174f36; color:#fff; padding: 18px; overflow:auto; }
.topic-item {
    padding: 13px 12px;
    border-radius: 14px;
    cursor: pointer;
    margin-bottom: 10px;
    background: rgba(255,255,255,.09);
    font-family: Arial, sans-serif;
}
.topic-item:hover, .topic-item.active { background: var(--gold-dark); }
.topic-chat { padding: 26px; }
.topic-chat h3 { color: var(--wine); font-weight:700; }
.chat-messages {
    height: 300px;
    overflow:auto;
    background: #f7edda;
    border-radius: 16px;
    padding: 18px;
    border: 1px solid rgba(0,0,0,.08);
}
.chat-bubble {
    background:#fff;
    border-radius:16px;
    padding:12px 14px;
    margin-bottom:12px;
    box-shadow:0 5px 12px rgba(0,0,0,.06);
}
.chat-bubble strong { color: var(--green); }
.chat-bubble small { display:block; color:#777; font-family:Arial, sans-serif; }
/* Fin funcionalidad Foro */

/* Inicio funcionalidad Contacto */
.contact-section {
    background: linear-gradient(135deg, rgba(139,30,45,.93), rgba(20,79,54,.92)), url('assets/portada.png') center/cover no-repeat;
}
.contact-card { background: rgba(255,248,234,.97); }
.whatsapp-link {
    display:block;
    margin-top:20px;
    text-align:center;
    color:#128c4a;
    font-weight:700;
    font-family:Arial, sans-serif;
    font-size:1.1rem;
}
.whatsapp-link i { font-size:1.5rem; margin-right:8px; }
.site-footer { background:#111; color:#ddd; padding:25px 0; font-family:Arial, sans-serif; }
.site-footer p { margin:0; }
/* Fin funcionalidad Contacto */

/* Inicio funcionalidad Responsivo */
@media (max-width: 991px) {
    .hero-section { text-align:center; }
    .forum-layout { grid-template-columns:1fr; }
    .topic-list { max-height:220px; }
}
@media (max-width: 576px) {
    .section { padding: 65px 0; }
    .editorial-card, .meaning-card, .form-card, .buy-card { padding:24px; }
    .hero-buttons .btn { display:block; width:100%; margin:10px 0; }
}
/* Fin funcionalidad Responsivo */
