/* =========================================================================
   PÁGINA DO LIVRO · Saia do Piloto Automático
   Herda todos os tokens de style.css. Aqui só o que é exclusivo desta página.
   ========================================================================= */

/* ------------------------------- TOPO ---------------------------------- */
.topo__voltar{margin-left:auto}
.topo--livro .link-sutil{color:inherit;opacity:.72}
.topo--livro .link-sutil:hover{opacity:1}

/* ------------------------- DOBRA 1 · PROMESSA -------------------------- */
.livro-hero{
  position:relative;background:var(--grafite);color:var(--papel);
  padding-block:clamp(112px,14vw,160px) clamp(64px,8vw,104px);
  overflow:hidden;
}
.livro-hero__fundo{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(100% 80% at 76% 18%,rgba(62,85,104,.52) 0%,transparent 60%),
    repeating-linear-gradient(to bottom,rgba(225,228,226,.05) 0 1px,transparent 1px 110px);
}
.livro-hero__inner{
  position:relative;max-width:var(--largura);margin-inline:auto;
  padding-inline:var(--gutter);
  display:grid;grid-template-columns:1.06fr .94fr;
  gap:clamp(36px,5vw,76px);align-items:center;
}
.livro-hero h1{margin-bottom:24px}
.livro-hero h1 em{color:var(--aco-claro)}
.livro-hero__sub{
  font-size:clamp(1.02rem,1.25vw,1.15rem);
  color:var(--papel-70);max-width:52ch;margin-bottom:38px;
}
.livro-hero__sub strong{color:var(--branco);font-weight:600}

/* ---------------------------- MOCKUP DO LIVRO --------------------------- */
.livro-capa{position:relative;display:grid;justify-items:center;gap:22px}

/* halo frio atrás do livro */
.livro-capa::before{
  content:"";position:absolute;inset:-14% -6%;z-index:0;pointer-events:none;
  background:radial-gradient(50% 45% at 50% 45%,rgba(125,153,173,.28),transparent 70%);
}
.livro-capa__palco{
  position:relative;z-index:1;
  width:min(318px,74vw);
  transform:perspective(1500px) rotateY(-13deg) rotateX(1.5deg);
  transition:transform .6s var(--ease);
}
.livro-capa__palco:hover{transform:perspective(1500px) rotateY(-7deg) rotateX(1deg)}
.livro-capa__palco img{
  width:100%;height:auto;border-radius:3px 5px 5px 3px;
  box-shadow:
    0 2px 6px rgba(0,0,0,.4),
    28px 38px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(225,228,226,.08);
}
/* lombada */
.livro-capa__palco::before{
  content:"";position:absolute;inset:0 auto 0 0;width:24px;z-index:2;
  border-radius:3px 0 0 3px;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.28) 45%,transparent 100%);
}
/* miolo de páginas na borda direita */
.livro-capa__palco::after{
  content:"";position:absolute;top:4px;bottom:4px;right:-6px;width:6px;z-index:1;
  border-radius:0 2px 2px 0;
  background:repeating-linear-gradient(to right,#cfd4d2 0 1px,#8e9795 1px 2px);
  box-shadow:1px 0 3px rgba(0,0,0,.45);
}
.livro-capa figcaption{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--papel-45);text-align:center;line-height:1.7;
}
.livro-capa figcaption span{display:block;color:var(--papel-70)}

/* ------------------------------ FORMULÁRIO ------------------------------ */
.oferta{
  background:var(--branco);color:var(--grafite);
  border-radius:var(--raio);padding:clamp(24px,3vw,34px);
  box-shadow:0 26px 60px rgba(0,0,0,.34);
  max-width:520px;
}
.oferta__linha{
  font-size:.98rem;line-height:1.5;
  padding-bottom:18px;margin-bottom:22px;
  border-bottom:var(--fio);max-width:none;
}
.oferta__linha strong{font-weight:600;color:var(--aco)}

.campo{margin-bottom:16px}
.campo label{
  display:block;font-family:var(--mono);font-size:.68rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--aco);margin-bottom:7px;
}
.campo input{
  width:100%;font-family:var(--corpo);font-size:1rem;color:var(--grafite);
  background:var(--papel);border:1px solid var(--grafite-12);border-radius:var(--raio);
  padding:13px 15px;
  transition:border-color .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease);
}
.campo input::placeholder{color:rgba(23,27,34,.38)}
.campo input:hover{border-color:var(--aco-claro)}
.campo input:focus{
  outline:none;background:var(--branco);
  border-color:var(--aco);box-shadow:0 0 0 3px rgba(62,85,104,.16);
}
.campo input[aria-invalid="true"]{border-color:#9d3b3b;background:#fbf4f4}
.campo__erro{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;
  color:#9d3b3b;margin-top:6px;min-height:0;
}
.campo__erro:empty{display:none}

.form .btn{margin-top:8px}
.form__nota{text-align:center;margin-top:12px}

/* --------------------------- DOBRA 2 · O AUTOR -------------------------- */
.autor{background:var(--branco)}
.autor__grid{
  display:grid;grid-template-columns:.82fr 1.18fr;
  gap:clamp(36px,5vw,76px);align-items:center;
}
.autor__foto img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 24%;
  border-radius:var(--raio);filter:grayscale(.35) saturate(.82) contrast(1.05);
}
.autor__texto p{margin-bottom:18px;color:var(--grafite-60)}
.autor__texto strong{font-weight:600;color:var(--grafite)}
.destaque{
  font-style:normal;font-weight:600;color:var(--aco);
  border-bottom:1px solid var(--aco-claro);
}
.autor__fecho{
  border-left:2px solid var(--aco);padding-left:18px;
  font-size:1.04rem;color:var(--grafite)!important;margin-bottom:30px!important;
}
.autor .btn{margin-bottom:4px}
.autor .form__nota{text-align:left;margin-top:10px}

/* ------------------------------ RESPONSIVO ------------------------------ */
@media (max-width:900px){
  .livro-hero__inner{grid-template-columns:1fr}
  .oferta{max-width:none}
  .autor__grid{grid-template-columns:1fr}
  .autor__foto{max-width:400px}
}

@media (max-width:560px){
  .livro-capa__palco{transform:perspective(1500px) rotateY(-8deg)}
}

/* ===================== AJUSTES DE LEGIBILIDADE / RITMO ==================== */

/* numa página de captura o formulário precisa aparecer cedo:
   headline um pouco menor que a da home e hero mais curto */
.livro-hero h1{font-size:clamp(2.7rem,5.4vw,4.5rem)}
.livro-hero{padding-block:clamp(104px,11vw,132px) clamp(56px,7vw,88px)}
.livro-hero__sub{margin-bottom:30px}

/* a capa é escura demais para viver sobre o grafite: painel claro atrás,
   no mesmo espírito dos cartões brancos do manual de identidade */
.livro-capa::before{
  content:"";position:absolute;z-index:0;
  left:50%;transform:translateX(-50%);
  top:-34px;bottom:50px;width:min(400px,94%);
  background:var(--papel);border-radius:12px;
  box-shadow:0 34px 80px rgba(0,0,0,.45);
}
.livro-capa__palco img{
  box-shadow:
    0 2px 5px rgba(23,27,34,.3),
    20px 28px 52px rgba(23,27,34,.42),
    0 0 0 1px rgba(23,27,34,.12);
}
.livro-capa figcaption{position:relative;z-index:1}


/* campo-armadilha do Formspree: invisível para gente, visível para robô */
.isca{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}



/* ==================== DOBRA 1 REORGANIZADA ==============================
   Antes a capa ficava centralizada verticalmente contra a coluna inteira
   (título + sub + formulário), então ela não dividia nenhuma linha com o
   formulário e os dois pareciam soltos. Agora o título abre a dobra em
   largura cheia e, abaixo, formulário e capa começam na mesma altura.
   ======================================================================= */
.livro-hero__inner{display:block}
.livro-hero__topo{max-width:880px;margin-bottom:clamp(38px,5vw,58px)}
.livro-hero__sub{margin-bottom:0}

.livro-hero__oferta{
  display:grid;grid-template-columns:minmax(0,520px) 1fr;
  gap:clamp(34px,5vw,72px);align-items:start;
}
.oferta{max-width:none}

/* o painel claro sobe 34px; o mesmo tanto de recuo alinha o topo dele
   com o topo do cartão do formulário */
.livro-capa{padding-top:34px;justify-items:center}

@media (max-width:900px){
  .livro-hero__oferta{grid-template-columns:1fr;gap:34px}
  .livro-capa{order:-1;padding-top:0;margin-bottom:4px}
  .livro-capa::before{top:-20px;bottom:-20px}
  .livro-capa__palco{width:min(236px,60vw)}
  .livro-capa figcaption{display:none}
}