/* =========================================================
   Chaveiro Disponível — Belo Horizonte
   Design system dark. Sem dependências externas.

   Profundidade no escuro não vem de sombra — vem de camada.
   Cada superfície sobe um degrau de luminosidade e ganha um
   fio de luz na borda superior. O brilho âmbar é reservado
   ao que gera contato.
   ========================================================= */

:root{
  /* ---- camadas (do mais fundo ao mais alto) ---- */
  --bg:        #08090D;
  --bg-1:      #0E1118;
  --bg-2:      #12151D;
  --surface:   #161A23;
  --surface-2: #1C212C;

  /* ---- fios de luz ---- */
  --line:      rgba(255,255,255,.07);
  --line-2:    rgba(255,255,255,.12);
  --edge:      inset 0 1px 0 rgba(255,255,255,.06);

  /* ---- texto ---- */
  --text:      #EEF1F6;
  --text-2:    #99A2B3;
  --text-3:    #6C7484;

  /* ---- acento ---- */
  --brass:     #FFB020;
  --brass-2:   #FFCB63;
  --brass-3:   #FF8A00;
  --brass-dim: rgba(255,176,32,.13);
  --wa:        #25D366;
  --live:      #3DDC84;

  /* ---- forma ---- */
  --r-sm: 10px;
  --r:    16px;
  --r-lg: 20px;
  --r-xl: 26px;
  --r-pill: 999px;

  --glow-brass: 0 6px 28px -6px rgba(255,176,32,.5);
  --glow-wa:    0 6px 28px -6px rgba(37,211,102,.45);
  --lift:       0 16px 40px -18px rgba(0,0,0,.9);

  /* ---- ritmo ---- */
  --pad:   clamp(1.15rem, 4vw, 2rem);
  --sec-y: clamp(3.75rem, 9vw, 7rem);
  --max:   1160px;

  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ease: cubic-bezier(.22,.61,.36,1);

  color-scheme: dark;
}

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

body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

h1,h2,h3{ margin:0; line-height:1.13; letter-spacing:-.025em; font-weight:800; }
p{ margin:0; }
img,svg{ max-width:100%; }
a{ color:inherit; }
::selection{ background:var(--brass); color:#160E00; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--brass); color:#160E00; font-weight:700;
  padding:.75rem 1.25rem; border-radius:0 0 var(--r-sm) 0;
}
.skip-link:focus{ left:0; }

:where(a,button,summary,details):focus-visible{
  outline:2px solid var(--brass);
  outline-offset:3px;
  border-radius:8px;
}

.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--pad); }
.wrap--narrow{ max-width:780px; }

/* ponto "ao vivo" */
.dot{
  display:inline-block; width:7px; height:7px; border-radius:50%;
  background:var(--live); flex:none;
  box-shadow:0 0 0 0 rgba(61,220,132,.65);
  animation:pulse 2.4s infinite;
}
@keyframes pulse{
  70%{ box-shadow:0 0 0 8px rgba(61,220,132,0); }
  100%{ box-shadow:0 0 0 0 rgba(61,220,132,0); }
}

/* =========================================================
   HEADER
   ========================================================= */
.header{
  position:sticky; top:0; z-index:100;
  background:rgba(8,9,13,.72);
  backdrop-filter:saturate(160%) blur(16px);
  -webkit-backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.header.is-stuck{ background:rgba(8,9,13,.9); border-bottom-color:var(--line); }
.header__in{ display:flex; align-items:center; gap:1rem; min-height:70px; }

.brand{ display:inline-flex; align-items:center; gap:.65rem; text-decoration:none; margin-right:auto; }
/* ---------------------------------------------------------
   MARCA
   O nome carrega o conceito: "Disponível" = está no ar.
   Por isso o símbolo é uma chave com um ponto de status
   verde, do jeito que um contato aparece online. É a
   assinatura da marca e se repete em header, hero e rodapé.
   --------------------------------------------------------- */
.mark{
  position:relative; display:inline-grid; place-items:center;
  width:42px; height:42px; flex:none;
  border-radius:13px;
  color:var(--brass);
  background:linear-gradient(155deg, rgba(255,176,32,.2), rgba(255,176,32,.045));
  border:1px solid rgba(255,176,32,.26);
  box-shadow:var(--edge);
}
.mark__key{ width:66%; height:66%; display:block; }
.mark__status{
  position:absolute; top:-2px; right:-2px;
  width:12px; height:12px; border-radius:50%;
  background:var(--live);
  border:2.5px solid var(--bg);
  box-shadow:0 0 0 0 rgba(61,220,132,.65);
  animation:pulse 2.4s infinite;
}

/* versão grande, para o lockup do hero */
.mark--xl{
  width:clamp(62px,13vw,92px); height:clamp(62px,13vw,92px);
  border-radius:clamp(18px,3.6vw,26px);
  background:linear-gradient(155deg, rgba(255,176,32,.24), rgba(255,176,32,.05));
}
.mark--xl .mark__status{
  width:clamp(15px,3vw,21px); height:clamp(15px,3vw,21px);
  top:-3px; right:-3px; border-width:clamp(3px,.7vw,4.5px);
}

/* lockup do hero: "Chaveiro" leve em cima, "Disponível" pesado embaixo */
.lockup{
  display:flex; align-items:center; gap:clamp(.85rem,2.4vw,1.35rem);
  margin-bottom:1.05rem;
}
.lockup__word{ display:flex; flex-direction:column; line-height:.94; margin:0; }
.lockup__top{
  font-size:clamp(1.35rem,4.2vw,2.5rem);
  font-weight:600; letter-spacing:.015em;
  color:var(--text-2);
}
.lockup__bot{
  font-size:clamp(2.35rem,7.8vw,4.5rem);
  font-weight:800; letter-spacing:-.038em;
}

/* linha do domínio */
.hero__domain{
  display:flex; align-items:center; flex-wrap:wrap; gap:.62rem;
  font-size:.94rem; color:var(--text-3);
  margin-bottom:1.5rem;
}
.hero__domain-url{ color:var(--brass); font-weight:700; letter-spacing:.005em; }
.hero__domain-sep{
  width:4px; height:4px; border-radius:50%; background:var(--text-3); flex:none;
}
.brand__txt{ display:flex; flex-direction:column; line-height:1.2; }
.brand__txt strong{ font-size:1.03rem; font-weight:800; letter-spacing:-.02em; }
.brand__txt small{
  display:flex; align-items:center; gap:.4rem;
  font-size:.74rem; color:var(--text-3); letter-spacing:.015em;
}

.nav{ display:none; gap:.15rem; }
.nav a{
  text-decoration:none; font-size:.9rem; font-weight:600; color:var(--text-2);
  padding:.5rem .78rem; border-radius:var(--r-sm);
  transition:color .18s, background .18s;
}
.nav a:hover{ color:var(--text); background:rgba(255,255,255,.05); }

/* especificidade elevada de propósito: .btn também define `display`,
   e sem isto o botão vazaria para o header do celular */
.header .header__cta{ display:none; }

@media (min-width:920px){
  .nav{ display:flex; }
  .header .header__cta{ display:inline-flex; margin-left:.75rem; }
}

/* =========================================================
   BOTÕES
   ========================================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.62rem;
  font-family:inherit; font-size:.95rem; font-weight:700; text-decoration:none;
  padding:.82rem 1.3rem; border-radius:var(--r-pill); border:0;
  cursor:pointer; white-space:nowrap;
  transition:transform .18s var(--ease), box-shadow .22s var(--ease), background .2s;
}
.btn svg{ width:1.15em; height:1.15em; fill:currentColor; flex:none; }
.btn span{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.22; }
.btn small{ font-size:.74em; font-weight:600; opacity:.78; letter-spacing:.01em; }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }

.btn--call{
  background:linear-gradient(180deg, var(--brass-2), var(--brass) 62%, #F0A00E);
  color:#1A1200;
  box-shadow:var(--glow-brass), inset 0 1px 0 rgba(255,255,255,.45);
}
.btn--call:hover{ box-shadow:0 10px 36px -6px rgba(255,176,32,.65), inset 0 1px 0 rgba(255,255,255,.45); }

.btn--wa{
  background:linear-gradient(180deg,#33E07C, var(--wa) 62%, #1FBE5C);
  color:#032013;
  box-shadow:var(--glow-wa), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn--wa:hover{ box-shadow:0 10px 36px -6px rgba(37,211,102,.6), inset 0 1px 0 rgba(255,255,255,.35); }

.btn--ghost{
  background:rgba(255,255,255,.04);
  color:var(--text);
  box-shadow:inset 0 0 0 1px var(--line-2);
}
.btn--ghost:hover{ background:rgba(255,255,255,.08); box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }

.btn--xl{ font-size:1.06rem; padding:1.02rem 1.65rem; }

.ctarow{ display:flex; flex-wrap:wrap; gap:.75rem; }
.ctarow .btn{ flex:1 1 245px; }
.ctarow--tight .btn{ flex:0 1 auto; }
.ctarow--center{ justify-content:center; }

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--bg);
  padding-block:clamp(3.25rem,9vw,6rem) clamp(3.25rem,7vw,5rem);
  border-bottom:1px solid var(--line);
}
/* malha sutil, some nas bordas */
.hero::before{
  content:""; position:absolute; inset:0; z-index:-2;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(80% 65% at 50% 8%, #000 10%, transparent 75%);
  -webkit-mask-image:radial-gradient(80% 65% at 50% 8%, #000 10%, transparent 75%);
}
/* halo âmbar */
.hero__aura{
  position:absolute; z-index:-1; top:-28%; right:-12%;
  width:min(680px,88vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(255,176,32,.22), rgba(255,138,0,.06) 45%, transparent 68%);
  filter:blur(54px);
  pointer-events:none;
}
.hero__in{ position:relative; max-width:900px; }

.badge{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.42rem .95rem .42rem .8rem;
  margin-bottom:1.5rem;
  border-radius:var(--r-pill);
  background:rgba(255,255,255,.045);
  border:1px solid var(--line-2);
  font-size:.8rem; font-weight:600; color:var(--text-2); letter-spacing:.01em;
}

.hl{
  background:linear-gradient(100deg, var(--brass-2) 5%, var(--brass) 48%, var(--brass-3));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero__sub{
  font-size:clamp(1.02rem,2.4vw,1.22rem);
  color:var(--text-2);
  max-width:54ch; margin-bottom:2.15rem;
}

/* selos */
.trust{
  list-style:none; margin:3rem 0 0; padding:0;
  display:grid; gap:.65rem;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
}
.trust li{
  display:flex; align-items:center; gap:.75rem;
  padding:.88rem 1rem;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  border:1px solid var(--line);
  border-radius:var(--r);
  box-shadow:var(--edge);
}
.trust svg{ width:21px; height:21px; fill:var(--brass); flex:none; }
.trust span{ display:flex; flex-direction:column; line-height:1.32; font-size:.79rem; color:var(--text-3); }
.trust strong{ font-size:.92rem; color:var(--text); font-weight:700; letter-spacing:-.01em; }

/* =========================================================
   SEÇÕES
   ========================================================= */
.sec{ padding-block:var(--sec-y); background:var(--bg); }
.sec--alt{ background:var(--bg-1); border-block:1px solid var(--line); }

.sec__head{ max-width:620px; margin-bottom:clamp(2rem,4.5vw,3.25rem); }
.sec__head--center{ margin-inline:auto; text-align:center; }
.sec__head h2{ font-size:clamp(1.8rem,4.6vw,2.7rem); margin-bottom:.75rem; }
.sec__head p{ font-size:1.03rem; color:var(--text-2); }

.eyebrow{
  font-size:.76rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--brass); margin-bottom:.9rem;
}
.lead{ font-size:1.05rem; color:var(--text-2); margin-bottom:1.15rem; }

.sec__foot{ margin-top:1.9rem; text-align:center; font-size:.95rem; color:var(--text-3); }
.sec__foot a{ color:var(--brass); font-weight:700; text-decoration:none; text-underline-offset:4px; }
.sec__foot a:hover{ text-decoration:underline; }

.grid{ display:grid; gap:.85rem; }

/* ---------- situações ---------- */
.grid--sit{ grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr)); }
.sit{
  position:relative; overflow:hidden;
  display:flex; align-items:center; gap:1rem;
  padding:1.15rem 1.2rem;
  background:linear-gradient(180deg, var(--surface), var(--bg-2));
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--edge);
  text-decoration:none;
  transition:transform .22s var(--ease), border-color .22s, box-shadow .22s;
}
.sit::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(120% 100% at 0% 0%, rgba(255,176,32,.09), transparent 55%);
  opacity:0; transition:opacity .25s var(--ease); pointer-events:none;
}
.sit:hover{
  transform:translateY(-3px);
  border-color:rgba(255,176,32,.34);
  box-shadow:var(--edge), var(--lift);
}
.sit:hover::after{ opacity:1; }

.sit__ico{
  position:relative; z-index:1;
  width:46px; height:46px; flex:none;
  display:grid; place-items:center; border-radius:13px;
  background:var(--brass-dim);
  border:1px solid rgba(255,176,32,.2);
  color:var(--brass);
}
.sit__ico svg{ width:23px; height:23px; fill:currentColor; }

.sit__txt{
  position:relative; z-index:1;
  display:flex; flex-direction:column; gap:.16rem;
  line-height:1.38; font-size:.85rem; color:var(--text-3);
}
.sit__txt strong{ font-size:1rem; font-weight:700; letter-spacing:-.015em; color:var(--text); }

.sit__go{
  position:relative; z-index:1;
  margin-left:auto; flex:none;
  width:19px; height:19px; color:var(--text-3);
  transition:transform .22s var(--ease), color .22s;
}
.sit__go svg{ width:100%; height:100%; fill:currentColor; display:block; }
.sit:hover .sit__go{ transform:translateX(4px); color:var(--brass); }

/* ---------- serviços (lista, não cartão) ---------- */
.srvlist{
  list-style:none; margin:0; padding:0;
  display:grid; gap:0;
  border-top:1px solid var(--line);
}
.srvlist li{
  display:flex; align-items:flex-start; gap:1.1rem;
  padding:1.55rem .25rem;
  border-bottom:1px solid var(--line);
}
.srvlist__ico{
  width:42px; height:42px; flex:none;
  display:grid; place-items:center; border-radius:12px;
  background:var(--brass-dim);
  border:1px solid rgba(255,176,32,.18);
  color:var(--brass);
}
.srvlist__ico svg{ width:22px; height:22px; fill:currentColor; }
.srvlist h3{ font-size:1.08rem; margin-bottom:.3rem; }
.srvlist p{ font-size:.93rem; color:var(--text-2); }

@media (min-width:860px){
  .srvlist{ grid-template-columns:1fr 1fr; column-gap:3.25rem; }
  .srvlist li:nth-last-child(-n+2){ border-bottom:0; }
}

/* ---------- automotivo ---------- */
.sec--auto{ position:relative; overflow:hidden; }
.sec--auto::before{
  content:""; position:absolute; z-index:0; inset:auto -10% -35% auto;
  right:-8%; top:12%;
  width:min(560px,70vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(255,176,32,.16), transparent 66%);
  filter:blur(58px); pointer-events:none;
}
.auto__in{ position:relative; z-index:1; display:grid; gap:clamp(2.5rem,5vw,4.25rem); align-items:center; }
.auto__txt h2{ font-size:clamp(1.8rem,4.6vw,2.7rem); margin-bottom:1.05rem; }

.ticks{ list-style:none; margin:0 0 2rem; padding:0; display:grid; gap:.72rem; }
.ticks li{
  position:relative; padding-left:2.1rem;
  font-size:.97rem; color:var(--text-2);
}
.ticks li::before{
  content:""; position:absolute; left:0; top:.24em;
  width:20px; height:20px; border-radius:50%;
  background:var(--brass-dim);
  border:1px solid rgba(255,176,32,.22);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FFB020'%3E%3Cpath d='M9.6 16.2 5.4 12l-1.4 1.4 5.6 5.6L20.4 8.2 19 6.8z'/%3E%3C/svg%3E");
  background-size:12px; background-repeat:no-repeat; background-position:center;
}

.auto__art{ display:flex; justify-content:center; }
.keycard{
  position:relative;
  width:min(430px,100%); aspect-ratio:4/2.8;
  display:grid; place-items:center;
  border-radius:var(--r-xl);
  background:linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.015));
  border:1px solid var(--line-2);
  box-shadow:var(--edge), var(--lift);
  overflow:hidden;
}
.keycard::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(70% 60% at 30% 20%, rgba(255,176,32,.12), transparent 62%);
}
.keycard__key{ width:64%; color:var(--brass); position:relative; z-index:2; filter:drop-shadow(0 4px 16px rgba(255,176,32,.35)); }
.keycard__chip{
  position:absolute; z-index:2; top:16%; left:12%;
  width:34px; height:26px; border-radius:5px;
  background:linear-gradient(150deg, var(--brass-2), #A66A00);
  box-shadow:0 2px 10px rgba(0,0,0,.5);
}
.keycard__chip::after{
  content:""; position:absolute; inset:5px 6px;
  border:1px solid rgba(0,0,0,.3); border-radius:2px;
}
.keycard__waves{ position:absolute; z-index:2; right:9%; top:50%; translate:0 -50%; display:grid; gap:7px; }
.keycard__waves i{
  display:block; width:7px; border-radius:var(--r-pill);
  background:var(--brass); opacity:.3;
  animation:wave 1.9s ease-in-out infinite;
}
.keycard__waves i:nth-child(1){ height:16px; }
.keycard__waves i:nth-child(2){ height:28px; animation-delay:.2s; }
.keycard__waves i:nth-child(3){ height:16px; animation-delay:.4s; }
@keyframes wave{ 0%,100%{ opacity:.18; } 50%{ opacity:.9; } }

@media (min-width:900px){ .auto__in{ grid-template-columns:1.05fr .95fr; } }

/* ---------- passos ---------- */
.steps{
  list-style:none; margin:0; padding:0;
  display:grid; gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,255px),1fr));
}
.steps li{
  position:relative;
  padding:1.7rem 1.45rem 1.6rem;
  background:linear-gradient(180deg, var(--surface), var(--bg-2));
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--edge);
}
.steps__n{
  display:grid; place-items:center;
  width:38px; height:38px; margin-bottom:1rem;
  border-radius:11px;
  background:var(--brass-dim);
  border:1px solid rgba(255,176,32,.24);
  color:var(--brass);
  font-weight:800; font-size:1rem;
}
.steps h3{ font-size:1.1rem; margin-bottom:.42rem; }
.steps p{ font-size:.93rem; color:var(--text-2); }

/* ---------- onde atendemos ---------- */
.area__in{ display:grid; gap:clamp(2.25rem,4.5vw,3.5rem); align-items:start; }
.area__txt h2{ font-size:clamp(1.8rem,4.6vw,2.7rem); margin-bottom:1.05rem; }

.card{
  padding:1.85rem 1.7rem;
  background:linear-gradient(180deg, var(--surface-2), var(--surface));
  border:1px solid var(--line-2);
  border-radius:var(--r-xl);
  box-shadow:var(--edge), var(--lift);
}
.card--addr{ font-style:normal; }
.card--addr h3{ font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; color:var(--brass); margin-bottom:1rem; }
.card__addr{ font-size:1.08rem; font-weight:600; line-height:1.5; }
.card__meta{ margin:1.5rem 0 0; display:grid; gap:1rem; }
.card__meta div{ display:grid; gap:.15rem; }
.card__meta dt{ font-size:.73rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-3); font-weight:700; }
.card__meta dd{ margin:0; font-size:1rem; font-weight:600; }
.card__meta a{ color:var(--brass); text-decoration:none; }
.card__meta a:hover{ text-decoration:underline; }

.card__map{
  display:inline-flex; align-items:center; gap:.45rem;
  margin-top:1.5rem; padding-top:1.3rem;
  border-top:1px solid var(--line);
  width:100%;
  font-size:.92rem; font-weight:700; color:var(--brass); text-decoration:none;
}
.card__map svg{ width:14px; height:14px; fill:currentColor; }
.card__map:hover{ text-decoration:underline; }

@media (min-width:900px){ .area__in{ grid-template-columns:1.08fr .92fr; } }

/* ---------- dúvidas ---------- */
.faq{ display:grid; gap:.6rem; }
.faq details{
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:var(--r);
  overflow:hidden;
  transition:border-color .22s, background .22s;
}
.faq details:hover{ border-color:var(--line-2); }
.faq details[open]{
  background:linear-gradient(180deg, var(--surface), var(--bg-2));
  border-color:rgba(255,176,32,.22);
}
.faq summary{
  display:flex; align-items:center; gap:1rem;
  padding:1.12rem 1.3rem;
  font-size:1rem; font-weight:700; letter-spacing:-.012em;
  cursor:pointer; list-style:none;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; margin-left:auto; flex:none;
  width:22px; height:22px; border-radius:50%;
  background:rgba(255,255,255,.06);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2399A2B3'%3E%3Cpath d='M12 15.4 5.6 9l1.4-1.4 5 5 5-5L18.4 9z'/%3E%3C/svg%3E");
  background-size:15px; background-repeat:no-repeat; background-position:center;
  transition:transform .28s var(--ease);
}
.faq details[open] summary::after{ transform:rotate(180deg); }
.faq__a{ padding:0 1.3rem 1.25rem; }
.faq__a p{ font-size:.95rem; color:var(--text-2); }
.faq__a a{ color:var(--brass); font-weight:700; }

/* =========================================================
   CTA FINAL
   ========================================================= */
.cta{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--bg);
  border-top:1px solid var(--line);
  padding-block:clamp(3.5rem,8vw,6rem);
  text-align:center;
}
.cta__aura{
  position:absolute; z-index:-1; top:-45%; left:50%; translate:-50% 0;
  width:min(820px,120vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(255,176,32,.2), rgba(255,138,0,.05) 42%, transparent 65%);
  filter:blur(60px); pointer-events:none;
}
.cta__in{ max-width:620px; }
.cta h2{ font-size:clamp(1.85rem,5.2vw,2.85rem); margin-bottom:.75rem; }
.cta__in > p{ color:var(--text-2); font-size:1.05rem; margin-bottom:2.1rem; }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{
  background:var(--bg);
  border-top:1px solid var(--line);
  color:var(--text-3); font-size:.9rem;
}
.footer__in{
  display:grid; gap:2.5rem;
  padding-block:clamp(2.75rem,6vw,4rem) 2.4rem;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));
}
.footer .brand__txt strong{ color:var(--text); }
.footer .brand__txt small{ color:var(--text-3); }
.footer__desc{ margin-top:1.05rem; max-width:34ch; line-height:1.68; }
.footer__col h3{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.12em;
  color:var(--brass); margin-bottom:1rem;
}
.footer__col a{
  display:block; text-decoration:none; padding:.32rem 0;
  transition:color .18s;
}
.footer__col a:hover{ color:var(--brass); }
.footer__addr{ margin-top:.95rem; line-height:1.62; }
.footer__addr strong{ color:var(--text-2); }

.footer__bar{
  display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; justify-content:space-between;
  padding-block:1.4rem;
  border-top:1px solid var(--line);
  font-size:.81rem;
}

/* =========================================================
   DOCK MOBILE
   ========================================================= */
.dock{
  position:fixed; z-index:120; left:0; right:0; bottom:0;
  display:grid; grid-template-columns:1fr 1fr; gap:.55rem;
  padding:.6rem var(--pad) calc(.6rem + env(safe-area-inset-bottom));
  background:rgba(8,9,13,.86);
  backdrop-filter:saturate(160%) blur(18px);
  -webkit-backdrop-filter:saturate(160%) blur(18px);
  border-top:1px solid var(--line-2);
}
.dock__btn{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.92rem .5rem; border-radius:var(--r-pill);
  font-size:.95rem; font-weight:800; text-decoration:none;
}
.dock__btn svg{ width:19px; height:19px; fill:currentColor; flex:none; }
.dock__btn--call{
  background:linear-gradient(180deg, var(--brass-2), var(--brass)); color:#1A1200;
  box-shadow:0 4px 18px -4px rgba(255,176,32,.6);
}
.dock__btn--wa{
  background:linear-gradient(180deg,#33E07C, var(--wa)); color:#032013;
  box-shadow:0 4px 18px -4px rgba(37,211,102,.5);
}

body{ padding-bottom:86px; }
@media (min-width:920px){
  .dock{ display:none; }
  body{ padding-bottom:0; }
}

/* =========================================================
   ENTRADA
   ========================================================= */
.reveal{ opacity:0; transform:translateY(16px); }
.reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .65s var(--ease), transform .65s var(--ease);
}

@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .dot, .mark__status, .keycard__waves i{ animation:none; }
  .btn:hover, .sit:hover{ transform:none; }
}

/* =========================================================
   IMPRESSÃO
   ========================================================= */
@media print{
  .dock,.header,.hero__aura,.cta__aura,.keycard{ display:none; }
  body{ padding:0; background:#fff; color:#000; }
  .hero,.sec,.sec--alt,.cta,.footer{ background:#fff !important; color:#000 !important; }
  .hl{ -webkit-text-fill-color:#000; color:#000; }
}