/* Páginas geradas (sites por ramo, privacidade). Usa os tokens e componentes de style.css. */

.pg-nav { position: sticky; top: 0; z-index: 90; background: rgba(5, 5, 7, .82); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.pg-nav-in { display: flex; align-items: center; gap: 24px; min-height: var(--nav-h); }
.pg-links { display: flex; gap: 22px; margin-left: auto; font-size: 14px; color: var(--muted); }
.pg-links a:hover { color: #fff; }

.pg-hero { padding: clamp(48px, 8vw, 110px) 0 clamp(30px, 5vw, 60px); position: relative; overflow: clip; }
.pg-hero::before { content: ""; position: absolute; left: 50%; top: -10%; width: min(1100px, 130vw); aspect-ratio: 2 / 1; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(47, 124, 240, .2), transparent 70%); pointer-events: none; z-index: -1; }
.pg-h1 { font-weight: 600; letter-spacing: -.045em; line-height: 1.02; font-size: clamp(2.3rem, 5.6vw, 4.6rem); max-width: 16ch; text-wrap: balance; }
.pg-h1 em, .pg .h2 em, .pg .h1 em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: -.02em; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }
.pg-actions { justify-content: flex-start; }
.pg-hero .hero-proof { text-align: left; }

.pg-stage { position: relative; margin-top: clamp(40px, 6vw, 70px); padding-right: clamp(20px, 8vw, 110px); }
.pg-stage .browser { width: 100%; }
.pg-phone { position: absolute; right: var(--pad); bottom: -8%; width: 18%; min-width: 96px; z-index: 2; }
.pg-note { margin-top: clamp(40px, 6vw, 64px); font-size: 13.5px; color: var(--dim); }

.pg-sec { padding: clamp(50px, 7vw, 100px) 0; border-top: 1px solid var(--line); }
.pg-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); margin-top: clamp(28px, 4vw, 48px); }
.pg-card { border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--bg-2); padding: clamp(22px, 2.4vw, 32px); }
.pg-card h3 { font-size: 1.2rem; font-weight: 600; letter-spacing: -.02em; }
.pg-card p { color: var(--muted); font-size: 15px; margin-top: 10px; }

.pg-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 6vw, 90px); align-items: start; }
.pg-ticks { margin-top: 8px; }
.pg-callout { margin-top: 24px; padding: 16px 18px; border-radius: 14px; border: 1px solid rgba(126, 196, 255, .3); background: rgba(126, 196, 255, .07); color: #d3dbe6; font-size: 14.5px; max-width: 60ch; }

.pg-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); margin-top: clamp(28px, 4vw, 48px); max-width: 900px; }
.pg-plans .plan-sub { margin-top: 18px; }
.pg-price .plans-pay { text-align: left; margin-inline: 0; }
.pg-price .plans-pay a { color: var(--text); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 4px; }

.pg-cta { text-align: center; }
.pg-cta .h1 { font-size: clamp(2rem, 4.6vw, 3.6rem); font-weight: 600; letter-spacing: -.04em; line-height: 1.05; margin-bottom: 30px; text-wrap: balance; }

.pg-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.pg-chips a { border: 1px solid var(--line-2); border-radius: 999px; padding: 9px 16px; font-size: 14px; color: var(--muted); transition: color .3s, border-color .3s; }
.pg-chips a:hover { color: #fff; border-color: rgba(255, 255, 255, .4); }

.pg-ramos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.pg-ramo { display: grid; border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--bg-2); overflow: hidden; transition: border-color .4s, transform .6s var(--ease-out); }
.pg-ramo:hover { border-color: color-mix(in srgb, var(--c) 55%, transparent); transform: translateY(-4px); }
.pg-ramo-img { aspect-ratio: 16 / 9; background: #000 center / cover; }
.pg-ramo-txt { display: grid; gap: 8px; padding: 20px 22px 24px; }
.pg-ramo-txt b { font-size: 1.15rem; font-weight: 600; letter-spacing: -.02em; }
.pg-ramo-txt span { color: var(--muted); font-size: 14.5px; }

.pg-text { max-width: 72ch; }
.pg-text h2 { font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; margin-top: 34px; }
.pg-text p { color: var(--muted); margin-top: 10px; }
.pg-text a { color: var(--text); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 4px; }

@media (max-width: 899px) {
  .pg-grid, .pg-ramos { grid-template-columns: 1fr 1fr; }
  .pg-split { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pg-links { display: none; }
  .pg-nav .btn { margin-left: auto; }
  .pg-grid, .pg-ramos, .pg-plans { grid-template-columns: 1fr; }
  .pg-stage { padding-right: 0; }
  .pg-phone { width: 26%; right: 4px; bottom: -14%; }
  .pg-actions .btn { flex: 1 1 100%; }
}