html { scroll-padding-top: 96px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; }
.rulo img { background: transparent; border: 0; border-radius: 0; padding: 0; filter: none; }
.button { background: #c43e1b; }
.button:hover { background: #a93216; }
.button-white, .button-white:hover { background: #fff; color: #b93817; }
.section-label:not(.light), .eyebrow, .plan-name { color: #b93817; }
.final-cta { background: #c43e1b; }
.pricing-switch b { color: #b93817; font-size: 12px; }
.pricing-switch .active b { color: #ff9a7b; }
.pain-grid p, .feature-grid p, .benefit-list p, .steps-grid p, details p { font-size: 16px; }
.price-features li, .price-copy > p { font-size: 14px; }
.mini-metrics span, .saved small, .saved b, .feature-tags span, .origin cite, .footer-bottom, .footer-grid h4 { font-size: 12px; }
.window-title, .avatar, .dash-head small, .real-ui .dash-head p, .quick-actions span, .fleet-title, .money-head strong, .money-head span, .fleet-stats small, .fleet-stats span, .money-grid small { font-size: 12px; }
.window-title, .dash-head small, .real-ui .dash-head p, .fleet-stats small, .fleet-stats span, .money-grid small { color: #475569; }
.quick-actions { flex-wrap: wrap; }
.fleet-stats, .money-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.money-grid article:last-child { display: block; }
.money-head { gap: 12px; flex-wrap: wrap; }
.footer-bottom { color: #a8b3c3; }
.demo-note { margin: 0; padding: 10px 16px; font-size: 12px; color: #475569; }
.legal-nav > a:last-child, .legal-kicker, .contact-box a { color: #b93817; }
.legal-nav { flex-wrap: wrap; padding-block: 12px; }
.contact-box a { overflow-wrap: anywhere; }
@media (min-width: 701px) and (max-width: 980px) {
  .menu-button { display: block; order: 2; }
  .nav-links.open { display: flex; position: absolute; top: 76px; left: 0; right: 0; padding: 20px; background: #fff; flex-direction: column; border-bottom: 1px solid var(--line); }
}
@media (max-width: 420px) {
  .mini-metrics { grid-template-columns: 1fr; }
  .control-top { gap: 10px; flex-wrap: wrap; }
  .feature-tags { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button { transition: none; }
}

/* Desktop visual review, September 2026. */
.nav .brand img { mix-blend-mode: multiply; }
.feature-grid .featured { grid-column: auto; }
.feature-tags { flex-wrap: wrap; }
.feature-grid > article > i svg { width: 24px; height: 24px; }
.price-copy #price-period { display: inline-block; margin-left: 8px; font-size: 16px; letter-spacing: normal; white-space: nowrap; }
.hero-actions > a { white-space: nowrap; }
.steps-grid article > span { position: static; display: block; margin: 0 0 10px; font-size: 14px; color: #475569; }
.footer-grid p, .footer-grid a { font-size: 14px; color: #b8c3d3; }
.footer-bottom { font-size: 13px; }
@media (min-width: 981px) {
  #funciones { padding-bottom: 64px; }
  .origin { padding-top: 0; padding-bottom: 64px; }
  .steps { padding-top: 32px; padding-bottom: 80px; }
}

.pain-grid i svg, .benefit-list i svg, .steps-grid i svg, .saved i svg { width: 24px; height: 24px; display: block; }

/* Mobile visual review: compact spacing while retaining readable text. */
@media (max-width: 700px) {
  .hero { padding: 32px 0 44px; }
  .section { padding: 48px 0; }
  .hero-grid { gap: 28px; }
  .hero-actions { margin: 24px 0 18px; }
  .hero-actions > a { display: flex; align-items: center; justify-content: center; text-align: center; white-space: normal; min-height: 48px; }
  .pain-grid, .feature-grid { margin-top: 28px; gap: 16px; }
  .pain-grid article, .feature-grid article { padding: 22px; min-height: 0; }
  .dashboard-shell .demo-note { padding: 8px 12px; }
  .dashboard-shell .window-bar { height: 36px; }
  .real-ui .dashboard { min-height: 0; grid-template-columns: 28px minmax(0,1fr); }
  .real-ui .dashboard aside { gap: 16px; padding-top: 12px; }
  .real-ui .side-mark { width: 22px; height: 22px; margin-bottom: 4px; }
  .real-ui .dash-content { padding: 12px 10px; min-width: 0; }
  .real-ui .dash-head p { margin-bottom: 0; }
  .quick-actions { margin: 10px 0 12px; flex-wrap: wrap; }
  .quick-actions span { padding: 5px 7px; }
  .fleet-stats { margin: 6px 0 12px; }
  .fleet-stats article, .money-grid article { padding: 8px; min-width: 0; }
  .fleet-stats small, .fleet-stats span, .money-grid small { overflow-wrap: anywhere; }
  .control-card { padding: 20px; width: 100%; }
  .ring { width: 132px; height: 132px; margin: 18px auto; }
  .mini-metrics { grid-template-columns: 1fr; gap: 8px; }
  .mini-metrics div { display: flex; align-items: center; gap: 14px; padding: 9px 12px; text-align: left; }
  .mini-metrics b { flex: 0 0 28px; font-size: 18px; }
  .mini-metrics span { font-size: 14px; }
  .saved { margin-top: 12px; padding: 10px; }
  .origin { padding-top: 0; padding-bottom: 32px; }
  .origin-card { padding: 28px 24px; }
  .quote-mark { display: none; }
  .steps { padding-top: 24px; }
  .steps-grid { margin: 28px 0; gap: 12px; }
  .steps-grid article i { width: 52px; height: 52px; border-radius: 14px; }
  .steps-grid article > span { margin-bottom: 6px; }
  .steps-grid h3 { margin: 12px 0 6px; }
  .steps-grid p { margin-bottom: 0; }
  .step-line { height: 14px; }
  .final-cta { padding: 48px 0; }
}

/* Keyboard navigation and constrained mobile viewports. */
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 12px 18px; background: #111827; color: #fff; border-radius: 6px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.menu-button { min-width: 44px; min-height: 44px; cursor: pointer; }
.mobile-nav-actions { display: none; }
.pricing-switch button { min-height: 44px; cursor: pointer; }
.eyebrow { max-width: 100%; }
.eyebrow > span { flex-shrink: 0; }
summary span { flex-shrink: 0; }
@media (max-width: 980px) {
  .nav-links.open { max-height: calc(100dvh - 76px); overflow-y: auto; overscroll-behavior: contain; }
  .nav-links > a { display: flex; align-items: center; min-height: 44px; }
}
@media (max-width: 700px) {
  .mobile-nav-actions { display: flex; flex-direction: column; gap: 12px; }
  .mobile-nav-actions .text-link { padding: 10px 0; }
  .nav-links.open { max-height: calc(100dvh - 68px); }
  .pricing-switch { max-width: 100%; flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .button:hover { transform: none; }
}

.pending-email { overflow-wrap: anywhere; }
.legal-card p a, .legal-note a { text-decoration: underline; text-underline-offset: 3px; }

/* Thirteen identical personal mementos, evenly arranged. */
.origin-card{padding-bottom:68px}.navecitas-memory{grid-column:1/-1;display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:12px;align-items:center;position:relative;pointer-events:none;margin-top:0}.navecitas-memory img{display:block;width:100%;height:auto;opacity:.28;filter:brightness(0) invert(1)}
@media(max-width:900px){.navecitas-memory{grid-template-columns:repeat(7,minmax(0,1fr));gap:16px 12px;margin-top:24px}.origin-card{padding-bottom:42px}}
@media(max-width:700px){.origin-card{padding-bottom:28px}.navecitas-memory{gap:12px 6px;margin-top:24px}}

.origin-card{row-gap:32px}.origin-card>blockquote{grid-column:2;grid-row:1}.navecitas-memory{grid-row:2}@media(max-width:980px){.origin-card>blockquote{grid-column:1;grid-row:auto}.navecitas-memory{grid-row:auto;margin-top:0}}
