/* =========================================================
   Radamez Melo — Assessoria Contábil
   Etapa 1: Header + Hero
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  --navy-950:#0a1b36;
  --navy-900:#0d213f;
  --navy-800:#122a50;
  --navy-700:#1a3568;
  --navy-line: rgba(255,255,255,.12);

  --gold-500:#d4a94a;
  --gold-400:#e3bd6c;
  --gold-050:#fbf3e3;

  --green-600:#1fa855; /* reservado para WhatsApp, quando confirmado */

  --ink-900:#101826;
  --ink-700:#3c4657;
  --ink-500:#67728a;

  --white:#ffffff;
  --paper:#f7f8fb;

  --font-head:'Manrope', 'Segoe UI', Roboto, Arial, sans-serif;
  --font-body:'Inter', 'Segoe UI', Roboto, Arial, sans-serif;

  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:26px;
  --radius-pill:999px;

  --shadow-sm: 0 2px 8px rgba(10,27,54,.08);
  --shadow-md: 0 12px 32px rgba(10,27,54,.14);
  --shadow-lg: 0 24px 60px rgba(10,27,54,.28);

  --ease: cubic-bezier(.22,.61,.36,1);
  --dur-fast: .22s;
  --dur-med: .45s;
  --dur-slow: .6s;

  --header-h: 84px;
}

/* ---------- Reset ---------- */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--ink-900);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ list-style: none; margin:0; padding:0; }
h1,h2,h3{ font-family: var(--font-head); margin:0; line-height:1.15; }
p{ margin:0; }
button{ font: inherit; cursor:pointer; }

.container{
  width: min(1200px, 100% - 2.5rem);
  margin-inline: auto;
}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:1rem; top:-3rem;
  background:var(--navy-950); color:var(--white);
  padding:.75rem 1.25rem; border-radius: var(--radius-sm);
  z-index: 200; transition: top var(--dur-fast) var(--ease);
}
.skip-link:focus{ top:1rem; }

:focus-visible{ outline: 2px solid var(--gold-500); outline-offset: 3px; }

/* ---------- Progress bar ---------- */
.progress-bar{
  position: fixed; top:0; left:0; height:3px; width:0%;
  background: linear-gradient(90deg, var(--gold-500), var(--gold-400));
  z-index: 1000;
  transition: width .12s linear;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family: var(--font-head); font-weight:700; font-size:.95rem;
  padding: .9rem 1.6rem; border-radius: var(--radius-pill);
  border: 1px solid transparent; white-space: nowrap;
  transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
  will-change: transform;
}
.btn--primary{
  background: linear-gradient(180deg, var(--gold-400), var(--gold-500));
  color: var(--navy-950);
  box-shadow: 0 10px 24px rgba(212,169,74,.35);
}
.btn--primary:hover{ transform: translateY(-2px); box-shadow: 0 14px 30px rgba(212,169,74,.45); }
.btn--primary:active{ transform: translateY(0); }

.btn--outline{
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.55);
  color: var(--white);
}
.btn--outline:hover{ background: rgba(255,255,255,.12); border-color: var(--white); transform: translateY(-2px); }

.btn--lg{ padding: 1.05rem 1.9rem; font-size: 1rem; }
.btn--sm{ padding: .65rem 1.25rem; font-size: .875rem; }
.btn--block{ display:flex; width:100%; }

.btn__icon{ transition: transform var(--dur-fast) var(--ease); }
.btn:hover .btn__icon{ transform: translateX(3px); }

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 500;
  background: linear-gradient(180deg, rgba(10,27,54,.92), rgba(10,27,54,.82));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--navy-line);
  transition: padding var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.site-header__inner{
  min-height: var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.site-header.is-scrolled{ --header-h: 68px; background: rgba(9,22,44,.96); box-shadow: var(--shadow-sm); }

.brand{ display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.brand__mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, var(--gold-400), var(--gold-500));
  color: var(--navy-950); font-family: var(--font-head); font-weight:800; font-size:1rem;
  box-shadow: 0 4px 14px rgba(212,169,74,.4);
}
.brand__text{ display:flex; flex-direction:column; line-height:1.2; }
.brand__name{ font-family: var(--font-head); font-weight:800; color:var(--white); font-size:1.02rem; }
.brand__sub{ color: var(--gold-400); font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; }

.main-nav__list{ display:flex; align-items:center; gap:2rem; }
.nav-link{
  position:relative; color: rgba(255,255,255,.86); font-weight:600; font-size:.92rem;
  padding: .35rem 0;
}
.nav-link::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0%;
  background: var(--gold-500); transition: width var(--dur-fast) var(--ease);
}
.nav-link:hover, .nav-link:focus-visible{ color: var(--white); }
.nav-link:hover::after, .nav-link:focus-visible::after{ width:100%; }

.site-header__actions{ display:flex; align-items:center; gap:1rem; }

.menu-toggle{
  display:none; position:relative; width:42px; height:42px; border-radius:50%;
  background: rgba(255,255,255,.08); border:1px solid var(--navy-line);
}
.menu-toggle__bars, .menu-toggle__bars::before, .menu-toggle__bars::after{
  content:""; display:block; position:absolute; left:50%; top:50%;
  width:18px; height:2px; background:var(--white);
  transform: translate(-50%,-50%); transition: transform var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);
}
.menu-toggle__bars::before{ transform: translate(-50%, -6px); }
.menu-toggle__bars::after{ transform: translate(-50%, 4px); }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars{ background: transparent; }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars::before{ transform: translate(-50%,-50%) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars::after{ transform: translate(-50%,-50%) rotate(-45deg); }

.mobile-nav{
  display:none; flex-direction:column; gap:1.25rem;
  padding: 1.5rem clamp(1.25rem,5vw,2.5rem) 2rem;
  background: var(--navy-950); border-top:1px solid var(--navy-line);
}
.mobile-nav__list{ display:flex; flex-direction:column; gap:1.1rem; }
.mobile-nav .nav-link{ font-size:1.05rem; }

@media (max-width: 900px){
  .main-nav, .site-header__actions .btn{ display:none; }
  .menu-toggle{ display:block; }
  .mobile-nav:not([hidden]){ display: flex; }
}

/* O atributo HTML [hidden] deve sempre vencer: sem isso, a regra acima
   (mesma especificidade de classe) poderia reaparecer o painel mobile
   mesmo fechado, dependendo da ordem de carregamento do CSS. */
.mobile-nav[hidden]{ display:none; }

/* ---------- Hero ---------- */
.hero{
  position: relative;
  overflow: clip;
  background: radial-gradient(120% 140% at 85% -10%, var(--navy-700), var(--navy-900) 55%, var(--navy-950) 100%);
  color: var(--white);
  padding-block: clamp(3rem, 8vw, 6.5rem);
}

.hero__bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.hero__grid{
  position:absolute; inset:0;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(60% 60% at 70% 30%, black, transparent 75%);
  opacity:.35;
}
.hero__shape{
  position:absolute; border-radius:50%; filter: blur(2px);
  background: radial-gradient(circle, rgba(212,169,74,.35), transparent 70%);
}
.hero__shape--1{ width:340px; height:340px; top:-80px; right:8%; }
.hero__shape--2{ width:220px; height:220px; bottom:-60px; right:28%; background: radial-gradient(circle, rgba(255,255,255,.12), transparent 70%); }
.hero__shape--3{ width:160px; height:160px; top:40%; left:-60px; }

.hero__inner{
  position: relative; z-index:1;
  display:grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
  gap: clamp(2.5rem, 5vw, 4rem);
  align-items:center;
}

.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  color: var(--gold-400); font-weight:700; font-size:.8rem;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.1rem;
}
.eyebrow::before{ content:""; width:22px; height:2px; background: var(--gold-500); display:inline-block; }

.hero__title{
  font-size: clamp(2.1rem, 4.4vw, 3.4rem);
  font-weight: 800; letter-spacing:-.01em; color: var(--white);
}
.hero__title .hl{ color: var(--gold-400); }

.hero__lead{
  margin-top:1.35rem; max-width: 46ch;
  font-size: clamp(1.02rem, 1.4vw, 1.15rem);
  color: rgba(255,255,255,.78); line-height:1.6;
}

.hero__actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.2rem; }

.hero__badges{
  display:flex; flex-wrap:wrap; gap: .6rem 1.6rem;
  margin-top: 2.4rem; padding-top: 1.6rem;
  border-top: 1px solid rgba(255,255,255,.12);
}
.hero__badges li{
  display:flex; align-items:center; gap:.55rem;
  font-size:.88rem; color: rgba(255,255,255,.8); font-weight:500;
}
.hero__badges svg{ color: var(--gold-400); flex-shrink:0; }

/* ---------- Hero visual: dashboard card ---------- */
.hero__visual{ position:relative; display:flex; justify-content:center; align-items:center; min-height: 320px; }

.dash-card{
  position:relative; width: min(400px, 100%);
  background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius-lg);
  padding: 1.6rem 1.6rem 1.9rem;
  box-shadow: var(--shadow-lg);
  backdrop-filter: blur(6px);
}
.dash-card__row{ display:flex; gap:.4rem; margin-bottom:1.4rem; }
.dash-card__dot{ width:9px; height:9px; border-radius:50%; background: rgba(255,255,255,.25); }
.dash-card__dot:first-child{ background: var(--gold-500); }

.dash-card__chart{
  display:flex; align-items:flex-end; gap: .65rem;
  height: 140px; padding: 0 .25rem;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.dash-card__chart .bar{
  flex:1; height: var(--h);
  background: linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.18));
  border-radius: 6px 6px 2px 2px;
  transform-origin: bottom;
  transition: transform .7s var(--ease);
}
.dash-card__chart .bar--accent{
  background: linear-gradient(180deg, var(--gold-400), var(--gold-500));
}

/* Crescimento sutil das barras quando o cartão entra em vista (só com JS). */
html.js .hero__visual .bar{ transform: scaleY(0); }
html.js .hero__visual.in-view .bar{ transform: scaleY(1); }
html.js .hero__visual .bar:nth-child(1){ transition-delay: .05s; }
html.js .hero__visual .bar:nth-child(2){ transition-delay: .11s; }
html.js .hero__visual .bar:nth-child(3){ transition-delay: .17s; }
html.js .hero__visual .bar:nth-child(4){ transition-delay: .23s; }
html.js .hero__visual .bar:nth-child(5){ transition-delay: .29s; }
html.js .hero__visual .bar:nth-child(6){ transition-delay: .35s; }

.dash-card__meta{ display:flex; align-items:center; gap:1.4rem; margin-top:1.5rem; }
.donut{
  --val:72%;
  width:64px; height:64px; border-radius:50%; flex-shrink:0;
  background: conic-gradient(var(--gold-500) calc(var(--val)), rgba(255,255,255,.14) 0);
  display:flex; align-items:center; justify-content:center;
}
.donut::after{
  content:""; width:42px; height:42px; border-radius:50%; background: var(--navy-900);
}
.dash-card__lines{ flex:1; display:flex; flex-direction:column; gap:.55rem; }
.line{ height:8px; border-radius: var(--radius-pill); background: rgba(255,255,255,.16); }
.line--60{ width:60%; } .line--80{ width:80%; } .line--40{ width:40%; }

.float-chip{
  position:absolute; display:flex; align-items:center; gap:.6rem;
  background: var(--white); color: var(--ink-900);
  padding:.75rem 1.1rem; border-radius: var(--radius-md);
  box-shadow: var(--shadow-md); font-size:.82rem; font-weight:700;
  animation: floaty 7s ease-in-out infinite;
}
.float-chip svg{ color: var(--gold-500); flex-shrink:0; }
.float-chip--top{ top:-6%; left:-8%; animation-delay: .3s; }
.float-chip--bottom{ bottom:2%; right:-10%; animation-delay: 1.6s; }

@keyframes floaty{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-5px); }
}

/* ---------- Back to top ----------
   É um <a href="#topo"> real: funciona por âncora nativa mesmo sem JS
   (o scroll suave nesse caso já vem do html{scroll-behavior:smooth} global,
   que por sua vez respeita prefers-reduced-motion). Sem JS, o botão fica
   sempre visível — é só com JS que ele passa a aparecer somente após rolar. */
.back-to-top{
  position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 400;
  width:48px; height:48px; border-radius:50%;
  background: var(--navy-950); color:var(--gold-400); border:1px solid var(--navy-line);
  display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-md);
  opacity:1; transform: none;
  transition: opacity var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.back-to-top:hover{ background: var(--navy-800); }

html.js .back-to-top{ opacity:0; transform: translateY(12px); pointer-events:none; }
html.js .back-to-top.is-visible{ opacity:1; transform:none; pointer-events:auto; }

/* ---------- Reveal on scroll (progressive enhancement) ---------- */
/* Sem JS (sem a classe .js no <html>), td conteúdo já nasce visível. */
.reveal{ opacity:1; transform:none; }

html.js .reveal{
  opacity:0; transform: translateY(14px);
  transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease);
}
html.js .reveal.in-view{ opacity:1; transform:none; }

html.js .reveal[data-reveal-delay="0"]{ transition-delay: 0s; }
html.js .reveal[data-reveal-delay="1"]{ transition-delay: .08s; }
html.js .reveal[data-reveal-delay="2"]{ transition-delay: .16s; }
html.js .reveal[data-reveal-delay="3"]{ transition-delay: .24s; }
html.js .reveal[data-reveal-delay="4"]{ transition-delay: .32s; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration: .001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  html.js .reveal{ transform:none; }
  .float-chip{ animation:none; }
  .hero__shape{ transform:none !important; }
}

/* ---------- Responsive: Hero stacking ---------- */
@media (max-width: 980px){
  .hero__inner{ grid-template-columns: 1fr; }
  /* Ordem no mobile segue a ordem natural do HTML: texto -> CTAs -> selos -> visual.
     (Sem "order" aqui de propósito — já tínhamos essa ordem correta na proposta;
     o order:-1 anterior invertia isso e colocava o cartão visual antes do texto.) */
  .hero__visual{ margin-top: 2.4rem; min-height:auto; }
  .dash-card{ width:min(360px,86vw); margin-inline:auto; }
  .float-chip{ display:none; } /* evita overflow/sobreposição em telas estreitas */
}

@media (max-width: 480px){
  .hero__actions{ flex-direction:column; align-items:stretch; }
  .hero__actions .btn{ width:100%; }
  .hero__badges{ flex-direction:column; gap:.7rem; }
}

/* =========================================================
   Etapa 2: Serviços
   ========================================================= */

.services{
  position: relative;
  overflow: clip;
  background: var(--paper);
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

.services__glow{
  position:absolute; top:-120px; left:50%; translate:-50% 0;
  width:640px; height:420px; pointer-events:none; z-index:0;
  background: radial-gradient(closest-side, rgba(212,169,74,.10), transparent 75%);
}

.section-head{
  position:relative; z-index:1;
  max-width: 620px; margin-inline:auto; margin-bottom: clamp(2.5rem, 5vw, 3.75rem);
  text-align:center;
}

.eyebrow--dark{ color: var(--navy-800); justify-content:center; }
.eyebrow--dark::before{ background: var(--gold-500); }

.section-head__title{
  margin-top:.9rem;
  font-size: clamp(1.75rem, 3.4vw, 2.5rem);
  font-weight:800; letter-spacing:-.01em; color: var(--ink-900);
  text-wrap: balance;
}

.section-head__lead{
  margin-top:1rem; color: var(--ink-500);
  font-size: 1.03rem; line-height:1.6;
}

/* Bloco introdutório: Constituição de Empresas (naturezas jurídicas, em formato de tags) */
.service-intro{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; align-items:flex-start; gap:1.5rem 2.25rem;
  background: var(--white);
  border: 1px solid rgba(16,24,38,.07);
  border-radius: var(--radius-lg);
  padding: 2rem 2.25rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1.75rem;
  transition: transform var(--dur-med) var(--ease), box-shadow var(--dur-med) var(--ease), border-color var(--dur-med) var(--ease);
}
.service-intro:hover, .service-intro:focus-within{
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: rgba(212,169,74,.35);
}

.service-intro__head{ display:flex; align-items:flex-start; gap:1rem; flex: 1 1 260px; min-width:220px; }

.service-intro__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius: var(--radius-md);
  background: var(--navy-950); color: var(--gold-400);
}
.service-intro__icon svg{ width:24px; height:24px; }

.service-intro__eyebrow{
  display:block; color: var(--gold-500); font-weight:700; font-size:.74rem;
  letter-spacing:.1em; text-transform:uppercase; margin-bottom:.3rem;
}

.service-intro__title{ font-size:1.15rem; font-weight:800; color: var(--ink-900); }

.service-intro__body{ flex:2 1 320px; min-width:260px; }

.service-intro__desc{ color: var(--ink-500); font-size:.94rem; line-height:1.6; margin-bottom:1.1rem; }

.service-tags{ display:flex; flex-wrap:wrap; gap:.6rem; }
.service-tags li{
  background: var(--paper);
  border: 1px solid rgba(16,24,38,.09);
  border-radius: var(--radius-pill);
  padding: .45rem 1rem;
  font-size:.83rem; font-weight:600; color: var(--navy-800);
}

/* Cards por setor: Contábil, Fiscal, Pessoal */
.services-grid{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; justify-content:center;
  gap: 1.5rem;
}

.service-card{
  flex: 1 1 320px; max-width: 400px;
  background: var(--white);
  border: 1px solid rgba(16,24,38,.07);
  border-radius: var(--radius-lg);
  padding: 2rem 1.75rem 1.85rem;
  box-shadow: var(--shadow-sm);
  position:relative; overflow:hidden;
  transition: transform var(--dur-med) var(--ease), box-shadow var(--dur-med) var(--ease), border-color var(--dur-med) var(--ease);
}

.service-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background: linear-gradient(90deg, var(--gold-500), var(--gold-400));
  transform: scaleX(0); transform-origin:left;
  transition: transform var(--dur-med) var(--ease);
}

.service-card:hover, .service-card:focus-within{
  transform: translateY(-6px);
  box-shadow: var(--shadow-md);
  border-color: rgba(212,169,74,.35);
}
.service-card:hover::before, .service-card:focus-within::before{ transform: scaleX(1); }

.service-card__top{ display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }

.service-card__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius: var(--radius-md);
  background: var(--navy-950); color: var(--gold-400);
  transition: background var(--dur-med) var(--ease), color var(--dur-med) var(--ease), transform var(--dur-med) var(--ease);
}
.service-card__icon svg{ width:24px; height:24px; }
.service-card:hover .service-card__icon, .service-card:focus-within .service-card__icon{
  background: linear-gradient(160deg, var(--gold-400), var(--gold-500));
  color: var(--navy-950);
  transform: scale(1.06);
}

.service-card__title{
  font-size: 1.08rem; font-weight:800; color: var(--ink-900);
}

.service-card__desc{
  color: var(--ink-500); font-size: .93rem; line-height:1.6; margin-bottom:1.2rem;
}

/* Lista de itens do setor: sempre visível (não depende de JS nem de <details>). */
.service-card__list{
  display:flex; flex-direction:column; gap:.65rem;
  border-top: 1px solid rgba(16,24,38,.08);
  padding-top: 1.1rem;
}
.service-card__list li{
  display:flex; align-items:flex-start; gap:.6rem;
  font-size:.86rem; color: var(--ink-700); line-height:1.5;
}
.service-card__list li svg{
  flex-shrink:0; margin-top:.28em; color: var(--gold-500);
}

@media (max-width: 720px){
  .service-intro{ flex-direction:column; padding: 1.7rem 1.5rem; }
  /* Em coluna, o eixo principal do flex vira vertical: sem isto, os flex-basis
     de 260px/320px definidos acima seriam lidos como altura mínima, deixando
     um vão em branco entre o cabeçalho e o texto. */
  .service-intro__head, .service-intro__body{ flex: none; min-width:0; width:100%; }
}

@media (max-width: 560px){
  .services-grid{ gap:1.1rem; }
  .service-card{ flex-basis:100%; max-width:none; padding: 1.6rem 1.4rem 1.4rem; }
}

/* =========================================================
   Etapa 3: Regimes Tributários
   ========================================================= */

.regimes{
  position: relative; overflow: clip;
  background: linear-gradient(180deg, var(--navy-950), var(--navy-900));
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

.regimes__glow{
  position:absolute; border-radius:50%; pointer-events:none; z-index:0;
  background: radial-gradient(circle, rgba(212,169,74,.14), transparent 70%);
}
.regimes__glow--1{ width:520px; height:520px; top:-180px; left:-140px; }
.regimes__glow--2{ width:420px; height:420px; bottom:-160px; right:-120px; background: radial-gradient(circle, rgba(255,255,255,.06), transparent 70%); }

.section-head--on-dark{ position:relative; z-index:1; }
.section-head--on-dark .section-head__title{ color: var(--white); }
.section-head--on-dark .section-head__lead{ color: rgba(255,255,255,.72); }

/* ---------- Escala conceitual de complexidade ---------- */
.complexity-scale{
  position:relative; z-index:1;
  max-width: 640px; margin: 0 auto clamp(3rem, 6vw, 4.5rem);
}
.complexity-scale__caption{
  text-align:center; font-size:.85rem; color: rgba(255,255,255,.68);
  margin-bottom: 2.25rem; line-height:1.6;
}
.complexity-scale__caption em{
  display:block; font-style:normal; font-size:.78em; color: rgba(255,255,255,.42);
  margin-top:.35rem;
}

.complexity-scale__track{
  display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem;
}
.complexity-scale__marker{
  flex:1; position:relative; display:flex; flex-direction:column; align-items:center; gap:.7rem;
  text-align:center;
}
.complexity-scale__marker::before{
  content:""; position:absolute; top:5px; left:-50%; width:100%; height:2px;
  background: linear-gradient(90deg, rgba(212,169,74,.1), rgba(212,169,74,.55));
  z-index:0;
}
.complexity-scale__marker:first-child::before{ display:none; }
.complexity-scale__marker .dot{
  position:relative; z-index:1;
  width:12px; height:12px; border-radius:50%;
  background: var(--navy-950); border:2px solid var(--gold-400);
}
.complexity-scale__marker b{
  font-weight:700; font-size:.78rem; color: rgba(255,255,255,.85);
}

/* ---------- Cards de regimes ---------- */
.regimes-grid{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; justify-content:center; gap:1.5rem;
  margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
}

.regime-card{
  flex: 1 1 250px; max-width: 300px;
  background: linear-gradient(165deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  padding: 1.9rem 1.6rem;
  transition: transform var(--dur-med) var(--ease), border-color var(--dur-med) var(--ease), background var(--dur-med) var(--ease);
}
.regime-card:hover, .regime-card:focus-within{
  transform: translateY(-6px);
  border-color: rgba(212,169,74,.45);
  background: linear-gradient(165deg, rgba(255,255,255,.1), rgba(255,255,255,.03));
}

.regime-card__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius: var(--radius-md); margin-bottom:1.1rem;
  background: linear-gradient(160deg, var(--gold-400), var(--gold-500));
  color: var(--navy-950);
  transition: transform var(--dur-med) var(--ease);
}
.regime-card__icon svg{ width:24px; height:24px; }
.regime-card:hover .regime-card__icon, .regime-card:focus-within .regime-card__icon{ transform: scale(1.08) rotate(-2deg); }

.regime-card__title{ font-size:1.05rem; font-weight:800; color: var(--white); margin-bottom:.55rem; }
.regime-card__desc{ font-size:.9rem; line-height:1.6; color: rgba(255,255,255,.72); }

.regime-card__pending{
  margin-top:1.1rem; padding-top:.85rem;
  border-top: 1px dashed rgba(255,255,255,.18);
  font-size:.76rem; line-height:1.5; color: rgba(255,255,255,.45);
}
.regime-card__pending strong{ color: var(--gold-400); font-weight:700; }

.regimes__cta{ position:relative; z-index:1; display:flex; justify-content:center; }

@media (max-width: 640px){
  .complexity-scale__marker b{ font-size:.7rem; }
  .regimes-grid{ gap:1.1rem; }
  .regime-card{ flex-basis:100%; max-width:none; }
}

/* =========================================================
   Etapa 4: Diferenciais
   ========================================================= */

.diferenciais{
  background: var(--paper);
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

/* ---------- Missão / Visão ---------- */
.mission-vision{
  display:grid; grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  max-width: 980px; margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.mv-card{
  position:relative; overflow:hidden;
  background: var(--white);
  border: 1px solid rgba(16,24,38,.07);
  border-left: 3px solid var(--gold-500);
  border-radius: var(--radius-lg);
  padding: 2.1rem 2rem;
  box-shadow: var(--shadow-sm);
}

.mv-card__mark{
  width:34px; height:26px; color: var(--gold-050);
  position:absolute; top:1.5rem; right:1.6rem;
}

.mv-card__label{
  position:relative; z-index:1;
  font-family: var(--font-head); font-weight:800; font-size:.78rem;
  letter-spacing:.08em; text-transform:uppercase; color: var(--gold-500);
  margin-bottom:.85rem;
}

.mv-card__quote{
  position:relative; z-index:1; margin:0;
  font-family: var(--font-head); font-weight:600; font-size:1.05rem; line-height:1.55;
  color: var(--navy-800);
}

/* ---------- Cards de diferenciais ---------- */
.diferenciais-grid{
  display:flex; flex-wrap:wrap; justify-content:center; gap:1.5rem;
}

.diff-card{
  flex: 1 1 260px; max-width: 340px;
  background: var(--white);
  border: 1px solid rgba(16,24,38,.06);
  border-radius: var(--radius-lg);
  padding: 2rem 1.75rem;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-med) var(--ease), box-shadow var(--dur-med) var(--ease);
}
.diff-card:hover, .diff-card:focus-within{
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
}

.diff-card__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius: var(--radius-md); margin-bottom:1.1rem;
  background: var(--navy-950); color: var(--gold-400);
  transition: transform var(--dur-med) var(--ease);
}
.diff-card__icon svg{ width:24px; height:24px; }
.diff-card:hover .diff-card__icon, .diff-card:focus-within .diff-card__icon{ transform: scale(1.06); }

.diff-card__title{ font-size:1.05rem; font-weight:800; color: var(--navy-800); margin-bottom:.55rem; }
.diff-card__desc{ font-size:.92rem; line-height:1.6; color: var(--ink-500); }

@media (max-width: 720px){
  .mission-vision{ grid-template-columns: 1fr; }
}

@media (max-width: 560px){
  .diferenciais-grid{ gap:1.1rem; }
  .diff-card{ flex-basis:100%; max-width:none; padding: 1.6rem 1.4rem; }
  .mv-card{ padding: 1.7rem 1.5rem; }
}

/* =========================================================
   Etapa 5: Área do Cliente
   ========================================================= */

.area-cliente{
  position: relative; overflow: clip;
  background: linear-gradient(180deg, var(--navy-900), var(--navy-950));
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

.area-cliente__glow{
  position:absolute; top:10%; right:-160px; width:520px; height:520px;
  border-radius:50%; pointer-events:none; z-index:0;
  background: radial-gradient(circle, rgba(212,169,74,.12), transparent 70%);
}

.area-cliente__inner{
  position:relative; z-index:1;
  display:grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
  gap: clamp(2.5rem, 5vw, 4rem);
  align-items:center;
}

.area-cliente__title{
  margin-top:.9rem;
  font-size: clamp(1.75rem, 3.2vw, 2.35rem);
  font-weight:800; letter-spacing:-.01em; color: var(--white);
  text-wrap: balance;
}

.area-cliente__lead{
  margin-top:1rem; max-width:46ch;
  font-size:1.02rem; line-height:1.65; color: rgba(255,255,255,.72);
}

/* ---------- Canais de contato ---------- */
.channel-list{ margin-top:2.1rem; display:flex; flex-direction:column; gap:.9rem; max-width:420px; }

.channel-card{
  display:flex; align-items:center; gap:1rem;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-md);
  padding: .9rem 1.1rem;
  transition: background var(--dur-med) var(--ease), border-color var(--dur-med) var(--ease), transform var(--dur-med) var(--ease);
}
.channel-card:hover, .channel-card:focus-within{
  background: rgba(255,255,255,.08);
  border-color: rgba(212,169,74,.4);
  transform: translateY(-2px);
}

.channel-card__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius: var(--radius-sm);
  background: linear-gradient(160deg, var(--gold-400), var(--gold-500));
  color: var(--navy-950);
}
.channel-card__icon svg{ width:20px; height:20px; }

.channel-card__body{ display:flex; flex-direction:column; gap:.15rem; min-width:0; }
.channel-card__label{ font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: rgba(255,255,255,.5); }
.channel-card__value{ font-size:.95rem; font-weight:700; color: var(--white); word-break:break-word; }
a.channel-card__value:hover{ color: var(--gold-400); }

.channel-card--pending{ border-style:dashed; background: rgba(255,255,255,.02); }
.channel-card--pending .channel-card__icon{ background: rgba(255,255,255,.1); color: rgba(255,255,255,.55); }
.channel-card__value--pending{ color: rgba(255,255,255,.5); font-weight:700; }

.area-cliente__actions{ margin-top:2.1rem; }

/* ---------- Cartão visual "Em breve" ---------- */
.area-cliente__visual{ display:flex; justify-content:center; }

.portal-card{
  position:relative; overflow:hidden; width:min(380px,100%);
  background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius-lg);
  padding: 1.8rem 1.7rem;
  box-shadow: var(--shadow-lg);
  backdrop-filter: blur(6px);
}

/* Faixa "Em breve" no canto — o overflow:hidden do .portal-card garante que ela
   nunca ultrapasse os limites do cartão, em nenhuma largura de tela. */
.portal-card__badge{
  position:absolute; top:14px; right:-42px; width:160px;
  transform: rotate(35deg); text-align:center;
  background: linear-gradient(180deg, var(--gold-400), var(--gold-500));
  color: var(--navy-950); font-family: var(--font-head); font-weight:800;
  font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.35rem 0; box-shadow: var(--shadow-sm);
}

.portal-card__header{ display:flex; align-items:center; gap:.7rem; margin-bottom:1.5rem; }
.portal-card__mark{
  width:36px; height:36px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(circle at 30% 30%, var(--gold-400), var(--gold-500));
  color: var(--navy-950); font-family: var(--font-head); font-weight:800; font-size:.82rem;
}
.portal-card__title{ font-family: var(--font-head); font-weight:800; color: var(--white); font-size:1rem; }

.portal-card__rows{ display:flex; flex-direction:column; gap:.9rem; margin-bottom:1.6rem; }
.portal-row{ display:flex; align-items:center; gap:.7rem; }
.portal-row__dot{ width:8px; height:8px; border-radius:50%; background: var(--gold-500); flex-shrink:0; }
.portal-row__line{ height:8px; border-radius: var(--radius-pill); background: rgba(255,255,255,.14); }
.portal-row__line--80{ width:80%; } .portal-row__line--55{ width:55%; } .portal-row__line--65{ width:65%; }

.portal-card__footer{ display:flex; gap:.6rem; flex-wrap:wrap; }
.portal-card__chip{
  font-size:.74rem; font-weight:700; color: rgba(255,255,255,.68);
  background: rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-pill); padding:.4rem .85rem;
}

@media (max-width: 980px){
  .area-cliente__inner{ grid-template-columns: 1fr; }
  .area-cliente__visual{ margin-top:2.4rem; }
  .portal-card{ width:min(360px,86vw); margin-inline:auto; }
}

@media (max-width: 480px){
  .channel-list{ max-width:none; }
  .area-cliente__actions .btn{ width:100%; }
}

/* =========================================================
   Contato
   ========================================================= */

.contato{
  background: var(--paper);
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

/* Variante do botão outline para uso sobre fundo claro (o .btn--outline
   original foi desenhado para o Hero, sobre fundo azul-marinho). */
.btn--outline-dark{
  background: var(--white);
  border-color: rgba(16,24,38,.16);
  color: var(--navy-800);
}
.btn--outline-dark:hover{
  background: var(--navy-950); border-color: var(--navy-950); color: var(--white);
  transform: translateY(-2px);
}

.contato-grid{
  display:grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
  gap: clamp(2rem, 5vw, 3.5rem);
  align-items:start;
  max-width: 1040px; margin-inline:auto;
}

.contato-info{ display:flex; flex-direction:column; gap:1.5rem; }

/* ---------- Botão de WhatsApp ---------- */
.whatsapp-btn{
  display:flex; align-items:center; gap:1rem;
  background: linear-gradient(160deg, #25d366, var(--green-600));
  border-radius: var(--radius-lg);
  padding: 1.1rem 1.4rem;
  box-shadow: 0 10px 26px rgba(31,168,85,.28);
  transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.whatsapp-btn:hover, .whatsapp-btn:focus-visible{
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(31,168,85,.38);
}
.whatsapp-btn__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%;
  background: rgba(255,255,255,.2); color: var(--white);
}
.whatsapp-btn__icon svg{ width:24px; height:24px; }
.whatsapp-btn__text{ display:flex; flex-direction:column; gap:.1rem; }
.whatsapp-btn__label{ font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: rgba(255,255,255,.85); }
.whatsapp-btn__value{ font-family: var(--font-head); font-size:1.15rem; font-weight:800; color: var(--white); }

/* ---------- Endereço ---------- */
.contato-address{
  display:flex; align-items:flex-start; gap:1rem;
  background: var(--white); border:1px solid rgba(16,24,38,.07);
  border-radius: var(--radius-lg); padding: 1.3rem 1.4rem;
  box-shadow: var(--shadow-sm);
}
.contato-address__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius: var(--radius-md);
  background: var(--navy-950); color: var(--gold-400);
}
.contato-address__icon svg{ width:22px; height:22px; }
.contato-address__text{
  font-style:normal; font-size:.95rem; line-height:1.6; color: var(--ink-700);
}

.contato-note{
  font-size:.78rem; line-height:1.5; color: var(--ink-500);
  border-left: 2px dashed rgba(16,24,38,.16); padding-left:.85rem;
}

/* ---------- Mapa ---------- */
.contato-map{ display:flex; flex-direction:column; gap:1.1rem; }

.contato-map__frame{
  position:relative; width:100%; aspect-ratio: 4 / 3;
  border-radius: var(--radius-lg); overflow:hidden;
  border:1px solid rgba(16,24,38,.08); box-shadow: var(--shadow-sm);
  background: var(--paper);
}
.contato-map__frame iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  z-index:2; background: var(--white);
  transition: opacity var(--dur-med) var(--ease);
}

/* Fallback visual: fica por baixo do iframe. Sem JS, o iframe real já
   aparece imediatamente (progressive enhancement) e cobre este bloco.
   Com JS, o iframe só aparece quando o evento "load" confirma que o
   Google Maps carregou — se isso nunca acontecer (bloqueio de rede,
   extensão, offline), este fallback permanece visível em vez de deixar
   um retângulo em branco. */
.contato-map__fallback{
  position:absolute; inset:0; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.85rem; padding:2rem 1.5rem; text-align:center;
  background: var(--paper);
}
.contato-map__fallback-icon{
  display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:50%;
  background: var(--white); color: var(--navy-800);
  border:1px solid rgba(16,24,38,.08); box-shadow: var(--shadow-sm);
}
.contato-map__fallback-icon svg{ width:24px; height:24px; }
.contato-map__fallback-text{ font-size:.85rem; color: var(--ink-500); max-width:230px; line-height:1.5; }
.contato-map__fallback-link{
  font-family: var(--font-head); font-weight:700; font-size:.85rem;
  color: var(--navy-800); text-decoration:underline; text-underline-offset:3px;
}
.contato-map__fallback-link:hover, .contato-map__fallback-link:focus-visible{ color: var(--gold-500); }

html.js .contato-map__frame iframe{ opacity:0; }
html.js .contato-map__frame.is-loaded iframe{ opacity:1; }
html.js .contato-map__frame.is-loaded .contato-map__fallback{
  opacity:0; transition: opacity var(--dur-med) var(--ease);
}

.contato-map .btn{ align-self:flex-start; }

.contato__cta{ display:flex; justify-content:center; margin-top: clamp(2.5rem, 5vw, 3.5rem); }

@media (max-width: 860px){
  .contato-grid{ grid-template-columns: 1fr; }
  .contato-map__frame{ aspect-ratio: 16/10; }
}

@media (max-width: 480px){
  .whatsapp-btn{ flex-wrap:wrap; }
  .contato-map .btn{ width:100%; justify-content:center; }
  .contato__cta .btn{ width:100%; }
}

/* =========================================================
   Notícias — seção estrutural com placeholder claramente
   sinalizado (sem manchetes, datas ou textos inventados).
   ========================================================= */

.noticias{
  position: relative; overflow: clip;
  background: var(--paper);
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

.noticias__glow{
  position:absolute; top:-120px; left:50%; translate:-50% 0;
  width:640px; height:420px; pointer-events:none; z-index:0;
  background: radial-gradient(closest-side, rgba(212,169,74,.10), transparent 75%);
}

.noticias-grid{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; justify-content:center;
  gap: 1.5rem;
}

.noticia-card{
  position:relative; overflow:hidden;
  flex: 1 1 280px; max-width: 340px;
  display:flex; flex-direction:column; align-items:flex-start; gap:1.3rem;
  background: var(--white);
  border: 1.5px dashed rgba(16,24,38,.16);
  border-radius: var(--radius-lg);
  padding: 2rem 1.75rem 1.9rem;
}

.noticia-card__badge{
  align-self:flex-start;
  font-family: var(--font-head); font-weight:800; font-size:.68rem;
  letter-spacing:.08em; text-transform:uppercase;
  color: var(--ink-500);
  background: var(--paper);
  border: 1px solid rgba(16,24,38,.12);
  border-radius: var(--radius-pill);
  padding: .32rem .85rem;
}

.noticia-card__icon{
  display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius: var(--radius-md);
  background: rgba(16,24,38,.05); color: rgba(16,24,38,.28);
}
.noticia-card__icon svg{ width:24px; height:24px; }

.noticia-card__lines{ display:flex; flex-direction:column; gap:.55rem; width:100%; }
.noticia-card__line{ height:9px; border-radius: var(--radius-pill); background: rgba(16,24,38,.08); }
.noticia-card__line--90{ width:90%; } .noticia-card__line--85{ width:85%; } .noticia-card__line--75{ width:75%; }
.noticia-card__line--70{ width:70%; } .noticia-card__line--65{ width:65%; } .noticia-card__line--60{ width:60%; }
.noticia-card__line--50{ width:50%; } .noticia-card__line--45{ width:45%; } .noticia-card__line--40{ width:40%; }

@media (max-width: 560px){
  .noticias-grid{ gap:1.1rem; }
  .noticia-card{ flex-basis:100%; max-width:none; }
}

/* =========================================================
   CTA — faixa de conversão antes do Contato, reforçando o
   WhatsApp (mesmo número provisório já usado em Contato).
   ========================================================= */

.cta-band{
  position: relative; overflow: clip;
  background: linear-gradient(180deg, var(--navy-950), var(--navy-900));
  padding-block: clamp(4.5rem, 9vw, 7.5rem);
}

.cta-band__glow{
  position:absolute; border-radius:50%; pointer-events:none; z-index:0;
  background: radial-gradient(circle, rgba(212,169,74,.14), transparent 70%);
}
.cta-band__glow--1{ width:520px; height:520px; top:-200px; left:-160px; }
.cta-band__glow--2{
  width:420px; height:420px; bottom:-180px; right:-140px;
  background: radial-gradient(circle, rgba(255,255,255,.05), transparent 70%);
}

.cta-band .section-head{ margin-bottom: clamp(2rem, 4vw, 2.75rem); max-width:640px; }

.cta-band__actions{
  position:relative; z-index:1;
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap: 1.1rem;
}

.whatsapp-btn--lg{ padding: 1.3rem 1.75rem; }
.whatsapp-btn--lg .whatsapp-btn__icon{ width:52px; height:52px; }
.whatsapp-btn--lg .whatsapp-btn__value{ font-size:1.25rem; }

.cta-band__note{
  position:relative; z-index:1;
  text-align:center; margin-top:1.4rem;
  font-size:.78rem; color: rgba(255,255,255,.45);
}

@media (max-width: 560px){
  .cta-band__actions{ flex-direction:column; align-items:stretch; }
  .cta-band__actions .whatsapp-btn,
  .cta-band__actions .btn{ width:100%; justify-content:center; }
}

/* =========================================================
   Rodapé — apenas dados já validados no projeto (telefone,
   e-mail e navegação da Área do Cliente/header; WhatsApp e
   endereço repetem o mesmo aviso de "provisório" do Contato).
   ========================================================= */

.site-footer{
  background: var(--navy-950);
  padding-top: clamp(3.5rem, 7vw, 5rem);
}

.footer__inner{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1.3fr;
  gap: 2.5rem;
  padding-bottom: clamp(3rem, 6vw, 4rem);
  border-bottom: 1px solid var(--navy-line);
}

.footer__brand{ max-width: 320px; }

.footer__desc{
  margin-top: 1.1rem;
  color: rgba(255,255,255,.6);
  font-size: .92rem; line-height:1.6;
}

.footer__col-title{
  font-family: var(--font-head); font-weight:800; font-size:.78rem;
  letter-spacing:.1em; text-transform:uppercase; color: var(--gold-400);
  margin-bottom: 1.2rem;
}

.footer__nav ul{ display:flex; flex-direction:column; gap:.8rem; }
.footer__nav a{
  position:relative; color: rgba(255,255,255,.72); font-size:.92rem; font-weight:500;
  transition: color var(--dur-fast) var(--ease);
}
.footer__nav a:hover, .footer__nav a:focus-visible{ color: var(--white); }

.footer__contact ul{ display:flex; flex-direction:column; gap:.9rem; }
.footer__contact li{ display:flex; }
.footer__contact a{
  display:inline-flex; align-items:center; gap:.7rem;
  color: rgba(255,255,255,.72); font-size:.9rem; font-weight:500;
  transition: color var(--dur-fast) var(--ease);
}
.footer__contact a:hover, .footer__contact a:focus-visible{ color: var(--white); }

.footer__icon{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  background: rgba(255,255,255,.07); color: var(--gold-400);
}
.footer__icon svg{ width:16px; height:16px; }

.footer__address-item{ align-items:flex-start; gap:.7rem; }
.footer__address-item address{
  color: rgba(255,255,255,.72); font-size:.9rem; font-weight:500; line-height:1.5;
  font-style:normal;
}

.footer__note{
  margin-top:1.3rem; padding-top:1rem;
  border-top: 1px dashed rgba(255,255,255,.14);
  font-size:.76rem; line-height:1.5; color: rgba(255,255,255,.4);
}

.footer__bottom-inner{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:1rem;
  padding-block: 1.5rem;
  /* Reserva espaço à direita para o botão flutuante "voltar ao topo" (fixed,
     right:1.5rem), que senão sobrepõe este link em telas médias (~560–1340px,
     faixa em que a largura do .container ainda não abre folga suficiente). */
  padding-right: 88px;
}

.footer__copy{ font-size:.82rem; color: rgba(255,255,255,.45); }

.footer__top-link{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.82rem; font-weight:700; color: rgba(255,255,255,.72);
  transition: color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.footer__top-link svg{ transition: transform var(--dur-fast) var(--ease); }
.footer__top-link:hover, .footer__top-link:focus-visible{ color: var(--gold-400); }
.footer__top-link:hover svg, .footer__top-link:focus-visible svg{ transform: translateY(-2px); }

@media (max-width: 860px){
  .footer__inner{ grid-template-columns: 1fr 1fr; }
  .footer__brand{ grid-column: 1 / -1; max-width:none; }
}

@media (max-width: 560px){
  .footer__inner{ grid-template-columns: 1fr; gap:2.2rem; }
  .footer__bottom-inner{ flex-direction:column; align-items:flex-start; padding-right:0; }
}
