:root {
  --bg: #06100e;
  --bg-soft: #0a1714;
  --paper: #e8e1d2;
  --muted: #a9b2ad;
  --cold: #5fc8ba;
  --cold-dark: #1b6c65;
  --gold: #d6aa52;
  --gold-light: #f0d38d;
  --line: rgba(255,255,255,.12);
  --shadow: 0 24px 70px rgba(0,0,0,.55);
  --serif: "Cinzel", Georgia, serif;
  --sans: "Inter", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--paper);
  background: var(--bg);
  font-family: var(--sans);
  line-height: 1.7;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.narrow { width: min(800px, 100%); text-align: center; }
.section { padding: 110px 0; position: relative; }
.skip-link { position: fixed; top: -60px; left: 20px; z-index: 9999; padding: 10px 15px; background: white; color: black; }
.skip-link:focus { top: 20px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: linear-gradient(to bottom, rgba(3,9,8,.96), rgba(3,9,8,.68));
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(13px);
}
.nav { min-height: 78px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { width:43px; height:43px; border:1px solid var(--gold); display:grid; place-items:center; border-radius:50%; font-family:var(--serif); color:var(--gold-light); }
.brand-text { font-family:var(--serif); font-size:.9rem; letter-spacing:.06em; line-height:1.25; }
.brand-text small { display:block; font-family:var(--sans); color:var(--muted); text-transform:uppercase; letter-spacing:.25em; font-size:.58rem; margin-top:4px; }
.nav-links { display:flex; gap:28px; align-items:center; }
.nav-links a { color:#d8d7d1; text-transform:uppercase; letter-spacing:.13em; font-size:.72rem; transition:.25s; }
.nav-links a:hover { color:var(--gold-light); }
.menu-toggle { display:none; background:none; border:0; padding:8px; }
.menu-toggle span { display:block; width:27px; height:2px; margin:5px; background:#fff; }

.hero { min-height: 100vh; display:grid; grid-template-columns:1fr 1fr; position:relative; background:#000; }
.hero-panel { position:relative; min-height:100vh; display:flex; align-items:flex-end; padding:170px 8vw 100px; background-size:cover; background-position:center; overflow:hidden; }
.hero-kaeltas { background-image:url('../img/kaeltas-portada-definitiva.jpg'); background-position:78% center; }
.hero-acva { background-image:url('../img/acva-portada-definitiva.jpg'); background-position:center 42%; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(1,7,6,.97) 0%, rgba(1,7,6,.55) 48%, rgba(1,7,6,.22) 100%); }
.hero-kaeltas .hero-overlay { background:linear-gradient(100deg, rgba(1,8,8,.8), rgba(1,8,8,.18)), linear-gradient(to top, rgba(1,8,8,.96), transparent 65%); }
.hero-acva .hero-overlay { background:linear-gradient(260deg, rgba(9,6,2,.68), rgba(9,6,2,.1)), linear-gradient(to top, rgba(5,8,6,.97), transparent 65%); }
.hero-content { position:relative; z-index:2; max-width:520px; }
.hero-content h2 { font-family:var(--serif); font-size:clamp(3.3rem,7vw,7.8rem); line-height:.9; margin:.1em 0 .2em; text-shadow:0 8px 25px #000; }
.hero-content p:not(.eyebrow) { max-width:540px; color:#e4e8e3; font-size:1.02rem; }
.hero-content .btn { margin-top:17px; }
.eyebrow, .section-kicker { margin:0 0 14px; text-transform:uppercase; letter-spacing:.22em; font-size:.72rem; color:var(--gold-light); font-weight:600; }
.hero-kaeltas .eyebrow { color:#8ee1d4; }
.hero-center { position:absolute; z-index:4; top:60%; left:50%; transform:translate(-50%,-50%); text-align:center; width:150px; pointer-events:none; }
.crest-frame { width:108px; height:142px; margin:0 auto 12px; padding:0; background:transparent; border:0; box-shadow:0 16px 44px rgba(0,0,0,.72), 0 0 24px rgba(214,170,82,.15); overflow:visible; }
.crest-frame img { width:100%; height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 6px 14px rgba(0,0,0,.72)); }
.hero-center p { font-family:var(--serif); text-transform:uppercase; letter-spacing:.12em; font-size:.63rem; line-height:1.8; text-shadow:0 2px 8px #000; }
.hero-title-wrap { position:absolute; top:110px; left:50%; transform:translateX(-50%); z-index:5; width:min(900px,90%); text-align:center; text-shadow:0 3px 22px #000; }
.hero-title-wrap h1 { font-family:var(--serif); font-size:clamp(1.4rem,3.2vw,3.25rem); margin:5px 0; letter-spacing:.04em; }
.hero-title-wrap p { margin:5px 0; color:#e0ded7; }
.hero-kicker { text-transform:uppercase; letter-spacing:.34em; color:var(--gold-light) !important; font-size:.66rem; }
.scroll-cue { position:absolute; z-index:5; bottom:25px; left:50%; transform:translateX(-50%); font-size:1.7rem; animation:bob 2s infinite; }
@keyframes bob { 50% { transform:translate(-50%,8px); } }

.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 24px; border-radius:3px; text-transform:uppercase; letter-spacing:.13em; font-size:.7rem; font-weight:600; border:1px solid transparent; transition:.25s ease; }
.btn:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.35); }
.btn-cold { background:linear-gradient(135deg, var(--cold-dark), var(--cold)); color:#fff; }
.btn-gold { background:linear-gradient(135deg, #8d6424, var(--gold)); color:#160f04; }

.intro { background:radial-gradient(circle at 50% 0%, rgba(43,112,96,.18), transparent 48%), var(--bg); }
.section h2 { font-family:var(--serif); font-size:clamp(2rem,4vw,4rem); line-height:1.15; margin:0 0 25px; }
.lead { font-size:1.18rem; color:#d2d6d2; }
.ornament { color:var(--gold); margin-top:32px; }

.works { background:linear-gradient(180deg, #07110f, #030807); }
.section-heading { text-align:center; margin-bottom:70px; }
.book-feature { display:grid; grid-template-columns:minmax(290px, 430px) 1fr; gap:80px; align-items:center; padding:75px 0; border-top:1px solid var(--line); }
.book-feature:last-child { border-bottom:1px solid var(--line); }
.book-acva { grid-template-columns:1fr minmax(290px, 430px); }
.book-acva .book-cover { order:2; }
.book-cover { position:relative; width:100%; max-width:420px; margin:auto; filter:drop-shadow(0 25px 30px rgba(0,0,0,.55)); }
.book-cover:before { content:""; position:absolute; inset:5% -5% -4% 5%; background:rgba(0,0,0,.5); filter:blur(20px); z-index:-1; }
.book-cover img { width:100%; aspect-ratio:2/3; object-fit:cover; border-radius:2px; }
.cover-kaeltas img { object-position:80% center; }
.book-copy h3 { font-family:var(--serif); font-size:clamp(2rem,4.5vw,4.5rem); line-height:1.05; margin:12px 0 25px; }
.genre { text-transform:uppercase; letter-spacing:.14em; font-size:.7rem; color:var(--muted); }
.status { display:inline-block; padding:6px 10px; border:1px solid rgba(214,170,82,.55); color:var(--gold-light); text-transform:uppercase; letter-spacing:.17em; font-size:.65rem; }
.book-kaeltas .status { color:#9be8dc; border-color:rgba(95,200,186,.55); }
.book-copy > p:not(.genre) { max-width:700px; color:#c1c8c3; }
blockquote { margin:28px 0; padding-left:22px; border-left:2px solid var(--gold); font-family:Georgia, serif; font-style:italic; color:#e7e0d3; }
.book-kaeltas blockquote { border-left-color:var(--cold); }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:30px; }
.coming { color:#7f8a84; font-size:.78rem; }

.author { background:radial-gradient(circle at 20% 50%, rgba(214,170,82,.12), transparent 36%), #0a120f; }
.author-grid { display:grid; grid-template-columns:360px 1fr; gap:80px; align-items:center; }
.crest-large { background:radial-gradient(circle at center,rgba(214,170,82,.08),transparent 68%); padding:12px; border:0; box-shadow:none; }

.crest-large img { width:100%; max-height:520px; object-fit:contain; filter:drop-shadow(0 14px 28px rgba(0,0,0,.62)); }
.author p { color:#c3c9c4; }
.note, .form-note { font-size:.78rem; color:#7f8a84 !important; }

.newsletter { background:linear-gradient(rgba(4,9,7,.86), rgba(4,9,7,.96)), url('../img/acva-portada-definitiva.jpg') center 36%/cover fixed; text-align:center; }
.newsletter-form { display:flex; max-width:620px; margin:32px auto 13px; }
.newsletter-form input { flex:1; min-width:0; height:52px; border:1px solid rgba(214,170,82,.5); border-right:0; background:rgba(3,8,7,.72); color:#fff; padding:0 18px; outline:none; }
.newsletter-form input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(214,170,82,.12); }
.newsletter-form .btn { border-radius:0 3px 3px 0; }

.footer { padding:40px 0; background:#020504; border-top:1px solid var(--line); color:#8e9993; font-size:.8rem; }
.footer-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; }
.footer-grid > p { text-align:right; }
.footer strong { color:#d8d6ce; font-family:var(--serif); }
.footer p { margin:5px 0; }
.footer-links { display:flex; gap:22px; }
.footer a:hover { color:var(--gold-light); }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 920px) {
  .nav-links { position:fixed; top:78px; left:0; right:0; padding:28px; background:#07110f; display:none; flex-direction:column; border-bottom:1px solid var(--line); }
  .nav-links.open { display:flex; }
  .menu-toggle { display:block; }
  .hero { grid-template-columns:1fr; }
  .hero-panel { min-height:72vh; padding:170px 24px 70px; }
  .hero-center { top:62%; width:118px; }
  .crest-frame { width:82px; height:108px; }
  .hero-center p { display:none; }
  .hero-title-wrap { top:100px; }
  .book-feature, .book-acva { grid-template-columns:1fr; gap:45px; }
  .book-acva .book-cover { order:0; }
  .author-grid { grid-template-columns:1fr; }
  .crest-large { max-width:390px; margin:auto; }
  .footer-grid { grid-template-columns:1fr; text-align:center; }
  .footer-links { justify-content:center; }
  .footer-grid > p { text-align:center; }
}

@media (max-width: 600px) {
  .container { width:min(100% - 28px, 1180px); }
  .brand-text { font-size:.7rem; }
  .brand-mark { width:38px; height:38px; }
  .section { padding:78px 0; }
  .hero-panel { min-height:68vh; align-items:flex-end; padding-top:170px; }
  .hero-content h2 { font-size:3.2rem; }
  .hero-title-wrap h1 { font-size:1.25rem; }
  .hero-title-wrap > p:last-child { font-size:.78rem; }
  .hero-center { display:none; }
  .book-feature { padding:55px 0; }
  .newsletter-form { flex-direction:column; gap:10px; }
  .newsletter-form input { border-right:1px solid rgba(214,170,82,.5); }
  .newsletter-form .btn { border-radius:3px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}


/* Versión 2: venta directa por WhatsApp */
.section-subtitle { max-width:720px; margin:-10px auto 0; color:var(--muted); text-align:center; }
.nav-whatsapp { border:1px solid rgba(37,211,102,.55); padding:8px 13px; border-radius:999px; color:#bdf3d0 !important; }
.format-list { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 4px; }
.format-list span { border:1px solid var(--line); padding:7px 12px; border-radius:999px; color:#d9dedb; font-size:.75rem; letter-spacing:.05em; }
.btn-whatsapp { background:linear-gradient(135deg,#128c4a,#25d366); color:#03140a; box-shadow:0 10px 28px rgba(37,211,102,.18); }
.btn-large { width:100%; min-height:56px; }
.contact { background:linear-gradient(125deg,rgba(3,9,7,.98),rgba(8,28,19,.93)), url('../img/kaeltas-portada-definitiva.jpg') center/cover fixed; }
.contact-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:70px; align-items:center; }
.sales-card { padding:38px; border:1px solid rgba(37,211,102,.26); background:rgba(4,13,9,.78); box-shadow:var(--shadow); backdrop-filter:blur(9px); }
.sales-card h3 { font-family:var(--serif); font-size:1.7rem; margin:8px 0 18px; }
.sales-card ul { padding-left:20px; color:#cbd2cd; margin:0 0 28px; }
.sales-icon { color:#58df8a; font-size:1.8rem; }
.whatsapp-note { font-size:.72rem; color:#7f8a84; margin:15px 0 0; text-align:center; }
.whatsapp-note code { color:#aab5ae; }
.floating-whatsapp { position:fixed; right:22px; bottom:22px; z-index:900; width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:#25d366; color:#05210f; font-weight:800; letter-spacing:.04em; box-shadow:0 14px 35px rgba(0,0,0,.45); border:2px solid rgba(255,255,255,.55); transition:.25s; }
.floating-whatsapp:hover { transform:translateY(-3px) scale(1.04); }

@media (max-width:920px) {
  .contact-grid { grid-template-columns:1fr; gap:38px; }
}
@media (max-width:600px) {
  .floating-whatsapp { width:52px; height:52px; right:14px; bottom:14px; }
  .sales-card { padding:26px 20px; }
}

/* Versión 3: introducción cinematográfica y marca definitiva */
body.intro-active { overflow:hidden; }
.site-header { opacity:1; transform:none; }
.brand-crest { width:44px; height:52px; flex:0 0 44px; overflow:visible; border:0; background:transparent; box-shadow:none; }
.brand-crest img { width:100%; height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 3px 8px rgba(0,0,0,.75)); }
.whatsapp-number { margin:16px 0 0; color:#bdf3d0; text-align:center; letter-spacing:.12em; font-size:.82rem; }

.cinematic-intro { position:fixed; inset:0; z-index:9999; display:grid; place-items:center; overflow:hidden; background:#000; color:#f4ead7; isolation:isolate; transition:opacity 1s ease, visibility 1s ease; }
.cinematic-intro.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.intro-vignette { position:absolute; inset:-15%; background:radial-gradient(circle at 50% 46%, rgba(177,126,40,.13), rgba(0,0,0,.82) 40%, #000 73%); opacity:0; animation:introAmbient 6.4s ease forwards; }
.intro-particles { position:absolute; inset:0; opacity:.22; background-image:radial-gradient(circle, rgba(231,197,125,.75) 0 1px, transparent 1.4px); background-size:92px 92px; mask-image:radial-gradient(circle at center, #000, transparent 68%); animation:particleDrift 12s linear infinite; }
.intro-stage { position:relative; z-index:2; width:min(92vw,850px); text-align:center; display:grid; justify-items:center; }
.intro-crest { position:relative; width:clamp(165px,20vw,245px); aspect-ratio:969/1296; opacity:0; transform:translateY(34px) scale(.82); filter:brightness(.25) saturate(.72); animation:crestEmergence 2.7s .35s cubic-bezier(.2,.75,.2,1) forwards; }
.intro-crest img { position:relative; z-index:3; width:100%; height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 10px 24px rgba(0,0,0,.82)); }
.crest-halo { position:absolute; inset:6% -18%; border-radius:50%; z-index:1; background:radial-gradient(circle, rgba(255,212,112,.25), rgba(174,109,21,.08) 50%, transparent 72%); filter:blur(13px); opacity:0; animation:haloPulse 2.4s 2.1s ease-in-out forwards; }
.crest-sweep { position:absolute; z-index:4; inset:4% -10%; border-radius:46%; overflow:hidden; opacity:0; background:linear-gradient(105deg, transparent 28%, rgba(255,229,160,.55) 48%, transparent 68%); transform:translateX(-120%) skewX(-8deg); animation:lightSweep 1.35s 2.2s ease-out forwards; mix-blend-mode:screen; }
.wing-glow { position:absolute; z-index:2; top:16%; width:37%; height:34%; border-top:2px solid rgba(255,204,100,.0); filter:drop-shadow(0 0 10px rgba(238,178,71,.7)); opacity:0; animation:wingAwaken 1.3s 2.25s ease-out forwards; }
.wing-left { left:10%; border-radius:75% 12% 0 0; transform-origin:right bottom; transform:rotate(-3deg) scaleX(.7); }
.wing-right { right:10%; border-radius:12% 75% 0 0; transform-origin:left bottom; transform:rotate(3deg) scaleX(.7); }
.intro-copy { margin-top:8px; opacity:0; transform:translateY(15px); animation:copyReveal 1.3s 2.65s ease forwards; }
.intro-copy p { margin:0 0 10px; text-transform:uppercase; letter-spacing:.3em; font-size:clamp(.62rem,1.3vw,.82rem); color:#c8b792; }
.intro-copy h1 { margin:0; font-family:var(--serif); font-size:clamp(1.6rem,4vw,3.4rem); font-weight:600; letter-spacing:.055em; text-shadow:0 0 35px rgba(214,170,82,.23); }
.intro-copy span { display:block; margin-top:9px; text-transform:uppercase; letter-spacing:.42em; font-size:.67rem; color:var(--gold-light); }
.intro-phrase { max-width:720px; margin:29px 18px 0; font-family:Georgia,serif; font-style:italic; font-size:clamp(.82rem,1.8vw,1.05rem); color:#bdb5a6; opacity:0; animation:phraseReveal 1.2s 3.75s ease forwards; }
.intro-skip { position:absolute; right:22px; bottom:20px; z-index:5; border:0; background:transparent; color:#8f887d; text-transform:uppercase; letter-spacing:.14em; font-size:.62rem; cursor:pointer; padding:10px; transition:.25s; }
.intro-skip:hover,.intro-skip:focus-visible { color:#e8d6ae; }
.cinematic-intro.is-exiting .intro-stage { animation:stageAscend 1.25s cubic-bezier(.2,.8,.2,1) forwards; }
.cinematic-intro.is-exiting .intro-vignette { opacity:0; transition:opacity 1s ease; }

@keyframes introAmbient { 0%{opacity:0} 35%,78%{opacity:1} 100%{opacity:.72} }
@keyframes crestEmergence { 0%{opacity:0;transform:translateY(34px) scale(.82);filter:brightness(.2) saturate(.5)} 70%{opacity:1;filter:brightness(.95) saturate(.92)} 100%{opacity:1;transform:none;filter:brightness(1) saturate(1)} }
@keyframes haloPulse { 0%{opacity:0;transform:scale(.85)} 55%{opacity:1;transform:scale(1.05)} 100%{opacity:.58;transform:scale(1)} }
@keyframes lightSweep { 0%{opacity:0;transform:translateX(-120%) skewX(-8deg)} 15%{opacity:1} 100%{opacity:0;transform:translateX(120%) skewX(-8deg)} }
@keyframes wingAwaken { 0%{opacity:0;border-color:transparent;transform:rotate(0) scaleX(.7)} 45%{opacity:.85;border-color:rgba(255,204,100,.75);transform:rotate(0) scaleX(1.08)} 100%{opacity:.25;border-color:rgba(255,204,100,.38);transform:rotate(0) scaleX(1)} }
@keyframes copyReveal { to{opacity:1;transform:none} }
@keyframes phraseReveal { to{opacity:1} }
@keyframes particleDrift { to{transform:translate3d(30px,-60px,0)} }
@keyframes stageAscend { 0%{transform:none;opacity:1} 60%{transform:translateY(-15vh) scale(.72);opacity:.8} 100%{transform:translateY(-36vh) scale(.26);opacity:0} }

@media (max-width:600px) {
  .brand-crest { width:36px; height:44px; flex-basis:36px; }
  .intro-crest { width:min(46vw,205px); }
  .intro-copy p { letter-spacing:.19em; }
  .intro-copy h1 { line-height:1.18; }
  .intro-phrase { max-width:88vw; line-height:1.6; }
  .intro-skip { right:10px; bottom:10px; }
}

@media (prefers-reduced-motion: reduce) {
  .cinematic-intro { display:none; }
  body.intro-active { overflow:auto; }
}
