/* Sales presentation, staging only. Existing IDs and event handlers are retained. */
.landing-hero { min-height: 690px; padding-bottom: 64px; background: radial-gradient(ellipse at 78% 46%,#36115a66,transparent 48%); }
.landing-nav { max-width: 1180px; padding-block: 10px 20px; }
.landing-hero__stage { display: grid; grid-template-columns: 1.2fr 1fr; max-width: 1180px; width: 100%; gap: 48px; text-align: left; padding: 56px 0 24px; }
.landing-hero__copy { grid-column: 1; grid-row: 1; min-width: 0; }
.landing-hero__mark { grid-column: 2; grid-row: 1; display: grid; place-items: center; position: relative; min-height: 360px; margin: 0; }
.landing-hero__mark::before { content: ''; position: absolute; width: 340px; height: 340px; border: 1px solid #bb77ff33; border-radius: 50%; box-shadow: 0 0 0 30px #a14cff06,0 0 0 60px #a14cff04; }
.landing-hero__logo { width: min(30vw,330px); position: relative; filter: drop-shadow(0 18px 30px #0009); }
.landing-eyebrow,.sales-kicker { display: block; color: #c597fa; font-size: 11px; letter-spacing: .2em; font-weight: 700; margin: 0 0 20px; }
.landing-hero__brand { font-size: 23px; letter-spacing: .05em; margin-bottom: 20px; text-shadow: none; }
.landing-hero__title { font-size: clamp(38px,4.8vw,66px); font-weight: 700; line-height: 1.06; letter-spacing: -.035em; color: #faf4ff; margin-bottom: 24px; }
.landing-hero__title span { color: #c38aff; }
.landing-hero__lead { margin: 0 0 28px; font-size: 17px; max-width: 480px; line-height: 1.65; }
.landing-hero__cta { justify-content: flex-start; gap: 12px; }
.landing-cta { padding: 15px 25px; font-size: 15px; }
.landing-hero__scroll { display: inline-flex; flex-direction: row; gap: 14px; font-size: 11px; margin-top: 28px; }
.landing-hero__note { font-size: 12px; color: #a99bbd; margin-top: 24px; }
.sales-section-heading { max-width: 1100px; margin: 0 auto 32px; text-align: left; }
.sales-section-heading h2 { font-size: clamp(25px,3vw,38px); letter-spacing: -.025em; margin: 0 0 12px; }
.sales-section-heading p { color: #afa1c0; margin: 0; }
.sales-section-heading .sales-kicker { margin-bottom: 12px; }
.landing-journey { padding-block: 32px 80px; }
.landing-journey__inner { max-width: 1100px; gap: 0; border: 1px solid #bc82ff29; border-radius: 20px; overflow: hidden; background: #100a1b; }
.landing-journey__step { border: 0; border-radius: 0; padding: 32px; background: linear-gradient(145deg,#21103255,transparent); box-shadow: none; }
.landing-journey__step + .landing-journey__step { border-left: 1px solid #bc82ff29; }
.landing-journey__num { width: 36px; height: 36px; display: grid; place-items: center; background: #a14cff15; border: 1px solid #a14cff38; border-radius: 10px; letter-spacing: 0; margin-bottom: 22px; }
.landing-journey__step h2 { font-size: 20px; }
.landing-journey__step p { font-size: 14px; }
.landing-demo {
  width: 100%;
  max-width: none;
  margin-inline: auto;
  padding-inline: var(--pad-page, 1.15rem);
  padding-bottom: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}
.landing-demo__label-row {
  width: 100%;
  max-width: 1100px;
}
.landing-demo__label { font-size: 24px; letter-spacing: -.02em; text-transform: none; color: #f5eaff; }
#demo .hero-video-block {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto !important;
  padding-inline: 0;
  box-sizing: border-box;
}
#demo .demo-shell {
  width: 100%;
  margin-inline: auto;
}
#demo .demo-shell__frame { padding: 8px !important; border-radius: 20px !important; border: 1px solid #ba80ff40 !important; background: #110b1c !important; box-shadow: 0 24px 64px #0006 !important; }
#demo .demo-shell__hud { display: none !important; }
#demo .demo-shell__inner { border-radius: 14px !important; overflow: hidden; }
#demo .demo-shell__dock { padding: 12px 16px !important; background: #100b18 !important; border-top: 1px solid #c58cff20; }
#demo .demo-dock__btn { box-shadow: none !important; border-color: #b37bf540 !important; border-radius: 10px !important; }
#demo .demo-dock__btn svg[hidden] { display: none !important; }
#demo .demo-dock__btn--seek { width: 42px !important; height: 42px !important; }
#demo .demo-dock__time { font-size: 12px; font-variant-numeric: tabular-nums; }
.faq.faq-section { max-width: 1160px; display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 52px; align-items: start; padding-block: 48px 80px; }
.faq.faq-section > h2.faq-title { font-size: 32px !important; line-height: 1.2 !important; letter-spacing: -.02em !important; text-align: left !important; text-transform: none !important; margin: 0 !important; }
.faq.faq-section > h2::before,.faq.faq-section > h2::after { display: none !important; }
.faq.faq-section .faq__list { width: 100%; gap: 0 !important; border-top: 1px solid #c18cff33; }
.faq.faq-section .faq__item.faq-item { background: transparent !important; border: 0 !important; border-bottom: 1px solid #c18cff33 !important; border-radius: 0 !important; }
.faq.faq-section .faq__item.faq-item > summary { padding: 20px 8px !important; }
.faq.faq-section .faq-icon-hex { display: none !important; }
.faq.faq-section .faq-question { font-size: 16px !important; }
.faq.faq-section .faq__item.faq-item > p { padding: 0 8px 22px !important; margin: 0 !important; font-size: 14px !important; }
#flowPanel { max-width: 1120px !important; margin-inline: auto !important; }
#paymentMethodsSection { padding: 26px !important; border: 1px solid #b986f52e !important; border-radius: 20px !important; background: #100a19 !important; box-shadow: none !important; }
#paymentMethodsSection .payment-methods-title { font-size: 12px !important; letter-spacing: .16em !important; margin-bottom: 22px !important; }
#paymentMethodsSection .payment-method-card { min-height: 310px !important; padding: 28px 24px 86px !important; border-radius: 14px !important; border: 1px solid #b986f544 !important; background: linear-gradient(145deg,#23103988,#0b0712) !important; box-shadow: none !important; text-align: left !important; }
#paymentMethodsSection .payment-method-card:hover { border-color: #ca99ff !important; background: linear-gradient(145deg,#351754,#10091b) !important; }
#paymentMethodsSection .payment-method-icon-wrap { margin: 0 0 18px !important; width: 64px !important; height: 64px !important; }
#paymentMethodsSection .payment-method-icon-hex { width: 64px !important; height: 64px !important; }
#paymentMethodsSection .payment-method-icon-hex svg { max-width: 38px; max-height: 38px; }
#paymentMethodsSection .payment-method-name { font-size: 23px !important; text-align: left !important; margin: 0 0 12px !important; }
#paymentMethodsSection .payment-method-description { text-align: left !important; font-size: 14px !important; line-height: 1.6 !important; margin: 0 !important; }
#paymentMethodsSection .payment-method-badge { box-shadow: none !important; font-size: 10px !important; padding: 7px 10px !important; height: auto !important; top: 22px !important; right: 22px !important; }
#paymentMethodsSection .payment-method-button { left: 24px !important; right: 24px !important; bottom: 22px !important; height: 44px !important; }
#flowPanel .benefits-bar { box-shadow: none !important; filter: none !important; margin-top: 28px !important; }
#flowPanel .benefits-bar::before,#flowPanel .benefits-bar::after { display: none !important; }
#qrSection:not([hidden]) { max-width: 1050px; margin: 36px auto; display: grid !important; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 22px 36px; align-items: start; }
#qrSection .qr-scan-head { grid-column: 1 / -1; background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 10px 0 20px !important; }
#qrSection .qr-scan-head__accent { display: none; }
#qrStage { grid-column: 1; grid-row: 2 / 5; width: 100% !important; max-width: 360px !important; box-sizing: border-box; padding: 12px !important; border: 1px solid #c795ff33 !important; border-radius: 18px !important; box-shadow: none !important; background: #120b1e !important; }
#qrStage .qr-stage__scan,#qrStage .qr-stage__ticks,#qrStage .sci-frame__glow { display: none !important; }
#qrStage .qr-wrap { padding: 8px !important; border: 0 !important; box-shadow: none !important; }
#qrStage .qr-img { width: 100%; height: auto; object-fit: contain; }
#qrSection .qr-actions { grid-column: 1; grid-row: 5; margin: 0 !important; }
#qrSection .comprobante-card { grid-column: 2; grid-row: 2; padding: 24px !important; border-radius: 18px !important; border: 1px solid #b986f533 !important; background: #120b1e !important; box-shadow: none !important; margin: 0 !important; }
#qrSection .comprobante-card__subtitle { font-size: 14px; line-height: 1.6; }
#qrSection .comprobante-card__header { align-items: flex-start; }
#qrSection .comprobante-card__hex { display: none; }
#qrSection .comprobante-card__zone { flex-wrap: wrap; gap: 18px; padding: 22px !important; background: #a14cff09 !important; border-radius: 12px !important; }
#qrSection .wa-comprobante-head { grid-column: 2; grid-row: 3; padding: 14px 18px !important; border-radius: 12px !important; box-shadow: none !important; margin: 0 !important; }
#qrSection .wa-actions { grid-column: 2; grid-row: 4; }
#qrSection .wa-hint { grid-column: 2; }
#qrSection .btn--whatsapp { max-width: 100%; font-size: 14px !important; box-shadow: none !important; min-height: 50px; }
#btnDescargarQr { box-shadow: none !important; border-radius: 12px !important; font-size: 12px !important; }
@media(max-width:800px) {
 .landing-hero { min-height: auto; padding-bottom: 40px; }
 .landing-hero__stage { display: flex; flex-direction: column; gap: 28px; padding-top: 24px; text-align: center; }
 .landing-hero__mark { order: 0; min-height: 200px; }
 .landing-hero__copy { order: 1; }
 .landing-hero__mark::before { width: 184px; height: 184px; box-shadow: 0 0 0 18px #a14cff06; }
 .landing-hero__logo { width: 174px; }
 .landing-hero__brand { display: none; }
 .landing-eyebrow { font-size: 9px; }
 .landing-hero__title { font-size: clamp(36px,8vw,54px); }
 .landing-hero__lead { font-size: 15px; margin-inline: auto; }
 .landing-hero__cta { justify-content: center; }
 .landing-journey__inner { grid-template-columns: 1fr; }
 .landing-journey__step + .landing-journey__step { border-left: 0; border-top: 1px solid #bc82ff29; }
 .landing-journey__step { padding: 24px; }
 .landing-journey,.landing-demo { padding-bottom: 48px; }
 .faq.faq-section { grid-template-columns: 1fr; gap: 24px; padding: 24px 20px 48px; }
 .faq.faq-section > h2.faq-title { font-size: 28px !important; }
 #paymentMethodsSection { padding: 16px !important; }
 #paymentMethodsSection .payment-methods-grid { grid-template-columns: 1fr !important; }
 #qrSection:not([hidden]) { display: flex !important; flex-direction: column; padding-inline: 14px; gap: 20px; }
 #qrSection > * { max-width: 100%; box-sizing: border-box; }
 #qrStage { align-self: center; }
 #qrSection .qr-actions { align-self: center; }
 #qrSection .comprobante-card { width: 100%; padding: 20px !important; }
 #qrSection .wa-comprobante-head,#qrSection .wa-actions { width: 100%; }
}
/* Let method content determine height; no absolutely positioned CTA over the copy. */
#paymentMethodsSection .payment-method-card { display: flex !important; flex-direction: column !important; align-items: stretch !important; min-height: 0 !important; padding: 26px !important; }
#paymentMethodsSection .payment-method-icon-wrap { flex: 0 0 64px !important; }
#paymentMethodsSection .payment-method-icon-hex { display: grid !important; place-items: center !important; }
#paymentMethodsSection .payment-method-icon-hex svg { position: static !important; transform: none !important; width: 36px !important; height: 36px !important; }
#paymentMethodsSection .payment-method-button { position: relative !important; inset: auto !important; width: 100% !important; flex: 0 0 46px !important; height: 46px !important; margin: 24px 0 0 !important; transform: none !important; }
#paymentMethodsSection .payment-method-description { flex: 1; }
#qrSection .wa-actions { margin: 0 !important; justify-self: stretch; }
#qrSection .btn--whatsapp { width: 100% !important; }
#qrStage { scroll-margin-top: 100px; }
.faq.faq-section .faq__item.faq-item > summary { display: grid !important; grid-template-columns: minmax(0,1fr) 24px !important; gap: 16px !important; }
.faq.faq-section .faq-left { display: none !important; }
.faq.faq-section .faq__item.faq-item > p { text-align: left !important; }
.faq.faq-section .faq__item.faq-item::before,.faq.faq-section .faq__item.faq-item::after { display: none !important; }