/* Editorial pop system: two books, one visual language. */
:root {
  --paper: #f6f2e9;
  --ink: #0d1017;
  --blue: #4255ff;
  --acid: #ddff36;
  --red: #ff4f3a;
  --cyan: #4ee8d1;
  --pink: #ff43b4;
  --line: rgba(13, 16, 23, .17);
}

body { background-color: var(--paper); }

.site-header {
  border-bottom-color: var(--line);
  box-shadow: 0 1px 0 rgba(255,255,255,.5);
}

.site-header nav a.is-current:not(.nav-contact) { color: var(--blue); }
.site-header nav a.is-current:not(.nav-contact)::after { transform: scaleX(1); }

.nav-contact,
.hero-buy,
.book-buy {
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  padding: 15px 20px;
  box-shadow: 5px 5px 0 var(--blue);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease;
}

.hero-buy:hover,
.hero-buy:focus-visible,
.book-buy:hover,
.book-buy:focus-visible {
  gap: 36px;
  color: var(--ink);
  background: var(--acid);
  box-shadow: 8px 8px 0 var(--blue);
  transform: translate(-2px,-2px);
}

.text-link-secondary { padding-block: 12px; }
.text-link-secondary {
  position:relative;
  isolation:isolate;
  border:1px solid currentColor;
  border-radius:999px;
  padding:12px 16px;
  overflow:hidden;
}
.text-link-secondary::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--cyan);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform 220ms ease;
}
.text-link-secondary:hover::before,
.text-link-secondary:focus-visible::before { transform:scaleX(1); transform-origin:left; }

.hero {
  background:
    linear-gradient(115deg, transparent 0 58%, rgba(255,79,58,.09) 58% 100%),
    radial-gradient(circle at 74% 36%, rgba(66,85,255,.20), transparent 24%),
    var(--paper);
}

.hero-copy::after {
  content: "ROMANZO · IDENTITÀ · EQUIVOCI";
  display: inline-block;
  margin-top: 46px;
  padding: 8px 11px;
  background: var(--red);
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
  transform: rotate(-1.5deg);
}

.hero h1 em { color: var(--red); }
.hero h1 em { animation: wrong-place 900ms cubic-bezier(.2,.8,.2,1) 450ms both; }
@keyframes wrong-place {
  0% { transform:translateX(.28em) skewX(-7deg); }
  55% { transform:translateX(-.025em) skewX(2deg); }
  100% { transform:translateX(.08em) skewX(0); }
}
.hero-current-cover { box-shadow: -20px 25px 0 var(--ink), 24px 30px 0 var(--red); }
.cover-stage:hover .hero-current-cover { box-shadow: -26px 31px 0 var(--ink), 30px 37px 0 var(--red); }

.marquee { background: var(--red); color: var(--ink); }

.backlist { background: linear-gradient(125deg, rgba(255,79,58,.10), transparent 35%), #fff; }
.backlist .section-number { border-color: var(--red); color: var(--red); }
.backlist-cover:hover,.backlist-cover:focus-visible { box-shadow: -18px 22px 0 var(--red); }

.book-excerpt-name { background: var(--red); color: var(--ink); }
.book-excerpt-name::before { color: #fff; opacity: .18; }
.book-excerpt-name::after { color: var(--ink); }

.characters { background: #11141d; }
.character-card { border: 1px solid rgba(255,255,255,.12); }
.character-card.is-lit { box-shadow:0 0 28px var(--neon-a); }
.character-card.is-lit::before { opacity:1; animation:character-led 1.35s linear infinite; }

/* The second book begins as a genuinely different chapter. */
.story {
  grid-template-columns:minmax(0,.82fr) minmax(0,1fr) minmax(250px,.68fr);
  border-width: 18px 0 0;
  border-color: var(--blue);
  background:
    radial-gradient(circle at 85% 12%, rgba(78,232,209,.17), transparent 23%),
    #0d1328;
}
.story::before {
  content:"03";
  position:absolute;
  right:-.035em;
  top:.02em;
  color:rgba(78,232,209,.055);
  font:700 clamp(230px,33vw,500px)/.8 var(--serif);
  letter-spacing:-.1em;
  pointer-events:none;
}
.story > * { position:relative; z-index:1; }
.story-heading { grid-column:1; }
.story-body { grid-column:2; }
.story-heading h2 {
  max-width:100%;
  font-size:clamp(46px,4.8vw,72px);
  line-height:.88;
}
.story .section-number { color: var(--cyan); border-color: var(--cyan); }
.story .eyebrow { color: var(--cyan); }
.story-heading h2 em { color: var(--cyan); }
.story-body .story-tagline { color: var(--acid); }
.story-visual { box-shadow: 22px 22px 0 var(--blue); }
.coming-stamp {
  display:inline-block;
  margin-right:12px;
  padding:7px 9px;
  border:1px solid var(--acid);
  color:var(--acid);
  transform:rotate(-2deg);
}

.place-characters { order: 6; }
.soundtrack { order: 7; }
.about { order: 8; }
.events { order: 9; }
.contact { order: 10; }

.story-excerpt {
  grid-column: 3;
  width: min(100%, 390px);
  justify-self: end;
  align-self:start;
  margin-top: 0;
  padding: 6px 0 6px clamp(18px, 2vw, 28px);
  border-left: 3px solid var(--cyan);
}
.story-excerpt-label {
  margin: 0 0 18px;
  color: var(--cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.story-excerpt blockquote {
  margin: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
  color: rgba(246,242,233,.72);
  font-family: var(--sans);
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 450;
  letter-spacing: 0;
  line-height: 1.48;
}
.story-excerpt blockquote::before { display:none; }
.story-excerpt blockquote p { margin: 0; }
.story-excerpt blockquote p + p { margin-top: .42em; }
.story-excerpt blockquote p:first-child,
.story-excerpt blockquote p:last-child { color: var(--paper); }

.place-characters {
  background:
    linear-gradient(90deg, rgba(66,85,255,.08) 1px, transparent 1px),
    linear-gradient(rgba(66,85,255,.08) 1px, transparent 1px),
    #f7f8ff;
  background-size: 34px 34px;
}
.place-character { transition: color 220ms ease, background 220ms ease, transform 220ms ease; }
.place-character:hover { background: var(--cyan); transform: translateY(-5px); }
.place-character-main:hover { background: var(--acid); }
.place-character-agnese:hover { background: var(--pink); color: var(--ink); }
.place-character-renato:hover { background: #ffc247; }
.place-character-tweed:hover { background: var(--blue); color: #fff; }
.place-character-grid > .place-character:nth-child(1)::after,
.place-character-grid > .place-character:nth-child(2)::after,
.place-character-grid > .place-character:nth-child(3)::after {
  position:absolute;
  top:-.18em;
  right:-.03em;
  z-index:-1;
  font:700 clamp(150px,18vw,270px)/1 var(--serif);
  opacity:.08;
}
.place-character-grid > .place-character:nth-child(1)::after { content:"Σ"; }
.place-character-grid > .place-character:nth-child(2)::after { content:"Ψ"; }
.place-character-grid > .place-character:nth-child(3)::after { content:"9"; }

.reader-reviews { position: relative; }
.review-card { border-radius: 14px; box-shadow: 0 12px 0 rgba(13,16,23,.07); }
.review-card:hover { border-color: var(--red); box-shadow: 0 16px 0 rgba(255,79,58,.13); }
.review-card.is-center {
  border-color:var(--red);
  background:#fff8f5;
  box-shadow:0 16px 0 rgba(255,79,58,.13);
}
.review-stars { color: var(--red); }
.review-progress {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 8px;
  margin-top: 28px;
}
.review-progress i:nth-child(n+4) { display:none; }
.review-progress i { height: 4px; background: rgba(13,16,23,.15); overflow: hidden; }
.review-progress i::after { content:""; display:block; width:100%; height:100%; background:var(--red); transform:scaleX(0); transform-origin:left; }
.review-progress i.is-active::after { animation: review-timer 5s linear both; }
@keyframes review-timer { to { transform:scaleX(1); } }

.soundtrack {
  align-items:start;
  background:
    radial-gradient(circle at 16% 18%, rgba(78,232,209,.65), transparent 22%),
    var(--acid);
}
.soundtrack-heading,.track-list { align-self:start; }
.soundtrack-cover {
  display:block;
  width:min(100%,310px);
  aspect-ratio:1;
  margin:34px 0 26px;
  object-fit:cover;
  border:1px solid var(--ink);
  box-shadow:10px 10px 0 var(--blue);
}
.play-all { min-height: 50px; box-shadow: 6px 6px 0 var(--blue); }
.track-play { box-shadow: 4px 4px 0 rgba(66,85,255,.45); }
.track:hover .track-info h3 { color: var(--blue); }
.track.is-active:hover .track-info h3 { color: #fff; }

.event { border-color: var(--line); }
.event::before { background: var(--cyan); }

.sticky-buy {
  position: fixed;
  z-index: 45;
  right: 18px;
  bottom: 18px;
  min-width: 142px;
  padding: 12px 16px;
  background: var(--red);
  color: var(--ink);
  border: 1px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.sticky-buy span,.sticky-buy strong { display:block; }
.sticky-buy span { font-size:9px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.sticky-buy strong { margin-top:3px; font:600 16px var(--serif); }
.sticky-buy:hover,.sticky-buy:focus-visible { transform:translate(-3px,-3px); box-shadow:9px 9px 0 var(--ink); }
.now-playing:not([hidden]) ~ .sticky-buy { bottom: 104px; }

.about .section-number {
  z-index:6;
  background:var(--ink);
  color:var(--paper);
  border-color:rgba(246,242,233,.65);
}

@media (max-width: 1100px) and (min-width: 781px) {
  .story { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
  .story-heading { grid-column:1; }
  .story-body,.story-excerpt { grid-column:2; }
  .story-excerpt { justify-self:start; margin-top:18px; }
}

@media (max-width: 780px) {
  .site-header { box-shadow: 0 1px 18px rgba(13,16,23,.08); }
  .site-header nav {
    top:70px;
    height:calc(100svh - 70px);
    max-height:none;
    justify-content:center;
    gap:4px;
    background:var(--ink);
    color:#fff;
  }
  .site-header nav a { min-height:52px; font-size:clamp(18px,5.7vw,27px); letter-spacing:.04em; }
  .site-header nav .nav-contact { margin-top:20px; color:var(--ink); background:var(--acid); }
  .hero { padding-top: 104px; }
  .hero-copy::after { margin-top: 32px; font-size: 9px; }
  .hero-current-cover { width: min(48vw,180px); box-shadow:-11px 14px 0 var(--ink),14px 18px 0 var(--red); }
  .hero-links { width:100%; }
  .hero-buy { justify-content:space-between; width:100%; min-height:54px; }
  .text-link-secondary { min-height:44px; }
  .book-buy { justify-content:space-between; width:100%; min-height:54px; }
  .story { border-top-width:12px; }
  .story { grid-template-columns:minmax(0,1fr); }
  .story-heading,.story-body { grid-column:auto; }
  .story-heading h2 { font-size:clamp(44px,13vw,64px); }
  .story::before { top:.16em; font-size:74vw; }
  .story-visual { width:74%; box-shadow:12px 12px 0 var(--blue); }
  .story-visual-title { padding:18px; }
  .story-visual-title strong { transform:none; font-size:clamp(28px,9vw,42px); }
  .story-excerpt {
    grid-column:auto;
    width:100%;
    max-width:420px;
    justify-self:start;
    margin-top:10px;
    padding-left:16px;
  }
  .soundtrack-cover { width:min(78vw,280px); }
  .story-excerpt blockquote { font-size:14px; line-height:1.5; }
  .review-progress { grid-template-columns:repeat(5,1fr); gap:5px; }
  .review-progress i:nth-child(n+4) { display:block; }
  .place-character:hover { transform:none; }
  .sticky-buy { right:12px; bottom:12px; min-width:124px; padding:10px 13px; }
  .sticky-buy strong { font-size:14px; }
  .now-playing:not([hidden]) ~ .sticky-buy { display:none; }
}

@media (max-width: 380px) {
  .hero-copy::after { max-width:82%; line-height:1.5; }
  .story-visual { width:82%; }
}

@media (prefers-reduced-motion: reduce) {
  .review-progress i.is-active::after { animation:none; transform:scaleX(1); }
  .place-character,.sticky-buy,.hero-buy,.book-buy { transition:none; }
  .hero h1 em { animation:none; }
  .text-link-secondary::before { transition:none; }
}

/* Final colour split: each novel keeps its own visual world. */
.hero,
.backlist {
  --book-accent:var(--red);
  --book-highlight:var(--pink);
}
.hero .text-link-secondary { color:#9e1746; }
.hero .text-link-secondary::before { background:#ffc4dd; }
.hero-buy:hover,
.hero-buy:focus-visible,
.book-buy:hover,
.book-buy:focus-visible { background:#ffc4dd; }
.hero .hero-copy::before { background:var(--red); }
.hero .eyebrow,.backlist .eyebrow { color:#9e1746; }

.characters {
  border-bottom:18px solid var(--red);
  background:
    radial-gradient(circle at 86% 12%,rgba(255,67,180,.10),transparent 25%),
    #111018;
}
.character-pasquale { background:#ff7a64; }
.character-chiara { background:#ffe4dc; }
.character-tonino { background:var(--red); }
.character-tweed { background:#8f1747; color:#fff; }
.character-card {
  --neon-a:#ff43b4;
  --neon-b:#ffb3d7;
}
.character-pasquale,.character-chiara {
  --neon-a:#ff1744;
  --neon-b:#ff73bd;
}
.marquee { background:#ff8a72; }

.book-excerpt-name {
  width:min(100%,900px);
  justify-self:center;
  padding:clamp(32px,4vw,58px) clamp(20px,5vw,64px);
}
.book-excerpt-name blockquote {
  max-width:760px;
  font-size:clamp(22px,2.7vw,38px);
  line-height:1.22;
}
.book-excerpt-name::before { font-size:clamp(150px,22vw,330px); }

.story,
.place-characters {
  --place-blue:#4255ff;
  --place-cyan:#4ee8d1;
  --place-orange:#ff9f1c;
}
.story-body .story-tagline { color:var(--place-orange); }
.story-soundtrack {
  margin-top:30px;
  color:var(--cyan);
  border-color:var(--cyan);
}
.story-soundtrack:hover,
.story-soundtrack:focus-visible { color:var(--acid); }

/* Final refinement pass */
.hero h1 { font-size:clamp(72px,10.6vw,162px); }
.hero-copy::after {
  margin-top:32px;
  padding:6px 9px;
  font-size:9px;
  letter-spacing:.13em;
  opacity:.88;
}

.sticky-buy {
  opacity:0;
  pointer-events:none;
  transform:translateY(18px);
  transition:opacity 180ms ease,transform 180ms ease,box-shadow 180ms ease;
}
.sticky-buy.is-visible {
  opacity:1;
  pointer-events:auto;
  transform:none;
}
.sticky-buy.is-visible:hover,
.sticky-buy.is-visible:focus-visible { transform:translate(-3px,-3px); }

.chapter-opening {
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:18px;
  align-items:center;
  margin:-50px 0 clamp(42px,6vw,82px);
  color:var(--cyan);
}
.chapter-opening span {
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.chapter-opening i { height:1px; background:linear-gradient(90deg,var(--cyan),transparent); }
.chapter-opening strong {
  font:600 clamp(48px,6vw,86px)/1 var(--serif);
  letter-spacing:-.06em;
  opacity:.22;
}
.story-heading.reveal { transform:translateX(-28px); }
.story-heading.reveal.visible { transform:none; }

.character-card { min-height:500px; }
.character-chiara { margin-top:64px; }
.character-tonino { margin-top:-22px; }
.character-tweed { margin-top:40px; }
.character-role { margin-bottom:clamp(38px,5vw,72px); }
.character-copy h3 {
  margin-bottom:24px;
  font-size:clamp(42px,5.25vw,76px);
}
.character-copy > p:last-child { line-height:1.66; }
.character-tag { margin-top:30px; }

.track-list.is-collapsed .track:nth-of-type(n+7):not(.is-active) { display:none; }
.tracks-toggle {
  width:100%;
  min-height:54px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:16px 18px;
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--acid);
  font:700 11px var(--sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
}
.tracks-toggle i {
  font-style:normal;
  font-size:18px;
  transition:transform 220ms ease;
}
.tracks-toggle[aria-expanded="true"] i { transform:rotate(180deg); }
.tracks-toggle:hover,.tracks-toggle:focus-visible { background:var(--blue); color:#fff; }

@media (min-width:1101px) {
  .site-header nav { gap:clamp(20px,2vw,34px); }
  .site-header nav a { font-size:11.5px; letter-spacing:.115em; }
}

@media (min-width:901px) {
  .place-character-grid > .place-character:nth-child(-n+3) { min-height:440px; }
  .place-character-grid > .place-character:nth-child(n+4) { min-height:400px; }
  .place-character h3 { margin-top:48px; margin-bottom:20px; }
}

@media (max-width:780px) {
  .hero h1 { font-size:clamp(50px,15.7vw,70px); line-height:.89; }
  .hero-copy::after { margin-top:24px; font-size:8px; }
  .sticky-buy { right:10px; bottom:10px; min-width:112px; padding:8px 11px; box-shadow:4px 4px 0 var(--ink); }
  .sticky-buy span { font-size:8px; }
  .sticky-buy strong { font-size:13px; }
  .chapter-opening { margin:-24px 0 38px; gap:12px; }
  .chapter-opening strong { font-size:44px; }
  .chapter-opening span { max-width:90px; font-size:9px; line-height:1.35; }
  .character-card,
  .character-chiara,
  .character-tonino,
  .character-tweed {
    min-height:440px;
    margin-top:0;
    padding:26px 24px;
  }
  .character-role { margin-bottom:40px; }
  .character-copy h3 { font-size:clamp(38px,12vw,54px); margin-bottom:20px; }
  .character-copy > p:last-child { font-size:15px; line-height:1.62; }
  .character-tag { margin-top:24px; }
  .place-character,
  .place-character-main,
  .place-character-tweed { min-height:440px; }
  .story-excerpt { margin-top:28px; }
  .about .portrait-wrap { width:min(72vw,310px)!important; }
  .tracks-toggle { min-height:52px; }
}

@media (prefers-reduced-motion:reduce) {
  .sticky-buy,.tracks-toggle i { transition:none; }
}
.coming-stamp { border-color:var(--place-cyan); color:var(--place-cyan); }
.place-characters-heading .eyebrow { color:var(--place-blue); }
.place-characters-heading h2 em { color:var(--place-blue); }
.place-character-main { background:var(--place-cyan); }
.place-character-agnese { background:var(--place-blue); color:#fff; }
.place-character-renato { background:var(--place-orange); color:var(--ink); }
.place-character-tweed { background:#101a4d; color:#fff; }
.place-character:hover { background:#9af5e8; color:var(--ink); }
.place-character-main:hover { background:#77efdd; }
.place-character-agnese:hover { background:#6d7cff; color:#fff; }
.place-character-renato:hover { background:#ffbd59; }
.place-character-tweed:hover { background:#263cae; color:#fff; }

@media (max-width:780px) {
  .book-excerpt-name {
    width:100%;
    margin-top:18px;
    padding:34px 18px 40px;
  }
  .book-excerpt-name .book-excerpt-label { margin-bottom:20px; }
  .book-excerpt-name blockquote {
    max-width:100%;
    font-size:clamp(19px,5.8vw,25px);
    line-height:1.28;
  }
  .characters { border-bottom-width:12px; }
}