/* ========================================================
   Componentes compartilhados das páginas no padrão atual
   (molde: /escaneamento-corporal-3d/). Usar junto com
   landing-base.css e js/landing-motion.js.
   Regras: sem contorno ao redor de cards (só brilho especular
   em cima), sem emoji (ícones Phosphor Light), cores neutras.
   ======================================================== */

.ic { width: 2.4rem; height: 2.4rem; flex-shrink: 0; fill: currentColor; }

/* Vidro especular */
.glass {
  position: relative;
  border: 0;
  border-radius: 2.4rem;
  background: linear-gradient(160deg, rgba(255, 255, 255, .065) 0%, rgba(255, 255, 255, .018) 55%, rgba(121, 58, 236, .035) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    inset 1px 0 0 rgba(255, 255, 255, .045),
    inset -1px 0 0 rgba(255, 255, 255, .02),
    inset 0 -1px 0 rgba(255, 255, 255, .02),
    0 30px 80px -40px rgba(0, 0, 0, .9);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  backdrop-filter: blur(18px) saturate(150%);
}
.glass.spot:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), inset 1px 0 0 rgba(255, 255, 255, .06), 0 30px 80px -36px rgba(81, 69, 229, .45); }
.glass--soft { background: linear-gradient(160deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .01)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
.glass--ours { background: linear-gradient(170deg, rgba(81, 69, 229, .26), rgba(121, 58, 236, .07) 60%, rgba(121, 58, 236, .03)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 40px 100px -40px rgba(81, 69, 229, .7); }

.glass-icon {
  display: inline-grid;
  place-items: center;
  width: 4.8rem;
  height: 4.8rem;
  margin-bottom: 2rem;
  border-radius: 1.4rem;
  color: rgba(200, 192, 255, .95);
  background: linear-gradient(160deg, rgba(81, 69, 229, .28), rgba(121, 58, 236, .08));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 0 30px -8px rgba(121, 58, 236, .55);
}
.glass-icon .ic { width: 2.6rem; height: 2.6rem; }
.card-title { font-size: 1.9rem; font-weight: 500; line-height: 1.35; margin-bottom: 1.2rem; color: var(--text-primary); }
.card-text { font-size: 1.5rem; line-height: 2.4rem; color: var(--text-secondary); }
.card-text strong { color: var(--text-primary); font-weight: 500; }
.card-text + .card-text { margin-top: 1.2rem; }

.pill {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  padding: .7rem 1.6rem;
  border-radius: 10rem;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: rgba(200, 192, 255, .95);
  background: linear-gradient(180deg, rgba(81, 69, 229, .2), rgba(81, 69, 229, .06));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 10px 30px -12px rgba(81, 69, 229, .6);
}
.pill .ic { width: 1.6rem; height: 1.6rem; }

/* Hero das páginas internas */
.pg-hero .hero-title-wrapper { max-width: 120rem; }
.pg-hero .pill { margin-bottom: 3.2rem; }
.pg-hero-eyebrow { grid-row: 1 / 2; place-self: end center; }
.pg-hero .hero-title.is-long { font-size: clamp(3.6rem, 6vw, 7.2rem); line-height: 1.08; }

/* Seções */
.bs-section { position: relative; padding: 10rem var(--gutter-outer); }
.bs-wrap { max-width: var(--container-max); margin: 0 auto; }
.bs-header { text-align: center; margin: 0 auto 6rem; max-width: 96rem; }
.bs-header .feature-subtitle { max-width: 76rem; }
.bs-divider {
  background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, .12) 25%, rgba(180, 170, 255, .32) 50%, rgba(255, 255, 255, .12) 75%, transparent);
  background-size: 100% 1px;
  background-repeat: no-repeat;
  background-position: top center;
}
.bs-glow::after {
  content: "";
  position: absolute;
  top: 20%; left: 50%;
  width: 60%; height: 50%;
  transform: translateX(-50%);
  background:
    radial-gradient(ellipse at 40% 50%, rgba(81, 69, 229, .22) 0%, transparent 60%),
    radial-gradient(ellipse at 60% 50%, rgba(121, 58, 236, .16) 0%, transparent 60%);
  filter: blur(100px);
  z-index: -1;
  pointer-events: none;
}

.bs-grid { display: grid; grid-template-columns: 1fr; gap: 1.6rem; }
@media (min-width: 768px) { .bs-grid--2, .bs-grid--4 { grid-template-columns: repeat(2, 1fr); } .bs-grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .bs-grid--4 { grid-template-columns: repeat(4, 1fr); } }
.bs-card { padding: 3.2rem; }

.bs-step { display: flex; flex-direction: column; padding: 2.8rem; }
.bs-step-num { font-size: 1.2rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(180, 170, 255, .75); margin-bottom: 1.6rem; }

.bs-split { display: grid; grid-template-columns: 1fr; gap: 5.6rem; align-items: center; }
@media (min-width: 1024px) { .bs-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8rem; } .bs-split--rev .bs-split-media { order: -1; } }
.bs-split .feature-title, .bs-split .feature-subtitle { text-align: left; margin-left: 0; }

.bs-checks { list-style: none; display: grid; gap: 1.6rem; margin-top: 3.6rem; }
.bs-checks li { display: grid; grid-template-columns: 2.4rem 1fr; gap: 1.4rem; font-size: 1.6rem; line-height: 2.5rem; color: var(--text-secondary); }
.bs-checks li strong { color: var(--text-primary); font-weight: 500; }
.bs-check {
  display: grid; place-items: center; width: 2.4rem; height: 2.4rem; margin-top: .1rem; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-start), var(--accent-end));
  box-shadow: 0 0 16px rgba(121, 58, 236, .55);
}
.bs-check svg { width: 1.3rem; height: 1.3rem; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.bs-fineprint { max-width: 100rem; margin: 3.2rem auto 0; font-size: 1.3rem; line-height: 2.1rem; color: var(--text-muted); text-align: center; }
.bs-fineprint p + p { margin-top: 1.2rem; }
.bs-fineprint strong { font-weight: 500; color: rgba(255, 255, 255, .72); }
.bs-fineprint a { text-decoration: underline; text-underline-offset: .3rem; text-decoration-color: rgba(255, 255, 255, .3); }

/* FAQ */
.bs-faq { max-width: 88rem; margin: 0 auto; }
.bs-faq details { background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, .1) 20%, rgba(255, 255, 255, .1) 80%, transparent); background-size: 100% 1px; background-repeat: no-repeat; background-position: bottom; }
.bs-faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2.6rem 0; font-size: 1.9rem; font-weight: 400; line-height: 1.4; cursor: pointer; }
.bs-faq summary::-webkit-details-marker { display: none; }
.bs-faq summary .ic { width: 2rem; height: 2rem; color: var(--text-muted); transition: transform .4s var(--ease-out); }
.bs-faq details[open] summary .ic { transform: rotate(45deg); }
.bs-faq .bs-faq-a { padding: 0 0 2.6rem; max-width: 78rem; font-size: 1.6rem; line-height: 2.7rem; color: var(--text-secondary); }
.bs-faq .bs-faq-a strong { color: var(--text-primary); font-weight: 500; }

/* ---------- Comparativo ---------- */

/* Aviso (como ler, recorte, "não afirmamos") */
.pg-note { max-width: 92rem; margin: 0 auto; padding: 2.8rem 3.2rem; display: grid; grid-template-columns: 2.4rem 1fr; gap: 1.6rem; text-align: left; }
.pg-note .ic { color: rgba(200, 192, 255, .9); margin-top: .2rem; }
.pg-note p { font-size: 1.5rem; line-height: 2.5rem; color: var(--text-secondary); }
.pg-note p + p { margin-top: 1.2rem; }
.pg-note strong { color: var(--text-primary); font-weight: 500; }
.pg-note a { text-decoration: underline; text-underline-offset: .3rem; text-decoration-color: rgba(255, 255, 255, .3); }

/* Números lado a lado */
.pg-gap-label { font-size: 1.2rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 2rem; line-height: 1.8rem; }
.pg-gap-row { display: flex; align-items: baseline; justify-content: space-between; gap: 1.6rem; padding: 1.2rem 0; }
.pg-gap-row + .pg-gap-row { background-image: linear-gradient(90deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); background-size: 100% 1px; background-repeat: no-repeat; background-position: top; }
.pg-gap-who { font-size: 1.4rem; color: var(--text-secondary); }
.pg-gap-val { font-size: 1.8rem; font-weight: 400; text-align: right; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.pg-gap-val.is-ours { font-size: 2.8rem; font-weight: 300; letter-spacing: -.02em; background: linear-gradient(135deg, #8a80ff, #b39dff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pg-gap-val.is-ours.sm { font-size: 2rem; }

/* Diferença: Premium Coach x concorrente dentro do mesmo card */
.pg-diff { display: flex; flex-direction: column; padding: 3.2rem; }
.pg-diff-row { padding: 1.6rem 0 0; font-size: 1.5rem; line-height: 2.4rem; color: var(--text-secondary); }
.pg-diff-row strong { color: var(--text-primary); font-weight: 500; }
.pg-diff-row + .pg-diff-row { margin-top: 1.6rem; background-image: linear-gradient(90deg, rgba(255, 255, 255, .08), transparent); background-size: 100% 1px; background-repeat: no-repeat; background-position: top; }
.pg-who { display: block; margin-bottom: .6rem; font-size: 1.1rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.pg-who.is-ours { color: rgba(180, 170, 255, .9); }

/* Tabela */
.pg-table-wrap { max-width: 110rem; margin: 0 auto; padding: .8rem 0; overflow-x: auto; }
.pg-table { width: 100%; border-collapse: collapse; font-size: 1.5rem; line-height: 2.2rem; }
.pg-table th, .pg-table td { padding: 1.6rem 2.4rem; text-align: left; vertical-align: top; }
.pg-table thead th { font-size: 1.2rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.pg-table thead th.is-ours { color: rgba(180, 170, 255, .9); }
.pg-table tbody tr { background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07) 10%, rgba(255, 255, 255, .07) 90%, transparent); background-size: 100% 1px; background-repeat: no-repeat; background-position: top; }
.pg-table td { color: var(--text-secondary); }
.pg-table td:first-child { color: var(--text-primary); }
.pg-table .pg-cat td { padding-top: 3.2rem; font-size: 1.2rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(180, 170, 255, .75); background: none; }
.pg-table .check { color: rgba(200, 192, 255, .95); font-weight: 500; }
.pg-table .na { color: var(--text-muted); font-style: italic; }
.pg-table .partial { color: var(--text-secondary); }
@media (max-width: 767px) { .pg-table th, .pg-table td { padding: 1.2rem 1.2rem; font-size: 1.3rem; line-height: 1.9rem; } }

/* Avaliações negativas (recorte declarado) */
.pg-reviews { display: grid; grid-template-columns: 1fr; gap: 1.6rem; align-items: start; }
@media (min-width: 1024px) { .pg-reviews { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 2.4rem; } }
.pg-reviews-col-title { display: block; margin-bottom: 1.6rem; font-size: 1.2rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.pg-reviews-col-title.is-ours { color: rgba(180, 170, 255, .9); }
.pg-review-list { display: grid; grid-template-columns: 1fr; gap: 1.6rem; }
@media (min-width: 768px) { .pg-review-list { grid-template-columns: repeat(2, 1fr); } }
.pg-review { padding: 2.8rem; }
.pg-review-tag { display: inline-block; margin-bottom: 1.4rem; padding: .3rem 1rem; border-radius: 10rem; font-size: 1.1rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .7); background: rgba(255, 255, 255, .07); }
.pg-review-tag sup { font-size: .9em; margin-left: .2rem; color: rgba(200, 192, 255, .9); }
.pg-review-quote { margin-top: 1.2rem; font-size: 1.5rem; line-height: 2.4rem; color: var(--text-secondary); font-style: italic; }
.pg-review-quote cite { display: block; margin-top: 1.4rem; font-size: 1.25rem; font-style: normal; color: var(--text-muted); }
.pg-review-empty { padding: 3.2rem; text-align: center; }
.pg-review-empty b { display: block; font-size: 5.6rem; font-weight: 300; line-height: 1; letter-spacing: -.04em; background: linear-gradient(135deg, #8a80ff, #b39dff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pg-review-empty span { display: block; margin-top: 1.2rem; font-size: 1.4rem; line-height: 2.2rem; color: var(--text-secondary); }

/* Lista simples (o que dá para trazer, planos, o que fica para trás) */
.pg-rows { max-width: 100rem; margin: 0 auto; padding: 1.2rem 3.2rem; }
.pg-row { display: grid; grid-template-columns: 1fr; gap: .6rem; padding: 2.2rem 0; background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, .08) 20%, rgba(255, 255, 255, .08) 80%, transparent); background-size: 100% 1px; background-repeat: no-repeat; background-position: bottom; }
.pg-row:last-child { background-image: none; }
@media (min-width: 768px) { .pg-row { grid-template-columns: 24rem 1fr; gap: 3.2rem; align-items: baseline; } .pg-row--3 { grid-template-columns: 20rem 1fr 1fr; } }
.pg-row-name { font-size: 1.7rem; font-weight: 500; }
.pg-row-text { font-size: 1.5rem; line-height: 2.3rem; color: var(--text-secondary); }
.pg-row-text strong { color: var(--text-primary); font-weight: 500; }
.pg-row-head .pg-row-text, .pg-row-head .pg-row-name { font-size: 1.2rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }

/* Links "leia também" */
.pg-link { display: block; padding: 2.8rem; transition: transform .5s var(--ease-out); }
.pg-link:hover { transform: translateY(-.4rem); }
.pg-link .card-title { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; }
.pg-link .card-title .ic { width: 1.8rem; height: 1.8rem; color: rgba(200, 192, 255, .9); }

@media (max-width: 767px) {
  .bs-section { padding: 7rem var(--gutter-outer); }
  .bs-header { margin-bottom: 4rem; }
  .bs-card, .pg-diff, .pg-review, .pg-link { padding: 2.4rem; }
  .pg-note { padding: 2.4rem; }
  .pg-rows { padding: .8rem 2.4rem; }
}

/* ---------- Mídia: vídeo 3D e prints das telas ---------- */
.pg-frame {
  position: relative;
  overflow: hidden;
  border-radius: 2.4rem;
  aspect-ratio: 16 / 9;
  background: radial-gradient(ellipse at 50% 55%, rgba(81, 69, 229, .2), transparent 65%), #05040c;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 50px 140px -50px rgba(81, 69, 229, .6);
  transform: perspective(1600px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .8s var(--ease-out);
}
.pg-frame.is-tilting { transition: transform .15s linear; }
.pg-frame video { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-frame-caption { margin-top: 1.6rem; text-align: center; font-size: 1.3rem; color: var(--text-muted); }

.pg-shots { display: grid; grid-template-columns: 1fr; gap: 1.6rem; }
@media (min-width: 768px) { .pg-shots--2 { grid-template-columns: repeat(2, 1fr); } }
.pg-shot { margin: 0; padding: 1.2rem; }
.pg-shot a { display: block; overflow: hidden; border-radius: 1.4rem; background: #0b0918; cursor: zoom-in; }
.pg-shot img { display: block; width: 100%; height: auto; transition: transform .8s var(--ease-out); }
.pg-shot a:hover img { transform: scale(1.03); }
.pg-shot figcaption { padding: 1.4rem .8rem .4rem; font-size: 1.4rem; line-height: 2.1rem; color: var(--text-secondary); }
.pg-shot figcaption .pg-who { margin-bottom: .4rem; }

.pg-lightbox { position: fixed; inset: 0; z-index: 1000; display: none; place-items: center; padding: 4rem var(--gutter-outer); background: rgba(0, 0, 0, .86); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); cursor: zoom-out; }
.pg-lightbox.open { display: grid; }
.pg-lightbox img { max-width: min(140rem, 100%); max-height: 82vh; border-radius: 1.6rem; box-shadow: 0 40px 120px -30px rgba(0, 0, 0, .9); }
.pg-lightbox p { margin-top: 1.6rem; max-width: 90rem; text-align: center; font-size: 1.4rem; line-height: 2.2rem; color: var(--text-secondary); }

/* Ajustes 2026-11-08: títulos das colunas de avaliação mais visíveis; prints com canto 35px */
.pg-reviews-col-title { font-size: 1.7rem; letter-spacing: .06em; color: var(--text-primary); margin-bottom: 2rem; }
.pg-reviews-col-title.is-ours { color: rgba(200, 192, 255, .98); }
.pg-review-empty span { font-size: 1.6rem; line-height: 2.5rem; }
.pg-shot a, .pg-shot img { border-radius: 3.5rem; }
.pg-shot { border-radius: 4.2rem; }

/* Telas de celular lado a lado */
.pg-phones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.6rem; }
@media (min-width: 1024px) { .pg-phones { grid-template-columns: repeat(4, 1fr); } }
.pg-phones .pg-shot figcaption { font-size: 1.35rem; }
.pg-phones .pg-shot .pg-rv { display: block; margin-top: .8rem; font-size: 1.25rem; color: var(--text-muted); }
