@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --ink:#090909;
  --ink-2:#11100e;
  --ink-3:#181613;
  --paper:#eee9df;
  --paper-soft:#c9c1b5;
  --gold:#b89561;
  --gold-hi:#dfc18e;
  --line:rgba(238,233,223,.13);
  --line-gold:rgba(184,149,97,.38);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --max:1240px;
  --ease:cubic-bezier(.2,.75,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);line-height:1.65;-webkit-font-smoothing:antialiased}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.container{width:min(calc(100% - 48px),var(--max));margin:auto}
.skip-link{position:fixed;left:15px;top:-100px;background:var(--gold);color:#080706;padding:10px 15px;z-index:10000}.skip-link:focus{top:15px}
.site-header{position:fixed;inset:0 0 auto;z-index:1000;height:88px;border-bottom:1px solid transparent;transition:.5s var(--ease)}
.site-header.scrolled{height:72px;background:rgba(9,9,9,.78);backdrop-filter:blur(18px);border-color:var(--line)}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{font-family:var(--serif);font-weight:600;letter-spacing:.09em;font-size:1.18rem;white-space:nowrap}
.brand em{font-style:normal;color:var(--gold)}
.nav{display:flex;align-items:center;gap:28px}.nav a{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(238,233,223,.65);position:relative;padding:7px 0}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--gold);transition:.35s}.nav a:hover,.nav a.active{color:var(--paper)}.nav a:hover:after,.nav a.active:after{right:0}
.menu-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--paper);padding:9px 11px}

.hero{min-height:100svh;position:relative;display:flex;align-items:end;overflow:hidden;background:#090909}
.hero:before{
 content:"";position:absolute;inset:-8%;
 background:
 radial-gradient(ellipse at 76% 35%,rgba(184,149,97,.22),transparent 22%),
 radial-gradient(ellipse at 63% 75%,rgba(118,88,48,.12),transparent 28%),
 linear-gradient(125deg,#080808 12%,#15120f 55%,#050505 100%);
 animation:heroDrift 16s ease-in-out infinite alternate;
}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,5,.98) 0%,rgba(5,5,5,.86) 40%,rgba(5,5,5,.26) 78%,rgba(5,5,5,.72) 100%),linear-gradient(0deg,rgba(5,5,5,.95),transparent 42%)}
@keyframes heroDrift{to{transform:scale(1.06) translate3d(-1.5%,1%,0)}}
.hero-inner{position:relative;z-index:2;padding:170px 0 95px;width:100%}
.hero-kicker{display:flex;align-items:center;gap:14px;color:var(--gold-hi);font-size:.67rem;letter-spacing:.25em;text-transform:uppercase}
.hero-kicker:before{content:"";width:42px;height:1px;background:var(--gold)}
.hero h1{font-family:var(--serif);font-size:clamp(4rem,9.2vw,9.8rem);font-weight:400;line-height:.82;letter-spacing:-.025em;max-width:1000px;margin:28px 0 30px}
.hero h1 span{color:var(--gold-hi)}
.hero-lead{max-width:620px;font-family:var(--serif);font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.35;color:rgba(238,233,223,.73)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:35px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border:1px solid var(--gold);background:var(--gold);color:#0a0908;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;transition:.35s var(--ease)}
.btn:hover{background:var(--gold-hi);border-color:var(--gold-hi);transform:translateY(-3px)}
.btn.ghost{background:transparent;color:var(--paper);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold-hi)}
.hero-note{position:absolute;right:0;bottom:38px;z-index:3;writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.25em;font-size:.58rem;color:rgba(238,233,223,.42)}

section{padding:125px 0;position:relative}
.section-dark{background:var(--ink)}
.section-soft{background:linear-gradient(180deg,#13110f,#0d0c0b)}
.section-paper{background:var(--paper);color:var(--ink)}
.section-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;margin-bottom:60px}
.eyebrow{font-size:.65rem;text-transform:uppercase;letter-spacing:.25em;color:var(--gold-hi);margin:0 0 18px}
.section-paper .eyebrow{color:#86693e}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:.95;margin:0 0 22px}
h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.025em}
h3{font-size:2.2rem}
.lead{font-family:var(--serif);font-size:1.35rem;color:var(--paper-soft);line-height:1.35}
.section-paper .lead{color:#665f55}
.section-copy{max-width:680px;color:rgba(238,233,223,.58);font-size:.96rem}
.section-paper .section-copy{color:#665f55}

.books-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.book-card{position:relative;min-width:0;background:#141311;border:1px solid var(--line);overflow:hidden;transition:.55s var(--ease)}
.book-card:hover{transform:translateY(-9px);border-color:var(--line-gold);box-shadow:0 30px 70px rgba(0,0,0,.38)}
.book-visual{aspect-ratio:2/3;position:relative;overflow:hidden;background:#171411}
.book-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(184,149,97,.15),transparent 45%),radial-gradient(circle at 50% 25%,rgba(255,255,255,.08),transparent 28%);transition:.6s var(--ease)}
.book-card:hover .book-visual:before{transform:scale(1.12)}
.cover-slot{position:absolute;inset:0;display:grid;place-items:center;padding:25px;text-align:center}
.cover-slot:after{content:"";position:absolute;inset:14px;border:1px solid rgba(184,149,97,.28);pointer-events:none}
.cover-slot .cover-title{position:relative;z-index:2;font-family:var(--serif);font-size:2.15rem;line-height:.95;text-transform:uppercase;letter-spacing:.02em}
.cover-slot .cover-type{position:absolute;top:25px;left:25px;z-index:2;color:var(--gold-hi);font-size:.55rem;letter-spacing:.2em;text-transform:uppercase}
.book-info{padding:21px 21px 24px}
.book-type{font-size:.59rem;text-transform:uppercase;letter-spacing:.18em;color:var(--gold-hi)}
.book-info h3{font-size:1.85rem;margin:8px 0 12px;line-height:.98}
.book-info p{font-size:.84rem;color:rgba(238,233,223,.55);margin:0 0 17px}
.arrow-link{font-size:.64rem;letter-spacing:.17em;text-transform:uppercase;color:var(--gold-hi);font-weight:700}

.feature-book{display:grid;grid-template-columns:.75fr 1.25fr;gap:100px;align-items:center}
.feature-art{aspect-ratio:2/3;max-width:420px;position:relative;background:linear-gradient(145deg,#312a20,#0b0a09);border:1px solid var(--line-gold);box-shadow:0 40px 100px rgba(0,0,0,.5)}
.feature-art:before{content:"";position:absolute;inset:25px;border:1px solid rgba(184,149,97,.3)}
.feature-art:after{content:"";position:absolute;width:65%;height:65%;right:-15%;bottom:-9%;background:radial-gradient(circle,rgba(184,149,97,.2),transparent 65%);filter:blur(20px)}
.feature-title{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:40px;font-family:var(--serif);font-size:clamp(2.7rem,5vw,5rem);line-height:.84;z-index:2}
.feature-copy{max-width:700px}
.feature-copy h2{max-width:720px}
.rule{height:1px;background:var(--line);margin:35px 0}

.author-panel{display:grid;grid-template-columns:.72fr 1.28fr;gap:100px;align-items:center}
.author-portrait{aspect-ratio:4/5;background:linear-gradient(145deg,#292521,#0c0b0a);border:1px solid var(--line);position:relative;display:grid;place-items:center;color:rgba(238,233,223,.3);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase}
.author-portrait:before{content:"";position:absolute;inset:15px;border:1px solid rgba(184,149,97,.2)}
.author-copy{max-width:700px}

.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;background:#0c0b0a}
.marquee-track{display:inline-flex;gap:55px;padding:22px 0;animation:marquee 26s linear infinite;font-family:var(--serif);font-size:1.55rem;color:rgba(238,233,223,.42)}
.marquee-track span{color:var(--gold)}
@keyframes marquee{to{transform:translateX(-50%)}}

.newsletter-panel{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end}
.newsletter-form{display:grid;grid-template-columns:1fr auto;gap:9px}
.field{width:100%;min-height:52px;border:1px solid var(--line);background:#12110f;color:var(--paper);padding:0 15px;outline:0}.field:focus{border-color:var(--gold)}
.form-status{grid-column:1/-1;font-size:.72rem;color:var(--gold-hi)}

.page-hero{padding:175px 0 95px;background:radial-gradient(circle at 75% 20%,rgba(184,149,97,.11),transparent 24%),#0b0a09}
.breadcrumbs{font-size:.59rem;text-transform:uppercase;letter-spacing:.18em;color:rgba(238,233,223,.42);margin-bottom:30px}
.page-hero h1{font-size:clamp(4rem,8vw,8rem);max-width:1050px}
.prose{max-width:800px}.prose p{font-size:1.02rem;color:rgba(238,233,223,.62)}.prose h2{margin-top:45px}
.book-hero{padding:160px 0 110px;min-height:90svh;display:grid;align-items:center;background:radial-gradient(circle at 16% 45%,rgba(184,149,97,.16),transparent 28%),#090909}
.book-hero-grid{display:grid;grid-template-columns:.62fr 1.38fr;gap:90px;align-items:center}
.book-hero-art{aspect-ratio:2/3;max-width:430px;background:linear-gradient(145deg,#2c271f,#0b0a09);border:1px solid var(--line-gold);position:relative;display:grid;place-items:center;box-shadow:0 45px 120px rgba(0,0,0,.55)}
.book-hero-art:before{content:"";position:absolute;inset:18px;border:1px solid rgba(184,149,97,.3)}
.book-hero-art .cover-title{font-family:var(--serif);font-size:clamp(2.8rem,5vw,5.5rem);line-height:.82;text-align:center;padding:35px}
.book-hero h1{font-size:clamp(4rem,8vw,8.5rem);max-width:950px}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.pill{border:1px solid var(--line);padding:6px 10px;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-hi)}
.book-sections{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.specs{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin-top:30px}.spec{padding:17px 0;border-bottom:1px solid var(--line)}.spec strong{display:block;font-size:.57rem;letter-spacing:.17em;text-transform:uppercase;color:var(--gold-hi)}.spec span{font-size:.85rem;color:rgba(238,233,223,.6)}
.buy-panel{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;background:#13110f;border:1px solid var(--line);padding:38px}
.quote{font-family:var(--serif);font-size:1.65rem;line-height:1.2;border-left:1px solid var(--gold);padding-left:25px;color:rgba(238,233,223,.72)}
.empty-state{padding:35px;border:1px dashed rgba(184,149,97,.35);color:rgba(238,233,223,.52);background:rgba(184,149,97,.025)}
.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.post{padding:28px;background:#141311;border:1px solid var(--line)}.post small{font-size:.58rem;text-transform:uppercase;letter-spacing:.18em;color:var(--gold-hi)}.post h3{font-size:2rem;margin:13px 0}.post p{font-size:.86rem;color:rgba(238,233,223,.5)}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.contact-form{display:grid;gap:10px}.contact-form label{font-size:.63rem;text-transform:uppercase;letter-spacing:.15em;color:rgba(238,233,223,.5)}
footer{padding:60px 0 35px;background:#070706;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}.footer-title{font-family:var(--serif);font-size:1.7rem}.footer-links{display:grid;gap:9px;margin-top:13px}.footer-links a,footer p{color:rgba(238,233,223,.42);font-size:.78rem}.copyright{border-top:1px solid var(--line);margin-top:45px;padding-top:25px;color:rgba(238,233,223,.28);font-size:.62rem}
.back-top{position:fixed;right:20px;bottom:20px;width:45px;height:45px;border:1px solid var(--line);background:rgba(9,9,9,.85);color:var(--paper);z-index:90;display:none}.back-top.show{display:block}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.visible{opacity:1;transform:none}
.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}
@media(max-width:1050px){.books-grid{grid-template-columns:repeat(2,1fr)}.section-head,.feature-book,.author-panel,.book-hero-grid,.book-sections,.newsletter-panel,.contact-grid{grid-template-columns:1fr;gap:45px}.feature-art,.book-hero-art{max-width:360px}.nav{gap:16px}}
@media(max-width:800px){
 .container{width:min(calc(100% - 30px),var(--max))}.site-header{height:72px}.site-header.scrolled{height:66px}.menu-toggle{display:block}
 .nav{display:none;position:absolute;top:72px;left:15px;right:15px;background:#0e0d0c;border:1px solid var(--line);padding:10px;flex-direction:column;align-items:stretch}.nav.open{display:flex}.nav a{padding:12px}
 .hero h1,.page-hero h1,.book-hero h1{font-size:clamp(3.4rem,15vw,5.8rem)}.hero-inner{padding-top:135px;padding-bottom:70px}.hero-note{display:none}
 section{padding:85px 0}.books-grid,.posts-grid{grid-template-columns:1fr 1fr}.newsletter-form,.buy-panel{grid-template-columns:1fr}.specs{grid-template-columns:1fr}
}
@media(max-width:540px){.books-grid,.posts-grid{grid-template-columns:1fr}.brand{font-size:1rem}.feature-title{font-size:2.8rem}.hero-actions .btn{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* FASE 5 · Portadas reales en catálogo */
.book-visual.cover-real-card{background:#05090a}
.book-visual.cover-real-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .8s var(--ease),filter .8s var(--ease)}
.book-card:hover .book-visual.cover-real-card img{transform:scale(1.035);filter:saturate(1.06) brightness(1.04)}
.book-visual.cover-storm-card{background:#03090b}