/* 1. Base e tipografia · 2. Seções · 3. Chat · 4. Responsividade */
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:95px;
}
body {
  margin:0;
  color:#202725;
  background:#fafaf7;
  font-family:Arial,Helvetica,sans-serif;
  font-size:16px;
  line-height:1.65;
}
button,input {
  font:inherit;
}
button,a {
  -webkit-tap-highlight-color:transparent;
}
a {
  color:inherit;
  text-decoration:none;
}
button {
  cursor:pointer;
}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible {
  outline:3px solid #be932e;
  outline-offset:5px;
}
h1,h2,h3,p {
  margin-top:0;
}
h1,h2,h3 {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  line-height:1.15;
}
h2 {
  font-size:clamp(2.2rem,4vw,3.7rem);
  letter-spacing:-.035em;
}
header {
  height:104px;
  padding:20px 5.5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#fafaf7;
  border-bottom:1px solid #dedfd8;
}
.brand {
  display:flex;
  flex-direction:column;
  min-width:max-content;
}
.brand-name {
  font:1.85rem Georgia,serif;
  letter-spacing:.13em;
}
.brand-sub {
  font-size:.65rem;
  letter-spacing:.18em;
  margin-top:3px;
  display:flex;
  align-items:center;
  gap:9px;
}
.brand-sub i {
  width:20px;
  border-top:1px solid #96731c;
}
nav {
  display:flex;
  gap:28px;
  font-size:.875rem;
}
nav a:hover {
  color:#886415;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:25px;
  padding:17px 25px;
  font-size:.9rem;
  font-weight:600;
  min-height:52px;
  border:1px solid transparent;
  border-radius:2px;
  transition:background .2s,transform .2s;
}
.button:hover {
  transform:translateY(-2px);
}
.gold {
  background:#dbbc78;
  color:#191d1b;
}
.gold:hover {
  background:#eacd8e;
}
.small {
  padding:12px 18px;
}
.outline {
  border-color:#a7aa9d;
}
.hero {
  background:#141918;
  color:#fff;
  display:grid;
  grid-template-columns:1.08fr 1fr;
  position:relative;
  padding-bottom:64px;
  overflow:hidden;
}
.hero-copy {
  padding:78px 7% 52px 10.2%;
  z-index:1;
}
.eyebrow {
  font-size:.72rem;
  letter-spacing:.18em;
  font-weight:600;
  color:#ddc48f;
  line-height:1.6;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:25px;
}
.eyebrow>span {
  width:28px;
  border-top:1px solid #ddc48f;
}
.hero h1 {
  font-size:clamp(2.8rem,4.9vw,5rem);
  letter-spacing:-.045em;
  margin:28px 0;
}
em {
  font-weight:400;
  color:#dbbc78;
}
.hero-copy>p {
  color:#c4c8c4;
  max-width:480px;
  font-size:1.025rem;
}
.hero-actions {
  display:flex;
  align-items:flex-start;
  flex-direction:column;
  gap:16px;
  margin-top:32px;
}
.text-button {
  background:none;
  border:0;
  padding:6px 0;
  font-size:.9rem;
  color:#eee8dd;
  display:inline-flex;
  gap:15px;
  align-items:center;
  border-bottom:1px solid #6f7061;
}
.hero-location {
  margin-top:38px;
  display:flex;
  gap:12px;
  align-items:center;
  color:#b9bdb7;
  font-size:.8rem;
  line-height:1.7;
}
.hero-location strong {
  font-weight:400;
  color:#e6e6dd;
}
.hero-location svg {
  width:23px;
  fill:none;
  stroke:#cfb574;
  stroke-width:1.2;
}
.hero-image {
  position:relative;
  min-height:670px;
}
.hero-image>img {
  width:100%;
  height:100%;
  position:absolute;
  object-fit:cover;
  object-position:43% center;
}
.hero-image:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#141918 0%,transparent 17%),linear-gradient(0deg,rgba(20,25,24,.65),transparent 40%);
}
.portrait-caption {
  position:absolute;
  bottom:34px;
  left:35px;
  z-index:1;
  border-left:1px solid #dbbc78;
  padding-left:18px;
  display:flex;
  flex-direction:column;
}
.portrait-caption span {
  font:1.8rem Georgia,serif;
}
.portrait-caption small {
  font-size:.65rem;
  letter-spacing:.14em;
  margin-top:8px;
}
.hero-bottom {
  position:absolute;
  bottom:0;
  width:100%;
  padding:18px 5.5%;
  border-top:1px solid #45483c;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#c3c3b8;
  letter-spacing:.16em;
  font-size:.65rem;
}
.hero-bottom a {
  font-size:1.4rem;
  line-height:1;
}
.section {
  padding:95px max(5.5%,calc((100vw - 1280px)/2));
}
.dark {
  color:#856619;
}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:60px;
  margin-bottom:46px;
}
.section-heading h2 {
  margin-bottom:0;
}
.section-heading>p {
  max-width:355px;
  color:#646a64;
  margin-bottom:5px;
}
.area-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
.area-card {
  border:1px solid #d4d8cf;
  background:#fff;
  padding:38px;
  position:relative;
}
.area-number {
  position:absolute;
  top:30px;
  right:30px;
  color:#7a8077;
  font-size:.8rem;
  letter-spacing:.1em;
}
.area-icon {
  width:44px;
  height:44px;
  fill:none;
  stroke:#997722;
  stroke-width:1.3;
  margin-bottom:20px;
}
.area-card h3 {
  font-size:2rem;
  margin-bottom:17px;
}
.area-card p {
  color:#606860;
  max-width:410px;
}
.area-card ul {
  list-style:none;
  padding:0;
  margin:25px 0 30px;
  color:#505a51;
  font-size:.9rem;
}
.area-card li {
  padding:9px 0;
  border-bottom:1px solid #edf0e8;
}
.area-card li:before {
  content:'—';
  margin-right:12px;
  color:#a58840;
}
.area-link {
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:.9rem;
  font-weight:600;
}
.area-link:hover {
  color:#8b6819;
}
.about {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:9%;
  align-items:center;
  background:#f0f1eb;
  border-top:1px solid #e2e4db;
}
.about-brand {
  background:white;
  max-width:410px;
  padding:24px;
  box-shadow:14px 14px 0 #e3e5dc;
}
.about-brand img {
  width:100%;
  height:auto;
  display:block;
}
.about-copy h2 {
  margin-bottom:10px;
}
.registration {
  font-size:.72rem;
  letter-spacing:.12em;
  color:#8d6c21;
  margin-bottom:28px;
}
.about-copy>p:not(.eyebrow):not(.registration) {
  color:#5b625b;
}
.dark-text {
  color:#29362c;
  border-color:#a2ab9e;
}
.process {
  background:#233128;
  color:#f8f8ee;
}
.process h2 {
  max-width:640px;
}
.steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:50px;
  margin-top:50px;
}
.steps article {
  border-top:1px solid #65735d;
  padding-top:25px;
}
.steps span {
  font-size:.8rem;
  color:#dbbc78;
}
.steps h3 {
  font-size:1.65rem;
  margin:22px 0 15px;
}
.steps p {
  color:#c4cdc0;
  font-size:.95rem;
}
.faq {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:9%;
}
.faq>div>p:not(.eyebrow) {
  color:#6a7168;
}
.questions details {
  border-bottom:1px solid #d8dcd1;
  padding:22px 0;
}
.questions details:first-child {
  padding-top:0;
}
.questions summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-weight:500;
}
.questions summary::-webkit-details-marker {
  display:none;
}
.questions summary:after {
  content:'+';
  font-size:1.4rem;
  color:#8d6c21;
  line-height:1;
}
.questions details[open] summary:after {
  content:'−';
}
.questions details p {
  margin:17px 25px 0 0;
  font-size:.95rem;
  color:#626b60;
}
.contact {
  background:#151c18;
  color:#fff;
  text-align:center;
  border-bottom:1px solid #3d493e;
}
.contact .eyebrow {
  justify-content:center;
}
.contact h2 {
  font-size:clamp(2.8rem,5.5vw,5rem);
}
.contact>p:not(.eyebrow) {
  color:#bdc6b9;
}
.contact .button {
  margin-top:15px;
}
.phone {
  display:block;
  color:#c7cfbf;
  font-size:.9rem;
  margin-top:18px;
}
footer {
  padding:44px 5.5% 85px;
  background:#151c18;
  color:#c3caba;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
  font-size:.8rem;
}
footer .brand-name {
  font-size:1.55rem;
}
footer>div:nth-child(2) {
  text-align:right;
}
.footer-note {
  grid-column:1/-1;
  border-top:1px solid #364032;
  padding-top:25px;
  margin-bottom:0;
  color:#a6b09e;
}
.privacy-link {
  background:none;
  border:none;
  color:inherit;
  padding:0;
  text-decoration:underline;
  text-underline-offset:4px;
  cursor:pointer;
  font-size:.8rem;
}
.chat-launch {
  position:fixed;
  bottom:23px;
  right:25px;
  z-index:4;
  border:1px solid #7a8e68;
  border-radius:50px;
  display:flex;
  align-items:center;
  gap:12px;
  background:#2c4435;
  color:white;
  padding:15px 23px;
  box-shadow:0 5px 25px #0003;
  font-size:.875rem;
}
.chat-launch svg {
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
}
dialog {
  border:1px solid #d3d9ca;
  border-radius:8px;
  padding:0;
  box-shadow:0 20px 100px #0004;
  color:#273327;
}
dialog::backdrop {
  background:#0c17165c;
}
#chat {
  margin:auto 24px 90px auto;
  width:410px;
  max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 120px);
}
.chat-header {
  display:flex;
  justify-content:space-between;
  gap:20px;
  background:#22362b;
  color:white;
  padding:22px;
}
.chat-header small {
  font-size:.65rem;
  letter-spacing:.12em;
  color:#d7c395;
}
.chat-header h2 {
  font-size:1.7rem;
  margin:7px 0 0;
  letter-spacing:0;
}
.close {
  background:none;
  border:0;
  font-size:1.8rem;
  line-height:1;
  color:inherit;
  min-width:40px;
  min-height:40px;
}
.chat-body {
  padding:18px;
  max-height:260px;
  overflow:auto;
  background:#f3f4ee;
  min-height:125px;
  scroll-behavior:smooth;
}
.bubble {
  padding:13px 15px;
  border-radius:2px 12px 12px;
  background:white;
  font-size:.9rem;
  margin-bottom:12px;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.bubble.user {
  background:#dce5d7;
  margin-left:35px;
  border-radius:12px 2px 12px 12px;
}
.chat-options {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  padding:14px 16px 5px;
}
.chat-options button {
  border:1px solid #bac6b2;
  border-radius:25px;
  background:white;
  color:#31432f;
  padding:7px 11px;
  font-size:.8rem;
}
.chat-options button:hover {
  background:#e8eddf;
}
#chat-form {
  display:flex;
  margin:12px 16px;
  gap:6px;
}
#question {
  width:100%;
  min-width:0;
  border:1px solid #c5cdbd;
  border-radius:4px;
  padding:10px;
  font-size:.9rem;
}
#chat-form button {
  background:#2b4132;
  color:white;
  border:0;
  border-radius:4px;
  width:44px;
  flex-shrink:0;
}
.chat-bottom {
  padding:0 16px 16px;
}
.chat-bottom .button {
  width:100%;
  padding:12px;
  font-size:.85rem;
  gap:4px;
}
.chat-bottom small {
  display:block;
  font-size:.72rem;
  line-height:1.5;
  color:#687461;
  margin:10px 0 5px;
}
#privacy {
  padding:35px;
  max-width:650px;
  width:calc(100vw - 30px);
  max-height:85dvh;
}
#privacy .close {
  float:right;
}
#privacy h2 {
  font-size:2rem;
}
#privacy p {
  font-size:.9rem;
}
.consent {
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:18px;
  background:#eaf0e1;
  margin:20px 0;
  font-size:.9rem;
}
.consent input {
  margin-top:6px;
  accent-color:#294333;
  width:18px;
  height:18px;
  flex-shrink:0;
}
.sr-only,.skip {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
}
.skip:focus {
  width:auto;
  height:auto;
  clip:auto;
  z-index:20;
  padding:10px;
  background:white;
  color:black;
}
.button span {
  font-size:1.1rem;
}
@media(min-width:1600px) {
  .hero-copy {
    padding-left:max(10.2%,calc((100vw - 1280px)/2));
  }
  .hero-image {
    max-height:820px;
  }
}
@media(max-width:1000px) {
  header {
    padding:18px 4%;
    gap:18px;
  }
  nav {
    gap:15px;
    font-size:.8rem;
  }
  .brand-name {
    font-size:1.5rem;
  }
  .brand-sub {
    font-size:.6rem;
  }
  .hero-copy {
    padding:55px 7%;
  }
  .hero-image {
    min-height:650px;
  }
  .hero h1 {
    font-size:3.4rem;
  }
  .section {
    padding:70px 5%;
  }
  .section-heading {
    gap:30px;
  }
  .area-card {
    padding:28px;
  }
  .steps {
    gap:25px;
  }
  .about {
    gap:7%;
  }
  .faq {
    gap:6%;
  }
}
@media(max-width:760px) {
  header {
    height:86px;
  }
  nav {
    display:none;
  }
  .brand-name {
    font-size:1.45rem;
  }
  .brand-sub {
    font-size:.56rem;
  }
  .button.small {
    font-size:.75rem;
    padding:10px 13px;
    gap:10px;
    min-height:44px;
  }
  .hero {
    grid-template-columns:1fr;
    padding-bottom:52px;
  }
  .hero-copy {
    padding:40px 6% 35px;
  }
  .hero h1 {
    font-size:clamp(2.6rem,9.5vw,4.5rem);
    margin:20px 0;
  }
  .hero h1 br:last-child {
    display:none;
  }
  .eyebrow {
    font-size:.63rem;
    letter-spacing:.13em;
  }
  .hero-copy>p {
    font-size:1rem;
  }
  .hero-actions {
    gap:14px;
    margin-top:25px;
  }
  .hero-location {
    margin-top:25px;
  }
  .hero-image {
    min-height:420px;
    height:70vw;
    max-height:530px;
  }
  .hero-image>img {
    object-position:center 35%;
  }
  .hero-image:after {
    background:linear-gradient(0deg,#141918a6,transparent 50%);
  }
  .portrait-caption {
    left:6%;
    bottom:22px;
  }
  .hero-bottom {
    font-size:.55rem;
    padding:15px 6%;
    letter-spacing:.1em;
    gap:12px;
  }
  .section {
    padding:60px 6%;
  }
  .section-heading {
    display:block;
    margin-bottom:30px;
  }
  .section-heading>p {
    margin-top:22px;
  }
  .area-grid {
    grid-template-columns:1fr;
    gap:20px;
  }
  .area-card {
    padding:28px;
  }
  .area-card h3 {
    font-size:1.9rem;
  }
  .about {
    grid-template-columns:1fr;
    gap:45px;
  }
  .about-brand {
    max-width:260px;
    margin:auto;
  }
  .about-copy h2 {
    font-size:2.7rem;
  }
  .steps {
    grid-template-columns:1fr;
    gap:22px;
    margin-top:30px;
  }
  .steps article {
    display:grid;
    grid-template-columns:35px 1fr;
    column-gap:12px;
    padding-top:22px;
  }
  .steps h3 {
    margin:0 0 12px;
    font-size:1.6rem;
  }
  .steps p {
    grid-column:2;
    margin:0;
  }
  .steps span {
    padding-top:4px;
  }
  .faq {
    grid-template-columns:1fr;
    gap:35px;
  }
  .questions summary {
    font-size:.95rem;
  }
  .contact h2 {
    font-size:3.4rem;
  }
  .contact .button {
    padding:15px;
    gap:10px;
  }
  footer {
    grid-template-columns:1fr;
    padding:35px 6% 95px;
  }
  footer>div:nth-child(2) {
    text-align:left;
  }
  .chat-launch {
    bottom:16px;
    right:16px;
    padding:13px 17px;
  }
  .chat-launch span {
    font-size:.8rem;
  }
  #chat {
    margin:auto 12px 12px;
    width:calc(100vw - 24px);
    max-height:calc(100dvh - 24px);
  }
  .chat-body {
    max-height:30dvh;
  }
  #privacy {
    padding:25px;
  }
  h2 {
    font-size:2.7rem;
  }
}
@media(prefers-reduced-motion:reduce) {
  html,.chat-body {
    scroll-behavior:auto;
  }
  * {
    transition:none!important;
  }
}

/* Benefícios previdenciários: preservar o ritmo e a leitura dos cartões. */
.benefits-grid .area-card {
  padding-top: 64px;
  display: flex;
  flex-direction: column;
}
.benefits-grid .area-card:last-child {
  grid-column: 1 / -1;
}
.benefits-grid .area-card:last-child p {
  max-width: 760px;
}
.benefits-grid .area-link {
  margin-top: auto;
}
.source-link {
  margin-top: 16px;
  color: #6b715f;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-size: 0.8rem;
}
.hero h1 {
  font-size: clamp(2.6rem, 4.4vw, 4.6rem);
  overflow-wrap: break-word;
}
@media (max-width: 760px) {
  .hero h1 {
    font-size: clamp(2.5rem, 8.5vw, 4rem);
  }
  .chat-options {
    max-height: 120px;
    overflow-y: auto;
  }
}

/* Identidade e contato sempre disponíveis durante a rolagem. */
header {
  position: sticky;
  top: 0;
  z-index: 10;
  box-shadow: 0 3px 16px #14191814;
}
.header-brand {
  flex-direction: row;
  align-items: center;
  gap: 12px;
}
.header-logo {
  width: 76px;
  height: 76px;
  object-fit: contain;
  flex-shrink: 0;
}
.header-brand-text {
  display: flex;
  flex-direction: column;
}
/* WhatsApp integrado à faixa branca fixa. */
.header-whatsapp {
  background: #167742;
  color: #fff;
  border-color: #167742;
  gap: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
.header-whatsapp:hover { background: #105f34; }
.header-whatsapp svg { width: 25px; height: 25px; flex-shrink: 0; }
.header-whatsapp span { font-size: inherit; }
.chat-launch { bottom: max(20px, env(safe-area-inset-bottom)); }
footer { padding-bottom: 95px; }
html { scroll-padding-top: 120px; }
@media (max-width: 1100px) {
  header nav { gap: 16px; }
  .header-brand .brand-name { font-size: 1.35rem; }
}
@media (max-width: 900px) {
  header nav { display: none; }
}
@media (max-width: 760px) {
  .header-logo { width: 60px; height: 60px; }
  .header-brand { gap: 8px; }
  .header-brand .brand-name { font-size: 1.15rem; }
  .header-brand .brand-sub { font-size: 0.6rem; letter-spacing: 0.03em; }
  .chat-launch { right: 16px; }
  html { scroll-padding-top: 100px; }
}
@media (max-width: 380px) {
  .header-brand-text { display: none; }
}

@media (max-width: 1100px) {
  header nav { display: none; }
}
@media (max-width: 600px) {
  .header-brand-text { display: none; }
  .header-whatsapp { padding: 11px 14px; }
}