/* =========================================================
   HD360 Moinhos · Página de captação Unimed (unimed.html)
   Só o que é exclusivo desta página; o resto vem do main.css.
   ========================================================= */

/* nav: só 4 âncoras, cabe por mais tempo antes do hambúrguer */
@media (max-width: 1140px) and (min-width: 1025px) {
  .lp-unimed .nav__links, .lp-unimed .nav__cta { display: flex; }
  .lp-unimed .nav__burger { display: none; }
}

/* ---------- Hero: fachada da Quintino + selo Unimed ---------- */
.lp-hero__media { position: relative; max-width: 500px; margin-inline: auto; width: 100%; }
.lp-hero__frame { border-radius: var(--r-xl); padding: 6px; background: var(--grad-marca); box-shadow: 0 30px 60px rgba(46,42,57,.14); }
.lp-hero__frame img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; object-position: 50% 30%; border-radius: calc(var(--r-xl) - 6px); display: block; }
.lp-hero__media .hero__peek { left: auto; right: -30px; bottom: -34px; width: 140px; }
.lp-badge {
  position: absolute; left: -28px; bottom: 44px; z-index: 4; max-width: 300px;
  display: flex; align-items: center; gap: 14px; padding: 14px 18px; text-align: left;
  background: var(--branco); border-radius: var(--r-md); box-shadow: 0 18px 40px rgba(46,42,57,.16);
  animation: bob 6s ease-in-out infinite;
}
.lp-badge img { height: 34px; width: auto; flex-shrink: 0; }
.lp-badge strong { display: block; font: 700 14.5px/1.25 var(--font-body); color: var(--tinta); }
.lp-badge small { display: block; font: 500 12.5px/1.35 var(--font-body); color: var(--tinta-muted); margin-top: 2px; }
@media (max-width: 980px) {
  .lp-hero__media { max-width: 420px; margin-top: 12px; }
  .lp-badge { left: 50%; transform: translateX(-50%); bottom: -30px; width: max-content; max-width: calc(100% - 24px); animation: none; }
  .lp-hero__media .hero__peek { right: -8px; bottom: auto; top: -30px; width: 96px; }
  .lp-hero { padding-bottom: 72px; }
}

@media (max-width: 560px) {
  .lp-hero .eyebrow--lg { font-size: 11.5px; padding: 8px 14px 8px 10px; letter-spacing: .03em; }
}

/* ---------- Identificação ---------- */
/* no celular a arte (que tem ar em cima) vira um recorte quadrado dos personagens */
@media (max-width: 980px) { .lp-unimed .split__art img { max-width: 260px; aspect-ratio: 1; object-fit: cover; object-position: 50% 92%; } }
.lp-pains { display: grid; gap: 12px; margin-top: 22px; text-align: left; }
.lp-pains li {
  display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px;
  background: var(--branco); border-radius: var(--r-md); box-shadow: 0 6px 18px rgba(46,42,57,.05);
  font: 500 15.5px/1.55 var(--font-body); color: var(--tinta);
}
.lp-pains__ic { width: 26px; height: 26px; flex-shrink: 0; margin-top: 1px; }
.lp-pains__ic svg { width: 100%; height: 100%; fill: currentColor; }
.lp-pains li:nth-child(1) .lp-pains__ic { color: var(--rosa); }
.lp-pains li:nth-child(2) .lp-pains__ic { color: var(--azul); }
.lp-pains li:nth-child(3) .lp-pains__ic { color: var(--lilas); }
.lp-pains li:nth-child(4) .lp-pains__ic { color: var(--verde); }
.lp-answer { margin-top: 22px; padding: 26px 28px; border-radius: var(--r-lg); background: var(--lilas); color: #fff; text-align: left; box-shadow: 0 18px 40px rgba(143,100,200,.25); }
.lp-answer__title { font-size: clamp(22px, 2.4vw, 28px); color: #fff; margin-bottom: 8px; }
.lp-answer p { font: 500 15.5px/1.6 var(--font-body); color: rgba(255,255,255,.94); }

/* ---------- Passos (3) ---------- */
.steps--3 { grid-template-columns: repeat(3, 1fr); max-width: 980px; margin-inline: auto; }
@media (max-width: 760px) { .steps--3 { grid-template-columns: 1fr; row-gap: 32px; } }

/* ---------- Especialidades: card com link direto no WhatsApp ---------- */
.lp-specs .spec { gap: 10px; }
.lp-specs .spec__tagline { margin-top: 6px; padding-top: 0; }
.lp-specs .spec__text { flex: 1; }
.spec__link { font: 700 14.5px/1.3 var(--font-body); text-decoration: none; margin-top: 4px; align-self: flex-start; }
.spec__link:hover { text-decoration: underline; }
.spec--azul .spec__link { color: var(--azul-ink); }
.spec--rosa .spec__link { color: var(--rosa-ink); }
.spec--lilas .spec__link { color: var(--lilas-ink); }
.spec--verde .spec__link { color: var(--verde-ink); }
.spec--amarelo .spec__link { color: var(--amarelo-ink); }

/* ---------- Faixa de CTA no meio ---------- */
.lp-band {
  margin-top: clamp(44px, 6vw, 64px); display: grid; grid-template-columns: 1.4fr auto; gap: 28px; align-items: center;
  padding: clamp(30px, 5vw, 52px); border-radius: var(--r-xl); background: var(--grad-marca); color: #fff;
  box-shadow: 0 24px 50px rgba(143,100,200,.22);
}
.lp-band__title { color: #fff; font-size: clamp(26px, 3.4vw, 40px); line-height: 1.08; }
.lp-band__text { margin-top: 10px; font: 500 16.5px/1.6 var(--font-body); color: rgba(255,255,255,.95); }
.lp-band .btn--white { color: var(--lilas-ink); }
@media (max-width: 780px) { .lp-band { grid-template-columns: 1fr; text-align: center; } .lp-band .btn { justify-self: center; } }

/* ---------- Unidades: abas Quintino | Casa ABA ---------- */
.lp-unit-panel__lede { max-width: 760px; margin: 0 auto clamp(24px, 3vw, 36px); text-align: center; font: 500 clamp(15.5px, 1.4vw, 17px)/1.65 var(--font-body); color: var(--tinta-muted); }

/* ---------- Unidade: fotos reais ---------- */
.lp-photos { display: grid; grid-template-columns: 1.5fr 1fr 1fr; grid-template-rows: repeat(2, clamp(140px, 16vw, 210px)); gap: 14px; margin-bottom: clamp(32px, 4vw, 48px); }
.lp-photos__item { overflow: hidden; border-radius: var(--r-lg); box-shadow: 0 12px 30px rgba(46,42,57,.08); }
.lp-photos__item--big { grid-row: span 2; }
.lp-photos__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-gentle); }
.lp-photos__item:hover img { transform: scale(1.04); }
@media (max-width: 760px) {
  .lp-photos { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 140px; }
  .lp-photos__item--big { grid-column: 1 / -1; grid-row: auto; }
}
.lp-unit .checklist { margin-top: 0; }
.lp-unit__map { margin-top: 22px; aspect-ratio: 16 / 9; }
.lp-unit .info-card .btn { justify-self: start; }
@media (max-width: 860px) { .lp-unit .info-card .btn { justify-self: stretch; } }

/* ---------- Guia em sanfona ---------- */
.lp-guide .faq__q { justify-content: flex-start; }
.lp-guide .faq__chevron { margin-left: auto; }
.lp-guide__n {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center;
  font: 400 17px/1 var(--font-display); color: #fff; background: var(--lilas);
}
.lp-guide .faq__item:nth-child(2) .lp-guide__n { background: var(--azul); }
.lp-guide .faq__item:nth-child(3) .lp-guide__n { background: var(--rosa); }
.lp-guide .faq__item:nth-child(4) .lp-guide__n { background: var(--verde); }
.lp-guide .faq__item:nth-child(5) .lp-guide__n { background: var(--amarelo); color: var(--tinta); }
.lp-guide .faq__item:nth-child(6) .lp-guide__n { background: var(--azul-ink); }
.lp-guide .faq__a p + p { margin-top: 12px; }
.lp-note { margin-top: 16px; padding: 16px 18px; border-radius: var(--r-md); background: var(--branco); font-size: 15px; }
.lp-note strong { color: var(--azul-ink); }
.lp-list { margin-top: 12px; display: grid; gap: 8px; }
.lp-list li { position: relative; padding-left: 22px; }
.lp-list li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--lilas); }
.lp-inline-cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;
  margin-top: 18px; padding: 16px 18px; border-radius: var(--r-md); background: var(--branco);
}
.lp-inline-cta p { font: 700 15.5px/1.4 var(--font-body); color: var(--lilas-ink); }
.lp-inline-cta .btn { padding: 11px 20px; font-size: 14.5px; }

/* ---------- WhatsApp: botão flutuante no desktop, barra fixa no celular ---------- */
.lp-bar { display: none; }
@media (max-width: 700px) {
  .lp-wpp { display: none; }
  .lp-bar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,.96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 -6px 24px rgba(46,42,57,.1);
  }
  .lp-bar .btn { width: 100%; justify-content: center; padding: 15px 12px; font-size: 14.5px; white-space: nowrap; }
  .lp-unimed .footer { padding-bottom: 96px; }
  .lp-unimed .cookies { bottom: 84px; }
}

@media (prefers-reduced-motion: reduce) { .lp-badge { animation: none; } }
.calm .lp-badge { animation: none !important; }
