/* Variante clara: conserva la composición y las medidas del borrador oscuro. */
:root {
  color-scheme: light;
  --ink: #20384b;
  --muted: #526b7e;
  --line: #d5e4ec;
  --surface: #ffffff;
  --surface-soft: #f4f8fb;
  --surface-blue: #edf6fc;
  --blue-50: #edf6fc;
  --blue-100: #e0f0fa;
  --green-100: #e4f5e9;
  --purple-100: #e0f0fa;
  --shadow-xs: 0 4px 16px #082d6108;
  --shadow-sm: 0 12px 30px #082d6110;
  --shadow-md: 0 22px 55px #082d6118;
  --shadow-lg: 0 32px 80px #082d6120;
}

body { background: #fff; }
h1, h2, h3 { color: #082d61; }
.section-kicker, .text-link, .plan-name, .access-label { color: #0869a5; }
.site-header { background: #ffffffed; border-color: var(--line); }
.main-nav a { color: #39556d; }
.main-nav a:hover, .main-nav a.active { color: #0767a2; }
.brand img { background: transparent; }
.menu-toggle { background: #edf6fc; color: #082d61; }
.button-outline { color: #09699c; background: #fff; border-color: #a9cddd; }
.button-outline:hover { color: #07517e; background: #e7f3fa; }
.hero { background: radial-gradient(ellipse at 40% 20%, #d9effba6, transparent 60%), radial-gradient(ellipse at 92% 80%, #def6e5a6, transparent 45%), #fff; }
.hero-copy h1 span { color: #087451; background-image: linear-gradient(100deg, #0876b7, #15813e); }
.eyebrow { color: #08649b; background: #e6f3fc; border-color: #c2dfed; }
.hero-lead, .hero-proof { color: #4b6478; }
.hero-proof .icon { color: #198642; }
.hero-price-line strong { color: #13733b; }
.product-stage { border-color: #c7dfe9; background: linear-gradient(145deg, #ecf6ff, #effaf4); box-shadow: 0 30px 80px #087bb118; }
.support-float > .icon { color: #168346; background: #d9f0e2; }
.support-float small { color: #516b7b; }
.support-float strong { color: #13733b; }
.ai-float { background: #fff; border-color: #c8dfeb; }
.ai-float-title { color: #096b92; }
.ai-answer { background: #eaf5fb; color: #36576b; }
.price-float small { color: #536d7e; }
.price-float strong { color: #13733b; }
.trust-strip { background: #f4f9fc; }
.trust-grid article { border-color: #d5e4ec; }
.trust-grid strong { color: #163c5c; }
.trust-grid span { color: #536e82; }
.trust-icon { color: #198448; background: #e0f2e7; }

.transformation, .feature-showcase, .commerce-section, .why-section, .pricing-section, .access-section, .payment-section { background: #fff; }
.benefits-section, .industries, .process-section, .faq-section { background: #f5f9fc; border-color: #e2edf3; }
.state-card, .benefit-card, .industry-card, .price-card, .process-card, .documents-banner, .faq-list details, .payment-panel, .payment-details article, .lead-form, .access-card, .cloud-card { background: #fff; border-color: #d5e4ec; }
.after-card { background: linear-gradient(140deg, #fff, #effaf2); border-color: #b5dcca; }
.state-list li, .mini-checks li, .price-card li, .industries-note { color: #466176; }
.state-label { color: #52697b; background: #edf2f6; }
.after-card .state-label { color: #18743c; }
.benefit-card:hover, .industry-card:hover { border-color: #7ebea0; box-shadow: 0 12px 32px #082d6112; }
.feature-icon.blue, .feature-icon.purple, .feature-icon.cyan, .feature-icon.navy, .industry-icon, .why-icon, .access-icon, .documents-icon, .payment-icon { color: #096da4; background: #e0f0fa; }
.feature-icon.green, .feature-icon.orange, .industry-card:nth-child(even) .industry-icon, .why-list article:nth-child(even) .why-icon, .cloud-card .access-icon { color: #198348; background: #e2f4e8; }
.spotlight, .spotlight-ai, .spotlight-dashboard, .commerce-store, .commerce-self-service { background: linear-gradient(130deg, #eef7fd, #fff 65%); border-color: #d5e4ec; }
.spotlight-dashboard, .commerce-self-service { background: linear-gradient(135deg, #edf9f2, #fff 65%); }
.spotlight-number { color: #082d6109; }
.purple-tag, .blue-tag { color: #096da4; background: #dfedf8; }
.green-tag { color: #18773e; background: #e1f3e7; }
.screen-card, .ai-window { background: #fff; border-color: #cadfe9; }
.ai-window-bar { background: #e7f3fb; color: #096994; }
.ai-window-bar span { background: #9dcde4; }
.ai-prompt { border-color: #fff; }
.prompt-list span, .metric-chips span, .dashboard-badge { color: #35576f; background: #fff; border-color: #cde0ea; }
.commerce-copy p strong { color: #18773e; }
.commerce-self-service .commerce-copy h2 { color: #082d61; }
.commerce-self-service .commerce-copy p, .commerce-light-checks li { color: #4b6478; }
.commerce-self-service .button-light, .access-panel .button-light { color: #fff; background: #087a54; }
.operation-section { background: #f0f7fc; border-color: #d5e4ec; }
.operation-section::before { opacity: .2; }
.operation-copy h2, .operation-copy h3, .operation-list strong { color: #082d61; }
.operation-copy > p, .operation-list > div { color: #4b6478; }
.why-stat { border-color: #fff; }
.price-card.featured { border-color: #66b78b; background: linear-gradient(145deg, #effaf4, #fff 60%); }
.price-card-top h3 { color: #13763d; }
.price-table thead { background: #0a507a; }
.price-table tbody tr:nth-child(even) { background: #f0f7fb; }
.renewal-note, .free-note { background: #eaf7ee; color: #245b3c; border-color: #c9e7d4; }
.access-panel { border-color: #cce0e8; background: radial-gradient(ellipse at top right, #d8f2e1aa, transparent 60%), #eef7fc; color: var(--ink); }
.access-copy h2 { color: #082d61; }
.access-copy p, .device-row span { color: #4b6478; }
.device-row .icon { color: #0874ac; }
.access-value, .cloud-card .access-label, .cloud-card .access-value { color: #18773e; }
.documents-banner strong, .faq-list summary, .payment-details strong, .form-heading strong { color: #163c5c; }
.format-tags span, .faq-list summary span { color: #096b9e; background: #e7f3fb; border-color: #cce2ed; }
.contact-section { background: radial-gradient(ellipse at left top, #dfedf9a6, transparent 60%), #f4faf7; color: var(--ink); border-color: #d5e4ec; }
.contact-section::after { opacity: .2; }
.contact-copy h2, .contact-points strong { color: #082d61; }
.contact-copy > p, .contact-points span { color: #4b6478; }
.contact-points > div > .icon { color: #096da4; background: #deedf7; }
.lead-form { box-shadow: 0 20px 55px #082d6112; }
.lead-form label > span { color: #36556d; }
.lead-form input, .lead-form textarea, .lead-form select { background: #f7fafc; border-color: #bfd3df; }
.lead-form input:focus, .lead-form textarea:focus, .lead-form select:focus { background: #fff; }
.lead-form input::placeholder, .lead-form textarea::placeholder, .lead-form small { color: #60798b; }
.form-status { color: #a52b43; }
.form-status.success { color: #196539; background: #e5f5ea; }
.lead-form .field-error { border-color: #c83d55; }
.light-kicker { color: #0869a5; }
.final-cta { background: linear-gradient(110deg, #e7f3fc, #eaf8ed); border-color: #cce4dc; }
.final-cta h2 { color: #082d61; }
.final-cta p { color: #4b6478; }
.final-cta-inner > div:first-child > span { color: #126c8c; }
.final-cta .button-light { background: #086a9f; color: #fff; }
.site-footer { background: #f4f8fb; color: #4b6478; }
.footer-grid strong { color: #163c5c; }
.footer-brand p, .footer-grid a, .footer-grid span, .footer-bottom a { color: #506b80; }
.footer-grid a:hover { color: #0869a5; }
.footer-bottom { border-color: #d5e4ec; }
.mobile-cta { background: #fffffff5; }
.mobile-cta a { color: #163c5c; }
.mobile-cta a:last-child { color: #fff; }
.social-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.social-links a { padding: 7px 11px; border: 1px solid #cce0e8; border-radius: 9px; background: #fff; font-weight: 700; }
.social-links a:hover { background: #e7f3fc; border-color: #87bdd5; }
.social-links a { display: inline-flex; width: 40px; height: 40px; padding: 9px; align-items: center; justify-content: center; flex-shrink: 0; }
.social-links img { width: 20px; height: 20px; }
.header-social { margin-top: 0; flex-wrap: nowrap; gap: 6px; }
.header-inner { gap: 20px; }
.main-nav { gap: 20px; }
.image-modal { width: min(1400px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #cbdfe9; border-radius: 16px; background: #fff; box-shadow: 0 24px 100px #0006; }
.image-modal::backdrop { background: #041427c9; backdrop-filter: blur(4px); }
.image-modal-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; }
.image-modal-bar h2 { margin: 0; font-size: 1rem; letter-spacing: 0; }
.image-modal-close { flex-shrink: 0; width: 40px; height: 40px; border: 1px solid #cbdfe9; border-radius: 10px; background: #edf6fc; color: #082d61; font-size: 1.7rem; cursor: pointer; }
.image-modal-content { display: block; width: 100%; height: auto; max-height: calc(100dvh - 112px); object-fit: contain; background: #edf3f8; }
body.image-modal-open { overflow: hidden; }
@media (max-width: 430px) {
  .header-inner { gap: 10px; }
  .brand, .brand img { width: 120px; }
  .header-social { gap: 4px; }
  .header-social a { width: 32px; height: 36px; padding: 6px; }
  .menu-toggle { width: 38px; flex-shrink: 0; }
  .image-modal { width: calc(100vw - 16px); }
}
@media (max-width: 930px) {
  .main-nav { background: #fff; }
}

/* Ritmo compacto: 64 px entre contenidos de secciones consecutivas. */
.section { padding-block: 32px; }
.hero { padding-block: 44px 58px; }
.section-heading { margin-bottom: 28px; }
.section-kicker { margin-bottom: 12px; }
.spotlight, .commerce-panel { margin-bottom: 24px; }
.spotlight:last-child, .commerce-panel:last-child { margin-bottom: 0; }
.access-section { padding-block: 24px 32px; }
.final-cta { padding-block: 40px; }
.site-footer { padding-top: 36px; }
.footer-grid { padding-bottom: 28px; }
#asistencia .commerce-grid { align-items: center; }
#asistencia .section-heading { margin-bottom: 0; }

/* Capturas completas y ampliables, distribuidas junto a su contenido. */
.transformation-visual-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.35fr); gap: 24px; align-items: center; }
.comparison-copy { min-width: 0; }
.comparison-copy .state-card { padding: 24px; border-radius: 20px; }
.comparison-copy .state-card h3 { font-size: 1.4rem; margin-bottom: 18px; }
.comparison-copy .state-label { margin-bottom: 12px; }
.comparison-copy .state-list { gap: 10px; font-size: .88rem; }
.comparison-before { margin-top: 14px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 14px; background: #f7fafc; }
.comparison-before summary { color: #456176; font-size: .85rem; font-weight: 700; }
.comparison-before .state-list { margin-top: 16px; }
.product-capture { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #cbdfe9; border-radius: 18px; background: #fff; box-shadow: var(--shadow-xs); }
.product-capture > a { display: grid; align-items: center; background: #edf3f8; overflow: hidden; cursor: zoom-in; }
.product-capture img { display: block; width: 100%; height: auto; object-fit: contain; }
.product-capture figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 5px 12px; padding: 13px 16px; }
.product-capture figcaption strong { color: #163c5c; font-size: .92rem; }
.product-capture figcaption span { color: #526b7e; font-size: .75rem; }
.capture-featured { box-shadow: var(--shadow-md); }
.capture-featured figcaption { flex-direction: column; align-items: flex-start; }
.capture-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.capture-gallery .product-capture > a { aspect-ratio: 16 / 10; }
.capture-gallery .product-capture img { height: 100%; max-height: 260px; }
.capture-store { margin-block: 0 24px; }
.capture-store .product-capture { max-width: 100%; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .product-capture img { transition: scale .25s ease; }
  .product-capture a:hover img { scale: 1.015; }
}
@media (max-width: 930px) {
  .transformation-visual-grid { grid-template-columns: 1fr; }
  .capture-featured { grid-row: 1; }
  .capture-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .capture-gallery { grid-template-columns: 1fr; gap: 14px; }
  .comparison-copy .state-card { padding: 20px; }
  .product-capture figcaption { padding: 12px; }
}

/* Entradas al desplazarse activas por petición del propietario de la web. */
@media screen {
  .js .reveal {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity 1.15s ease, transform 1.15s cubic-bezier(.2,.7,.2,1) !important;
    transition-delay: var(--reveal-delay, 0ms) !important;
  }
  .js .reveal.reveal-active { opacity: 1; transform: translateY(0); }
  .heading-word {
    display: inline-block;
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .9s ease, transform 1.1s cubic-bezier(.2,.7,.2,1) !important;
    transition-delay: var(--word-delay, 0ms) !important;
  }
  .heading-visible .heading-word { opacity: 1; transform: translateY(0); }
  .product-stage.reveal-active .ai-float { animation: creativa-float 3.6s ease-in-out 2; }
  .product-stage.reveal-active .phone-card { animation: creativa-float 4s ease-in-out 2 reverse; }
  .button .icon { transition: translate .2s ease; }
  .button:hover .icon { translate: 3px 0; }
  .benefit-card, .industry-card { transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
  .benefit-card.reveal-active:hover, .industry-card.reveal-active:hover { transform: translateY(-4px); }
}
@keyframes creativa-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -7px; }
}
/* Cada familia tiene un movimiento propio; no se desplaza la página. */
.js .reveal[data-motion] {
  transition: opacity 1s ease, transform 1.25s cubic-bezier(.16,1,.3,1), clip-path 1.25s cubic-bezier(.16,1,.3,1) !important;
  transition-delay: var(--reveal-delay, 0ms) !important;
}
.js .reveal[data-motion="fade"] { transform: none; }
.js .reveal[data-motion="left"] { transform: translateX(-38px); }
.js .reveal[data-motion="right"] { transform: translateX(38px); }
.js .reveal[data-motion="rise"] { transform: translateY(28px); }
.js .reveal[data-motion="zoom"] { transform: scale(.93); clip-path: inset(4% 3% round 18px); }
.js .reveal.reveal-active[data-motion] { opacity: 1; transform: none; clip-path: inset(0 round 0); }
.js .reveal.reveal-active[data-motion="zoom"] { clip-path: none; }
.spotlight-copy .heading-word, .commerce-copy .heading-word { transform: none; }
.spotlight-copy .heading-visible .heading-word, .commerce-copy .heading-visible .heading-word { transform: none; }
@media (max-width: 700px) {
  .js .reveal[data-motion="left"]:not(.reveal-active) { transform: translateX(-16px); }
  .js .reveal[data-motion="right"]:not(.reveal-active) { transform: translateX(16px); }
}
@media (max-width: 700px) {
  .section { padding-block: 24px; }
  .hero { padding-block: 30px 52px; }
  .section-heading { margin-bottom: 24px; }
  .access-section { padding-block: 20px 24px; }
  .final-cta { padding-block: 32px; }
}
