/* Diseño editorial premium para la cubierta nocturna de lanzamiento. */
:root {
  --paper: #f6f3ec;
  --paper-deep: #ece7dc;
  --ink: #1b2633;
  --ink-dark: #101923;
  --muted: #6b7074;
  --line: #ded8cc;
  --gold: #c9a867;
  --max: 1160px;
}

html { scroll-padding-top: 92px; scroll-behavior: smooth; }
body { background: var(--paper); color: var(--ink); font-synthesis: none; }
.header { position: sticky; top: 0; z-index: 40; border-color: #e6dfd3; background: rgb(246 243 236 / 91%); backdrop-filter: blur(16px); }
.nav-wrap { padding-block: 16px; }
.brand { letter-spacing: 1.25px; }
.brand-mark { width: 42px; height: 42px; border-color: #b6a06d; color: #937842; font-family: var(--sans); font-size: 13px; font-weight: 700; letter-spacing: -1px; padding: 0; }
.header nav { gap: 27px; }
.header nav a { color: #424c56; }
.header nav .nav-buy { border: 0; border-radius: 999px; background: var(--ink); color: #f9f5ec; padding: 11px 18px; }
.header nav .nav-buy:hover { background: #2a3b4f; color: #fff; }

.hero {
  isolation: isolate;
  position: relative;
  max-width: none;
  padding: 72px max(32px, calc((100vw - var(--max)) / 2)) 0;
  min-height: 650px;
  overflow: hidden;
  color: #f7f2e9;
}
.hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(ellipse at 78% 30%, rgb(72 88 105 / 44%), transparent 39%),
    radial-gradient(ellipse at 14% 98%, rgb(117 91 52 / 19%), transparent 43%),
    linear-gradient(125deg, #111a27 0%, #172333 53%, #101722 100%);
  content: "";
}
.hero-copy, .hero-art, .hero-bottom { position: relative; z-index: 1; }
.hero-copy { max-width: 600px; }
.hero .eyebrow { color: #e0c27e; letter-spacing: 2.15px; }
.status-dot { background: #d7b66e; box-shadow: 0 0 0 4px rgb(215 182 110 / 17%); }
.hero h1 { max-width: 660px; font-size: clamp(68px, 8vw, 112px); letter-spacing: -5px; line-height: .99; }
.hero h1 em { color: #ddc17f; }
.hero-subtitle { color: #e9d9b2; font-size: 16px; }
.hero-description { color: #c7ced3; }
.hero-byline p, .hero-byline p > span { color: #d4d8d9; }
.tiny-rule { background: #c5a75f; }
.hero-year { color: rgb(241 233 213 / 8%); }
.book-stage { perspective: none; }
.book { width: min(100%, 328px); border-radius: 3px; box-shadow: 0 32px 64px rgb(0 0 0 / 42%), 0 4px 10px rgb(0 0 0 / 24%); transform: rotate(-1.5deg); transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease; }
.book:hover { transform: translateY(-5px) rotate(0); box-shadow: 0 40px 72px rgb(0 0 0 / 48%), 0 4px 10px rgb(0 0 0 / 24%); }
.book img { border-radius: 3px; }
.book-spine { opacity: .24; }
.book-stage::after { background: rgb(0 0 0 / 48%); filter: blur(24px); }
.art-caption { color: #c8c9c5; letter-spacing: .35px; }
.hero-bottom { border-color: rgb(234 224 202 / 24%); color: #d5d3cc; }
.button-green { background: #d3b56f; color: #17212b; }
.button-green:hover { background: #e2c783; }
.hero-actions .button { min-height: 54px; border-radius: 999px; box-shadow: 0 8px 24px rgb(0 0 0 / 20%); }
.hero-actions .button:hover { box-shadow: 0 12px 30px rgb(0 0 0 / 29%); }
.text-link { border-color: rgb(223 209 176 / 48%); color: #eee5d1; }
.text-link:hover { border-color: #e1c77d; }

.intro { padding-block: 96px; }
.section-label { color: #68747e; }
.section-label .index { color: #a18349; }
.intro h2, .history h2, .excerpt-heading h2, .faq h2 { color: #1b2633; }
.intro h2 em { color: #8d7651; }
.intro .intro-note { color: #7d6945; }
.history { background: #182433; }
.history-copy { color: #e9e5dd; }
.history .section-label, .history .section-label .index { color: #d0b575; }
.history h2 { color: #f7f2e9; }
.history p { color: #cbd0d2; }
.history blockquote { border-left-color: #c4a45c; }
.excerpt { padding-block: 94px; }
.excerpt-paper { border: 1px solid #e4dccd; border-radius: 12px; box-shadow: 0 18px 45px rgb(32 37 40 / 6%); }
.excerpt blockquote { color: #293644; }
.author { padding-block: 96px; }
.author-portrait img { border-radius: 3px; box-shadow: 16px 20px 44px rgb(35 38 39 / 15%); }
.author h2 { color: #1b2633; }
.author h2 em { color: #8d7651; }
.signature { color: #8d7651; }
.purchase { padding-block: 92px; border-color: #e2dccf; }
.purchase-top .eyebrow { color: #8d7651; }
.purchase h2 { color: #1b2633; }
.channels { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border-color: #ded8cc; border-radius: 12px; background: #faf8f3; box-shadow: 0 15px 40px rgb(30 37 42 / 5%); }
.channel { padding: 30px 32px 32px; transition: background-color .22s ease; }
.channel:hover { background: #fffdf8; }
.channel + .channel { border-left-color: #ded8cc; }
.channel-tag { color: #8d7651; }
.channel h3 { color: #1b2633; font-size: 32px; }
.channel p { color: #697077; font-size: 12px; max-width: 310px; }
.channel .button { border-radius: 999px; }
.faq { padding-block: 92px; }
.faq .eyebrow { color: #8d7651; }
.faq-items details { border-color: #ded8cc; }
.faq summary { color: #263441; }
.faq summary span { color: #9a7d46; }
.faq details p { color: #5e666e; }
.faq details a { color: #795f30; }
.closing { max-width: none; padding: 64px max(32px, calc((100vw - var(--max)) / 2)); background: #172332; color: #f4eddf; }
.closing p { color: #f4eddf; }
.closing > span { color: #cbb983; }
.footer { background: #101923; color: #e9e4d9; border-color: #2a3540; }
.footer a, .footer-link, .footer p { color: #d0d3d3; }
.reader { border: 1px solid #e5dcc9; border-radius: 12px; box-shadow: 0 28px 90px rgb(0 0 0 / 28%); }
.reader-bar { background: #172332; color: #e7d7ae; }
.reader h2 { color: #1b2633; }
.reader-byline { color: #8d7651; }
.privacy-dialog { border: 1px solid #e5dcc9; border-radius: 12px; box-shadow: 0 28px 90px rgb(0 0 0 / 28%); }
.privacy-dialog h2 { color: #1b2633; }

@media (max-width: 700px) {
  .hero { min-height: 0; padding: 46px 24px 0; }
  .hero h1 { font-size: clamp(61px, 13vw, 86px); letter-spacing: -3.5px; }
  .hero-art { margin-top: 38px; }
  .book { width: min(72vw, 286px); }
  .hero-bottom { color: #d8d6cf; }
  .intro, .excerpt, .author, .purchase, .faq { padding-block: 66px; }
  .channels { grid-template-columns: 1fr; }
  .channel + .channel { border-left: 0; border-top: 1px solid #ded8cc; }
  .channel { padding: 26px 24px; }
  .closing { padding: 48px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .book, .channel { transition: none; }
  .book, .book:hover { transform: none; }
}