html, body { overflow-x: clip; } /* Páginas SEO finales. */
body[data-page="seo"] { --seo-accent: var(--color-primary); --seo-surface: var(--color-surface-soft); color: var(--color-text-main); background: var(--color-bg); font-family: var(--font-body); }
body[data-page-key="solutions-barberias"] { --seo-accent: #c89565; --seo-surface: #efe2d5; }
body[data-page-key="solutions-salones-de-unas"] { --seo-accent: #df7b9e; --seo-surface: #f8e4ec; }
body[data-page-key="solutions-cafeterias"] { --seo-accent: #b9794f; --seo-surface: #f0e1cd; }
body[data-page-key="solutions-retail"] { --seo-accent: #5f9d91; --seo-surface: #dcefeb; }
body[data-page-key="solutions-restaurantes"] { --seo-accent: #df7b68; --seo-surface: #f5dfda; }
body[data-page-key="solutions-tiendas-y-marcas-locales"] { --seo-accent: #8f72a5; --seo-surface: #ebe3f0; }
.seo-hero h1, .seo-section h2, .seo-wallet-band h2, .seo-faq h2, .seo-final h2 {
    min-width: 0; margin: 0; overflow-wrap: anywhere; font-family: var(--font-display);
    font-style: normal; font-weight: 700; letter-spacing: -.04em; line-height: 1.02;
}
.seo-hero { padding: 10rem 0 var(--space-2xl); border-bottom: 1px solid var(--color-border); }
.seo-hero__inner { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(21rem, .85fr); gap: var(--space-3xl); align-items: center; }
.seo-hero h1 { max-width: 15ch; font-size: clamp(3.2rem, 5.5vw, 5rem); }
.seo-hero__intro { max-width: 40rem; margin: var(--space-l) 0 0; color: var(--color-text-muted); font-size: var(--txt-l); line-height: 1.55; }
.seo-actions { display: flex; flex-wrap: wrap; gap: var(--space-s); margin-top: var(--space-l); }
.seo-product-visual { display: flex; flex-direction: column; gap: var(--space-s); transform: rotate(-2deg); }
.seo-product-visual div { display: flex; justify-content: space-between; gap: var(--space-m); padding: var(--space-l); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--shadow-card); }
.seo-product-visual div:nth-child(2) { margin-left: var(--space-xl); color: var(--color-surface); background: var(--color-text-main); }
.seo-product-visual div:nth-child(3) { margin-left: var(--space-s); background: var(--color-surface-soft); }
.seo-product-visual span, .seo-industry-card__brand { font-family: var(--font-label); font-size: var(--txt-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.seo-industry-visual { display: grid; place-items: center; min-height: 26rem; background: var(--seo-surface); border-radius: 50%; }
.seo-industry-card { width: min(85%, 24rem); padding: var(--space-l); color: var(--color-text-main); background: var(--seo-accent); border-radius: var(--radius-card); box-shadow: var(--shadow-card); transform: rotate(3deg); }
.seo-industry-card__marks { display: flex; justify-content: space-between; gap: .5rem; margin: var(--space-2xl) 0; }
.seo-industry-card__marks i { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; background: var(--color-bg); border-radius: 50%; font-style: normal; }
.seo-industry-card strong { display: block; max-width: 14ch; font-family: var(--font-display); font-size: var(--txt-2xl); line-height: 1.1; }
.seo-content { padding-block: var(--space-2xl); }
.seo-section { max-width: 62rem; scroll-margin-top: 7rem; }
.seo-section + .seo-section { margin-top: var(--space-xl); padding-top: var(--space-xl); border-top: 1px solid var(--color-border); }
.seo-section h2 { max-width: 19ch; font-size: clamp(2.5rem, 4.7vw, 4.25rem); }
.seo-section__lead, .seo-section__text { max-width: 60ch; margin: var(--space-l) 0 0; color: var(--color-text-muted); font-size: var(--txt-l); line-height: 1.65; }
.seo-ledger { margin: var(--space-xl) 0 0; padding: 0; border-top: 2px solid var(--color-text-main); list-style: none; }
.seo-ledger li { position: relative; padding: var(--space-m) 0 var(--space-m) 2rem; color: var(--color-text-muted); border-bottom: 1px solid var(--color-border); line-height: 1.55; }
.seo-ledger li::before { content: "✓"; position: absolute; left: 0; color: var(--color-primary-hover); font-weight: 900; }
.seo-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--space-xl); border-top: 2px solid var(--color-text-main); }
.seo-cards article { min-width: 0; padding: var(--space-l); border-bottom: 1px solid var(--color-border); }
.seo-cards article + article { border-left: 1px solid var(--color-border); }
.seo-cards h3 { margin: 0 0 var(--space-s); font-family: var(--font-display); font-size: var(--txt-xl); }
.seo-cards p { margin: 0; color: var(--color-text-muted); line-height: 1.6; }
.seo-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--space-xl); border: 1px solid var(--color-border); border-radius: var(--radius-card); overflow: hidden; }
.seo-comparison article { min-height: 20rem; padding: var(--space-xl); }
.seo-comparison__highlight { color: var(--color-surface); background: var(--color-text-main); }
.seo-comparison span { font-family: var(--font-label); font-size: var(--txt-xs); letter-spacing: .1em; text-transform: uppercase; }
.seo-comparison h3 { max-width: 18ch; margin: var(--space-xl) 0 var(--space-m); font-family: var(--font-display); font-size: var(--txt-2xl); line-height: 1.1; }
.seo-comparison p { margin: 0; color: var(--color-text-muted); line-height: 1.65; }
.seo-comparison__highlight p { color: var(--color-border); }
.seo-wallet-band { padding-block: var(--space-2xl); background: var(--color-surface-soft); }
.seo-wallet-band__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-xl); align-items: end; }
.seo-wallet-band h2 { font-size: clamp(2.25rem, 4vw, 3.5rem); }
.seo-wallet-band__names { display: flex; gap: var(--space-s); }
.seo-wallet-band__names strong { padding: var(--space-s) var(--space-m); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-pill); white-space: nowrap; }
.seo-faq { padding-block: var(--space-2xl); }
.seo-faq h2 { font-size: clamp(2.5rem, 4vw, 4rem); }
.seo-faq__list { max-width: 62rem; margin-top: var(--space-xl); border-top: 2px solid var(--color-text-main); }
.seo-faq details { border-bottom: 1px solid var(--color-border); }
.seo-faq summary { display: grid; grid-template-columns: minmax(0, 1fr) 2rem; gap: var(--space-m); padding: var(--space-m) 0; cursor: pointer; list-style: none; font-family: var(--font-display); font-size: var(--txt-l); font-weight: 700; }
.seo-faq summary::-webkit-details-marker { display: none; }
.seo-faq summary::after { content: "+"; }
.seo-faq details[open] summary::after { content: "−"; }
.seo-faq details p { max-width: 60ch; margin: 0; padding: 0 var(--space-xl) var(--space-m) 0; color: var(--color-text-muted); line-height: 1.65; }
.seo-final { padding-block: var(--space-2xl); color: var(--color-surface); background: var(--color-primary-hover); }
.seo-final h2 { max-width: 18ch; font-size: clamp(2.7rem, 5vw, 4.75rem); }
.seo-final p { max-width: 52ch; margin: var(--space-m) 0 var(--space-l); color: var(--color-surface-soft); font-size: var(--txt-l); }
.seo-final .site-button { color: var(--color-text-on-primary); background: var(--color-surface); border-color: var(--color-surface); }
.seo-footer { padding-bottom: var(--space-l); color: var(--color-border); background: var(--color-text-main); }
.seo-footer a { color: var(--color-surface-soft); }
.seo-faq summary:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 4px; }
@media (max-width: 900px) {
    .seo-hero__inner, .seo-wallet-band__inner { grid-template-columns: minmax(0, 1fr); }
    .seo-hero { padding-top: 8.5rem; }
    .seo-product-visual, .seo-industry-visual { width: min(100%, 34rem); margin-inline: auto; }
    .seo-wallet-band__names { justify-content: start; }
}
@media (max-width: 600px) {
    .seo-hero h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
    .seo-hero__intro { font-size: var(--txt-m); }
    .seo-actions { flex-direction: column; }
    .seo-actions .site-button { width: 100%; }
    .seo-product-visual div:nth-child(2), .seo-product-visual div:nth-child(3) { margin-left: 0; }
    .seo-industry-visual { min-height: 22rem; }
    .seo-industry-card__marks i { width: 2rem; height: 2rem; }
    .seo-cards, .seo-comparison { grid-template-columns: minmax(0, 1fr); }
    .seo-cards article { padding-inline: 0; }
    .seo-cards article + article { border-left: 0; }
    .seo-comparison article { min-height: 0; }
    .seo-wallet-band__names { align-items: stretch; flex-direction: column; }
    .seo-final .site-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
