/* =================================================================
   SCULPTEE � landing.css
   Estilos das landing pages de procedimento (formato LP de convers�o).
   Importar SEMPRE depois de base.css.
   ================================================================= */

/* LP usa header minimalista (logo + CTA), sem navega��o completa. */
.lp-header { position: fixed; inset: 0 0 auto 0; z-index: 100; padding: 16px 0; transition: background .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease); }
.lp-header .container { display: flex; align-items: center; justify-content: space-between; }
.lp-header.scrolled { background: rgba(255,249,242,.92); backdrop-filter: blur(14px); box-shadow: 0 1px 0 var(--line); }
.lp-header .brand { color: var(--white); font-size: 1.35rem; }
.lp-header.scrolled .brand { color: var(--ink); }

/* --------------------------- LP Hero ---------------------------- */
.lp-hero { position: relative; background: var(--bg-deep); color: var(--on-deep); padding-top: clamp(110px, 14vw, 150px); padding-bottom: clamp(56px, 8vw, 96px); overflow: hidden; }
.lp-hero__media { position: absolute; inset: 0; }
.lp-hero__media img { width: 100%; height: 100%; object-fit: cover; opacity: .42; }
.lp-hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, rgba(70,62,52,.92) 0%, rgba(70,62,52,.6) 55%, rgba(70,62,52,.35) 100%); }
.lp-hero .container { position: relative; z-index: 2; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(36px, 5vw, 72px); align-items: center; }
.lp-hero .eyebrow { color: var(--gold-soft); margin-bottom: 22px; }
.lp-hero h1 { color: var(--white); font-size: clamp(2.3rem, 4.6vw, 3.8rem); }
.lp-hero h1 em { font-style: italic; color: var(--gold-soft); }
.lp-hero__sub { color: rgba(237,231,220,.85); font-size: clamp(1.02rem, 1.5vw, 1.2rem); margin-top: 22px; max-width: 48ch; }
.lp-hero__bullets { display: grid; gap: 12px; margin-top: 28px; }
.lp-hero__bullets li { display: flex; gap: 12px; align-items: flex-start; color: rgba(237,231,220,.9); font-size: .98rem; }
.lp-hero__bullets li::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 3px; border-radius: 50%; background: var(--gold); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat; }

/* Card de formul�rio em destaque no hero */
.lp-form-card {
  background: rgba(255,249,242,.97);
  color: var(--ink);
  border-radius: 8px;
  padding: clamp(28px, 3vw, 38px);
  border: 1px solid rgba(43,39,35,.08);
  box-shadow: 0 34px 70px -38px rgba(33,30,26,.42);
}
.lp-form-card h3 { font-size: clamp(1.5rem, 2.2vw, 1.8rem); margin-bottom: 10px; }
.lp-form-card .form-intro { font-size: .95rem; color: var(--ink-soft); margin-bottom: 24px; line-height: 1.7; }
.lp-form-card .lead-form { gap: 16px; }
.lp-form-card .lead-form .field { gap: 8px; }
.lp-form-card .lead-form label {
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold);
}
.lp-form-card .lead-form input,
.lp-form-card .lead-form select,
.lp-form-card .lead-form textarea {
  width: 100%;
  min-height: 56px;
  padding: 16px 18px;
  background: rgba(242,236,227,.74);
  border: 1px solid rgba(140,123,104,.24);
  border-radius: 6px;
  color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.46);
  transition: border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.lp-form-card .lead-form input::placeholder,
.lp-form-card .lead-form textarea::placeholder { color: rgba(86,80,74,.56); }
.lp-form-card .lead-form input:focus,
.lp-form-card .lead-form select:focus,
.lp-form-card .lead-form textarea:focus {
  outline: none;
  border-color: rgba(140,123,104,.75);
  background: var(--white);
  box-shadow: 0 0 0 4px rgba(140,123,104,.12);
}
.lp-form-card .lead-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(43,39,35,.75) 50%),
    linear-gradient(135deg, rgba(43,39,35,.75) 50%, transparent 50%);
  background-position:
    calc(100% - 20px) calc(50% - 2px),
    calc(100% - 14px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 42px;
}
.lp-form-card .trust {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
  font-size: .76rem;
  color: var(--muted);
  line-height: 1.6;
}

/* --------------------------- Dores ------------------------------ */
.pain-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.pain { display: flex; gap: 14px; padding: 22px; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); }
.pain__icon { flex: none; width: 30px; height: 30px; color: var(--gold); }
.pain p { font-size: .96rem; color: var(--ink-soft); margin: 0; }
.pain strong { color: var(--ink); font-weight: 500; }

/* --------------------------- Benef�cios ------------------------- */
.benefit { padding: 28px; background: var(--bg-alt); border-radius: var(--radius); border: 1px solid var(--line); }
.benefit__icon { width: 38px; height: 38px; color: var(--gold); margin-bottom: 16px; }
.benefit h3 { font-size: 1.25rem; margin-bottom: 8px; }
.benefit p { font-size: .92rem; }

/* --------------------------- Passos ----------------------------- */
.steps { counter-reset: step; display: grid; gap: 0; }
.step { display: grid; grid-template-columns: 90px 1fr; gap: 24px; padding: 28px 0; border-top: 1px solid var(--line-light); }
.step:last-child { border-bottom: 1px solid var(--line-light); }
.step__num { counter-increment: step; font-family: var(--font-display); font-size: 2.6rem; color: var(--gold-soft); line-height: 1; }
.step__num::before { content: "0" counter(step); }
.step h3 { margin-bottom: 8px; }

/* ------------------------- Antes & depois ----------------------- */
.ba-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ba { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--bg); }
.ba__imgs { display: grid; grid-template-columns: 1fr 1fr; }
.ba__imgs .media-ph { aspect-ratio: 3/4; border: 0; border-right: 1px solid var(--line); }
.ba__imgs .media-ph:last-child { border-right: 0; }
.ba__tag { position: absolute; top: 10px; left: 10px; z-index: 2; background: rgba(33,30,26,.8); color: #fff; font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; padding: 4px 8px; border-radius: 2px; }
.ba__imgs > div { position: relative; }
.ba__caption { padding: 16px 18px; font-size: .86rem; color: var(--ink-soft); }
.ba-disclaimer { font-size: .76rem; color: var(--muted); text-align: center; margin-top: 24px; }

/* --------------------------- FAQ -------------------------------- */
.faq { max-width: 820px; margin-inline: auto; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; text-align: left; background: none; border: 0; cursor: pointer; padding: 24px 0; font-family: var(--font-display); font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: var(--ink); }
.faq-q .icon { flex: none; width: 22px; height: 22px; position: relative; }
.faq-q .icon::before, .faq-q .icon::after { content: ""; position: absolute; inset: 0; margin: auto; background: var(--gold); transition: transform .3s var(--ease); }
.faq-q .icon::before { width: 100%; height: 1.5px; }
.faq-q .icon::after { width: 1.5px; height: 100%; }
.faq-item.open .faq-q .icon::after { transform: scaleY(0); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .4s var(--ease); }
.faq-item.open .faq-a { max-height: 400px; }
.faq-a p { padding-bottom: 24px; font-size: .98rem; }

/* ---------------------- Autoridade (doutora) -------------------- */
.authority { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.authority .media-ph, .authority .media { aspect-ratio: 4/5; }
.authority__creds { display: grid; gap: 10px; margin-top: 22px; }
.authority__creds li { display: flex; gap: 12px; font-size: .94rem; color: rgba(237,231,220,.8); }
.authority__creds li::before { content: ""; flex: none; width: 16px; height: 16px; margin-top: 3px; background: var(--gold); border-radius: 50%; }

/* --------------------------- CTA final -------------------------- */
.lp-final { text-align: center; }
.lp-final .lead-form {
  max-width: 560px;
  margin: 36px auto 0;
  text-align: left;
  background: rgba(255,249,242,.96);
  border: 1px solid rgba(228,221,210,.24);
  border-radius: 8px;
  padding: clamp(24px, 3vw, 34px);
  box-shadow: 0 28px 60px -34px rgba(20,18,16,.38);
}
.lp-final h2 { max-width: 20ch; margin-inline: auto; }
.lp-final .lead-form .field {
  display: grid;
  gap: 8px;
}
.lp-final .lead-form label {
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold);
}
.lp-final .lead-form input,
.lp-final .lead-form select,
.lp-final .lead-form textarea {
  width: 100%;
  min-height: 56px;
  padding: 16px 18px;
  background: rgba(242,236,227,.74);
  border: 1px solid rgba(140,123,104,.24);
  border-radius: 6px;
  color: var(--ink);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.46);
  transition: border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.lp-final .lead-form input::placeholder,
.lp-final .lead-form textarea::placeholder { color: rgba(86,80,74,.56); }
.lp-final .lead-form input:focus,
.lp-final .lead-form select:focus,
.lp-final .lead-form textarea:focus {
  outline: none;
  border-color: rgba(140,123,104,.75);
  background: var(--white);
  box-shadow: 0 0 0 4px rgba(140,123,104,.12);
}
.lp-final .lead-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(43,39,35,.75) 50%),
    linear-gradient(135deg, rgba(43,39,35,.75) 50%, transparent 50%);
  background-position:
    calc(100% - 20px) calc(50% - 2px),
    calc(100% - 14px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 42px;
}
.lp-final .lead-form .btn {
  margin-top: 6px;
}

/* ------------------------ Selos / garantia ---------------------- */
.seals { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(24px, 4vw, 56px); }
.seal { text-align: center; max-width: 200px; }
.seal__icon { width: 44px; height: 44px; color: var(--gold); margin: 0 auto 14px; }
.seal h4 { font-family: var(--font-body); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px; }
.seal p { font-size: .84rem; }

/* --------------------------- Responsivo ------------------------- */
@media (max-width: 900px) {
  .lp-hero .container { grid-template-columns: 1fr; }
  .authority { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .lp-header .container {
    gap: 12px;
    align-items: stretch;
  }
  .lp-header .btn {
    min-width: 0;
    padding-inline: 1.1em;
  }
  .lp-hero {
    padding-top: 104px;
  }
  .lp-hero__media::after {
    background: linear-gradient(180deg, rgba(70,62,52,.88) 0%, rgba(70,62,52,.6) 45%, rgba(70,62,52,.78) 100%);
  }
  .lp-hero h1,
  .lp-hero__sub {
    max-width: none;
  }
  .lp-form-card {
    padding: 22px;
  }
  .lp-form-card .lead-form input,
  .lp-form-card .lead-form select,
  .lp-form-card .lead-form textarea {
    min-height: 52px;
  }
  .lp-final .lead-form {
    padding: 22px;
  }
  .lp-final .lead-form input,
  .lp-final .lead-form select,
  .lp-final .lead-form textarea {
    min-height: 52px;
  }
  .pain-grid { grid-template-columns: 1fr; }
  .ba-grid { grid-template-columns: 1fr; }
  .step { grid-template-columns: 64px 1fr; gap: 16px; }
}
@media (max-width: 560px) {
  .lp-header .container {
    flex-direction: column;
    align-items: stretch;
  }
  .lp-header .brand {
    text-align: center;
  }
  .lp-hero .container {
    gap: 24px;
  }
  .lp-hero__bullets li {
    font-size: .92rem;
  }
  .faq-q {
    padding: 20px 0;
    font-size: 1rem;
  }
  .step {
    grid-template-columns: 52px 1fr;
    gap: 12px;
  }
}