/* ==========================================================================
   SEÇÕES — layout específico de cada bloco da landing e da página de obrigado
   ========================================================================== */

/* ---------- HERO ---------- */
.hero {
  min-height: 100svh; display: flex; align-items: center;
  padding-block: calc(var(--header-h) + var(--sp-7)) var(--sp-8);
  background:
    radial-gradient(60rem 40rem at 85% 20%, rgb(107 45 107 / 0.75), transparent 60%),
    radial-gradient(40rem 30rem at 0% 100%, rgb(203 113 105 / 0.22), transparent 60%),
    var(--plum);
  color: var(--cream); overflow: hidden; position: relative;
}
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr);  gap: var(--sp-7); align-items: center; }
.hero__copy { display: grid; gap: var(--sp-5); justify-items: start; position: relative; z-index: 1; }
.hero h1 .accent { color: var(--amber); }
.hero h1 .line { display: block; overflow: hidden; padding-bottom: 0.08em; }
.hero__sub { max-width: 34rem; color: rgb(246 241 241 / 0.85); }
.hero__meta { padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-5); font-size: var(--fs-sm); color: rgb(246 241 241 / 0.78); }
.hero__meta li { display: inline-flex; align-items: center; gap: var(--sp-2); list-style: none; }
.hero__meta svg { width: 1.1rem; height: 1.1rem; color: var(--amber); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-4); margin-top: var(--sp-3); }

.hero__visual { position: relative; display: grid; place-items: center; }
.hero__seal { width: min(78%, 26rem); filter: drop-shadow(0 30px 40px rgb(0 0 0 / 0.45)); will-change: transform; }
.hero__ring {
  position: absolute; width: min(100%, 34rem); aspect-ratio: 1; border-radius: 50%;
  border: 1px dashed rgb(230 172 84 / 0.45);
}
.hero__ring--2 { width: min(82%, 28rem); border-color: rgb(139 170 151 / 0.4); border-style: solid; }
.hero__number {
  position: absolute; right: -2%; bottom: -4%; z-index: -1;
  font-family: var(--font-title); font-weight: 800; font-size: clamp(9rem, 28vw, 22rem); line-height: 0.8;
  color: transparent; -webkit-text-stroke: 2px rgb(246 241 241 / 0.1); user-select: none;
}
@media (min-width: 62em) {
  .hero__grid { grid-template-columns: 1.15fr 0.85fr; }
}

/* ---------- SOBRE / CREDIBILIDADE ---------- */
.about__grid { display: grid; grid-template-columns: minmax(0, 1fr);  gap: var(--sp-7); }
.about__text { display: grid; gap: var(--sp-4); }
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
.stat { padding: var(--sp-5); border-radius: var(--radius); background: #fff; border: 1px solid var(--cream-200); box-shadow: var(--shadow-sm); }
.stat__num { font-family: var(--font-title); font-weight: 800; font-size: clamp(2rem, 1.4rem + 2.5vw, 3.25rem); color: var(--plum); line-height: 1; }
.stat__num span { color: var(--coral); }
.stat__label { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--text-soft); }
.stat:nth-child(2) { border-top: 4px solid var(--sage); }
.stat:nth-child(3) { border-top: 4px solid var(--amber); }
.stat:nth-child(1) { border-top: 4px solid var(--coral); }
.stat:nth-child(4) { border-top: 4px solid var(--plum); }
@media (min-width: 62em) { .about__grid { grid-template-columns: 1fr 1fr; align-items: center; gap: var(--sp-9); } }

/* ---------- PALESTRANTES ---------- */
.speakers { background: var(--plum); color: var(--cream); }
.speakers__grid { display: grid; gap: var(--sp-5); grid-template-columns: repeat(1, minmax(0, 1fr)); }
@media (min-width: 30em)  { .speakers__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 62em)  { .speakers__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-6); } }
@media (min-width: 80em)  { .speakers__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.speakers__note { margin-top: var(--sp-7); text-align: center; color: rgb(246 241 241 / 0.7); font-size: var(--fs-sm); }

/* ---------- PRODUTO ---------- */
.product { background: var(--cream-200); }
.product__card {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); padding: clamp(1.5rem, 1rem + 3vw, 3.5rem);
  border-radius: var(--radius-lg); background: var(--plum); color: var(--cream);
  position: relative; overflow: hidden; box-shadow: var(--shadow-lg);
}
.product__card::before {
  content: ""; position: absolute; inset: auto -10% -40% auto; width: 28rem; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgb(230 172 84 / 0.28), transparent 65%);
}
.product__card .lead { color: rgb(246 241 241 / 0.85); }
.product__copy { display: grid; gap: var(--sp-4); justify-items: start; position: relative; }
.product__list { display: grid; gap: var(--sp-3); padding: 0; margin: 0; list-style: none; }
.product__list li { display: flex; gap: var(--sp-3); align-items: flex-start; }
.product__list svg { flex: none; width: 1.3rem; height: 1.3rem; margin-top: 0.25rem; color: var(--sage); }
.product__badge { position: relative; display: grid; place-items: center; }
.product__badge img { width: min(60%, 14rem); filter: drop-shadow(0 20px 30px rgb(0 0 0 / 0.4)); }
.product__tag { display: inline-block; padding: 0.35em 0.9em; border-radius: var(--radius-pill); background: var(--amber); color: var(--plum); font-family: var(--font-sub); font-weight: 700; font-size: var(--fs-xs); letter-spacing: 0.1em; text-transform: uppercase; }
@media (min-width: 62em) { .product__card { grid-template-columns: 1.4fr 0.6fr; align-items: center; } }

/* ---------- CTA ---------- */
.cta { background: linear-gradient(135deg, var(--coral), var(--coral-600)); color: var(--plum); text-align: center; overflow: hidden; }
.cta__inner { display: grid; gap: var(--sp-5); justify-items: center; max-width: 46rem; margin-inline: auto; }
.cta h2 { color: var(--cream); }
.cta p { color: var(--plum); font-weight: 600; font-size: var(--fs-lg); }
.cta .btn { --btn-bg: var(--plum); --btn-fg: var(--cream); --btn-bg-hover: var(--amber); box-shadow: var(--shadow); }
.cta .btn:hover { color: var(--plum); }

/* ---------- FORMULÁRIO ---------- */
.signup__grid { display: grid; grid-template-columns: minmax(0, 1fr);  gap: var(--sp-7); align-items: start; }
.signup__intro { display: grid; gap: var(--sp-4); }
.signup__perks { display: grid; gap: var(--sp-3); padding: 0; margin: var(--sp-3) 0 0; list-style: none; }
.signup__perks li { display: flex; gap: var(--sp-3); align-items: center; font-weight: 600; }
.signup__perks svg { flex: none; width: 1.4rem; height: 1.4rem; color: var(--sage); }
.form-card {
  display: grid; gap: var(--sp-5); padding: clamp(1.5rem, 1rem + 2.5vw, 2.75rem);
  background: var(--cream); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  color: var(--ink); border-top: 6px solid var(--amber);
}
.form-card h3 { color: var(--plum); }
.form-card .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* honeypot anti-spam */
.form-note { font-size: var(--fs-xs); color: var(--text-soft); text-align: center; }
.form-status { min-height: 1.4em; text-align: center; font-weight: 600; font-size: var(--fs-sm); color: #b3261e; }
@media (min-width: 62em) { .signup__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-9); } }

/* ---------- FAQ ---------- */
.faq__wrap { max-width: 52rem; margin-inline: auto; }

/* ---------- RODAPÉ ---------- */
.footer { background: var(--plum-900); color: rgb(246 241 241 / 0.8); padding-block: var(--sp-8) var(--sp-5); font-size: var(--fs-sm); }
.footer__grid { display: grid; grid-template-columns: minmax(0, 1fr);  gap: var(--sp-7); }
.footer__brand { display: grid; gap: var(--sp-4); justify-items: start; max-width: 22rem; }
.footer__brand img { width: 5rem; }
.footer h4 { font-family: var(--font-sub); font-weight: 700; font-size: var(--fs-sm); letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); margin-bottom: var(--sp-4); }
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.footer a { text-decoration: none; transition: color var(--t-fast); }
.footer a:hover { color: var(--amber); }
.social { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.social a {
  width: 2.75rem; height: 2.75rem; display: grid; place-items: center; border-radius: 50%;
  border: 1px solid rgb(246 241 241 / 0.25); transition: background var(--t), color var(--t), transform var(--t) var(--ease);
}
.social a:hover { background: var(--amber); color: var(--plum); transform: translateY(-3px); }
.social svg { width: 1.25rem; height: 1.25rem; }
.footer__bottom { margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid rgb(246 241 241 / 0.12); text-align: center; font-size: var(--fs-xs); }
@media (min-width: 48em) { .footer__grid { grid-template-columns: 1.4fr 1fr 1fr; } }

/* ---------- PÁGINA DE OBRIGADO ---------- */
.thanks {
  min-height: 100svh; display: grid; place-items: center; text-align: center;
  padding: var(--sp-8) var(--gutter);
  background:
    radial-gradient(50rem 32rem at 50% 0%, rgb(107 45 107 / 0.8), transparent 65%),
    var(--plum);
  color: var(--cream); overflow: hidden;
}
.thanks__inner { display: grid; gap: var(--sp-5); justify-items: center; max-width: 44rem; }
.thanks__seal { width: clamp(7rem, 20vw, 10rem); filter: drop-shadow(0 20px 30px rgb(0 0 0 / 0.4)); }
.thanks h1 { font-size: clamp(2.2rem, 1.4rem + 4vw, 4rem); }
.thanks h1 .accent { color: var(--amber); }
.thanks__card {
  padding: var(--sp-6); border-radius: var(--radius-lg); background: rgb(246 241 241 / 0.07);
  border: 1px solid rgb(230 172 84 / 0.3); display: grid; gap: var(--sp-4); justify-items: center;
}
.thanks__card h2 { font-size: var(--fs-h3); color: var(--amber); }
.thanks__card p { color: rgb(246 241 241 / 0.88); }
.thanks .btn { --btn-bg: var(--amber); --btn-fg: var(--plum); --btn-bg-hover: var(--cream); }
.thanks .btn:hover { color: var(--plum); }
.thanks__back { color: rgb(246 241 241 / 0.7); font-size: var(--fs-sm); }

/* Contraste em fundos escuros fora de .section--dark */
.speakers .lead, .thanks .lead { color: rgb(246 241 241 / 0.82); }
.speakers .eyebrow, .thanks .eyebrow { color: var(--amber); }

/* ---------- IDEALIZADORA ---------- */
.founder { background: var(--cream-200); overflow: hidden; }
.founder__grid { display: grid; grid-template-columns: minmax(0, 1fr);  gap: var(--sp-7); align-items: center; }
.founder__photo { position: relative; margin: 0; max-width: 28rem; justify-self: center; width: 100%; }
.founder__photo::before { /* moldura deslocada na cor da marca */
  content: ""; position: absolute; inset: 1.25rem -1.25rem -1.25rem 1.25rem;
  border-radius: var(--radius-lg); background: var(--plum); z-index: 0;
}
.founder__photo::after { /* detalhe âmbar */
  content: ""; position: absolute; width: 38%; height: 38%; left: -1rem; top: -1rem;
  border-left: 4px solid var(--amber); border-top: 4px solid var(--amber); border-top-left-radius: var(--radius-lg); z-index: 2; pointer-events: none;
}
.founder__photo > img:first-child {
  position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 55% 30%;
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
}
.founder__seal { position: absolute; z-index: 3; right: -1.5rem; bottom: -1.75rem; width: clamp(5rem, 16vw, 7.5rem); filter: drop-shadow(0 14px 18px rgb(0 0 0 / 0.35)); }
.founder__text { display: grid; gap: var(--sp-4); justify-items: start; }
.founder__text h2 { color: var(--plum); }
.founder__roles { display: flex; flex-wrap: wrap; gap: var(--sp-2); padding: 0; margin: 0; list-style: none; }
.founder__roles li {
  padding: 0.4em 1em; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 700;
  background: var(--plum); color: var(--cream); letter-spacing: 0.02em;
}
.founder__roles li:nth-child(2) { background: var(--sage); color: var(--plum); }
.founder__roles li:nth-child(3) { background: var(--amber); color: var(--plum); }
.founder__text .lead { color: var(--plum); font-weight: 600; }
@media (min-width: 62em) { .founder__grid { grid-template-columns: 0.8fr 1.2fr; gap: var(--sp-9); } }

/* ==========================================================================
   RESPONSIVO — MOBILE-FIRST (W3C): Viewport + Media Queries + Flexbox/Grid
   Breakpoints:  base < 30em (celular) · 30em (celular grande) · 48em (tablet)
                 62em (desktop) · 80em (desktop largo)
   Os trechos min-width acima ampliam o layout; os blocos abaixo refinam o mobile.
   ========================================================================== */

/* Filhos de grid/flex podem encolher (evita estouro horizontal por palavras longas) */
.about__text, .founder__text, .hero__copy, .signup__intro, .product__copy, .footer__brand,
.thanks__inner, .section__head, .form-card { min-width: 0; }

/* ---------- Celulares (até 47.99em) ---------- */
@media (max-width: 47.99em) {
  .hero { min-height: auto; padding-block: calc(var(--header-h) + var(--sp-6)) var(--sp-7); }
  .hero__grid { gap: var(--sp-6); }
  .hero__visual { order: -1; max-height: 13rem; margin-top: var(--sp-2); }      /* selo vem antes do texto */
  .hero__seal { width: 9.5rem; }
  .hero__ring { width: 13rem; }
  .hero__ring--2 { width: 11rem; }
  .hero__number { display: none; }
  .hero__actions { width: 100%; flex-direction: column; align-items: stretch; }
  .hero__actions .btn { width: 100%; }
  .hero__sub { font-size: var(--fs-base); }

  .section__head { margin-bottom: var(--sp-6); }
  .founder__photo { max-width: 20rem; margin-bottom: var(--sp-5); }
  .founder__photo::before { inset: 0.875rem -0.875rem -0.875rem 0.875rem; }
  .product__badge { display: none; }
  .cta .btn, .product__copy .btn, .form-card .btn { width: 100%; }
  .form-card { border-radius: var(--radius); }
  .acc-trigger { padding: var(--sp-4); font-size: var(--fs-base); }
  .acc-panel p { padding: 0 var(--sp-4) var(--sp-4); }
  .footer__grid { gap: var(--sp-6); }
}

/* ---------- Celulares pequenos (até 29.99em) ---------- */
@media (max-width: 29.99em) {
  .stats { grid-template-columns: minmax(0, 1fr); }
  .stat { padding: var(--sp-4); }
  .hero__meta { flex-direction: column; gap: var(--sp-2); }
  .eyebrow { font-size: var(--fs-xs); letter-spacing: 0.1em; }
  .eyebrow::before { width: 1.5rem; }
  .header__brand span { font-size: 0.8125rem; }
}

/* ---------- Tablets (48em – 61.99em) ---------- */
@media (min-width: 48em) and (max-width: 61.99em) {
  .hero__visual { max-height: 22rem; }
  .founder__grid { grid-template-columns: 0.7fr 1.3fr; gap: var(--sp-7); }
  .signup__grid { gap: var(--sp-7); }
}

/* ---------- Celular na horizontal (pouca altura) ---------- */
@media (orientation: landscape) and (max-height: 32em) {
  .hero { min-height: auto; padding-block: calc(var(--header-h) + var(--sp-5)) var(--sp-6); }
  .thanks { min-height: auto; padding-block: var(--sp-7); }
}

/* ---------- Dispositivos de toque: alvos ≥ 44px e feedback sem hover ---------- */
@media (pointer: coarse) {
  .btn, .nav a, .acc-trigger, .social a { min-height: 2.75rem; }
  .footer ul { gap: 0; }
  .footer ul a { display: inline-flex; align-items: center; min-height: 2.75rem; }
  .header__brand { min-height: 2.75rem; }
  .btn:active { transform: scale(0.97); }
}

/* Recortes de tela (notch) e barras do sistema */
@supports (padding: max(0px)) {
  .footer { padding-bottom: max(var(--sp-5), env(safe-area-inset-bottom)); }
  .header { padding-top: env(safe-area-inset-top); height: calc(var(--header-h) + env(safe-area-inset-top)); }
}
