/* ============================================================
   GABRIEL FLORES — Componentes (botões, badges, cards, foto, form)
   ============================================================ */

/* ---------- Botões / CTA ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--font-body); font-weight:600; font-size:1.0625rem;
  padding:1rem 2rem; border-radius:var(--radius-pill);
  cursor:pointer; border:0; text-decoration:none; text-align:center;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{ background:var(--accent); color:#fff; box-shadow:var(--shadow-accent); }
.btn-primary:hover{ background:var(--accent-strong); transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(176,92,41,.40); }
.btn-secondary{ background:transparent; color:var(--brand); border:1.5px solid var(--border-strong); }
.btn-secondary:hover{ border-color:var(--brand); background:var(--surface-alt); }
.btn-lg{ font-size:1.15rem; padding:1.15rem 2.4rem; }
.btn-block{ display:flex; width:100%; }

@keyframes pulse-glow{
  0%   { box-shadow:0 0 0 0 rgba(176,92,41,.45); }
  70%  { box-shadow:0 0 0 16px rgba(176,92,41,0); }
  100% { box-shadow:0 0 0 0 rgba(176,92,41,0); }
}
.btn-pulse{ animation:pulse-glow 2s infinite; }
@media (prefers-reduced-motion:reduce){ .btn-pulse{ animation:none; } html{ scroll-behavior:auto; } }

/* ---------- Badges / selos ---------- */
.badge{ display:inline-flex; align-items:center; flex-wrap:wrap; justify-content:center; gap:.4rem;
  font-size:.8125rem; font-weight:600; padding:.4rem .85rem; border-radius:var(--radius-pill);
  max-width:100%; text-align:center; }
.badge-free{ background:rgba(94,122,82,.13); color:var(--success); }
.badge-accent{ background:rgba(176,92,41,.13); color:var(--accent-strong); }
.badge-soft{ background:var(--surface-alt); color:var(--text-soft); }
.bg-dark .badge-soft{ background:rgba(255,255,255,.1); color:#E7DECF; }

/* ---------- Header ---------- */
.site-header{ position:sticky; top:0; z-index:50;
  background:rgba(238,241,245,.9); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border); }
.site-header .container{ display:flex; align-items:center; justify-content:space-between;
  padding-block:.9rem; }
.logo{ font-family:var(--font-display); font-weight:700; font-size:1.25rem; color:var(--brand);
  text-decoration:none; letter-spacing:-.02em; }
.logo span{ color:var(--accent-strong); }
.site-header .btn{ padding:.6rem 1.3rem; font-size:.95rem; }

/* ---------- Hero ---------- */
.hero{ padding-block:var(--space-7) var(--space-6); text-align:center; }
.hero h1{ margin-inline:auto; max-width:18ch; }
.hero .sub{ font-size:1.2rem; color:var(--text-soft); max-width:54ch; margin:0 auto var(--space-4); }
.hero .micro{ font-size:.875rem; color:var(--text-soft); margin-top:var(--space-2); }
@media (min-width:768px){ .hero .sub{ font-size:1.35rem; } }

/* ---------- Cards ---------- */
.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:var(--space-4); box-shadow:var(--shadow-sm);
  transition:box-shadow .2s ease, border-color .2s ease, transform .2s ease; }
.card:hover{ box-shadow:var(--shadow); border-color:var(--border-strong); transform:translateY(-2px); }
.bg-dark .card{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); }

.grid{ display:grid; gap:var(--space-3); grid-template-columns:1fr; }
.grid > *{ min-width:0; }
@media (min-width:680px){ .grid-2{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:880px){ .grid-3{ grid-template-columns:repeat(3,1fr); } }

/* ---------- Lista de bullets ---------- */
.checklist{ list-style:none; padding:0; margin:0; display:grid; gap:var(--space-3); }
.checklist li{ position:relative; padding-left:2.1rem; }
.checklist li::before{ content:""; position:absolute; left:0; top:3px; width:22px; height:22px;
  background:var(--accent); border-radius:50%;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%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' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/14px no-repeat; }

/* lista de "antes" (x) */
.crosslist{ list-style:none; padding:0; margin:0; display:grid; gap:var(--space-2); }
.crosslist li{ position:relative; padding-left:1.6rem; color:var(--text-soft); }
.crosslist li::before{ content:"✕"; position:absolute; left:0; top:0; color:var(--brick); font-weight:700; }

/* ---------- Foto do mentor ---------- */
.foto-gabriel{ display:block; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  border:6px solid var(--surface); width:100%; max-width:360px; aspect-ratio:4/5;
  object-fit:cover; margin-inline:auto; }
.foto-square{ aspect-ratio:1/1; max-width:300px; }   /* retrato quadrado (headshot) */
.foto-tall{ aspect-ratio:2/3; max-width:340px; }      /* corpo inteiro, sem cortar */
.foto-placeholder{ display:flex; align-items:center; justify-content:center;
  background:var(--surface-alt); color:var(--brand-soft); font-family:var(--font-display);
  font-size:1rem; text-align:center; padding:var(--space-3); }

.mentor{ display:grid; gap:var(--space-4); align-items:center; grid-template-columns:1fr; }
.mentor > *{ min-width:0; }
@media (min-width:780px){ .mentor{ grid-template-columns:340px 1fr; } }

/* ---------- Caixa de preço / oferta ---------- */
.price-box{ background:var(--surface); border:1px solid var(--border-strong);
  border-radius:var(--radius-lg); padding:var(--space-5) var(--space-4);
  box-shadow:var(--shadow); text-align:center; max-width:560px; margin-inline:auto; }
.price-box .old{ color:var(--text-soft); text-decoration:line-through; font-size:1.05rem; }
.price-box .now{ font-family:var(--font-display); font-weight:700; color:var(--brand);
  font-size:2.5rem; line-height:1.1; }
.price-box .now em{ color:var(--accent-strong); font-style:normal; }
.price-box .terms{ color:var(--text-soft); font-size:.95rem; margin-top:.4rem; }

/* ---------- Formulário ---------- */
.lead-form{ display:grid; gap:var(--space-2); max-width:440px; margin-inline:auto; }
.lead-form input{ font-family:var(--font-body); font-size:1rem; padding:.95rem 1.1rem;
  border:1.5px solid var(--border-strong); border-radius:var(--radius); background:var(--surface);
  color:var(--text); width:100%; }
.lead-form input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(176,92,41,.18); }
.lead-form .micro{ font-size:.8125rem; color:var(--text-soft); text-align:center; margin:.3rem 0 0; }
.form-msg{ font-size:.95rem; margin-top:.6rem; text-align:center; min-height:1.2em; }
.form-msg.ok{ color:var(--success); }
.form-msg.err{ color:#b15b3a; }

/* ---------- FAQ ---------- */
.faq details{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:var(--space-3) var(--space-4); margin-bottom:var(--space-2); }
.faq summary{ font-weight:600; cursor:pointer; list-style:none; color:var(--brand);
  font-size:1.08rem; display:flex; justify-content:space-between; gap:1rem; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--accent-strong); font-weight:700; font-size:1.4rem; line-height:1; }
.faq details[open] summary::after{ content:"–"; }
.faq details[open] summary{ margin-bottom:var(--space-2); }

/* ---------- Order bump ---------- */
.bump{ border:2px dashed var(--accent); background:rgba(176,92,41,.06);
  border-radius:var(--radius); padding:var(--space-3); display:flex; gap:.85rem; align-items:flex-start; }
.bump input{ margin-top:.35rem; width:20px; height:20px; accent-color:var(--accent); flex:0 0 auto; }

/* ---------- Eyebrow / seções ---------- */
.eyebrow{ text-transform:uppercase; letter-spacing:.12em; font-size:.8125rem; font-weight:700;
  color:var(--accent-strong); margin-bottom:var(--space-1); }
.bg-dark .eyebrow{ color:var(--accent-glow); }

/* ---------- Depoimento placeholder ---------- */
.quote{ background:var(--surface); border-left:3px solid var(--accent); border-radius:var(--radius);
  padding:var(--space-3) var(--space-4); font-style:italic; color:var(--text-soft); }

/* ---------- Footer ---------- */
.site-footer{ background:var(--brand); color:#D8CFC1; padding-block:var(--space-5); font-size:.9rem; }
.site-footer a{ color:#E7DECF; text-decoration:none; }
.site-footer a:hover{ color:#fff; text-decoration:underline; }
.site-footer .container{ display:flex; flex-wrap:wrap; gap:var(--space-3) var(--space-4);
  justify-content:space-between; align-items:center; }
.site-footer nav{ display:flex; gap:var(--space-3); flex-wrap:wrap; }

/* ---------- Sticky CTA mobile ---------- */
.sticky-cta{ position:fixed; left:0; right:0; bottom:0; z-index:60; padding:.6rem var(--space-3);
  background:rgba(251,249,245,.95); backdrop-filter:blur(10px); border-top:1px solid var(--border);
  display:none; }
.sticky-cta .btn{ width:100%; }
@media (max-width:680px){ .sticky-cta{ display:block; } body{ padding-bottom:5rem; } }

/* ---------- Imagens / mídia ---------- */
.media{ border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  border:6px solid var(--surface); overflow:hidden; }
.media img{ width:100%; height:100%; object-fit:cover; display:block; }
.bg-dark .media{ border-color:rgba(255,255,255,.08); }

/* hero em duas colunas (texto + imagem) */
.hero-split{ display:grid; grid-template-columns:1fr; gap:var(--space-5); align-items:center; text-align:left; }
.hero-split > *{ min-width:0; }
.hero-split .sub{ margin-left:0; }
.hero-split h1{ margin-left:0; }
/* imagem proporcional: altura limitada, centralizada na coluna */
.hero-split .media{ width:100%; max-width:400px; aspect-ratio:4/5; max-height:440px;
  margin-inline:auto; }
@media (min-width:880px){
  .hero-split{ grid-template-columns:1.15fr .85fr; }
  .hero-split .media{ margin-right:0; }
}
@media (max-width:879px){
  .hero-split{ text-align:center; }
  .hero-split h1, .hero-split .sub{ margin-inline:auto; }
  .hero-split .media{ max-width:360px; aspect-ratio:16/11; max-height:300px; }
}

/* faixa de imagem full-width com sobreposição forte (legibilidade garantida) */
.band{ position:relative; display:flex; align-items:center; overflow:hidden;
  background-size:cover; background-position:center; padding-block:var(--space-5); }
.band::after{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(28,25,22,.90) 0%, rgba(28,25,22,.80) 50%, rgba(28,25,22,.60) 100%); }
.band .container{ position:relative; z-index:2; color:#fff; }
.band h2{ color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.55); }
.band p{ color:#F1E9DB; text-shadow:0 1px 10px rgba(0,0,0,.55); margin-bottom:0; }
@media (max-width:680px){ .band::after{ background:rgba(28,25,22,.82); } }

/* faixa-galeria de ambientes */
.ambient-strip{ display:grid; gap:var(--space-3); grid-template-columns:1fr; }
@media (min-width:780px){ .ambient-strip{ grid-template-columns:repeat(3,1fr); } }
.ambient-strip .media{ aspect-ratio:4/3; border-width:4px; }

/* ---------- Comentários do YouTube (prova social) ---------- */
.yt-comment{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:var(--space-3); text-align:left; box-shadow:var(--shadow-sm); }
.yt-head{ display:flex; align-items:center; gap:.6rem; margin-bottom:.6rem; }
.yt-av{ width:34px; height:34px; border-radius:50%; background:var(--brand-soft); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.95rem; flex:0 0 auto; }
.yt-user{ font-weight:600; font-size:.9rem; color:var(--text-soft); }
.yt-comment p{ margin:0; color:var(--text); font-size:.98rem; }

/* utilitários */
.mt-2{ margin-top:var(--space-2); } .mt-4{ margin-top:var(--space-4); }
.mb-4{ margin-bottom:var(--space-4); }
.stack > * + *{ margin-top:var(--space-3); }

/* ---------- Modal de captura ---------- */
.modal-overlay{ position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center;
  background:rgba(24,18,12,.62); backdrop-filter:blur(3px); padding:var(--space-3); }
.modal-overlay.open{ display:flex; animation:modal-fade .18s ease; }
@keyframes modal-fade{ from{ opacity:0 } to{ opacity:1 } }
.modal{ position:relative; width:100%; max-width:440px; background:var(--navy); color:var(--text-on-dark);
  border-radius:var(--radius-lg); padding:var(--space-5) var(--space-4); box-shadow:var(--shadow-lg);
  text-align:center; max-height:92vh; overflow-y:auto; }
.modal h2{ color:#fff; }
.modal .text-soft{ color:#C9D2E0; }
.modal .badge-soft{ background:rgba(255,255,255,.1); color:#E7DECF; }
.modal-close{ position:absolute; top:10px; right:14px; background:none; border:0; color:#C9D2E0;
  font-size:1.9rem; line-height:1; cursor:pointer; padding:0 .3rem; }
.modal-close:hover{ color:#fff; }