/* ==========================================================================
   inc/theme.css — Design system compartilhado Hidrauluc
   Reset · tokens · header/nav · footer · widget WhatsApp · botões ·
   helpers de seção · animação de revelação
   Carregado por todas as páginas que usam inc/header.php + inc/footer.php.
   ========================================================================== */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

:root {
  /* Marca */
  --r: #c0241f; --rd: #8c1a17; --rh: #e63030;
  --r-50: #fdf1f0; --r-100: #fbe0de;

  /* Neutros */
  --bg: #fff; --s1: #f8fafc; --s2: #f1f5f9; --br: #e2e8f0;
  --ink: #0f172a;      /* títulos — mais escuro que --tx para hierarquia real */
  --tx: #1e293b;       /* corpo de texto */
  --mu: #64748b;       /* texto auxiliar */
  --m2: #475569;       /* texto secundário forte (labels, nav) */

  /* Tipografia */
  --fd: 'Barlow Condensed', system-ui, sans-serif;   /* display / headings */
  --fb: 'Barlow', system-ui, sans-serif;             /* corpo */
  --fm: ui-monospace, 'Courier New', monospace;      /* labels técnicos */

  /* Escala de espaçamento */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem;
  --sp-6: 1.5rem; --sp-8: 2rem; --sp-12: 3rem; --sp-16: 4rem; --sp-24: 6rem;

  /* Raios */
  --r1: 6px; --r2: 12px; --r3: 20px; --rpill: 999px;

  /* Easings */
  --ease: cubic-bezier(.25,.46,.45,.94);
  --sp: cubic-bezier(.34,1.56,.64,1);

  /* Sombras — camadas suaves, sem "peso" excessivo */
  --sh1: 0 1px 2px rgba(15,23,42,.04), 0 4px 16px rgba(15,23,42,.06);
  --sh2: 0 8px 24px rgba(15,23,42,.08), 0 2px 6px rgba(15,23,42,.05);
  --shr: 0 20px 45px -18px rgba(192,36,31,.35);
}

body {
  font-family: var(--fb);
  background: var(--bg);
  color: var(--tx);
  line-height: 1.55;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

.c { max-width: 1280px; margin: 0 auto; padding: 0 2rem; }
@media (max-width: 700px) { .c { padding: 0 1.25rem; } }

.sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--rh); outline-offset: 3px; border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .hs, .rv, .cc, .pc, .bc, .rc, .tkt, .mqt { transition: none !important; animation: none !important; }
  .hs.act { opacity: 1; }
  .rv { opacity: 1; transform: none; }
}

/* ==========================================================================
   Header
   ========================================================================== */
header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.97);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--br); box-shadow: var(--sh1); }

/* Ticker de promoções */
.tk { background: var(--r); height: 32px; display: flex; align-items: center; overflow: hidden; position: relative; }
.tkl { flex-shrink: 0; background: var(--rd); padding: 0 1rem; font: 600 .7rem/32px var(--fd); letter-spacing: 3px;
  text-transform: uppercase; color: #fff; height: 100%; display: flex; align-items: center; margin-right: 2rem; }
.tkl::after { content: ''; position: absolute; left: 100px; top: 0; bottom: 0; width: 24px;
  background: linear-gradient(90deg, var(--rd), transparent); }
.tkt { display: flex; gap: 4rem; white-space: nowrap; animation: tk 38s linear infinite;
  font: 600 .7rem var(--fm); letter-spacing: 1px; color: rgba(255,255,255,.9); }
.tk:hover .tkt { animation-play-state: paused; }
@keyframes tk { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.tkt span { opacity: .7; } .tkt b { color: #fff; font-weight: 700; }

/* Barra principal */
.hb { height: 72px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .5rem; }
@media (max-width: 700px) { .hb { height: 60px; gap: .5rem; } .tk { height: 26px; } }

/* Logo */
.logo { display: flex; align-items: center; gap: .8rem; text-decoration: none; animation: sli .7s var(--ease) both; flex-shrink: 0; }
.logo-svg { display: block; height: 64px; width: auto; overflow: hidden; max-width: 240px; }
@media (max-width: 700px) { .logo-svg { height: 44px; max-width: 110px; } }
.logo-svg #logo-red { transition: transform .5s var(--sp); transform-origin: center; }
.logo-svg #logo-gray { transition: opacity .4s, transform .4s; transform-origin: center; }
.logo-svg #logo-orange { transition: transform .5s var(--sp), fill .3s; transform-origin: center; }
.logo:hover .logo-svg #logo-red { transform: rotate(8deg) scale(1.04); }
.logo:hover .logo-svg #logo-gray { opacity: .85; transform: translateX(2px); }
.logo:hover .logo-svg #logo-orange { transform: rotate(-5deg) scale(1.06); }
@keyframes sli { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }

/* Navegação desktop */
nav { justify-self: center; display: flex; align-items: center; }
nav ul { display: flex; list-style: none; gap: .1rem; align-items: center; }
nav a { font: 600 .8rem var(--fd); letter-spacing: 1.2px; text-transform: uppercase; color: var(--m2);
  text-decoration: none; padding: .5rem .8rem; border-radius: var(--r1); transition: color .2s, background .2s;
  position: relative; display: flex; align-items: center; line-height: 1; white-space: nowrap; }
nav a::after { content: ''; position: absolute; bottom: 2px; left: 50%; width: 0; height: 2px; background: var(--r);
  transition: width .25s var(--ease), left .25s var(--ease); }
nav a:hover, nav a.on { color: var(--r); background: rgba(192,36,31,.05); }
nav a:hover::after, nav a.on::after { width: 60%; left: 20%; }
@media (max-width: 900px) { nav { display: none; } }

.nc { font: 700 .85rem var(--fd) !important; letter-spacing: 2px !important; background: var(--r) !important;
  color: #fff !important; padding: .5rem 1.6rem !important; border-radius: var(--r1) !important;
  transition: background .2s, transform .2s, box-shadow .2s !important; text-decoration: none !important; }
.nc::after { display: none !important; }
.nc:hover { background: var(--rh) !important; transform: translateY(-2px) !important; box-shadow: var(--shr) !important; }

/* Dropdown "Ferramentas" */
.dd { position: relative; display: flex; align-items: center; }
.dd-btn { display: flex; align-items: center; gap: .25rem; cursor: pointer; }
.dd-btn::after { content: '▾'; position: static; width: auto; height: auto; background: none;
  font-size: .65rem; transition: transform .2s; color: var(--mu); }
.dd-menu::before { content: ''; position: absolute; top: -10px; left: 0; right: 0; height: 10px; }
.dd:hover .dd-btn::after, .dd.act .dd-btn::after { transform: rotate(-180deg); }
.dd-menu { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: #fff;
  border: 1px solid var(--br); border-radius: var(--r2); box-shadow: var(--sh2); min-width: 220px;
  padding: .75rem .4rem .4rem; z-index: 200; white-space: nowrap; margin-top: -2px; }
.dd:hover .dd-menu, .dd.act .dd-menu { display: block; }
.dd-menu a { display: flex; align-items: center; gap: .6rem; padding: .6rem .9rem; font: 600 .78rem var(--fd);
  letter-spacing: 1.5px; text-transform: uppercase; color: var(--m2); text-decoration: none; border-radius: var(--r1);
  transition: background .15s, color .15s, padding-left .15s; }
.dd-menu a:hover { background: rgba(192,36,31,.07); color: var(--r); padding-left: 1.1rem; }
.dd-menu a span { font-size: 1rem; flex-shrink: 0; }
.dd-sep { height: 1px; background: var(--br); margin: .3rem .4rem; }
@media (max-width: 900px) { .dd-menu { display: none !important; } }

/* Área direita do header — margin-left:auto garante o espaçamento
   correto mesmo com a nav desktop escondida (não depender de nav{margin:auto}) */
.hr { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; margin-left: auto; }
.sc { display: flex; gap: .4rem; margin-left: .25rem; padding-left: .75rem; border-left: 1px solid var(--br); }
.sc a { width: 34px; height: 34px; border-radius: var(--r1); background: var(--s2); border: 1px solid var(--br);
  display: flex; align-items: center; justify-content: center; color: var(--mu); text-decoration: none;
  transition: background .25s, color .25s, border-color .25s, transform .25s; }
.sc a:hover { background: var(--r); color: #fff; border-color: var(--r); transform: translateY(-3px); }
.iso { font: 700 .7rem var(--fm); letter-spacing: 1.5px; text-transform: uppercase; background: var(--s2);
  border: 1px solid var(--br); color: var(--m2); padding: .4rem 1rem; border-radius: var(--r1); text-decoration: none;
  display: inline-flex; align-items: center; gap: .35rem; transition: background .25s, color .25s, border-color .25s; }
.iso:hover { background: var(--r); color: #fff; border-color: var(--r); }
@media (max-width: 700px) { .sc, .iso { display: none; } .nc { display: none !important; } }

/* Botão hambúrguer */
.mt { display: none; background: none; border: 1px solid var(--br); color: var(--tx); width: 40px; height: 40px;
  border-radius: var(--r1); cursor: pointer; align-items: center; justify-content: center;
  transition: background .2s, border-color .2s, color .2s; }
.mt:hover { background: var(--r); border-color: var(--r); color: #fff; }
@media (max-width: 900px) { .mt { display: flex; } }

/* Menu mobile — ancorado ao <header> (position:relative implícito via sticky),
   sempre no topo do header independente da altura do ticker */
header { position: sticky; }
.mn { display: none; position: absolute; top: 100%; left: 0; width: 100%; background: rgba(255,255,255,.98);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 2px solid var(--br);
  max-height: 0; overflow: hidden; transition: max-height .45s cubic-bezier(.4,0,.2,1); z-index: 99; }
.mn.open { max-height: 640px; overflow-y: auto; }
.mn ul { list-style: none; padding: .5rem 0 1.5rem; display: block; }
.mn li { border-bottom: 1px solid var(--br); display: block; width: 100%; }
.mn li:last-child { border-bottom: none; }
.mn a { display: flex; align-items: center; padding: 1.05rem 1.5rem; font: 700 1rem var(--fd); letter-spacing: 2px;
  text-transform: uppercase; color: var(--m2); text-decoration: none; border-left: 4px solid transparent;
  transition: color .2s, background .2s, padding-left .2s, border-color .2s; }
.mn a:hover, .mn a.on { color: var(--r); background: rgba(192,36,31,.06); padding-left: 1.75rem; border-left-color: var(--r); }
.mn a.em { color: var(--r); font-weight: 800; }
@media (max-width: 900px) { .mn { display: block; } }

/* ==========================================================================
   Botões
   ========================================================================== */
.bp { font: 700 .85rem var(--fd); letter-spacing: 2px; text-transform: uppercase; background: var(--r); color: #fff;
  padding: .85rem 2.2rem; border-radius: var(--r1); text-decoration: none; display: inline-flex; align-items: center;
  gap: .6rem; border: 2px solid var(--r); position: relative; overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.bp::after { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.12);
  transform: translateX(-100%); transition: transform .4s var(--ease); }
.bp:hover::after { transform: translateX(0); }
.bp:hover { transform: translateY(-3px); box-shadow: var(--shr); }
.bo { font: 700 .85rem var(--fd); letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.85);
  background: transparent; padding: .85rem 2.2rem; border-radius: var(--r1); text-decoration: none;
  display: inline-flex; align-items: center; gap: .6rem; border: 2px solid rgba(255,255,255,.3);
  transition: color .3s, border-color .3s, background .3s, transform .3s var(--ease); }
.bo:hover { color: #fff; border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.08); transform: translateY(-3px); }
.btn-s { font: 700 .85rem var(--fd); letter-spacing: 2px; text-transform: uppercase; color: var(--m2);
  background: transparent; padding: .85rem 2.2rem; border-radius: var(--r1); text-decoration: none;
  display: inline-flex; align-items: center; gap: .6rem; border: 2px solid var(--br);
  transition: color .3s, border-color .3s, background .3s, transform .3s var(--ease); }
.btn-s:hover { color: var(--r); border-color: var(--r); background: rgba(192,36,31,.04); transform: translateY(-3px); }
.bp svg, .bo svg, .btn-s svg, .ccl svg, .bl svg { transition: transform .25s var(--ease); }
.bp:hover svg, .bo:hover svg, .btn-s:hover svg, .cc:hover .ccl svg, .bc:hover .bl svg { transform: translateX(4px); }

/* ==========================================================================
   Helpers de seção
   ========================================================================== */
.sec { padding: 6rem 0; background: #fff; }
.sec-a { padding: 6rem 0; background: var(--s1); }
@media (max-width: 700px) { .sec, .sec-a { padding: 3.5rem 0; } }
.slb { display: inline-flex; align-items: center; gap: .6rem; font: 700 .7rem var(--fm); letter-spacing: 3px;
  text-transform: uppercase; color: var(--r); margin-bottom: 1rem; }
.slb::before { content: ''; width: 24px; height: 2px; background: var(--r); }
.st { font: 800 clamp(2rem,4vw,3rem)/1.1 var(--fd); text-transform: uppercase; letter-spacing: -1px;
  color: var(--ink); margin-bottom: .75rem; }
.st span { color: var(--r); }
.ss { font: 400 1rem var(--fb); color: var(--mu); max-width: 500px; }

/* ==========================================================================
   Revelação ao rolar
   ========================================================================== */
.rv { opacity: 0; transform: translateY(36px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.rv.fl { transform: translateX(-36px); } .rv.fr { transform: translateX(36px); } .rv.sc { transform: scale(.93); }
.rv.on { opacity: 1 !important; transform: none !important; }

/* ==========================================================================
   Footer
   ========================================================================== */
.ft { background: #990914; padding: 5rem 0 2rem; color: #fff; }
.fg { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 4rem; margin-bottom: 4rem; padding-bottom: 4rem;
  border-bottom: 1px solid rgba(255,255,255,.15); }
.flo img { height: 40px; width: auto; filter: brightness(1.1); margin-bottom: 1rem; display: block; }
.fd-t { font: 400 .9rem var(--fb); color: rgba(255,255,255,.8); line-height: 1.7; margin-bottom: 1.5rem; }
.fso { display: flex; gap: .5rem; }
.fso a { width: 36px; height: 36px; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--r1); display: flex; align-items: center; justify-content: center; color: #fff;
  text-decoration: none; transition: background .25s, color .25s, transform .25s; }
.fso a:hover { background: #fff; color: #990914; transform: translateY(-3px); }
.fiso { display: inline-flex; align-items: center; gap: .75rem; margin-top: 1.25rem; text-decoration: none;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2); border-radius: var(--r2);
  padding: .6rem 1rem; transition: background .25s, border-color .25s; position: relative; overflow: hidden; }
.fiso:hover { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.4); }
.fiso::after { content: ''; position: absolute; top: 0; left: -150%; width: 50%; height: 100%;
  background: linear-gradient(115deg, transparent, rgba(255,255,255,.3), transparent);
  animation: fisoshine 5s ease-in-out infinite; }
@keyframes fisoshine { 0%, 55% { left: -150%; } 100% { left: 150%; } }
@media (prefers-reduced-motion: reduce) { .fiso::after { animation: none; display: none; } }
.fiso img { object-fit: contain; flex-shrink: 0; }
.fiso-lbl { font: 700 .65rem var(--fm); letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: .15rem; }
.fiso-val { font: 800 1.1rem var(--fd); letter-spacing: .5px; color: #fff; }
.fh { font: 700 .75rem var(--fm); letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.7);
  margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: 1px solid rgba(255,255,255,.15); }
.fli { list-style: none; }
.fli li { margin-bottom: .6rem; }
.fli a { font: 400 .9rem var(--fb); color: rgba(255,255,255,.8); text-decoration: none;
  transition: color .2s, padding-left .2s; display: flex; align-items: center; gap: .4rem; }
.fli a:hover { color: #fff; padding-left: .4rem; }
.fnf { margin-top: 1rem; }
.fin { width: 100%; font: 400 .9rem var(--fb); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
  color: #fff; padding: .75rem 1rem; border-radius: var(--r1); outline: none; margin-bottom: .5rem; }
.fin:focus { border-color: rgba(255,255,255,.6); } .fin::placeholder { color: rgba(255,255,255,.5); }
.fsb { width: 100%; font: 700 .75rem var(--fd); letter-spacing: 2px; text-transform: uppercase; background: #000;
  color: #fff; border: none; padding: .75rem; border-radius: var(--r1); cursor: pointer; transition: background .2s; }
.fsb:hover { background: rgba(0,0,0,.8); }
.fmap { height: 220px; margin-top: 1rem; border-radius: var(--r2); background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2); display: flex; align-items: center; justify-content: center; cursor: pointer;
  flex-direction: column; gap: .5rem; transition: background .2s; }
.fmap:hover { background: rgba(255,255,255,.15); }
.fmap iframe { width: 100%; height: 220px; border: none; border-radius: var(--r2); margin-top: 1rem; }
.fbt { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.fcp { font: 400 .8rem var(--fb); color: rgba(255,255,255,.8); } .fcp strong { color: #fff; }
@media (max-width: 1100px) { .fg { grid-template-columns: 1fr 1fr; gap: 2.5rem; } }
@media (max-width: 700px) { .fg { grid-template-columns: 1fr; gap: 2rem; } .fbt { flex-direction: column; text-align: center; } }

/* ==========================================================================
   Widget flutuante do WhatsApp
   ========================================================================== */
#wa { position: fixed; bottom: 28px; right: 28px; width: 60px; height: 60px; background: #25D366;
  border-radius: var(--r2); display: flex; align-items: center; justify-content: center; border: none; z-index: 1000;
  box-shadow: 0 8px 24px rgba(37,211,102,.4); transition: transform .25s var(--sp), box-shadow .25s; cursor: pointer; }
#wa:hover { transform: scale(1.1) rotate(-4deg); box-shadow: 0 12px 30px rgba(37,211,102,.5); }
#wa svg { width: 30px; height: 30px; }
#wa::before { content: ''; position: absolute; inset: -6px; border-radius: var(--r2); border: 2px solid rgba(37,211,102,.5);
  opacity: 0; animation: wap 2.4s ease-out infinite; }
@keyframes wap { 0% { transform: scale(.9); opacity: .8; } 70% { transform: scale(1.35); opacity: 0; } 100% { opacity: 0; } }
#wpop { position: fixed; bottom: 104px; right: 28px; width: 300px; z-index: 999; transform-origin: bottom right;
  transform: scale(0) translateY(16px); opacity: 0; transition: transform .4s var(--sp), opacity .25s; pointer-events: none; }
#wpop.open { transform: scale(1) translateY(0); opacity: 1; pointer-events: all; }
.wac { background: #fff; border: 1px solid var(--br); border-radius: var(--r3); overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.15); }
.wah { background: linear-gradient(135deg,#25D366,#128C7E); padding: 1rem 1.1rem; display: flex; align-items: center; gap: .75rem; }
.wah svg { width: 24px; height: 24px; flex-shrink: 0; }
.wah h3 { color: #fff; font: 800 .95rem var(--fd); letter-spacing: .5px; }
.wah p { color: rgba(255,255,255,.75); font-size: .75rem; }
.wax { margin-left: auto; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.2); border: none;
  cursor: pointer; color: #fff; font-size: .85rem; display: flex; align-items: center; justify-content: center; transition: background .2s; }
.wax:hover { background: rgba(255,255,255,.35); }
.wab { padding: 1.25rem; }
.wabl { background: var(--s2); border: 1px solid var(--br); border-radius: var(--r2); padding: 1rem 1.1rem; margin-bottom: 1rem; }
.wabl h4 { font: 700 .95rem var(--fd); color: var(--ink); margin-bottom: .25rem; }
.wabl p { font: 400 .8rem var(--fb); color: var(--mu); }
.wact { display: flex; align-items: center; justify-content: center; gap: .6rem; width: 100%; padding: .9rem;
  background: #25D366; color: #fff; border: none; font: 700 .85rem var(--fd); letter-spacing: 1.5px;
  text-transform: uppercase; border-radius: var(--r1); text-decoration: none; transition: background .2s, transform .2s; }
.wact:hover { background: #20BA5A; transform: translateY(-2px); }
.wact svg { width: 18px; height: 18px; }

/* ==========================================================================
   Popup de lead — cartão discreto no canto (não bloqueia a tela)
   ========================================================================== */
#lead-card { position: fixed; bottom: 28px; left: 28px; z-index: 998; width: 340px; max-width: calc(100vw - 40px);
  transform: translateY(24px) scale(.97); opacity: 0; pointer-events: none;
  transition: transform .45s var(--sp), opacity .3s; }
#lead-card.open { transform: none; opacity: 1; pointer-events: all; }
.lc-box { background: #fff; border-radius: var(--r3); overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.18); border: 1px solid var(--br); }
.lc-head { background: var(--r); padding: 1.1rem 1.3rem; position: relative; }
.lc-head .lc-x { position: absolute; top: .7rem; right: .7rem; width: 28px; height: 28px; border-radius: var(--r1);
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.25); color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background .2s; }
.lc-head .lc-x:hover { background: rgba(255,255,255,.3); }
.lc-eyebrow { font: 700 .62rem var(--fm); letter-spacing: 2.5px; text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: .35rem; }
.lc-head h2 { font: 800 1.4rem/1.15 var(--fd); text-transform: uppercase; letter-spacing: -.3px; color: #fff; padding-right: 1.75rem; }
.lc-head p { font-size: .8rem; color: rgba(255,255,255,.82); margin-top: .3rem; }
.lc-body { padding: 1.3rem; }
.lc-field { margin-bottom: .8rem; }
.lc-field label { display: block; font: 700 .65rem var(--fm); letter-spacing: 1.5px; text-transform: uppercase; color: var(--m2); margin-bottom: .3rem; }
.lc-field input, .lc-field textarea { font: 400 .88rem var(--fb); background: var(--s1); border: 1.5px solid var(--br);
  border-radius: var(--r1); padding: .65rem .85rem; width: 100%; transition: border-color .2s; }
.lc-field input:focus, .lc-field textarea:focus { border-color: var(--r); }
.lc-row { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.lc-submit { width: 100%; margin-top: .3rem; font: 700 .78rem var(--fd); letter-spacing: 1.5px; text-transform: uppercase;
  background: var(--r); color: #fff; border: none; border-radius: var(--r1); padding: .75rem; cursor: pointer;
  transition: background .2s, transform .2s; }
.lc-submit:hover { background: var(--rh); transform: translateY(-2px); }
.lc-submit:disabled { opacity: .6; cursor: default; transform: none; }
.lc-msg { margin-top: .6rem; padding: .7rem .9rem; border-radius: var(--r1); font-size: .82rem; display: none; }
@media (max-width: 480px) { #lead-card { left: 12px; right: 12px; bottom: 12px; width: auto; } }


/* Parceiro Hidrauluc: ocupa o espaco livre sem deslocar a navegacao desktop. */
.hb > .hr { position: relative; }
.partner-button { font: 700 .8rem var(--fd); letter-spacing: .7px; white-space: nowrap;
  color: var(--r); background: #fff; border: 1px solid var(--r); border-radius: var(--r1);
  padding: .5rem .7rem; cursor: pointer; transition: background .2s, color .2s; }
.partner-button:hover { color: #fff; background: var(--r); }
.partner-button:focus-visible { outline: 2px solid var(--r); outline-offset: 3px; }
.partner-desktop { position: absolute; right: calc(100% + 8px); top: 50%; transform: translateY(-50%); }
.mn .partner-mobile { display: block; margin: .75rem 1.5rem; padding: .75rem 1rem; font-size: 1rem; }
@media (min-width: 901px) and (max-width: 1250px) {
  .hb > nav[aria-label="Principal"] { display: none; }
  .hb .mt { display: flex; }
  header > .mn { display: block; }
}
@media (max-width: 700px) { .partner-desktop { display: none; } }


/* Cabecalho desktop compacto: menu junto da logo e acoes em sequencia. */
@media (min-width: 1251px) {
  .hb { grid-template-columns: auto auto 1fr; gap: 1rem; }
  .hb > .logo { margin-right: 2.25rem; }
  .hb > nav[aria-label="Principal"] { justify-self: start; }
  .hb > nav[aria-label="Principal"] > ul > li > a { padding-left: .6rem; padding-right: .6rem; }
  .hb > .hr { justify-self: start; margin-left: 0; }
  .hb .partner-desktop { position: static; transform: none; }
}


/* Links da pagina Parceiro Hidrauluc com as mesmas medidas dos botoes. */
.partner-button { text-decoration: none; line-height: normal; }
.partner-button[aria-current="page"] { background: var(--r-50); }
.partner-button[aria-current="page"]:hover { background: var(--r); }
.mn a.partner-mobile { letter-spacing: .7px; text-transform: none; line-height: normal; font-weight: 700; border: 1px solid var(--r); }
.mn a.partner-mobile::after { display: none; }