/* ==========================================================================
   HG Digital - hgdigital.site
   Sistema visual. Base tipografica: Outfit.
   Regra de contraste da marca: ambar (#F9A11B) nunca como texto sobre branco.
   ========================================================================== */

:root{
  /* Marca */
  --hg-red:#E0231B;
  --hg-red-deep:#B8140D;
  --hg-orange:#F2731A;
  --hg-amber:#F9A11B;
  --hg-amber-light:#F9B233;
  --hg-grad:linear-gradient(135deg,#E0231B 0%,#F2731A 50%,#F9B233 100%);
  --hg-grad-btn:linear-gradient(135deg,#E0231B 0%,#B8140D 100%);

  /* Neutros */
  --hg-ink:#111827;
  --hg-ink-soft:#4B5563;
  --hg-ink-muted:#6B7280;
  --hg-dark:#1F2937;
  --hg-dark-deep:#161D28;
  --hg-bg:#F9FAFB;
  --hg-line:#E5E7EB;
  --hg-wa:#25D366;

  /* Forma */
  --hg-r:15px;
  --hg-r-lg:22px;
  --hg-r-sm:10px;
  --hg-shadow:0 1px 2px rgba(17,24,39,.04), 0 18px 50px -18px rgba(17,24,39,.14);
  --hg-shadow-lift:0 2px 6px rgba(17,24,39,.05), 0 28px 60px -20px rgba(17,24,39,.22);
  --hg-shadow-soft:0 0 60px rgba(0,0,0,.10);

  /* Ritmo */
  --hg-section:clamp(3.75rem, 7.5vw, 7rem);
  --hg-header-h:76px;
}

/* --------------------------------------------------------------- base --- */
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}

body{
  font-family:"Outfit",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:#FFFFFF;
  color:var(--hg-ink);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

::selection{ background:var(--hg-red); color:#fff; }

:focus-visible{ outline:3px solid var(--hg-red); outline-offset:3px; border-radius:4px; }
.hg-on-dark :focus-visible{ outline-color:var(--hg-amber); }

section[id]{ scroll-margin-top:calc(var(--hg-header-h) + 12px); }

.hg-shell{ width:100%; max-width:1200px; margin-inline:auto; padding-inline:1.25rem; }
@media (min-width:768px){ .hg-shell{ padding-inline:2rem; } }

.hg-section{ padding-block:var(--hg-section); position:relative; }
.hg-section--tight{ padding-block:clamp(3rem,5.5vw,4.75rem); }
/* secao imediatamente apos a barra de credibilidade sobreposta */
.hg-section--after-cred{ padding-top:clamp(3.25rem,6vw,5.25rem); }
.hg-bg-soft{ background:var(--hg-bg); }
.hg-bg-dark{ background:var(--hg-dark-deep); color:#E5E7EB; }

/* ------------------------------------------------------- tipografia ----- */
.hg-h1{
  font-size:clamp(2.15rem,5.1vw,4rem);
  line-height:1.06;
  font-weight:700;
  letter-spacing:-.025em;
  color:#fff;
  text-wrap:balance;
}
.hg-h2{
  font-size:clamp(1.7rem,3.5vw,2.7rem);
  line-height:1.14;
  font-weight:600;
  letter-spacing:-.02em;
  color:var(--hg-ink);
  text-wrap:balance;
}
.hg-bg-dark .hg-h2,.hg-on-dark .hg-h2{ color:#fff; }

.hg-h3{
  font-size:clamp(1.1rem,1.6vw,1.3rem);
  line-height:1.3;
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--hg-ink);
}
.hg-on-dark .hg-h3{ color:#fff; }

.hg-lead{ font-size:clamp(1.0625rem,1.5vw,1.1875rem); line-height:1.65; color:var(--hg-ink-soft); }
.hg-on-dark .hg-lead{ color:#CBD5E1; }
.hg-body{ color:var(--hg-ink-soft); }
.hg-on-dark .hg-body{ color:#C4CCD7; }
.hg-fine{ font-size:.9375rem; color:var(--hg-ink-muted); line-height:1.6; }
.hg-on-dark .hg-fine{ color:#9AA5B4; }

/* Destaque em gradiente - apenas texto grande (H1/H2) e sempre sobre fundo escuro */
.hg-grad-text{
  background:linear-gradient(100deg,#F2731A 0%,#F9B233 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

/* Rotulo de secao (eyebrow) */
.hg-eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--hg-red);
}
.hg-eyebrow::before{
  content:""; width:26px; height:3px; border-radius:2px; background:var(--hg-grad); flex:none;
}
.hg-on-dark .hg-eyebrow{ color:var(--hg-amber); }
.hg-on-dark .hg-eyebrow::before{ background:linear-gradient(90deg,#F2731A,#F9B233); }

/* ---------------------------------------------------------- botoes ------ */
.hg-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.625rem;
  font-weight:600; font-size:1rem; line-height:1.2; text-decoration:none;
  padding:.95rem 1.75rem; border-radius:999px; border:1px solid transparent;
  transition:transform .22s ease, box-shadow .22s ease, background-color .22s ease, border-color .22s ease, color .22s ease;
  cursor:pointer; text-align:center;
}
.hg-btn svg{ flex:none; }

/* Primario sobre fundo claro - vermelho profundo, texto branco */
.hg-btn--primary{
  background-image:var(--hg-grad-btn); color:#fff;
  box-shadow:0 12px 28px -12px rgba(224,35,27,.65);
}
.hg-btn--primary:hover{ transform:translateY(-2px); box-shadow:0 18px 36px -12px rgba(224,35,27,.75); }
.hg-btn--primary:active{ transform:translateY(0); }

/* Primario sobre fundo escuro - ambar preenchido com texto #111827 */
.hg-btn--amber{
  background-color:var(--hg-amber); color:#111827;
  box-shadow:0 12px 30px -12px rgba(249,161,27,.6);
}
.hg-btn--amber:hover{ background-color:#F9B233; transform:translateY(-2px); box-shadow:0 18px 38px -12px rgba(249,161,27,.7); }

/* Secundario claro */
.hg-btn--ghost{
  background:#fff; color:var(--hg-ink); border-color:var(--hg-line);
  box-shadow:0 1px 2px rgba(17,24,39,.04);
}
.hg-btn--ghost:hover{ border-color:var(--hg-red); color:var(--hg-red); transform:translateY(-2px); }

/* Secundario escuro */
.hg-btn--ghost-dark{
  background:rgba(255,255,255,.04); color:#fff; border-color:rgba(255,255,255,.26);
}
.hg-btn--ghost-dark:hover{ background:rgba(255,255,255,.11); border-color:rgba(255,255,255,.5); transform:translateY(-2px); }

.hg-btn--sm{ padding:.68rem 1.25rem; font-size:.9375rem; }
.hg-btn--block{ width:100%; }

/* Link com seta */
.hg-arrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-weight:600; font-size:.9688rem; color:var(--hg-red); text-decoration:none;
  transition:gap .22s ease, color .22s ease;
}
.hg-arrow svg{ transition:transform .22s ease; flex:none; }
.hg-arrow:hover{ gap:.75rem; color:var(--hg-red-deep); }
.hg-arrow:hover svg{ transform:translateX(3px); }
.hg-on-dark .hg-arrow{ color:var(--hg-amber); }
.hg-on-dark .hg-arrow:hover{ color:var(--hg-amber-light); }

/* ---------------------------------------------------------- cartoes ----- */
.hg-card{
  background:#fff; border:1px solid var(--hg-line); border-radius:var(--hg-r);
  padding:clamp(1.5rem,2.6vw,2rem);
  box-shadow:var(--hg-shadow);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.hg-card--hover:hover{ transform:translateY(-4px); box-shadow:var(--hg-shadow-lift); border-color:rgba(224,35,27,.28); }

.hg-card-dark{
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.11);
  border-radius:var(--hg-r); padding:clamp(1.5rem,2.6vw,2rem);
  transition:transform .28s ease, border-color .28s ease, background-color .28s ease;
}
.hg-card-dark--hover:hover{ transform:translateY(-4px); border-color:rgba(249,161,27,.4); background:rgba(255,255,255,.07); }

/* Icone em bloco */
.hg-icon{
  width:52px; height:52px; border-radius:14px; flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(224,35,27,.09); color:var(--hg-red);
}
.hg-icon--lg{ width:60px; height:60px; border-radius:16px; }
.hg-on-dark .hg-icon{ background:rgba(249,178,51,.15); color:var(--hg-amber-light); }

/* Etiqueta / chip */
.hg-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.42rem .85rem; border-radius:999px;
  background:#fff; border:1px solid var(--hg-line);
  font-size:.875rem; font-weight:500; color:var(--hg-ink-soft);
}
.hg-on-dark .hg-chip{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.14); color:#D8DEE7; }

/* Bloco de segmento atendido (texto corrido em cartao) */
.hg-segment{
  display:flex; align-items:flex-start; gap:.6rem;
  padding:.9rem 1.05rem; border-radius:12px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  font-size:.9375rem; line-height:1.5; color:#D8DEE7; margin:0;
}
.hg-segment::before{
  content:""; width:6px; height:6px; border-radius:50%; flex:none; margin-top:.55rem;
  background:linear-gradient(135deg,#F2731A,#F9B233);
}

/* ---------------------------------------------------------- header ------ */
.hg-header{
  position:fixed; inset-inline:0; top:0; z-index:60;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
}
.hg-header::before{
  content:""; position:absolute; inset-inline:0; top:0; height:3px; background:var(--hg-grad);
}
.hg-header.is-stuck{ border-bottom-color:var(--hg-line); box-shadow:0 4px 24px -12px rgba(17,24,39,.22); }

.hg-navlink{
  position:relative; font-size:.9375rem; font-weight:500; color:var(--hg-ink-soft);
  text-decoration:none; padding:.5rem .1rem; transition:color .2s ease;
}
.hg-navlink::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px; border-radius:2px;
  background:var(--hg-grad); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.hg-navlink:hover{ color:var(--hg-ink); }
.hg-navlink:hover::after,.hg-navlink.is-active::after{ transform:scaleX(1); }
.hg-navlink.is-active{ color:var(--hg-ink); font-weight:600; }

.hg-mobilelink{
  display:flex; align-items:center; justify-content:space-between;
  padding:.9rem .25rem; font-size:1.0625rem; font-weight:500; color:var(--hg-ink);
  text-decoration:none; border-bottom:1px solid var(--hg-line);
}
.hg-mobilelink:active{ color:var(--hg-red); }

/* ------------------------------------------------------------ hero ------ */
.hg-hero{
  position:relative; overflow:hidden;
  background:var(--hg-dark-deep);
  padding-top:calc(var(--hg-header-h) + clamp(2.75rem,6vw,5rem));
  padding-bottom:clamp(6rem,9vw,8.5rem);
}
.hg-hero::before{ /* brilho quente da marca */
  content:""; position:absolute; z-index:0; pointer-events:none;
  width:min(1100px,150%); aspect-ratio:1;
  right:-22%; top:-38%;
  background:radial-gradient(circle at center,
    rgba(224,35,27,.42) 0%, rgba(242,115,26,.24) 34%, rgba(249,178,51,.09) 55%, transparent 70%);
}
.hg-hero::after{ /* malha sutil */
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 30% 20%,#000 10%,transparent 75%);
  mask-image:radial-gradient(ellipse 90% 70% at 30% 20%,#000 10%,transparent 75%);
}
.hg-hero > *{ position:relative; z-index:1; }

.hg-hero-tag{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.45rem 1rem .45rem .5rem; border-radius:999px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  font-size:.8125rem; font-weight:500; color:#E2E8F0;
}
.hg-hero-tag b{ font-weight:600; color:#fff; }

/* Barra de credibilidade - sobreposta ao limite do hero */
.hg-credbar{ margin-top:clamp(-5.5rem,-7vw,-4rem); position:relative; z-index:20; }
.hg-credbar-inner{
  background:#fff; border:1px solid var(--hg-line); border-radius:var(--hg-r-lg);
  box-shadow:var(--hg-shadow-soft), 0 1px 2px rgba(17,24,39,.05);
  display:grid; gap:0; overflow:hidden;
}
@media (min-width:640px){ .hg-credbar-inner{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .hg-credbar-inner{ grid-template-columns:repeat(4,1fr); } }
.hg-cred{
  padding:1.4rem clamp(1.1rem,2vw,1.6rem);
  border-bottom:1px solid var(--hg-line);
  display:flex; gap:.85rem; align-items:flex-start;
}
.hg-cred:last-child{ border-bottom:0; }
@media (min-width:640px){
  .hg-cred:nth-child(odd){ border-right:1px solid var(--hg-line); }
  .hg-cred:nth-last-child(-n+2){ border-bottom:0; }
}
@media (min-width:1024px){
  .hg-cred{ border-bottom:0; border-right:1px solid var(--hg-line); }
  .hg-cred:last-child{ border-right:0; }
}
.hg-cred svg{ color:var(--hg-red); flex:none; margin-top:.15rem; }
.hg-cred strong{ display:block; font-weight:600; font-size:.9688rem; line-height:1.35; color:var(--hg-ink); }
.hg-cred span{ display:block; font-size:.8438rem; line-height:1.45; color:var(--hg-ink-muted); margin-top:.2rem; }

/* --------------------------------------------------------- problema ----- */
.hg-problem{
  display:flex; gap:1rem; align-items:flex-start;
  background:#fff; border:1px solid var(--hg-line); border-left:3px solid rgba(224,35,27,.55);
  border-radius:var(--hg-r-sm); padding:1.15rem 1.35rem;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
  transition:border-left-color .25s ease, transform .25s ease;
}
.hg-problem:hover{ border-left-color:var(--hg-red); transform:translateX(3px); }
.hg-problem svg{ color:var(--hg-red); flex:none; margin-top:.28rem; }

.hg-note{
  border-radius:var(--hg-r); padding:1.5rem clamp(1.25rem,2.4vw,2rem);
  background:linear-gradient(135deg,rgba(224,35,27,.05),rgba(249,178,51,.07));
  border:1px solid rgba(224,35,27,.16);
}

/* ----------------------------------------------------------- etapas ----- */
.hg-steps{ position:relative; display:grid; gap:1.25rem; }
@media (min-width:900px){ .hg-steps{ grid-template-columns:repeat(4,1fr); gap:1.5rem; } }

.hg-step{ position:relative; }
.hg-step-num{
  width:56px; height:56px; border-radius:50%; flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.25rem; font-weight:700; color:#fff;
  background-image:var(--hg-grad-btn);
  box-shadow:0 10px 24px -10px rgba(224,35,27,.6);
  position:relative; z-index:2;
}
.hg-step-line{
  display:none; position:absolute; top:28px; left:56px; right:-1.5rem; height:2px;
  background:linear-gradient(90deg,rgba(224,35,27,.32),rgba(249,178,51,.18));
}
@media (min-width:900px){ .hg-step:not(:last-child) .hg-step-line{ display:block; } }

/* ---------------------------------------------------------- circulo ----- */
.hg-badge-round{
  width:132px; height:132px; border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  background:var(--hg-dark); color:#fff; box-shadow:var(--hg-shadow-soft);
  border:1px solid rgba(255,255,255,.08);
}

/* -------------------------------------------------------------- faq ----- */
.hg-faq-item{
  background:#fff; border:1px solid var(--hg-line); border-radius:var(--hg-r);
  overflow:hidden; transition:border-color .25s ease, box-shadow .25s ease;
}
.hg-faq-item.is-open{ border-color:rgba(224,35,27,.3); box-shadow:var(--hg-shadow); }
.hg-faq-q{
  width:100%; display:flex; align-items:flex-start; gap:1rem; justify-content:space-between;
  padding:1.15rem clamp(1.1rem,2vw,1.5rem); text-align:left; background:none; border:0; cursor:pointer;
  font-family:inherit; font-size:1.0313rem; font-weight:600; line-height:1.45; color:var(--hg-ink);
  transition:color .2s ease;
}
.hg-faq-q:hover{ color:var(--hg-red); }
.hg-faq-icon{
  width:30px; height:30px; border-radius:50%; flex:none; margin-top:.05rem;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(224,35,27,.09); color:var(--hg-red);
  transition:transform .3s ease, background-color .25s ease, color .25s ease;
}
.hg-faq-item.is-open .hg-faq-icon{ transform:rotate(45deg); background:var(--hg-red); color:#fff; }
.hg-faq-a{ padding:0 clamp(1.1rem,2vw,1.5rem) 1.35rem; color:var(--hg-ink-soft); }
.hg-faq-a a{ color:var(--hg-red); font-weight:600; text-decoration:underline; text-underline-offset:2px; }

/* --------------------------------------------------------- contato ------ */
.hg-datarow{
  display:flex; flex-wrap:wrap; gap:.35rem 1rem; align-items:baseline;
  padding:.9rem 0; border-bottom:1px solid var(--hg-line);
}
.hg-datarow dt{ font-weight:600; color:var(--hg-ink); font-size:.9375rem; min-width:132px; }
.hg-datarow dd{ color:var(--hg-ink-soft); margin:0; }
.hg-on-dark .hg-datarow{ border-bottom-color:rgba(255,255,255,.12); }
.hg-on-dark .hg-datarow dt{ color:#fff; }
.hg-on-dark .hg-datarow dd{ color:#C4CCD7; }
.hg-datarow a{ color:var(--hg-red); font-weight:600; text-decoration:none; }
.hg-datarow a:hover{ text-decoration:underline; }
.hg-on-dark .hg-datarow a{ color:var(--hg-amber); }

.hg-map{
  border-radius:var(--hg-r); overflow:hidden; border:1px solid var(--hg-line);
  box-shadow:var(--hg-shadow); background:var(--hg-bg); line-height:0;
}
.hg-map iframe{ display:block; width:100%; height:340px; border:0; }
@media (min-width:768px){ .hg-map iframe{ height:420px; } }
@media (min-width:1024px){ .hg-map iframe{ height:100%; min-height:420px; } }

/* ---------------------------------------------------------- rodape ------ */
.hg-footer{ background:var(--hg-dark); color:#C4CCD7; }
.hg-footer-title{
  font-size:.75rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--hg-amber); margin-bottom:1.1rem; display:block;
}
.hg-footer a{ color:#C4CCD7; text-decoration:none; transition:color .2s ease; }
.hg-footer a:hover{ color:#fff; }
.hg-social{
  width:42px; height:42px; border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); color:#E5E7EB;
  transition:background-color .22s ease, transform .22s ease, border-color .22s ease, color .22s ease;
}
.hg-social:hover{ background:rgba(249,161,27,.16); border-color:rgba(249,161,27,.45); transform:translateY(-2px); color:#fff; }

/* -------------------------------------------------- whatsapp flutuante -- */
.hg-fab{
  position:fixed; right:1rem; bottom:1rem; z-index:70;
  display:inline-flex; align-items:center; gap:.65rem;
  height:60px; padding:0 1.15rem 0 1.05rem; border-radius:999px;
  background:var(--hg-wa); color:#fff; text-decoration:none;
  box-shadow:0 10px 30px -8px rgba(18,140,126,.6), 0 0 0 1px rgba(6,78,59,.25);
  transition:transform .25s ease, box-shadow .25s ease;
}
@media (min-width:768px){ .hg-fab{ right:1.75rem; bottom:1.75rem; } }
.hg-fab:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 16px 38px -8px rgba(18,140,126,.7), 0 0 0 1px rgba(6,78,59,.3); }
.hg-fab svg{ flex:none; }
.hg-fab-label{ font-weight:600; font-size:.9688rem; white-space:nowrap; display:none; }
@media (min-width:640px){ .hg-fab-label{ display:inline; } }
@media (max-width:639px){ .hg-fab{ width:60px; padding:0; justify-content:center; } }

.hg-fab::after{
  content:""; position:absolute; inset:0; border-radius:999px; pointer-events:none;
  border:2px solid var(--hg-wa);
  animation:hg-pulse 2.6s cubic-bezier(.4,0,.6,1) infinite;
}
@keyframes hg-pulse{
  0%{ transform:scale(1); opacity:.7; }
  70%{ transform:scale(1.22); opacity:0; }
  100%{ transform:scale(1.22); opacity:0; }
}

/* ------------------------------------------------------- animacoes ------ */
[data-reveal]{ opacity:0; transform:translateY(18px); }
.hg-revealed[data-reveal]{ opacity:1; transform:none; transition:opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion:reduce){ [data-reveal]{ opacity:1!important; transform:none!important; } }

[x-cloak]{ display:none!important; }

/* ---------------------------------------------------------- impressao --- */
@media print{
  .hg-header,.hg-fab,.hg-map{ display:none!important; }
  body{ color:#000; }
}
