/* ============================================================
   O SEGUNDO HORIZONTE — Landing
   Editorial / cream-amber system derived from the book cover
   ============================================================ */

:root{
  /* paper & ink */
  --paper:      #F4E7CC !important;   /* warm cream */
  --paper-2:    #EDDCB9 !important;   /* deeper panel */
  --paper-3:    #E7D2A8 !important;   /* card / inset */
  --ink:        #19130D !important;   /* near-black, warm */
  --ink-2:      #5B4F3F !important;   /* secondary text */
  --ink-3:      #8A7A61 !important;   /* muted / captions */
  --line:       #D8C39A !important;   /* hairline on paper */
  --line-2:     #C9B486 !important;

  /* horizon palette */
  --amber:      #E6920A !important;
  --orange:     #D9531B !important;
  --vermillion: #C23018 !important;
  --sun:        #AE1C0E !important;
  --night:      #14100B !important;   /* the black band */

  /* roles */
  --accent:     var(--vermillion);
  --accent-ink: var(--sun);

  /* type */
  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans:  "Archivo", system-ui, -apple-system, sans-serif;
  --mono:  "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  /* metrics */
  --maxw: 1200px;
  --gutter: clamp(20px, 5vw, 72px);
  --r: 3px;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink) !important;
  font-family:var(--serif);
  font-size:18px;
  line-height:1.6;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-optical-sizing:auto;
}
img{ display:block; max-width:100%; }
a{ color:inherit !important; text-decoration:none; }
::selection{ background:var(--sun) !important; color:var(--paper) !important; }

/* paper grain via faint dual gradient */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(1200px 600px at 82% -8%, rgba(230,146,10,.10), transparent 60%),
    radial-gradient(900px 700px at -10% 110%, rgba(174,28,14,.06), transparent 60%);
}
main, header, footer{ position:relative; z-index:1; }

/* ---------- layout helpers ---------- */
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(72px,9vw,140px); }
.section--tight{ padding-block:clamp(56px,6vw,96px); }
.divider{ height:1px; background:var(--line); border:0; margin:0; }

/* ---------- eyebrow / labels (mono telemetry) ---------- */
.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--accent-ink) !important;
  font-weight:500;
  display:inline-flex; align-items:center; gap:.7em;
  margin:0 0 1.2rem;
}
.eyebrow::before{
  content:""; width:26px; height:1px; background:currentColor !important; opacity:.6;
  display:inline-block;
}
.eyebrow--plain::before{ display:none; }
.coord{ font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; color:var(--ink-3) !important; text-transform:uppercase; }

/* ---------- headings ---------- */
.h-display{
  font-family:var(--serif);
  font-weight:430;
  font-size:clamp(2.9rem, 6.6vw, 5.6rem);
  line-height:1.01;
  letter-spacing:-.018em;
  margin:0;
  text-wrap:balance;
}
.h1{
  font-family:var(--serif);
  font-weight:440;
  font-size:clamp(2.1rem, 4.2vw, 3.5rem);
  line-height:1.04;
  letter-spacing:-.015em;
  margin:0;
  text-wrap:balance;
}
.h2{
  font-family:var(--serif);
  font-weight:480;
  font-size:clamp(1.5rem,2.4vw,2rem);
  line-height:1.12;
  letter-spacing:-.01em;
  margin:0;
}
.lead{
  font-size:clamp(1.18rem,1.7vw,1.45rem);
  line-height:1.5;
  color:var(--ink-2) !important;
  font-weight:380;
  text-wrap:pretty;
}
.body{ color:var(--ink-2) !important; font-weight:400; text-wrap:pretty; }
em, .it{ font-style:italic; }
.u-ink{ color:var(--ink) !important; }
.u-accent{ color:var(--accent-ink); }

/* ---------- buttons ---------- */
.btns{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.btn{
  font-family:var(--sans);
  font-weight:600;
  font-size:.95rem;
  letter-spacing:.01em;
  line-height:1;
  display:inline-flex; align-items:center; gap:.6em;
  padding:1.05em 1.5em;
  border-radius:var(--r);
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .18s ease, background .2s ease, color .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn--primary{ background:var(--ink); color:var(--paper) !important; }
.btn--primary:hover{ background:var(--sun); }
.btn--accent{ background:var(--accent); color:var(--paper) !important; }
.btn--accent:hover{ background:var(--sun) !important; }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--ink) !important; }
.btn--ghost:hover{ background:var(--ink); color:var(--paper) !important; }
.btn--link{
  font-family:var(--mono); font-weight:500; font-size:.78rem; letter-spacing:.12em;
  text-transform:uppercase; padding:0; color:var(--ink) !important;
  border-bottom:1px solid var(--line-2); border-radius:0;
}
.btn--link:hover{ transform:none; color:var(--sun) !important; border-color:var(--sun) !important; }
.btn .ar{ transition:transform .2s ease; }
.btn:hover .ar{ transform:translateX(3px); }

/* ---------- horizon motif (CSS sun) ---------- */
.horizon{ position:relative; }
.sun{
  border-radius:999px;
  background:
    radial-gradient(120% 120% at 50% 18%,
      #F2B23A 0%, var(--amber) 26%, var(--orange) 55%, var(--vermillion) 78%, var(--sun) 100%);
}
.sunset-band{
  background:linear-gradient(180deg, var(--amber), var(--orange) 42%, var(--vermillion) 74%, var(--sun));
}
.halfsun{
  border-radius:999px 999px 0 0;
  background:radial-gradient(140% 200% at 50% 0%, #F2B23A 0%, var(--amber) 24%, var(--orange) 52%, var(--vermillion) 76%, var(--sun) 100%);
}
.horizon-rule{
  display:flex; align-items:flex-end; justify-content:center; gap:0;
  position:relative; height:60px; margin-top:8px;
}
.horizon-rule::before{
  content:""; position:absolute; bottom:0; left:0; right:0; height:1px; background:var(--ink);
}
.horizon-rule .halfsun{ width:120px; height:60px; position:relative; }

/* hero direction toggle pill */
.heroswitch{
  position:fixed; right:18px; bottom:18px; z-index:60;
  display:flex; align-items:center; gap:8px;
  background:var(--ink); color:var(--paper) !important;
  border-radius:999px; padding:7px 8px 7px 16px;
  box-shadow:0 16px 34px -18px rgba(25,19,13,.7);
  font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
}
.heroswitch .seg{ display:inline-flex; background:rgba(244,231,204,.14); border-radius:999px; }
.heroswitch button{
  appearance:none; border:0; background:transparent; cursor:pointer; color:#C9B486 !important;
  font:inherit; letter-spacing:.14em; padding:.5em .85em; border-radius:999px; transition:.15s;
}
.heroswitch button[aria-pressed="true"]{ background:var(--amber); color:var(--night) !important; }

/* ============================================================
   HEADER / NAV
   ============================================================ */
.nav{
  position:sticky; top:0; z-index:50;
  background:color-mix(in oklab, var(--paper) 86%, transparent) !important;
  backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav__in{ display:flex; align-items:center; gap:24px; height:68px; }
.brand{ display:flex; align-items:center; gap:11px; margin-right:auto; }
.brand .mk{ width:13px; height:13px; border-radius:999px; }
.brand b{ font-family:var(--mono); font-weight:600; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; }
.nav__links{ display:flex; gap:30px; }
.nav__links a{
  font-family:var(--sans); font-size:.86rem; font-weight:500; color:var(--ink-2) !important;
  transition:color .15s ease; position:relative;
}
.nav__links a:hover{ color:var(--ink) !important; }
.nav__right{ display:flex; align-items:center; gap:18px; }
.lang{
  display:inline-flex; font-family:var(--mono); font-size:.72rem; letter-spacing:.1em;
  border:1px solid var(--line-2); border-radius:999px; overflow:hidden;
}
.lang button{
  appearance:none; border:0; background:transparent; cursor:pointer;
  padding:.45em .8em; color:var(--ink-3) !important; font:inherit; transition:.15s;
}
.lang button[aria-pressed="true"]{ background:var(--ink); color:var(--paper) !important; }
.nav .btn{ padding:.7em 1.1em; font-size:.82rem; }

/* ============================================================
   HERO (shared bits)
   ============================================================ */
.hero{ padding-top:clamp(48px,7vw,96px); padding-bottom:clamp(56px,7vw,110px); overflow:hidden; }

/* Direction A — editorial, cover-forward */
.heroA__grid{ display:grid; grid-template-columns:1.22fr .78fr; gap:clamp(32px,5vw,80px); align-items:center; }
.heroA__title{ margin:.2em 0 0; font-size:clamp(2.6rem,5.1vw,4.6rem); }
.heroA__title .ln2{ font-style:italic; color:var(--accent-ink) !important; }
.heroA__sub{ margin:1.9rem 0 0; max-width:32ch; }
.heroA__btns{ margin-top:2.2rem; }
.heroA__meta{ margin-top:1.5rem; display:flex; gap:22px; flex-wrap:wrap; }
.heroA__art{ position:relative; justify-self:center; padding:14px; }
.heroA__art .glow{
  position:absolute; inset:-6% -8% -10% -8%; z-index:0;
  background:radial-gradient(58% 52% at 50% 44%, rgba(217,83,27,.20), transparent 72%);
  filter:blur(14px);
}
.cover{
  position:relative; z-index:1; width:min(400px,76vw); height:auto; display:block;
  box-shadow:0 34px 70px -30px rgba(25,19,13,.55), 0 10px 26px -18px rgba(25,19,13,.45);
  transform:rotate(-1.2deg);
}
.heroA__horizonline{ margin-top:0; }

/* Direction B — instrument / console */
.heroB{ position:relative; }
.heroB__top{ display:grid; grid-template-columns:1.18fr .82fr; gap:clamp(32px,5vw,72px); align-items:center; }
.heroB__copy{ min-width:0; }
.heroB__title{ margin:.6rem 0 0; max-width:16ch; }
.heroB__title .em{ font-style:italic; color:var(--accent-ink) !important; }
.heroB__lead{ margin:1.7rem 0 0; max-width:34ch; }
.heroB__coverwrap{ position:relative; display:flex; justify-content:center; padding:6px; }
.heroB__cover{ position:relative; z-index:1; width:min(340px,72vw); height:auto; display:block; box-shadow:0 34px 70px -30px rgba(25,19,13,.55), 0 10px 26px -18px rgba(25,19,13,.45); transform:rotate(1.4deg); }
.console{
  margin-top:clamp(36px,5vw,64px);
  border:1px solid var(--ink);
  background:color-mix(in oklab, var(--paper) 70%, #fff 30%) !important;
  border-radius:var(--r);
  display:grid; grid-template-columns:repeat(3,1fr);
}
.console__cell{ padding:26px clamp(20px,2.4vw,34px); border-right:1px solid var(--line); }
.console__cell:last-child{ border-right:0; }
.console__k{ font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3) !important; }
.console__t{ font-family:var(--serif); font-size:1.18rem; margin:.5rem 0 1rem; line-height:1.15; }
.console__cell .btn{ padding:.7em 1.1em; font-size:.82rem; }

/* ============================================================
   GENERIC SECTION SCAFFOLD
   ============================================================ */
.head-row{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(24px,4vw,60px); align-items:end; margin-bottom:clamp(40px,5vw,72px); }
.head-row .lead{ margin:0; }

/* O LIVRO */
.book{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(36px,5vw,80px); align-items:center; }
.book__art{ position:relative; justify-self:start; }
.book__art .cover{ width:min(340px,70vw); height:auto; transform:rotate(1.2deg); }
.book__facts{ display:grid; grid-template-columns:repeat(2,auto); gap:18px 40px; margin-top:28px; }
.fact .k{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3) !important; }
.fact .v{ font-family:var(--serif); font-size:1.05rem; }
.pull{
  border-left:2px solid var(--accent); padding-left:22px; margin:30px 0 0;
  font-style:italic; font-size:1.2rem; color:var(--ink) !important; line-height:1.45;
}
.pull cite{ display:block; margin-top:12px; font-style:normal; font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3) !important; }

/* PILLARS */
.pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,2.4vw,32px); }
.pillar{ padding-top:26px; border-top:2px solid var(--ink); }
.pillar__n{ font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; color:var(--accent-ink) !important; }
.pillar h3{ font-family:var(--serif); font-weight:480; font-size:1.5rem; line-height:1.1; margin:.7rem 0 .8rem; letter-spacing:-.01em; }
.pillar p{ margin:0; color:var(--ink-2) !important; font-size:1.02rem; }

/* TOOLS */
.tools{ border-top:1px solid var(--line); }
.tool{
  display:grid; grid-template-columns:64px 1fr auto; gap:24px; align-items:baseline;
  padding:22px 0; border-bottom:1px solid var(--line);
  transition:background .2s ease, padding .2s ease;
}
.tool:hover{ background:color-mix(in oklab, var(--paper) 78%, var(--amber) 22%) !important; }
.tool__n{ font-family:var(--mono); font-size:.9rem; color:var(--ink-3); letter-spacing:.05em; }
.tool__name{ font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.7rem); font-weight:440; letter-spacing:-.01em; }
.tool__tag{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3) !important; text-align:right; }

/* PARA QUEM */
.audience{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2vw,28px); }
.aud{ background:var(--paper-2); border:1px solid var(--line); border-radius:var(--r); padding:30px 28px 32px; }
.aud .role{ font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-ink) !important; }
.aud h3{ font-family:var(--serif); font-weight:470; font-size:1.45rem; margin:.5rem 0 .6rem; }
.aud p{ margin:0; color:var(--ink-2) !important; font-size:1rem; }

/* BRIEFING (dark) */
.briefing{ background:var(--night); color:var(--paper) !important; position:relative; overflow:hidden; }
.briefing::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:6px;
  background:linear-gradient(90deg, var(--amber), var(--orange) 45%, var(--vermillion) 72%, var(--sun));
}
.briefing .eyebrow{ color:var(--amber) !important; }
.briefing .h1{ color:var(--paper); }
.briefing .lead{ color:#D8C7A6 !important; }
.briefing__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(36px,6vw,90px); align-items:center; }
.briefing__sun{ position:absolute; width:520px; height:520px; right:-160px; top:-200px; opacity:.5; z-index:0; }
.briefing__in{ position:relative; z-index:1; }
.signup{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }
.signup input{
  flex:1 1 220px; font-family:var(--sans); font-size:.95rem;
  background:rgba(244,231,204,.06); border:1px solid rgba(244,231,204,.25);
  color:var(--paper) !important; padding:1.05em 1.2em; border-radius:var(--r);
}
.signup input::placeholder{ color:#A99B7E; }
.signup input:focus{ outline:none; border-color:var(--amber) !important; }
.commit{ display:grid; gap:18px; }
.commit__row{ display:flex; gap:16px; align-items:flex-start; padding-top:18px; border-top:1px solid rgba(244,231,204,.16); }
.commit__row .num{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; color:var(--amber) !important; padding-top:3px; }
.commit__row p{ margin:0; color:#D8C7A6 !important; }
.commit__row b{ color:var(--paper); font-weight:500; }
.fineprint{ font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; color:#A99B7E !important; margin-top:14px; }

/* ENDORSEMENT */
.endorse{ background:var(--paper-2); }
.endorse__q{
  font-family:var(--serif); font-weight:420; font-style:italic;
  font-size:clamp(1.6rem,3.2vw,2.6rem); line-height:1.22; letter-spacing:-.01em;
  margin:0; text-wrap:balance;
}
.endorse__q .hl{ color:var(--accent-ink) !important; font-style:italic; }
.endorse__by{ display:flex; align-items:center; gap:16px; margin-top:34px; }
.endorse__by .mk{ width:42px; height:42px; border-radius:999px; }
.endorse__by .nm{ font-family:var(--sans); font-weight:600; font-size:1rem; }
.endorse__by .rl{ font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3) !important; }

/* AUTHOR */
.author{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,5vw,72px); align-items:center; }
.author__photo{
  position:relative; overflow:hidden; margin:0;
  width:100%; aspect-ratio:4/5;
  border-radius:var(--r); border:1px solid var(--line);
  background:var(--paper-2);
}
.author__photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 22%; display:block; }
.author__tags{ display:flex; flex-wrap:wrap; gap:9px; margin-top:24px; }
.tag{
  font-family:var(--mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--line-2); border-radius:999px; padding:.5em .9em; color:var(--ink-2) !important;
  white-space:nowrap;
}

/* DIAGNOSTIC CTA */
.diag{ position:relative; overflow:hidden; }
.diag__band{ position:absolute; inset:0; z-index:0; opacity:.13; }
.diag__in{ position:relative; z-index:1; text-align:center; max-width:780px; margin-inline:auto; }
.diag .h1{ margin-top:1rem; }
.diag .btns{ justify-content:center; margin-top:2rem; }

/* FOOTER */
.foot{ background:var(--night); color:var(--paper) !important; padding-block:clamp(56px,7vw,96px); }
.foot__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; }
.foot__motto{ font-family:var(--serif); font-style:italic; font-size:1.45rem; line-height:1.3; max-width:22ch; color:var(--paper) !important; }
.foot h4{ font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--amber) !important; margin:0 0 16px; font-weight:500; }
.foot__col a{ display:block; color:#D8C7A6 !important; font-family:var(--sans); font-size:.92rem; padding:5px 0; transition:color .15s; }
.foot__col a:hover{ color:var(--paper) !important; }
.foot__bottom{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-top:54px; padding-top:24px; border-top:1px solid rgba(244,231,204,.16); }
.foot__bottom span{ font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; color:#A99B7E !important; }

/* ---------- language visibility ---------- */
[data-en]{ }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px){
  .heroA__grid{ grid-template-columns:1fr; }
  .heroA__art{ order:-1; }
  .heroB__top{ grid-template-columns:1fr; }
  .heroB__coverwrap{ order:-1; }
  .heroB__title, .heroB__lead{ max-width:none; }
  .book{ grid-template-columns:1fr; }
  .author{ grid-template-columns:1fr; }
  .briefing__grid{ grid-template-columns:1fr; }
  .head-row{ grid-template-columns:1fr; }
  .foot__top{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 760px){
  body{ font-size:17px; }
  .nav__links{ display:none; }
  .pillars{ grid-template-columns:1fr; }
  .audience{ grid-template-columns:1fr; }
  .console{ grid-template-columns:1fr; }
  .console__cell{ border-right:0; border-bottom:1px solid var(--line); }
  .console__cell:last-child{ border-bottom:0; }
  .tool{ grid-template-columns:42px 1fr; }
  .tool__tag{ display:none; }
  .foot__top{ grid-template-columns:1fr 1fr; }
  .book__facts{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 460px){
  .foot__top{ grid-template-columns:1fr; }
}

/* ---------- entrance ---------- */
@media (prefers-reduced-motion: no-preference){
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:none; }
}