/* ============================================================
   BRENNA ANDRADE — SISTEMA VISUAL
   Paleta:  areia (creme quente) · ameixa · vinho · rosa queimado · sálvia
   Tipos:   Newsreader (serif editorial) · Instrument Sans (sans utilitária)
   ============================================================ */
:root{
  --areia:      #F7F2EC;
  --areia-2:    #EFE5DA;
  --areia-3:    #E7DACD;
  --ameixa:     #47182F;
  --ameixa-esc: #33101F;
  --vinho:      #7B2C46;
  --rosa:       #E4C3B9;
  --rosa-claro: #F1DCD4;
  --salvia:     #8D9C86;
  --tinta:      #2E2126;
  --tinta-60:   rgba(46,33,38,.66);
  --tinta-40:   rgba(46,33,38,.42);
  --linha:      rgba(71,24,47,.16);
  --linha-forte:rgba(71,24,47,.30);

  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans:  "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --pad: clamp(1.5rem, 5.5vw, 6.5rem);
  --maxw: 1360px;
  --secao: clamp(6rem, 13vw, 12rem);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--areia);
  color:var(--tinta);
  font-family:var(--sans);
  font-size:clamp(1rem, .96rem + .18vw, 1.09rem);
  line-height:1.72;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* textura de papel — asset Higgsfield, discretíssima */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:url("https://d8j0ntlcm91z4.cloudfront.net/user_3I6D1mPKRb7x23d4cgv4KnTKgcv/hf_20260818_182305_284c94a5-da8d-43ba-a0a9-31cdf6891827_min.webp");
  background-size:760px auto;
  opacity:.30; mix-blend-mode:multiply;
}
main,header,footer{ position:relative; z-index:1; }

img{ max-width:100%; display:block; }
a{ color:inherit; }

h1,h2,h3,blockquote{
  font-family:var(--serif);
  font-weight:300;
  color:var(--ameixa);
  letter-spacing:-.018em;
  margin:0;
  text-wrap:balance;
}
h1{ font-size:clamp(2.7rem, 6.1vw, 5.35rem); line-height:.98; }
h2{ font-size:clamp(2rem, 3.9vw, 3.35rem); line-height:1.06; }
h3{ font-size:clamp(1.2rem, 1.7vw, 1.45rem); line-height:1.25; letter-spacing:-.01em; }
em{ font-style:italic; }
p{ margin:0 0 1.15em; max-width:62ch; }
p:last-child{ margin-bottom:0; }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.secao{ padding-block:var(--secao); }

.eyebrow{
  font-family:var(--sans);
  font-size:.7rem; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase;
  color:var(--vinho);
  display:flex; align-items:center; gap:.85rem;
  margin:0 0 clamp(1.6rem,3vw,2.6rem);
}
.eyebrow::before{ content:""; width:2.2rem; height:1px; background:var(--vinho); opacity:.5; flex:none; }

.lead{ font-size:clamp(1.08rem,1.02rem + .3vw,1.24rem); color:var(--tinta-60); line-height:1.68; }

/* ---------- pular para conteúdo ---------- */
.skip{
  position:absolute; left:1rem; top:-4rem; z-index:200;
  background:var(--ameixa); color:var(--areia);
  padding:.75rem 1.15rem; border-radius:2px; font-size:.85rem;
  transition:top .18s var(--ease);
}
.skip:focus{ top:1rem; }

:focus-visible{ outline:2px solid var(--vinho); outline-offset:3px; border-radius:2px; }

/* ============================================================
   HEADER
   ============================================================ */
.topo{
  position:sticky; top:0; z-index:100;
  transition:background .35s var(--ease), border-color .35s var(--ease), backdrop-filter .35s var(--ease);
  border-bottom:1px solid transparent;
}
.topo.fixo{
  background:rgba(247,242,236,.86);
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  border-bottom-color:var(--linha);
}
.topo-in{
  max-width:var(--maxw); margin-inline:auto; padding:clamp(1.1rem,2vw,1.6rem) var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
}
.marca{ text-decoration:none; display:flex; flex-direction:column; line-height:1.15; }
.marca strong{
  font-family:var(--serif); font-weight:400; font-size:1.2rem;
  color:var(--ameixa); letter-spacing:-.01em;
}
.marca span{
  font-size:.63rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--tinta-40); margin-top:.28rem;
}
.nav{ display:flex; align-items:center; gap:clamp(1.4rem,2.4vw,2.5rem); }
.nav a{
  font-size:.87rem; text-decoration:none; color:var(--tinta-60);
  transition:color .2s var(--ease); position:relative; padding-block:.2rem;
}
.nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--vinho); transition:right .3s var(--ease);
}
.nav a:hover{ color:var(--ameixa); }
.nav a:hover::after{ right:0; }
@media (max-width:900px){ .nav{ display:none; } }

/* botões */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--sans); font-size:.88rem; font-weight:500; letter-spacing:.005em;
  text-decoration:none; border:0; cursor:pointer;
  padding:.92em 1.7em; border-radius:100px;
  transition:transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease);
}
.btn svg{ width:1.05em; height:1.05em; flex:none; }
.btn-cheio{ background:var(--ameixa); color:var(--areia); box-shadow:0 1px 0 rgba(71,24,47,.2); }
.btn-cheio:hover{ background:var(--vinho); transform:translateY(-2px); box-shadow:0 10px 24px -12px rgba(71,24,47,.6); }
.btn-claro{ background:var(--rosa-claro); color:var(--ameixa); }
.btn-claro:hover{ background:var(--rosa); transform:translateY(-2px); }
.btn-linha{ border:1px solid var(--linha-forte); color:var(--ameixa); background:transparent; }
.btn-linha:hover{ border-color:var(--ameixa); background:rgba(71,24,47,.04); }
.btn-topo{ padding:.72em 1.35em; font-size:.82rem; }
@media (max-width:520px){ .btn-topo span{ display:none; } .btn-topo{ padding:.75em 1em; } }