/* ==========================================================================
   A MORTE DA VACA ROXA — landing do livro
   Identidade puxada da capa: amarelo neon + magenta sobre preto.
   ========================================================================== */

:root{
  --ink:        #09090a;
  --ink-2:      #101011;
  --panel:      #141315;
  --paper:      #f4f0e7;
  --paper-dim:  #b8b2a6;
  --neon:       #e4ff2b;
  --neon-dim:   #b9d016;
  --magenta:    #c62e97;
  --magenta-2:  #e84bb4;
  --magenta-deep:#5e0f45;
  --stone:      #8d8880;
  --stone-dark: #4f4c47;

  --font-display: "Fraunces", "Times New Roman", serif;
  --font-ui: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-kicker: "Archivo Expanded", "Archivo", sans-serif;

  --container: 1360px;
  --pad: clamp(24px, 5vw, 72px);
  --ease-out: cubic-bezier(.16,.84,.44,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
}

*, *::before, *::after{ box-sizing: border-box; }
html{ background: var(--ink); }
html, body{ height:100%; }
body{
  margin:0; background: var(--ink); color: var(--paper);
  font-family: var(--font-ui); font-size:16px; line-height:1.5;
  -webkit-font-smoothing: antialiased; overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,p{ margin:0; }
button{ font-family:inherit; background:none; border:none; cursor:pointer; color:inherit; }
::selection{ background: var(--neon); color: var(--ink); }

/* texture */
.grain{
  position:fixed; inset:0; z-index:300; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.vignette{
  position:fixed; inset:0; z-index:299; pointer-events:none;
  background: radial-gradient(120% 100% at 50% 45%, transparent 42%, rgba(0,0,0,.6) 100%);
  mix-blend-mode:multiply;
}
.progress-rail{ position:fixed; top:0; left:0; right:0; height:2px; z-index:250; background:rgba(255,255,255,.08); }
.progress-fill{ height:100%; width:0%; background: linear-gradient(90deg, var(--magenta), var(--neon)); }

/* nav */
.bnav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:20px var(--pad);
  transition: background .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent;
}
.bnav.is-solid{ background:rgba(9,9,10,.72); backdrop-filter:blur(10px); border-bottom-color:rgba(255,255,255,.08); }
.bnav__back{ font-family:var(--font-ui); font-size:13px; font-weight:600; color:var(--paper-dim); display:flex; gap:8px; align-items:center; }
.bnav__back:hover{ color:var(--paper); }
.bnav__title{ font-family:var(--font-kicker); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--stone); display:none; }
@media(min-width:900px){ .bnav__title{ display:block; } }
.bnav__cta{
  font-size:13px; font-weight:700; padding:11px 22px; border-radius:999px;
  background:var(--neon); color:var(--ink);
  transition: transform .25s ease, box-shadow .25s ease;
}
.bnav__cta:hover{ transform:translateY(-2px); box-shadow:0 8px 30px -8px var(--neon); }

/* shared bits */
.chapter-tag{
  display:inline-block; font-family:var(--font-kicker); font-weight:600;
  font-size:clamp(11px,1.1vw,13px); letter-spacing:.14em; text-transform:uppercase;
  color:var(--magenta-2); margin-bottom:clamp(28px,6vw,52px);
}
.btn{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--font-ui);
  font-weight:700; font-size:15px; padding:16px 30px; border-radius:999px;
  transition: transform .3s var(--ease-out), background .3s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.btn--neon{ background:var(--neon); color:var(--ink); }
.btn--neon:hover{ transform:translateY(-2px); box-shadow:0 12px 40px -10px var(--neon); }
.btn--magenta{ background:var(--magenta); color:var(--paper); }
.btn--magenta:hover{ background:var(--magenta-2); transform:translateY(-2px); }
.btn--ghost{ border:1px solid rgba(244,240,231,.3); color:var(--paper); }
.btn--ghost:hover{ border-color:var(--neon); color:var(--neon); }
.btn--lg{ padding:20px 42px; font-size:16px; }

.reveal-up{ opacity:0; transform:translateY(26px); }

.chapter{ position:relative; width:100%; }

/* ============ HERO ============ */
.bhero{ background:var(--ink); }
.bhero__pin{
  height:100vh; overflow:hidden; position:relative;
  display:grid; grid-template-columns: 1.1fr .9fr; align-items:center;
  padding:0 var(--pad);
}
.bhero__glow{
  position:absolute; z-index:0; inset:0;
  background:
    radial-gradient(50% 55% at 78% 45%, rgba(198,46,151,.28), transparent 70%),
    radial-gradient(40% 40% at 12% 80%, rgba(228,255,43,.08), transparent 70%);
}
.bhero__copy{ position:relative; z-index:3; max-width:15em; }
.bhero__kicker{
  font-family:var(--font-kicker); font-size:clamp(11px,1.3vw,14px); letter-spacing:.2em;
  text-transform:uppercase; color:var(--stone); margin-bottom:24px;
  opacity:0; transform:translateY(12px);
}
.bhero__title{
  font-family:var(--font-display); font-weight:600; font-style:italic;
  font-size:clamp(34px,5vw,70px); line-height:.98; letter-spacing:-.01em;
  color:var(--neon); text-transform:uppercase;
  text-shadow:0 2px 40px rgba(9,9,10,.95);
}
.bhero__title .l{ display:block; overflow:hidden; padding:.02em 0; }
.bhero__title .l span{ display:inline-block; will-change:transform; }
.bhero__sub{
  margin-top:22px; font-family:var(--font-ui); font-weight:500;
  font-size:clamp(14px,1.4vw,18px); letter-spacing:.02em; color:var(--paper-dim);
  max-width:23em; opacity:0;
}
.bhero__cta{ margin-top:28px; display:flex; gap:14px; flex-wrap:wrap; opacity:0; }

.bhero__media{ position:relative; z-index:2; height:100%; display:flex; align-items:flex-end; justify-content:center; }
.bhero__cow{
  height:96%; width:auto; max-width:none; object-fit:contain; object-position:bottom;
  filter:contrast(1.05) brightness(.96);
  -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 12%, #000 100%);
  mask-image:linear-gradient(180deg, transparent 0, #000 12%, #000 100%);
  transform:translateY(4%) scale(1.02);
}
.bhero__scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, var(--ink) 24%, rgba(9,9,10,.55) 44%, transparent 66%), linear-gradient(0deg, var(--ink) 3%, transparent 26%); }
.bhero__cue{
  position:absolute; z-index:4; bottom:34px; left:var(--pad);
  display:flex; align-items:center; gap:12px; opacity:0;
  font-family:var(--font-kicker); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--stone);
}
.bhero__cue-line{ width:48px; height:1px; background:rgba(244,240,231,.3); position:relative; overflow:hidden; }
.bhero__cue-line::after{ content:""; position:absolute; left:-40%; top:0; width:40%; height:100%; background:var(--neon); animation:cue 1.8s ease-in-out infinite; }
@keyframes cue{ 0%{transform:translateX(0);opacity:0} 40%{opacity:1} 100%{transform:translateX(340%);opacity:0} }

/* ============ THESIS ============ */
.thesis{ background:var(--ink); }
.thesis__pin{ height:100vh; display:flex; flex-direction:column; justify-content:center; padding:var(--pad); max-width:var(--container); margin:0 auto; }
.thesis__lines{ max-width:16em; }
.tline{
  font-family:var(--font-display); font-weight:400; font-size:clamp(24px,4.6vw,54px);
  line-height:1.22; color:var(--stone-dark); margin-bottom:.08em; opacity:.16;
}
.tline b{ font-weight:600; font-style:italic; color:var(--neon); }
.tline .mag{ color:var(--magenta-2); font-style:italic; }

/* ============ INTRO PROSE ============ */
.intro{ background:var(--paper); color:var(--ink); padding:clamp(80px,12vw,150px) var(--pad); }
.intro__grid{ max-width:1040px; margin:0 auto; }
.intro .chapter-tag{ color:var(--magenta); }
.intro__lead{
  font-family:var(--font-display); font-weight:400; font-style:italic;
  font-size:clamp(24px,3.4vw,44px); line-height:1.28; color:var(--ink); margin-bottom:.7em;
}
.intro__lead b{ font-style:normal; font-weight:600; background:linear-gradient(180deg, transparent 62%, rgba(198,46,151,.28) 0); }
.intro p{ font-size:clamp(15px,1.2vw,18px); line-height:1.75; color:#3a372f; margin-bottom:1.2em; max-width:40em; }
.intro p strong{ color:var(--magenta); font-weight:600; }

/* ============ PROVOCATIONS (horizontal) ============ */
.prov{ background:var(--ink-2); }
.prov__pin{ height:100vh; overflow:hidden; }
.prov__pin .chapter-tag{ position:absolute; top:clamp(88px,12vh,120px); left:var(--pad); z-index:5; margin:0; }
.prov__track{ position:absolute; top:0; left:0; height:100%; display:flex; align-items:center; will-change:transform; }
.prov__panel{ flex:0 0 auto; width:100vw; height:100%; display:flex; flex-direction:column; justify-content:center; padding:0 var(--pad); }
.prov__intro h2{ font-family:var(--font-display); font-weight:500; font-style:italic; font-size:clamp(32px,5.4vw,68px); line-height:1.08; color:var(--paper); max-width:11em; }
.prov__intro h2 em{ color:var(--neon); font-style:normal; }
.prov__intro p{ margin-top:22px; color:var(--stone); font-size:clamp(15px,1.3vw,18px); max-width:26em; line-height:1.6; }

.pcard{ max-width:760px; border-top:2px solid var(--magenta); padding-top:28px; }
.pcard__num{ font-family:var(--font-kicker); font-weight:700; font-size:13px; letter-spacing:.14em; color:var(--neon); }
.pcard h3{ font-family:var(--font-display); font-weight:500; font-size:clamp(26px,4.2vw,50px); line-height:1.1; color:var(--paper); margin:14px 0 20px; max-width:14em; }
.pcard p{ font-size:clamp(15px,1.2vw,18px); line-height:1.7; color:var(--stone); max-width:34em; margin-bottom:26px; }
.pcard .btn{ font-size:13px; padding:12px 24px; }

/* ============ OBJECT / BUY ============ */
.buy{ background:var(--ink); padding:clamp(80px,12vw,150px) var(--pad); position:relative; overflow:hidden; }
.buy__glow{ position:absolute; inset:0; z-index:0; background:radial-gradient(45% 55% at 28% 45%, rgba(198,46,151,.22), transparent 70%); }
.buy__grid{ position:relative; z-index:1; max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.buy__render{ display:flex; justify-content:center; }
.buy__render img{ width:100%; max-width:520px; filter:drop-shadow(0 40px 70px rgba(0,0,0,.55)); will-change:transform; }
.buy .chapter-tag{ color:var(--neon-dim); }
.buy h2{ font-family:var(--font-display); font-weight:500; font-size:clamp(30px,4vw,52px); line-height:1.12; color:var(--paper); margin-bottom:22px; }
.buy h2 em{ color:var(--neon); font-style:italic; }
.buy__price{ display:flex; align-items:baseline; gap:14px; margin:26px 0 6px; }
.buy__price .val{ font-family:var(--font-display); font-weight:600; font-size:clamp(38px,5vw,60px); color:var(--neon); }
.buy__price .old{ font-size:16px; color:var(--stone); text-decoration:line-through; }
.buy__formats{ font-size:13px; color:var(--stone); letter-spacing:.03em; margin-bottom:24px; }
.buy__note{ font-size:14px; line-height:1.65; color:var(--paper-dim); max-width:34em; margin:22px 0 30px; border-left:2px solid var(--magenta); padding-left:16px; }
.buy__actions{ display:flex; gap:16px; flex-wrap:wrap; }

.freechap{
  position:relative; z-index:1; max-width:var(--container); margin:clamp(50px,7vw,90px) auto 0;
  display:flex; align-items:center; gap:clamp(20px,3vw,40px); flex-wrap:wrap; justify-content:space-between;
  padding:clamp(26px,4vw,40px); border:1px solid rgba(255,255,255,.1); border-radius:14px;
  background:linear-gradient(120deg, rgba(198,46,151,.08), transparent 60%);
}
.freechap__txt h3{ font-family:var(--font-display); font-weight:500; font-size:clamp(22px,2.6vw,32px); color:var(--paper); }
.freechap__txt h3 em{ color:var(--magenta-2); font-style:italic; }
.freechap__txt p{ margin-top:8px; color:var(--stone); font-size:14.5px; max-width:34em; }

/* ============ AUTHOR ============ */
.author{ background:var(--paper); color:var(--ink); padding:clamp(80px,12vw,150px) var(--pad); }
.author__grid{ max-width:var(--container); margin:0 auto; display:grid; grid-template-columns:.75fr 1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.author__media{ aspect-ratio:4/5; overflow:hidden; border-radius:8px; background:var(--ink); }
.author__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06); will-change:transform; }
.author .chapter-tag{ color:var(--magenta); }
.author h2{ font-family:var(--font-display); font-weight:500; font-size:clamp(32px,4.4vw,58px); line-height:1.05; color:var(--ink); margin-bottom:8px; }
.author__tag{ font-family:var(--font-kicker); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--magenta); margin-bottom:26px; display:block; }
.author p{ font-size:clamp(15px,1.15vw,17px); line-height:1.75; color:#3a372f; margin-bottom:1.2em; max-width:38em; }
.author p strong{ color:var(--ink); font-weight:600; }

/* ============ MOVEMENT + VIP + FOOTER ============ */
.move{ background:var(--ink); padding:clamp(90px,14vw,170px) var(--pad) 0; }
.move__inner{ max-width:var(--container); margin:0 auto; }
.move__big{
  font-family:var(--font-display); font-weight:500; font-size:clamp(34px,6vw,84px); line-height:1.04;
  color:var(--paper); max-width:14em; margin-bottom:20px;
}
.move__big em{ color:var(--neon); font-style:italic; }
.move__sub{ font-size:clamp(16px,1.4vw,20px); color:var(--stone); max-width:30em; line-height:1.6; }
.move__actions{ margin-top:40px; display:flex; gap:16px; flex-wrap:wrap; align-items:center; }

.vip{
  margin-top:clamp(60px,8vw,100px); padding:clamp(30px,4vw,48px); border-radius:16px;
  background:linear-gradient(130deg, var(--magenta-deep), var(--ink-2) 70%);
  border:1px solid rgba(232,75,180,.2);
  display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center;
}
.vip__txt h3{ font-family:var(--font-display); font-weight:500; font-size:clamp(22px,2.6vw,32px); color:var(--paper); }
.vip__txt p{ margin-top:8px; color:var(--paper-dim); font-size:14.5px; max-width:34em; }
.vip__form{ display:flex; gap:10px; flex-wrap:wrap; }
.vip__form input{
  font-family:var(--font-ui); font-size:15px; padding:15px 18px; border-radius:999px; min-width:220px;
  background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.16); color:var(--paper);
}
.vip__form input::placeholder{ color:var(--stone); }
.vip__form input:focus{ outline:none; border-color:var(--neon); }

.bfooter{
  max-width:var(--container); margin:clamp(70px,9vw,110px) auto 0; padding:26px 0 34px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:12.5px; color:var(--stone);
}
.bfooter a:hover{ color:var(--paper); }

/* ============ RESPONSIVE ============ */
@media(max-width:900px){
  .bhero__pin{ grid-template-columns:1fr; align-items:end; padding-bottom:0; }
  .bhero__copy{ position:relative; z-index:3; padding-bottom:8vh; max-width:100%; }
  .bhero__media{ position:absolute; inset:0; z-index:1; align-items:flex-start; justify-content:flex-end; opacity:.5; }
  .bhero__cow{ height:100%; }
  .bhero__scrim{ background:linear-gradient(0deg, var(--ink) 14%, transparent 60%), linear-gradient(90deg, var(--ink) 20%, transparent 80%); }
  .buy__grid{ grid-template-columns:1fr; }
  .buy__render{ order:-1; }
  .buy__render img{ max-width:340px; }
  .freechap{ flex-direction:column; align-items:flex-start; }
  .author__grid{ grid-template-columns:1fr; }
  .author__media{ aspect-ratio:16/11; }
  .vip{ grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; } }
