/* =========================================================================
   Método PASSOS™ / @oalvaropassos — base
   Identidade da conta: fundo escuro quente, serifada pesada (Georgia),
   texto creme, acento âmbar. Editorial — "isto é sobre ideias".
   ========================================================================= */

:root{
  --bg:      #14110D;
  --bg-2:    #1c1811;
  --bg-3:    #241f17;
  --line:    #3a3225;
  --ink:     #F4EFE4;
  --ink-dim: #b7ad9b;
  --ink-mut: #8a8171;
  --amber:   #E7B24C;
  --amber-deep:#c9922f;
  --red:     #E0524B;
  --green:   #46B29D;

  --serif: Georgia, "Times New Roman", "Nimbus Roman", serif;
  --sans:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --wrap: 1080px;
  --gap: clamp(1rem, 4vw, 2rem);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0 }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100% }

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  line-height:1.65;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block }
a{ color:inherit }
::selection{ background:var(--amber); color:#191308 }

h1,h2,h3,h4{ font-family:var(--serif); font-weight:700; line-height:1.12; letter-spacing:-0.01em }
h1{ font-size:clamp(2.1rem, 1.4rem + 3.4vw, 3.9rem) }
h2{ font-size:clamp(1.7rem, 1.2rem + 2.2vw, 2.7rem) }
h3{ font-size:clamp(1.2rem, 1.05rem + 0.8vw, 1.55rem) }

p{ max-width:62ch }
strong{ color:var(--ink); font-weight:700 }
em{ color:var(--amber); font-style:normal }

/* ---------- layout ---------- */
.wrap{ width:min(var(--wrap), 100% - 2*var(--gap)); margin-inline:auto }
.wrap--narrow{ max-width:720px }

section{ padding-block:clamp(3.5rem, 8vw, 7rem) }
section + section{ border-top:1px solid var(--line) }

.eyebrow{
  font-family:var(--sans);
  font-size:.74rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--amber);
  display:inline-flex; align-items:center; gap:.6rem;
}
.eyebrow::before{ content:""; width:2rem; height:1px; background:var(--amber) }

.lead{ font-size:clamp(1.1rem, 1rem + 0.6vw, 1.35rem); color:var(--ink-dim); line-height:1.6 }

/* ---------- buttons ---------- */
.btn{
  --btn-bg:var(--amber); --btn-fg:#191308;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.95rem 1.7rem;
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--sans); font-weight:700; font-size:1rem;
  letter-spacing:.01em; text-decoration:none;
  border:1px solid var(--btn-bg); border-radius:2px;
  cursor:pointer; transition:transform .12s ease, background .15s ease, box-shadow .15s ease;
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 30px -12px rgba(231,178,76,.5) }
.btn:active{ transform:translateY(0) }
.btn--ghost{ --btn-bg:transparent; --btn-fg:var(--ink); border-color:var(--line) }
.btn--ghost:hover{ background:var(--bg-3); box-shadow:none }
.btn--block{ width:100% }

/* ---------- footer ---------- */
.foot{
  border-top:1px solid var(--line);
  padding-block:2.5rem;
  color:var(--ink-mut); font-size:.9rem;
}
.foot a{ color:var(--ink-dim); text-decoration:none }
.foot a:hover{ color:var(--amber) }
.foot__row{ display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; align-items:center; justify-content:space-between }

/* ---------- utility ---------- */
.tm{ font-size:.6em; vertical-align:.55em; letter-spacing:0 }
.hr{ height:1px; background:var(--line); border:0; margin-block:2.5rem }
[hidden]{ display:none !important }

@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; animation:none !important; scroll-behavior:auto }
}