:root { --ba-color-canvas: #f3f5f2; --ba-color-surface: #ffffff; --ba-color-ink: #071419; --ba-color-ink-soft: #10242b; --ba-color-muted: #506168; --ba-color-line: #d8dfdc; --ba-color-brand: #79c900; --ba-color-brand-bright: #94e600; --ba-color-brand-dark: #315e00; --ba-color-blue: #07519b; --ba-color-blue-dark: #032c54; --ba-color-whatsapp: #25d366; --ba-color-whatsapp-dark: #128c4a; --ba-color-focus: #0b72e7; --ba-font-body: "Segoe UI", Arial, Helvetica, sans-serif; --ba-font-display: Impact, Haettenschweiler, "Arial Narrow Bold", "Segoe UI", sans-serif; --ba-text-xs: clamp(0.78rem, 0.76rem + 0.1vw, 0.86rem); --ba-text-sm: clamp(0.9rem, 0.86rem + 0.15vw, 0.98rem); --ba-text-base: clamp(1rem, 0.96rem + 0.16vw, 1.1rem); --ba-text-lead: clamp(1.08rem, 1rem + 0.28vw, 1.28rem); --ba-text-h3: clamp(1.35rem, 1.15rem + 0.55vw, 1.75rem); --ba-text-h2: clamp(2.15rem, 1.6rem + 2vw, 3.65rem); --ba-text-display: clamp(2.65rem, 2rem + 2.2vw, 3.9rem); --ba-space-1: 0.35rem; --ba-space-2: 0.65rem; --ba-space-3: 1rem; --ba-space-4: 1.5rem; --ba-space-5: 2rem; --ba-space-6: 3rem; --ba-space-section: clamp(4rem, 2.5rem + 5vw, 7rem); --ba-container: 74rem; --ba-container-narrow: 56rem; --ba-gutter: clamp(1rem, 0.45rem + 2vw, 2.25rem); --ba-radius-sm: 0.5rem; --ba-radius-md: 0.9rem; --ba-radius-lg: 1.35rem; --ba-radius-pill: 999px; --ba-shadow-card: 0 1rem 2.5rem rgb(7 20 25 / 10%); --ba-shadow-dark: 0 1.25rem 3rem rgb(0 0 0 / 28%); --ba-transition: 180ms ease; } .ba-page { color: var(--ba-color-ink); background: var(--ba-color-canvas); font-family: var(--ba-font-body); font-size: var(--ba-text-base); line-height: 1.6; text-rendering: optimizeLegibility; } .ba-page ::selection { color: var(--ba-color-ink); background: var(--ba-color-brand-bright); } .ba-page, .ba-page *, .ba-page *::before, .ba-page *::after { box-sizing: border-box; } .ba-page :where(h1, h2, h3, h4, p) { margin-block: 0; } .ba-page :where(img, svg, video) { display: block; max-width: 100%; } .ba-page :where(button, input, textarea, select) { font: inherit; } .ba-page a { color: inherit; text-underline-offset: 0.2em; } .ba-page :where(a, button):focus-visible { outline: 3px solid var(--ba-color-focus); outline-offset: 4px; } .ba-page { width: 100%; overflow: clip; } .ba-page.ba-page .ba-section.ba-section { width: 100%; padding-block: var(--ba-space-section); } .ba-page.ba-page .ba-container.ba-container { width: min(calc(100% - (2 * var(--ba-gutter))), var(--ba-container)); margin-inline: auto; } .ba-page.ba-page.ba-page .ba-stack.ba-stack.ba-stack { display: flex; flex-direction: column; gap: var(--ba-space-4); } .ba-page.ba-page.ba-page .ba-cluster.ba-cluster.ba-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ba-space-3); } .ba-page.ba-page.ba-page .ba-grid.ba-grid.ba-grid { display: grid; gap: var(--ba-space-4); } .ba-page.ba-page.ba-page .ba-grid.ba-grid--two.ba-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ba-page.ba-page.ba-page .ba-grid.ba-grid--auto.ba-grid--auto, .ba-page.ba-page.ba-page .ba-process-grid.ba-process-grid.ba-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } @media (max-width: 46rem) { .ba-page.ba-page > .ba-section.ba-section { padding-inline: 0; } .ba-page.ba-page > .ba-section.ba-section > .ba-container.ba-container { width: 100%; padding-inline: var(--ba-gutter); } .ba-page.ba-page.ba-page .ba-grid.ba-grid--two.ba-grid--two, .ba-page.ba-page.ba-page .ba-grid.ba-grid--auto.ba-grid--auto, .ba-page.ba-page.ba-page .ba-process-grid.ba-process-grid.ba-process-grid { grid-template-columns: 1fr; } .ba-page.ba-page.ba-page .ba-cluster.ba-cluster.ba-cluster { align-items: stretch; } } .ba-page.ba-page .ba-button.ba-button { display: inline-flex; width: fit-content; min-height: 3rem; align-items: center; justify-content: center; gap: 0.6rem; padding: 0.78rem 1.1rem; border: 2px solid transparent; border-radius: 0.75rem; font-family: var(--ba-font-body); font-size: var(--ba-text-sm); font-weight: 850; line-height: 1.1; text-align: center; text-decoration: none; transition: transform var(--ba-transition), background-color var(--ba-transition), border-color var(--ba-transition), color var(--ba-transition), box-shadow var(--ba-transition); } .ba-page.ba-page .ba-button.ba-button :where(a, button) { color: inherit; text-decoration: none; } .ba-page.ba-page .ba-button.ba-button--primary { color: var(--ba-color-ink); background: var(--ba-color-brand-bright); box-shadow: 0 0.75rem 1.6rem rgb(121 201 0 / 22%); } .ba-page.ba-page .ba-button.ba-button--primary:hover { color: var(--ba-color-ink); background: #a8ff18; box-shadow: 0 1rem 2rem rgb(121 201 0 / 30%); transform: translateY(-2px); } .ba-page.ba-page .ba-button.ba-button--secondary { color: var(--ba-color-surface); border-color: var(--ba-color-blue); background: var(--ba-color-blue); box-shadow: 0 0.65rem 1.4rem rgb(7 81 155 / 20%); } .ba-page.ba-page .ba-button.ba-button--secondary:hover { color: var(--ba-color-surface); border-color: var(--ba-color-blue-dark); background: var(--ba-color-blue-dark); transform: translateY(-2px); } .ba-page.ba-page .ba-button.ba-button--ghost { color: var(--ba-color-blue); border-color: var(--ba-color-blue); background: var(--ba-color-surface); } .ba-page.ba-page .ba-button.ba-button--ghost:hover { color: var(--ba-color-surface); border-color: var(--ba-color-blue-dark); background: var(--ba-color-blue-dark); transform: translateY(-2px); } .ba-page.ba-page .ba-button.ba-button-whatsapp { color: #ffffff; border-color: var(--ba-color-whatsapp); background: var(--ba-color-whatsapp); box-shadow: 0 0.65rem 1.35rem rgb(18 140 74 / 22%); line-height: 1.2; } .ba-page.ba-page .ba-button.ba-button-whatsapp::before { width: 1.1rem; height: 1.1rem; flex: 0 0 1.1rem; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 2a9.5 9.5 0 0 0-8.18 14.34L2.5 21.2l4.98-1.3A9.5 9.5 0 1 0 12 2Zm0 17.2a7.7 7.7 0 0 1-3.92-1.08l-.28-.17-2.96.77.79-2.88-.19-.3A7.7 7.7 0 1 1 12 19.2Zm4.22-5.76c-.23-.12-1.37-.68-1.58-.75-.21-.08-.36-.12-.52.11-.15.23-.59.75-.73.9-.13.16-.27.18-.5.06-.23-.11-.98-.36-1.86-1.15a6.9 6.9 0 0 1-1.29-1.6c-.13-.23-.01-.35.1-.46l.35-.41c.12-.14.16-.23.23-.39.08-.15.04-.29-.02-.4-.06-.12-.52-1.25-.71-1.71-.19-.45-.38-.39-.52-.4h-.44c-.16 0-.4.05-.62.28-.21.23-.8.78-.8 1.9s.82 2.21.93 2.36c.12.16 1.61 2.46 3.9 3.45.55.23.97.38 1.3.48.55.17 1.04.15 1.43.09.44-.07 1.37-.56 1.56-1.1.19-.55.19-1.02.13-1.11-.06-.1-.21-.16-.44-.27Z'/%3E%3C/svg%3E"); content: ""; } .ba-page.ba-page .ba-button.ba-button-whatsapp:hover { color: #ffffff; border-color: var(--ba-color-whatsapp-dark); background: var(--ba-color-whatsapp-dark); box-shadow: 0 1rem 2rem rgb(18 140 74 / 32%); transform: translateY(-2px); } @media (max-width: 30rem) { .ba-page.ba-page.ba-page .ba-button.ba-button.ba-button { width: 100%; } .ba-page.ba-page.ba-page .ba-button.ba-button-whatsapp.ba-button-whatsapp { min-height: 3.4rem; padding: 0.7rem 0.8rem; font-size: 0.9rem; line-height: 1.25; } } @media (prefers-reduced-motion: reduce) { .ba-page.ba-page .ba-button.ba-button { transition: none; } .ba-page.ba-page .ba-button.ba-button:hover { transform: none; } } .ba-page-home.ba-page-home .ba-home-hero-section.ba-home-hero-section { padding-block: 0; } .ba-page-home.ba-page-home .ba-home-hero.ba-home-hero { position: relative; isolation: isolate; min-height: clamp(45rem, 88vh, 57rem); display: flex; align-items: center; overflow: hidden; color: var(--ba-color-surface); background: linear-gradient(115deg, rgb(7 20 25 / 98%) 0 48%, rgb(3 44 84 / 93%) 72%, rgb(7 81 155 / 85%) 100%), var(--ba-color-ink); } .ba-home-hero::before { position: absolute; z-index: -1; top: -14rem; right: -8rem; width: 42rem; aspect-ratio: 1; border: 5rem solid rgb(148 230 0 / 12%); border-radius: 50%; content: ""; } .ba-home-hero::after { position: absolute; z-index: -1; right: 0; bottom: 0; width: 36%; height: 0.45rem; background: var(--ba-color-brand-bright); content: ""; } .ba-page-home.ba-page-home .ba-home-hero-container.ba-home-hero-container { padding-block: clamp(4rem, 7vw, 7rem); } .ba-page-home.ba-page-home.ba-page-home .ba-home-hero-content.ba-home-hero-content.ba-home-hero-content { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr); grid-template-rows: repeat(5, auto); gap: var(--ba-space-4) clamp(2.5rem, 6vw, 5.5rem); align-items: center; } .ba-page-home.ba-page-home .ba-home-hero-content :where(.ba-heading, .ba-text, .ba-home-hero-actions) { grid-column: 1; } .ba-home-hero .ba-heading, .ba-home-hero .ba-heading :where(h1, h2), .ba-home-hero .ba-text, .ba-home-hero .ba-text p { color: var(--ba-color-surface); } .ba-home-hero .ba-heading--eyebrow, .ba-home-hero .ba-heading--eyebrow :where(h2, h3, h4, p) { color: var(--ba-color-brand-bright); } @media (min-width: 30.01rem) { .ba-home-hero .ba-heading--display { max-width: 100%; } } .ba-home-hero .ba-text { max-width: 42rem; color: rgb(255 255 255 / 80%); } .ba-home-hero .ba-text p { color: inherit; } .ba-home-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ba-space-3); margin-top: var(--ba-space-2); } .ba-page-home.ba-page-home .ba-home-hero-actions .ba-button.ba-button { padding-inline: 0.85rem; font-size: 0.875rem; } .ba-home-hero-actions .ba-button--ghost { color: var(--ba-color-surface); border-color: #2474bd; background: var(--ba-color-blue); box-shadow: 0 0.65rem 1.4rem rgb(0 0 0 / 20%); } .ba-home-hero-actions .ba-button--ghost:hover { color: var(--ba-color-surface); border-color: #328bdc; background: #0b67b8; } .ba-page-home.ba-page-home .ba-home-hero-content .ba-home-hero-image.ba-home-hero-image { grid-column: 2; grid-row: 1 / span 5; min-height: clamp(25rem, 46vw, 34rem); display: block; overflow: hidden; border: 1px solid rgb(148 230 0 / 45%); border-radius: var(--ba-radius-lg); background: linear-gradient(145deg, transparent 42%, rgb(148 230 0 / 18%) 42% 58%, transparent 58%), radial-gradient(circle at 60% 35%, rgb(7 81 155 / 75%), transparent 48%), linear-gradient(155deg, #101d22, #03080b); box-shadow: var(--ba-shadow-dark); font-size: var(--ba-text-sm); } .ba-page-home.ba-page-home .ba-home-hero-content .ba-home-hero-image img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; } @media (max-width: 58rem) { .ba-page-home.ba-page-home.ba-page-home .ba-home-hero-content.ba-home-hero-content.ba-home-hero-content { grid-template-columns: 1fr; } .ba-page-home.ba-page-home .ba-home-hero-content :where(.ba-heading, .ba-text, .ba-home-hero-actions), .ba-page-home.ba-page-home .ba-home-hero-content .ba-home-hero-image.ba-home-hero-image { grid-column: 1; } .ba-page-home.ba-page-home .ba-home-hero-content .ba-home-hero-image.ba-home-hero-image { grid-row: auto; min-height: 23rem; } } @media (max-width: 30rem) { .ba-page-home.ba-page-home .ba-home-hero-actions.ba-home-hero-actions { flex-direction: column; } .ba-page-home.ba-page-home .ba-home-hero-content .ba-home-hero-image.ba-home-hero-image { min-height: 19rem; } } .ba-page .ba-review-flip.ba-testimonial { width: 100%; min-width: 0; min-height: 0; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: transparent; box-shadow: none; } .ba-page .ba-review-flip > :first-child { width: 100%; height: auto; min-height: 0; aspect-ratio: 3 / 4; } .ba-page .ba-review-flip > :first-child > :first-child { background-color: transparent; background-size: cover; background-position: center; background-repeat: no-repeat; } .ba-page .ba-review-flip > :first-child > :last-child { background-color: var(--ba-color-ink-soft); color: var(--ba-color-surface); } .ba-page .ba-review-flip > :first-child > :last-child > :first-child { padding: var(--ba-space-4); overflow-y: auto; } .ba-page .ba-review-flip h3 + div { font-family: var(--ba-font-body); font-size: var(--ba-text-base); line-height: 1.6; overflow-wrap: anywhere; } @media (prefers-reduced-motion: reduce) { .ba-page .ba-review-flip > :first-child > * { transition-duration: 0.01ms; } } .ba-site-header.ba-site-header { position: relative; z-index: 20; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--ba-space-4); width: 100%; padding: 0.7rem max(var(--ba-gutter), calc((100% - var(--ba-container)) / 2)); color: var(--ba-color-ink); background: rgb(255 255 255 / 96%); border-bottom: 1px solid var(--ba-color-line); box-shadow: 0 0.4rem 1.4rem rgb(7 20 25 / 7%); font-family: var(--ba-font-body); } .ba-brand--header.ba-brand--header { width: clamp(4.35rem, 4rem + 1vw, 5.4rem); } .ba-brand--header img, .ba-brand--footer img { display: block; width: 100%; height: auto; } .ba-navigation--primary.ba-navigation--primary { justify-self: end; } .ba-navigation--primary a { color: var(--ba-color-ink-soft); font-size: var(--ba-text-sm); font-weight: 700; text-decoration: none; } .ba-navigation--primary a:hover, .ba-navigation--primary a:focus-visible { color: var(--ba-color-brand-dark); } .ba-navigation--mobile-actions, .ba-navigation--mobile-drawer { display: none; } .ba-site-header.ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions a { display: inline-flex; min-height: 2.75rem; align-items: center; justify-content: center; padding: 0.65rem 1rem; color: #ffffff; background: var(--ba-color-whatsapp); border-radius: var(--ba-radius-pill); box-shadow: 0 0.6rem 1.4rem rgb(37 211 102 / 22%); font-size: var(--ba-text-sm); font-weight: 800; line-height: 1.2; text-decoration: none; transition: background var(--ba-transition), transform var(--ba-transition); } .ba-site-header.ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions a:hover, .ba-site-header.ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions a:focus-visible { color: #ffffff; background: var(--ba-color-whatsapp-dark); transform: translateY(-1px); } .ba-site-footer.ba-site-footer { display: grid; grid-template-columns: minmax(8rem, 0.8fr) 1fr 1fr; gap: var(--ba-space-5) var(--ba-space-6); width: 100%; padding: var(--ba-space-6) max(var(--ba-gutter), calc((100% - var(--ba-container)) / 2)) var(--ba-space-4); color: #ffffff; background: var(--ba-color-ink); border-top: 0.3rem solid var(--ba-color-brand); font-family: var(--ba-font-body); } .ba-brand--footer.ba-brand--footer { width: clamp(6.5rem, 5.5rem + 2vw, 9rem); align-self: start; } .ba-navigation--footer a, .ba-navigation--legal a { color: rgb(255 255 255 / 78%); font-size: var(--ba-text-sm); line-height: 1.5; text-decoration: none; } .ba-navigation--footer a:hover, .ba-navigation--footer a:focus-visible, .ba-navigation--legal a:hover, .ba-navigation--legal a:focus-visible { color: var(--ba-color-brand-bright); } .ba-site-footer__copyright.ba-site-footer__copyright { grid-column: 1 / -1; padding-top: var(--ba-space-4); color: rgb(255 255 255 / 62%); border-top: 1px solid rgb(255 255 255 / 14%); font-size: var(--ba-text-xs); } @media (max-width: 68rem) { .ba-site-header.ba-site-header { grid-template-columns: auto minmax(0, 1fr) auto; } .ba-site-header.ba-site-header .ba-navigation--primary.ba-navigation--primary { grid-column: 3; grid-row: 1; } .ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions { grid-column: 2; grid-row: 1; justify-self: end; } } @media (max-width: 46rem) { .ba-site-header.ba-site-header { grid-template-columns: 1fr; justify-items: center; gap: 0; min-height: 4.75rem; padding-block: 0.55rem; background: linear-gradient(115deg, rgb(20 73 55 / 72%), transparent 45%), var(--ba-color-ink); border-bottom-color: rgb(148 230 0 / 38%); box-shadow: 0 0.6rem 1.6rem rgb(7 20 25 / 18%); } .ba-brand--header.ba-brand--header { width: 4.35rem; justify-self: center; filter: drop-shadow(0 0.25rem 0.55rem rgb(0 0 0 / 18%)); } .ba-site-header.ba-site-header .ba-navigation--primary.ba-navigation--primary { display: none; } .ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions { display: none; } .ba-site-footer.ba-site-footer { grid-template-columns: 1fr 1fr; gap: var(--ba-space-5) var(--ba-space-4); padding-bottom: calc(6.5rem + env(safe-area-inset-bottom)); } .ba-brand--footer.ba-brand--footer { grid-column: 1 / -1; width: 6.75rem; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer { display: block; position: fixed; bottom: 0; z-index: 100; height: calc(4.85rem + env(safe-area-inset-bottom)); margin: 0; padding-bottom: env(safe-area-inset-bottom); color: var(--ba-color-blue-dark); background: linear-gradient(165deg, #ffffff 0%, #eef6ff 100%); border: 0; border-top: 2px solid var(--ba-color-blue); border-radius: 0; box-shadow: 0 -0.45rem 1.3rem rgb(7 20 25 / 14%); backdrop-filter: blur(0.85rem); } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions { left: 0; width: 66.6667%; padding: 0; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions > div, .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions nav, .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions ul { width: 100%; height: 100%; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 0; margin: 0; padding: 0; list-style: none; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions li { position: relative; min-width: 0; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a { position: relative; display: flex; height: 100%; min-height: 4.75rem; flex-direction: column; align-items: center; justify-content: center; gap: 0; padding: 2.65rem 0.3rem 0.5rem; overflow: hidden; color: var(--ba-color-blue-dark); background-color: #edf6ff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2307519b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 11.6a8.5 8.5 0 0 1-12.6 7.5L3 20.5l1.4-4.7A8.5 8.5 0 1 1 20.5 11.6Z'/%3E%3Cpath d='M8.6 8.1c.3 3 2.3 5 5.3 5.3'/%3E%3C/svg%3E"), linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); background-position: center 0.65rem, center; background-repeat: no-repeat; background-size: 1.65rem 1.65rem, 100% 100%; border: 0; border-radius: 0; font-family: var(--ba-font-display); font-size: 0.95rem; font-weight: 800; line-height: 1; letter-spacing: 0.025em; text-align: center; text-decoration: none; transition: color var(--ba-transition), background var(--ba-transition), border-color var(--ba-transition), transform var(--ba-transition); } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a[href*="reservar"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2307519b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M8 3.5V7M16 3.5V7M3.5 9.5h17M8 15l2.1 2.1L16 12'/%3E%3C/svg%3E"), linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a:hover, .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a:focus-visible { color: var(--ba-color-blue); background-color: #dceeff; transform: none; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer { position: fixed; right: 0; width: 33.3333%; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"] { display: flex; width: 100%; height: 100%; min-height: 4.75rem; flex-direction: column; align-items: center; justify-content: center; gap: 0.26rem; margin: 0; padding: 0.55rem 0.25rem 0.45rem; color: var(--ba-color-blue-dark); background: linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); border: 0; border-radius: 0; font-size: 0; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"]::before { display: block; width: 1.55rem; height: 1.55rem; background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2307519b' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M5 7h14M5 12h14M5 17h14'/%3E%3C/svg%3E"); content: ""; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"] svg, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"] i { display: none; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"]::after { content: "Menú"; font-family: var(--ba-font-display); font-size: 0.95rem; font-weight: 800; line-height: 1; letter-spacing: 0.025em; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"][aria-expanded="true"] { color: var(--ba-color-blue); background-color: #dceeff; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] { display: block; position: fixed; right: 0; bottom: calc(4.85rem + env(safe-area-inset-bottom)); left: auto; width: min(90vw, 23rem); max-height: calc(100dvh - 6.25rem - env(safe-area-inset-bottom)); overflow-y: auto; padding: 0.65rem; color: var(--ba-color-blue-dark); background: linear-gradient(150deg, #ffffff 0%, #eaf4ff 100%); border: 1px solid rgb(7 81 155 / 30%); border-right: 0; border-radius: 1rem 0 0 0; box-shadow: -0.8rem -0.8rem 2rem rgb(7 20 25 / 18%); opacity: 0; visibility: hidden; pointer-events: none; transform: translate3d(0, 1.25rem, 0) scale(0.985); transform-origin: right bottom; transition: opacity 170ms ease-out, transform 240ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 240ms; will-change: opacity, transform; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden="false"] { opacity: 1; visibility: visible; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); transition-delay: 0s; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] a { padding: 0.95rem 1rem; color: var(--ba-color-blue-dark); border-bottom: 1px solid rgb(7 81 155 / 16%); border-left: 0.18rem solid transparent; font-size: 0.95rem; font-weight: 750; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] a:hover, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] a:focus-visible, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] a[aria-current="page"] { color: var(--ba-color-blue-dark); background: rgb(7 81 155 / 9%); border-left-color: var(--ba-color-blue); } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a { padding: 0.45rem; color: transparent; background-image: url("/wp-content/uploads/2026/09/Contacto.png"), linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); background-position: center, center; background-repeat: no-repeat; background-size: auto 2.85rem, 100% 100%; font-size: 0; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a[href*="reservar"] { background-image: url("/wp-content/uploads/2026/09/reservar.png"), linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); } .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a::before, .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a::after { display: none; content: none; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"], .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"][aria-expanded="true"] { background-color: #edf6ff; background-image: url("/wp-content/uploads/2026/09/Menu_1.png"), linear-gradient(145deg, #ffffff 0%, #edf6ff 70%, #e2f0fc 100%); background-position: center, center; background-repeat: no-repeat; background-size: auto 2.85rem, 100% 100%; } .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"]::before, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer [role="button"]::after { display: none; content: none; } } @media (max-width: 30rem) { .ba-site-footer.ba-site-footer { grid-template-columns: 1fr; } .ba-brand--footer.ba-brand--footer, .ba-site-footer__copyright.ba-site-footer__copyright { grid-column: 1; } } @media (prefers-reduced-motion: reduce) { .ba-site-header.ba-site-header.ba-site-header .ba-navigation--actions.ba-navigation--actions a, .ba-site-footer.ba-site-footer .ba-navigation--mobile-actions a, .ba-site-footer.ba-site-footer .ba-navigation--mobile-drawer nav[aria-hidden] { transition: none; } } .ba-heading, .ba-heading :where(h1, h2, h3, h4) { color: inherit; font-family: var(--ba-font-display); font-weight: 900; line-height: 0.98; letter-spacing: 0.005em; } .ba-heading--display, .ba-heading--display :where(h1, h2) { max-width: 11ch; font-size: var(--ba-text-display); line-height: 0.98; letter-spacing: 0.018em; text-transform: uppercase; } .ba-heading:not(.ba-heading--display):not(.ba-heading--eyebrow), .ba-heading:not(.ba-heading--display):not(.ba-heading--eyebrow) :where(h2) { font-size: var(--ba-text-h2); text-transform: uppercase; } .ba-page.ba-page .ba-card .ba-heading.ba-heading, .ba-page.ba-page .ba-card .ba-heading.ba-heading :where(h3, h4), .ba-page.ba-page .ba-faq .ba-heading.ba-heading, .ba-page.ba-page .ba-faq .ba-heading.ba-heading :where(h3, h4) { font-family: var(--ba-font-body); font-size: var(--ba-text-h3); font-weight: 850; line-height: 1.08; letter-spacing: -0.025em; text-transform: none; } .ba-heading--eyebrow, .ba-heading--eyebrow :where(h2, h3, h4, p) { color: var(--ba-color-brand-dark); font-family: var(--ba-font-body); font-size: var(--ba-text-xs); font-weight: 900; line-height: 1.2; letter-spacing: 0.13em; text-transform: uppercase; } .ba-text, .ba-text p { color: var(--ba-color-muted); font-family: var(--ba-font-body); font-size: var(--ba-text-base); line-height: 1.6; } .ba-text--lead, .ba-text--lead p { max-width: 60ch; font-size: var(--ba-text-lead); line-height: 1.5; } .ba-text--small, .ba-text--small p { font-size: var(--ba-text-sm); } @media (max-width: 30rem) { .ba-heading--display, .ba-heading--display :where(h1, h2) { max-width: none; font-size: clamp(2rem, 9.5vw, 2.45rem); line-height: 1.08; letter-spacing: 0.028em; } .ba-heading:not(.ba-heading--display):not(.ba-heading--eyebrow), .ba-heading:not(.ba-heading--display):not(.ba-heading--eyebrow) :where(h2) { font-size: clamp(1.8rem, 8.5vw, 2.15rem); line-height: 1.1; letter-spacing: 0.022em; } } .ba-page-home > .ba-section > .ba-container > .ba-heading:first-child { max-width: 18ch; } .ba-page-contacto .ba-contact-hero { color: var(--ba-color-surface); background: radial-gradient(circle at 86% 18%, rgb(148 230 0 / 20%), transparent 24rem), linear-gradient(135deg, var(--ba-color-blue-dark), var(--ba-color-ink)); } .ba-page-contacto .ba-contact-hero-container, .ba-page-contacto .ba-contact-info-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(19rem, 0.8fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; } .ba-page-contacto .ba-contact-hero :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-hero .ba-heading--eyebrow, .ba-page-contacto .ba-contact-number { color: var(--ba-color-brand-bright); } .ba-page-contacto .ba-contact-hero .ba-heading--display { max-width: 11ch; } .ba-page-contacto .ba-contact-hero-content > .ba-text--lead { max-width: 42rem; color: rgb(255 255 255 / 82%); } .ba-page-contacto .ba-contact-hours { color: rgb(255 255 255 / 72%); } .ba-page-contacto .ba-contact-summary { display: flex; flex-direction: column; gap: 1rem; border: 1px solid rgb(255 255 255 / 18%); color: var(--ba-color-surface); background: rgb(255 255 255 / 8%); box-shadow: var(--ba-shadow-dark); backdrop-filter: blur(0.65rem); } .ba-page-contacto .ba-contact-summary :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-summary .ba-text--small { color: var(--ba-color-brand-bright); font-weight: 900; letter-spacing: 0.12em; } .ba-page-contacto .ba-contact-reasons { background: var(--ba-color-canvas); } .ba-page-contacto.ba-page-contacto .ba-contact-reasons-grid.ba-contact-reasons-grid, .ba-page-contacto.ba-page-contacto .ba-contact-process-grid.ba-contact-process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-page-contacto .ba-contact-card { display: flex; min-height: 23rem; flex-direction: column; gap: 0.9rem; border-top: 0.4rem solid var(--ba-color-blue); } .ba-page-contacto .ba-contact-card .ba-button { width: 100%; margin-top: auto; } .ba-page-contacto .ba-contact-card--business { color: var(--ba-color-surface); border-color: var(--ba-color-brand-bright); background: var(--ba-color-blue-dark); box-shadow: var(--ba-shadow-dark); } .ba-page-contacto .ba-contact-card--business :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-process { color: var(--ba-color-surface); background: var(--ba-color-blue-dark); } .ba-page-contacto .ba-contact-process > .ba-container > .ba-heading { color: var(--ba-color-surface); } .ba-page-contacto .ba-contact-process-grid { counter-reset: ba-contact-step; } .ba-page-contacto .ba-contact-step { position: relative; min-height: 13rem; padding-right: 4.5rem; counter-increment: ba-contact-step; border-color: rgb(255 255 255 / 14%); background: rgb(255 255 255 / 7%); box-shadow: none; } .ba-page-contacto .ba-contact-step :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-step .ba-text { color: rgb(255 255 255 / 76%); } .ba-page-contacto .ba-contact-step::before { position: absolute; top: 1.35rem; right: 1.35rem; left: auto; width: 2.5rem; height: 2.5rem; border-radius: 50%; color: var(--ba-color-ink); background: var(--ba-color-brand-bright); content: counter(ba-contact-step, decimal-leading-zero); font-size: 0.78rem; font-weight: 900; line-height: 2.5rem; text-align: center; } .ba-page-contacto .ba-contact-info { background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-page-contacto .ba-contact-data { padding-bottom: 0.85rem; border-bottom: 1px solid var(--ba-color-line); font-weight: 700; } .ba-page-contacto .ba-contact-instagram { align-self: flex-start; } .ba-page-contacto .ba-contact-appointment { border: 0; color: var(--ba-color-ink); background: var(--ba-color-brand-bright); } .ba-page-contacto .ba-contact-appointment :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-final { background: var(--ba-color-canvas); } .ba-page-contacto .ba-contact-final-cta { color: var(--ba-color-surface); background: radial-gradient(circle at 82% 20%, rgb(148 230 0 / 18%), transparent 20rem), var(--ba-color-ink); } .ba-page-contacto .ba-contact-final-cta :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-contacto .ba-contact-final-cta .ba-text--small { color: rgb(255 255 255 / 70%); } @media (max-width: 58rem) { .ba-page-contacto .ba-contact-hero-container, .ba-page-contacto .ba-contact-info-grid { grid-template-columns: 1fr; } .ba-page-contacto .ba-contact-summary, .ba-page-contacto .ba-contact-appointment { max-width: 40rem; } } @media (max-width: 46rem) { .ba-page-contacto.ba-page-contacto .ba-contact-reasons-grid.ba-contact-reasons-grid, .ba-page-contacto.ba-page-contacto .ba-contact-process-grid.ba-contact-process-grid { grid-template-columns: 1fr; } .ba-page-contacto .ba-contact-card, .ba-page-contacto .ba-contact-step { min-height: 0; } .ba-page-contacto .ba-contact-hero .ba-heading--display { letter-spacing: 0.02em; line-height: 1.08; } } .ba-page-home > .ba-section > .ba-container > .ba-text--lead { max-width: 50rem; } .ba-card { min-width: 0; padding: clamp(1.4rem, 1rem + 1vw, 2rem); border: 1px solid var(--ba-color-line); border-radius: var(--ba-radius-md); background: var(--ba-color-surface); box-shadow: var(--ba-shadow-card); } .ba-home-benefits { background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-home-benefits > .ba-container { gap: var(--ba-space-5); } .ba-home-benefits .ba-heading--eyebrow { color: var(--ba-color-blue); } .ba-page-home.ba-page-home .ba-home-benefits .ba-grid--auto.ba-grid--auto { width: 100%; align-self: stretch; margin-top: var(--ba-space-3); } .ba-benefit-card { position: relative; min-height: 12rem; overflow: hidden; border-color: #1c3037; color: var(--ba-color-surface); background: var(--ba-color-ink); box-shadow: var(--ba-shadow-dark); } .ba-benefit-card:nth-of-type(2), .ba-benefit-card:nth-of-type(5) { color: var(--ba-color-ink); border-color: var(--ba-color-brand); background: var(--ba-color-brand-bright); box-shadow: 0 1rem 2.5rem rgb(121 201 0 / 18%); } .ba-benefit-card::after { position: absolute; right: -1.25rem; bottom: -1.25rem; width: 5rem; aspect-ratio: 1; border: 0.8rem solid rgb(148 230 0 / 18%); border-radius: 50%; content: ""; } .ba-benefit-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-benefit-card .ba-text { opacity: 0.78; } .ba-home-bikes { position: relative; color: var(--ba-color-surface); background: radial-gradient(circle at 90% 15%, rgb(148 230 0 / 14%), transparent 24rem), linear-gradient(135deg, var(--ba-color-blue-dark), var(--ba-color-blue) 68%, #0b67b8); } .ba-home-bikes :where(.ba-heading, .ba-heading h2) { color: var(--ba-color-surface); } .ba-home-bikes .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-home-bikes :where(.ba-text, .ba-text p) { color: rgb(255 255 255 / 78%); } .ba-bike-specs, .ba-bike-equipment { align-content: start; } .ba-home-bikes .ba-card { min-height: 13rem; border: 1px solid rgb(255 255 255 / 20%); background: rgb(3 19 30 / 76%); box-shadow: var(--ba-shadow-dark); } .ba-home-bikes .ba-card :where(.ba-heading, .ba-text, p) { color: var(--ba-color-surface); } .ba-home-bikes .ba-card:first-child { border-color: var(--ba-color-brand-bright); } .ba-home-bikes .ba-button--secondary { color: var(--ba-color-ink); border-color: var(--ba-color-brand-bright); background: var(--ba-color-brand-bright); } .ba-home-process { color: var(--ba-color-ink); background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), linear-gradient(135deg, rgb(148 230 0 / 9%), transparent 45%), var(--ba-color-surface); } .ba-home-process .ba-heading--eyebrow { color: var(--ba-color-ink); } .ba-process-grid { counter-reset: ba-step; margin-top: var(--ba-space-3); } .ba-page-home.ba-page-home .ba-process-step.ba-process-step { position: relative; min-height: 11rem; padding: 1.6rem 5rem 1.6rem clamp(1.4rem, 1rem + 1vw, 2rem); overflow: hidden; counter-increment: ba-step; border: 0; color: var(--ba-color-surface); background: var(--ba-color-ink); box-shadow: var(--ba-shadow-dark); } .ba-page-home.ba-page-home .ba-process-step.ba-process-step::before { position: absolute; top: 1.15rem; right: 1.25rem; left: auto; width: 2.6rem; min-width: 2.6rem; max-width: 2.6rem; height: 2.6rem; min-height: 2.6rem; max-height: 2.6rem; display: block; border-radius: 50%; color: var(--ba-color-ink); background: var(--ba-color-brand-bright); content: counter(ba-step, decimal-leading-zero); font-size: 0.75rem; font-weight: 900; line-height: 2.6rem; text-align: center; } .ba-process-step :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-process-step .ba-text { opacity: 0.78; } .ba-home-process .ba-button-whatsapp { border-color: var(--ba-color-whatsapp-dark); box-shadow: 0 0.75rem 1.6rem rgb(18 140 74 / 24%); } .ba-home-reviews { color: var(--ba-color-surface); background: linear-gradient(120deg, rgb(7 81 155 / 34%), transparent 60%), var(--ba-color-ink); } .ba-home-reviews :where(.ba-heading, .ba-heading h2) { color: var(--ba-color-surface); } .ba-home-reviews .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-home-reviews :where(.ba-text, .ba-text p) { color: rgb(255 255 255 / 72%); } .ba-page-home.ba-page-home .ba-testimonials--grid.ba-testimonials--grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ba-space-4); margin-top: var(--ba-space-3); } .ba-testimonial { min-height: 12rem; border: 1px dashed rgb(148 230 0 / 55%); color: var(--ba-color-surface); background: rgb(255 255 255 / 7%); box-shadow: none; } .ba-testimonial :where(.ba-text, p) { color: inherit; } .ba-home-conditions { background: linear-gradient(90deg, transparent 0 65%, rgb(148 230 0 / 11%) 65% 100%), var(--ba-color-surface); } .ba-page-home.ba-page-home .ba-benefits--compact.ba-benefits--compact { display: block; width: 100%; } .ba-home-conditions .ba-benefits--compact .ba-card { min-height: 10rem; border-top: 0.4rem solid var(--ba-color-brand); box-shadow: var(--ba-shadow-card); } .ba-home-faq { background: var(--ba-color-canvas); } .ba-faq { max-width: var(--ba-container-narrow); margin-top: var(--ba-space-3); gap: 0.55rem; } .ba-page-home.ba-page-home .ba-faq .ba-heading.ba-heading { margin-top: 0.7rem; padding: 1rem 1.15rem; border-left: 0.35rem solid var(--ba-color-brand-bright); border-radius: var(--ba-radius-sm) var(--ba-radius-sm) 0 0; color: var(--ba-color-surface); background: var(--ba-color-ink); } .ba-page-home.ba-page-home .ba-faq .ba-text.ba-text { margin-top: -0.55rem; padding: 0.95rem 1.15rem 1.1rem; border: 1px solid var(--ba-color-line); border-top: 0; border-radius: 0 0 var(--ba-radius-sm) var(--ba-radius-sm); color: var(--ba-color-muted); background: var(--ba-color-surface); } .ba-final-cta { position: relative; overflow: hidden; color: var(--ba-color-surface); background: linear-gradient(115deg, var(--ba-color-ink) 0 62%, var(--ba-color-blue-dark) 62% 100%); } .ba-final-cta::before { position: absolute; top: 0; left: 0; width: 9rem; height: 0.45rem; background: var(--ba-color-brand-bright); content: ""; } .ba-final-cta > .ba-container { position: relative; align-items: flex-start; } .ba-final-cta :where(.ba-heading, .ba-heading h2) { max-width: 17ch; color: var(--ba-color-surface); } .ba-final-cta :where(.ba-text, .ba-text p) { max-width: 48rem; color: rgb(255 255 255 / 76%); } @media (max-width: 52rem) { .ba-page-home.ba-page-home .ba-testimonials--grid.ba-testimonials--grid { grid-template-columns: 1fr; } } @media (max-width: 46rem) { .ba-benefit-card, .ba-process-step, .ba-testimonial { min-height: 0; } .ba-home-conditions { background: var(--ba-color-surface); } } .ba-page-legal .ba-legal-hero { color: var(--ba-color-surface); background: linear-gradient(120deg, var(--ba-color-ink), var(--ba-color-blue-dark)); } .ba-page-legal .ba-legal-hero :where(.ba-heading, .ba-heading h1, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-legal .ba-legal-hero .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-page-legal .ba-legal-hero .ba-heading--display { max-width: 15ch; } .ba-page-legal .ba-legal-content { background: var(--ba-color-surface); } .ba-page-legal .ba-legal-content--alternate { background: var(--ba-color-canvas); } .ba-page-legal .ba-container { max-width: 58rem; } .ba-page-legal .ba-legal-grid { align-items: stretch; } .ba-page-legal .ba-legal-card { border-top: 0.35rem solid var(--ba-color-blue); } .ba-page-legal .ba-legal-data-card { display: flex; flex-direction: column; gap: 0.7rem; color: var(--ba-color-surface); border: 0; background: var(--ba-color-blue-dark); } .ba-page-legal .ba-legal-data-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-page-legal .ba-legal-inline-placeholder, .ba-page-legal .ba-legal-placeholder { color: #5a3b00; border-color: #e1a900; background: #fff3c4; } .ba-page-legal .ba-legal-pending-section { background: linear-gradient(135deg, #fff8df, var(--ba-color-canvas)); } .ba-page-legal .ba-legal-pending-section > .ba-container { border-left: 0.4rem solid #e1a900; } .ba-page-legal .ba-legal-final { color: var(--ba-color-surface); background: var(--ba-color-blue-dark); } .ba-page-legal .ba-legal-final :where(.ba-heading, .ba-text, p) { color: inherit; } @media (max-width: 46rem) { .ba-page-legal .ba-legal-grid { grid-template-columns: 1fr; } } .ba-page-publicidad-empresas { --ba-ad-accent: #00b8ff; --ba-ad-accent-soft: #dff6ff; --ba-ad-violet: #6647f5; --ba-ad-ink: #071a35; } .ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-hero-section.ba-ad-hero-section { padding-block: 0; } .ba-page-publicidad-empresas .ba-ad-hero { min-height: clamp(42rem, 78vh, 52rem); display: flex; align-items: center; color: var(--ba-color-surface); background: radial-gradient(circle at 82% 20%, rgb(0 184 255 / 28%), transparent 25rem), linear-gradient(125deg, var(--ba-ad-ink), var(--ba-color-blue-dark) 48%, var(--ba-ad-violet)); } .ba-page-publicidad-empresas .ba-ad-hero-container { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: center; padding-block: clamp(4rem, 7vw, 6.5rem); } .ba-page-publicidad-empresas .ba-ad-hero :where(.ba-heading, .ba-heading h1, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-publicidad-empresas .ba-ad-hero .ba-heading--eyebrow { color: var(--ba-ad-accent); } .ba-page-publicidad-empresas .ba-ad-hero .ba-heading--display { max-width: 12ch; } .ba-page-publicidad-empresas .ba-ad-hero-content > .ba-text { max-width: 42rem; color: rgb(255 255 255 / 82%); } .ba-ad-hero-actions { display: flex; flex-wrap: wrap; gap: var(--ba-space-3); } .ba-ad-hero-placeholder { min-height: 30rem; display: block; overflow: hidden; border: 1px dashed rgb(0 184 255 / 72%); border-radius: var(--ba-radius-lg); color: rgb(255 255 255 / 72%); background: linear-gradient(145deg, transparent 40%, rgb(0 184 255 / 18%) 40% 58%, transparent 58%), radial-gradient(circle at 60% 35%, rgb(102 71 245 / 52%), transparent 45%), rgb(255 255 255 / 6%); box-shadow: var(--ba-shadow-dark); } .ba-ad-hero-placeholder img, .ba-ad-format-image img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; } .ba-ad-intro { background: linear-gradient(90deg, var(--ba-ad-accent) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-ad-intro .ba-heading--eyebrow { color: var(--ba-color-blue); } .ba-ad-honesty-note { display: grid; grid-template-columns: minmax(12rem, 0.55fr) minmax(0, 1.45fr); gap: var(--ba-space-4); align-items: center; color: var(--ba-color-surface); border: 0; background: var(--ba-ad-ink); } .ba-ad-honesty-note :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-ad-modalities { background: radial-gradient(circle at 90% 12%, rgb(102 71 245 / 12%), transparent 26rem), var(--ba-color-canvas); } .ba-ad-anchor { color: var(--ba-ad-violet); font-size: 0.78rem; font-weight: 900; letter-spacing: 0.13em; } .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-modalities-grid.ba-ad-modalities-grid.ba-ad-modalities-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-ad-product-card { min-height: 22rem; display: flex; flex-direction: column; gap: var(--ba-space-3); border-top: 0.4rem solid var(--ba-ad-accent); } .ba-ad-product-number { color: var(--ba-color-blue); font-weight: 900; letter-spacing: 0.08em; } .ba-ad-product-card--featured { color: var(--ba-color-surface); border-color: var(--ba-color-brand-bright); background: linear-gradient(145deg, var(--ba-color-blue-dark), var(--ba-ad-violet)); box-shadow: 0 1.2rem 3rem rgb(37 28 105 / 24%); } .ba-ad-product-card--featured :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-ad-product-card--featured .ba-ad-product-number { color: var(--ba-color-brand-bright); } .ba-ad-product-card--featured .ba-button { margin-top: auto; } .ba-ad-flow { color: var(--ba-color-surface); background: linear-gradient(120deg, rgb(0 184 255 / 16%), transparent 55%), var(--ba-ad-ink); } .ba-ad-flow :where(.ba-heading, .ba-heading h2) { color: inherit; } .ba-ad-flow .ba-heading--eyebrow { color: var(--ba-ad-accent); } .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-flow-grid.ba-ad-flow-grid.ba-ad-flow-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } .ba-ad-flow-step { position: relative; min-height: 12rem; color: var(--ba-color-surface); border-color: rgb(0 184 255 / 35%); background: rgb(255 255 255 / 7%); box-shadow: none; } .ba-ad-flow-step:not(:last-child)::after { position: absolute; top: 50%; right: -1.25rem; z-index: 2; color: var(--ba-ad-accent); content: "→"; font-size: 1.5rem; font-weight: 900; } .ba-ad-flow-step :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-ad-flow-note { padding: var(--ba-space-3) var(--ba-space-4); border-left: 0.35rem solid var(--ba-color-brand-bright); color: rgb(255 255 255 / 82%); background: rgb(255 255 255 / 6%); } .ba-ad-includes { background: var(--ba-color-surface); } .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-includes-grid.ba-ad-includes-grid.ba-ad-includes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-ad-service-card { min-height: 11rem; border-top: 0.35rem solid var(--ba-ad-violet); } .ba-ad-service-card.ba-is-pending { border-style: dashed; color: #17415c; background: var(--ba-ad-accent-soft); } .ba-ad-process { background: linear-gradient(90deg, transparent 0 70%, rgb(0 184 255 / 10%) 70% 100%), var(--ba-color-canvas); } .ba-ad-process-grid { counter-reset: ba-ad-process; } .ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-process-step.ba-ad-process-step { position: relative; min-height: 12rem; padding: 1.6rem 4.8rem 1.6rem clamp(1.4rem, 1rem + 1vw, 2rem); counter-increment: ba-ad-process; border-color: rgb(0 184 255 / 25%); } .ba-ad-process-step::before { position: absolute; top: 1.35rem; right: 1.35rem; left: auto; width: 2.55rem; height: 2.55rem; border-radius: 50%; color: var(--ba-color-surface); background: var(--ba-ad-violet); content: counter(ba-ad-process, decimal-leading-zero); font-size: 0.78rem; font-weight: 900; line-height: 2.55rem; text-align: center; } .ba-ad-formats { color: var(--ba-color-surface); background: linear-gradient(125deg, var(--ba-color-blue-dark), var(--ba-ad-violet)); } .ba-ad-formats :where(.ba-heading, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-formats-grid.ba-ad-formats-grid.ba-ad-formats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-ad-format-placeholder { min-height: 17rem; display: grid; place-items: end start; padding: var(--ba-space-4); border: 1px dashed rgb(255 255 255 / 58%); border-radius: var(--ba-radius-md); color: rgb(255 255 255 / 76%); background: rgb(255 255 255 / 7%); } .ba-ad-future-note { display: grid; grid-template-columns: minmax(14rem, 0.6fr) minmax(0, 1.4fr); gap: var(--ba-space-4); align-items: center; color: var(--ba-ad-ink); border: 0; background: var(--ba-ad-accent); } .ba-ad-future-note :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-ad-faq { background: var(--ba-color-canvas); } .ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-faq .ba-faq .ba-heading.ba-heading { margin-top: 0.7rem; padding: 1rem 1.15rem; border-left: 0.35rem solid var(--ba-ad-accent); border-radius: var(--ba-radius-sm) var(--ba-radius-sm) 0 0; color: var(--ba-color-surface); background: var(--ba-ad-ink); } .ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-faq .ba-faq .ba-text.ba-text { margin-top: -0.55rem; padding: 0.95rem 1.15rem 1.1rem; border: 1px solid var(--ba-color-line); border-top: 0; border-radius: 0 0 var(--ba-radius-sm) var(--ba-radius-sm); color: var(--ba-color-muted); background: var(--ba-color-surface); } .ba-page-publicidad-empresas .ba-ad-final-cta { background: linear-gradient(115deg, var(--ba-ad-ink) 0 58%, var(--ba-ad-violet) 58% 100%); } .ba-page-publicidad-empresas .ba-ad-final-cta::before { background: var(--ba-ad-accent); } @media (max-width: 68rem) { .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-flow-grid.ba-ad-flow-grid.ba-ad-flow-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-ad-flow-step::after { display: none; } } @media (max-width: 64rem) { .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-modalities-grid.ba-ad-modalities-grid.ba-ad-modalities-grid, .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-includes-grid.ba-ad-includes-grid.ba-ad-includes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 58rem) { .ba-page-publicidad-empresas .ba-ad-hero-container { grid-template-columns: 1fr; } .ba-ad-hero-placeholder { min-height: 22rem; } } @media (max-width: 46rem) { .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-modalities-grid.ba-ad-modalities-grid.ba-ad-modalities-grid, .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-flow-grid.ba-ad-flow-grid.ba-ad-flow-grid, .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-includes-grid.ba-ad-includes-grid.ba-ad-includes-grid, .ba-page-publicidad-empresas.ba-page-publicidad-empresas.ba-page-publicidad-empresas .ba-ad-formats-grid.ba-ad-formats-grid.ba-ad-formats-grid, .ba-ad-honesty-note, .ba-ad-future-note { grid-template-columns: 1fr; } .ba-ad-product-card, .ba-ad-flow-step, .ba-ad-service-card, .ba-ad-process-step, .ba-ad-format-placeholder { min-height: 0; } .ba-ad-process { background: var(--ba-color-canvas); } } .ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-hero-section.ba-bike-page-hero-section { padding-block: 0; } .ba-page-bicicletas .ba-bike-page-hero { position: relative; isolation: isolate; min-height: clamp(42rem, 78vh, 52rem); display: flex; align-items: center; overflow: hidden; color: var(--ba-color-surface); background: radial-gradient(circle at 78% 30%, rgb(148 230 0 / 18%), transparent 23rem), linear-gradient(120deg, var(--ba-color-ink) 0 48%, var(--ba-color-blue-dark) 76%, var(--ba-color-blue) 100%); } .ba-ad-format-image { display: block; overflow: hidden; padding: 0; } .ba-page-bicicletas .ba-bike-page-hero::after { position: absolute; z-index: -1; right: -8rem; bottom: -12rem; width: 34rem; aspect-ratio: 1; border: 4.5rem solid rgb(148 230 0 / 12%); border-radius: 50%; content: ""; } .ba-page-bicicletas .ba-bike-page-hero-container { padding-block: clamp(4rem, 7vw, 6.5rem); } .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-hero-content.ba-bike-page-hero-content.ba-bike-page-hero-content { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr); grid-template-rows: repeat(5, auto); gap: var(--ba-space-4) clamp(2.5rem, 6vw, 5.5rem); align-items: center; } .ba-page-bicicletas .ba-bike-page-hero-content > :not(.ba-bike-page-image-placeholder) { grid-column: 1; } .ba-page-bicicletas .ba-bike-page-hero :where(.ba-heading, .ba-heading h1, .ba-heading h2, .ba-text, .ba-text p) { color: var(--ba-color-surface); } .ba-page-bicicletas .ba-bike-page-hero .ba-heading--eyebrow, .ba-page-bicicletas .ba-bike-page-hero .ba-heading--eyebrow :where(h2, h3) { color: var(--ba-color-brand-bright); } .ba-page-bicicletas .ba-bike-page-hero .ba-heading--display { max-width: 13ch; } .ba-page-bicicletas .ba-bike-page-hero .ba-text { max-width: 44rem; color: rgb(255 255 255 / 80%); } .ba-page-bicicletas .ba-bike-page-hero-actions { display: flex; flex-wrap: wrap; gap: var(--ba-space-3); } .ba-page-bicicletas .ba-bike-page-hero .ba-button--ghost { color: var(--ba-color-surface); border-color: #2b7fc9; background: var(--ba-color-blue); } .ba-page-bicicletas .ba-bike-page-image-placeholder { grid-column: 2; grid-row: 1 / span 5; min-height: clamp(25rem, 43vw, 32rem); display: block; overflow: hidden; border: 1px solid rgb(148 230 0 / 48%); border-radius: var(--ba-radius-lg); background: linear-gradient(145deg, transparent 42%, rgb(148 230 0 / 18%) 42% 58%, transparent 58%), radial-gradient(circle at 58% 38%, rgb(7 81 155 / 76%), transparent 46%), linear-gradient(155deg, #111f25, #03080b); box-shadow: var(--ba-shadow-dark); } .ba-page-bicicletas .ba-bike-page-image-placeholder img, .ba-bike-page-detail-placeholder img, .ba-bike-gallery-placeholder img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; } .ba-bike-page-facts { background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-facts-grid.ba-bike-page-facts-grid.ba-bike-page-facts-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-specs-grid.ba-bike-page-specs-grid.ba-bike-page-specs-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ba-bike-fact-card { min-height: 12rem; border-top: 0.35rem solid var(--ba-color-brand-bright); background: var(--ba-color-ink); box-shadow: var(--ba-shadow-dark); } .ba-bike-fact-card :where(.ba-heading, .ba-text, p) { color: var(--ba-color-surface); } .ba-bike-fact-card .ba-text, .ba-bike-equipment-card .ba-text { opacity: 0.76; } .ba-bike-page-specs { background: radial-gradient(circle at 92% 12%, rgb(7 81 155 / 10%), transparent 26rem), var(--ba-color-canvas); } .ba-bike-spec-card { min-height: 11rem; border-color: rgb(7 81 155 / 18%); box-shadow: 0 0.8rem 2rem rgb(7 20 25 / 8%); } .ba-bike-spec-card .ba-heading { color: var(--ba-color-blue); } .ba-bike-spec-card--highlight { color: var(--ba-color-ink); border-color: var(--ba-color-brand); background: var(--ba-color-brand-bright); } .ba-bike-spec-card--highlight :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-bike-range-note { display: grid; grid-template-columns: minmax(13rem, 0.7fr) minmax(0, 1.3fr); align-items: center; gap: var(--ba-space-4); color: var(--ba-color-surface); border: 0; background: var(--ba-color-blue-dark); box-shadow: var(--ba-shadow-dark); } .ba-bike-range-note :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-bike-range-note .ba-text { opacity: 0.82; } .ba-bike-page-equipment { color: var(--ba-color-surface); background: linear-gradient(125deg, rgb(7 81 155 / 42%), transparent 62%), var(--ba-color-ink); } .ba-bike-page-equipment :where(.ba-heading, .ba-heading h2) { color: var(--ba-color-surface); } .ba-bike-page-equipment .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-bike-page-equipment > .ba-container > .ba-text { color: rgb(255 255 255 / 76%); } .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-equipment-grid.ba-bike-page-equipment-grid.ba-bike-page-equipment-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-gallery-grid.ba-bike-page-gallery-grid.ba-bike-page-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-bike-equipment-card { min-height: 13rem; border-color: rgb(255 255 255 / 16%); color: var(--ba-color-surface); background: rgb(255 255 255 / 7%); box-shadow: none; } .ba-bike-equipment-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-bike-equipment-card:first-child { border-color: var(--ba-color-brand-bright); background: rgb(148 230 0 / 10%); } .ba-bike-page-care { background: linear-gradient(90deg, transparent 0 68%, rgb(148 230 0 / 10%) 68% 100%), var(--ba-color-surface); } .ba-bike-care-card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ba-space-3); } .ba-bike-page-detail-placeholder { min-height: 25rem; display: block; overflow: hidden; border: 1px dashed var(--ba-color-brand); border-radius: var(--ba-radius-lg); background: linear-gradient(135deg, transparent 38%, rgb(148 230 0 / 17%) 38% 58%, transparent 58%), var(--ba-color-canvas); } .ba-bike-page-gallery { color: var(--ba-color-surface); background: var(--ba-color-ink); } .ba-bike-page-gallery :where(.ba-heading, .ba-heading h2) { color: var(--ba-color-surface); } .ba-bike-page-gallery > .ba-container > .ba-text { color: rgb(255 255 255 / 72%); } .ba-bike-gallery-placeholder { min-height: 18rem; display: block; overflow: hidden; border: 1px dashed rgb(148 230 0 / 58%); border-radius: var(--ba-radius-md); color: rgb(255 255 255 / 72%); background: radial-gradient(circle at 60% 34%, rgb(7 81 155 / 56%), transparent 42%), rgb(255 255 255 / 5%); } .ba-bike-page-faq { background: var(--ba-color-canvas); } .ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-faq .ba-faq .ba-heading.ba-heading { margin-top: 0.7rem; padding: 1rem 1.15rem; border-left: 0.35rem solid var(--ba-color-brand-bright); border-radius: var(--ba-radius-sm) var(--ba-radius-sm) 0 0; color: var(--ba-color-surface); background: var(--ba-color-ink); } .ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-faq .ba-faq .ba-text.ba-text { margin-top: -0.55rem; padding: 0.95rem 1.15rem 1.1rem; border: 1px solid var(--ba-color-line); border-top: 0; border-radius: 0 0 var(--ba-radius-sm) var(--ba-radius-sm); color: var(--ba-color-muted); background: var(--ba-color-surface); } @media (max-width: 64rem) { .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-facts-grid.ba-bike-page-facts-grid.ba-bike-page-facts-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-specs-grid.ba-bike-page-specs-grid.ba-bike-page-specs-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-equipment-grid.ba-bike-page-equipment-grid.ba-bike-page-equipment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 58rem) { .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-hero-content.ba-bike-page-hero-content.ba-bike-page-hero-content { grid-template-columns: 1fr; } .ba-page-bicicletas .ba-bike-page-hero-content > :not(.ba-bike-page-image-placeholder), .ba-page-bicicletas .ba-bike-page-image-placeholder { grid-column: 1; } .ba-page-bicicletas .ba-bike-page-image-placeholder { grid-row: auto; min-height: 22rem; } } @media (max-width: 46rem) { .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-facts-grid.ba-bike-page-facts-grid.ba-bike-page-facts-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-specs-grid.ba-bike-page-specs-grid.ba-bike-page-specs-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-equipment-grid.ba-bike-page-equipment-grid.ba-bike-page-equipment-grid, .ba-page-bicicletas.ba-page-bicicletas.ba-page-bicicletas .ba-bike-page-gallery-grid.ba-bike-page-gallery-grid.ba-bike-page-gallery-grid { grid-template-columns: 1fr; } .ba-bike-range-note { grid-template-columns: 1fr; } .ba-bike-fact-card, .ba-bike-spec-card, .ba-bike-equipment-card, .ba-bike-gallery-placeholder { min-height: 0; } .ba-bike-page-care { background: var(--ba-color-surface); } } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-hero-section.ba-conditions-hero-section { padding-block: 0; } .ba-page-condiciones-alquiler .ba-conditions-hero { min-height: clamp(38rem, 72vh, 48rem); display: flex; align-items: center; color: var(--ba-color-surface); background: radial-gradient(circle at 88% 16%, rgb(148 230 0 / 18%), transparent 22rem), linear-gradient(120deg, var(--ba-color-blue-dark), var(--ba-color-blue) 58%, #0b67b8); } .ba-page-condiciones-alquiler .ba-conditions-hero-container { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(20rem, 0.8fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: center; padding-block: clamp(4rem, 7vw, 6rem); } .ba-page-condiciones-alquiler .ba-conditions-hero :where(.ba-heading, .ba-heading h1, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-condiciones-alquiler .ba-conditions-hero .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-page-condiciones-alquiler .ba-conditions-hero .ba-heading--display { max-width: 13ch; } .ba-page-condiciones-alquiler .ba-conditions-hero-content > .ba-text { max-width: 42rem; color: rgb(255 255 255 / 82%); } .ba-conditions-hero-actions { display: flex; flex-wrap: wrap; gap: var(--ba-space-3); } .ba-page-condiciones-alquiler .ba-conditions-hero .ba-button--ghost { color: var(--ba-color-ink); border-color: var(--ba-color-brand-bright); background: var(--ba-color-brand-bright); } .ba-conditions-price-card { display: flex; flex-direction: column; gap: 0.8rem; border: 0; color: var(--ba-color-surface); background: var(--ba-color-ink); box-shadow: var(--ba-shadow-dark); } .ba-conditions-price-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-conditions-price-card .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-conditions-price-card .ba-conditions-price { color: var(--ba-color-brand-bright); font-size: clamp(2.3rem, 5vw, 4rem); line-height: 1; } .ba-conditions-price-card .ba-text { padding-top: 0.75rem; border-top: 1px solid rgb(255 255 255 / 16%); color: rgb(255 255 255 / 82%); } .ba-conditions-process { background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-process-grid.ba-conditions-process-grid.ba-conditions-process-grid, .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-included-grid.ba-conditions-included-grid.ba-conditions-included-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ba-conditions-process-grid { counter-reset: ba-condition-step; } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-step.ba-conditions-step { position: relative; min-height: 13rem; padding: 1.6rem 4.8rem 1.6rem clamp(1.4rem, 1rem + 1vw, 2rem); counter-increment: ba-condition-step; border-color: rgb(7 81 155 / 18%); box-shadow: 0 0.8rem 2rem rgb(7 20 25 / 8%); } .ba-conditions-step::before { position: absolute; top: 1.35rem; right: 1.35rem; left: auto; width: 2.55rem; height: 2.55rem; border-radius: 50%; color: var(--ba-color-surface); background: var(--ba-color-blue); content: counter(ba-condition-step, decimal-leading-zero); font-size: 0.78rem; font-weight: 900; line-height: 2.55rem; text-align: center; } .ba-conditions-included { background: radial-gradient(circle at 92% 18%, rgb(7 81 155 / 11%), transparent 24rem), var(--ba-color-canvas); } .ba-condition-card { min-height: 14rem; border-top: 0.4rem solid var(--ba-color-blue); } .ba-condition-card--highlight { border-color: var(--ba-color-brand); color: var(--ba-color-ink); background: var(--ba-color-brand-bright); } .ba-condition-card--highlight :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-conditions-use { color: var(--ba-color-surface); background: linear-gradient(120deg, rgb(7 81 155 / 42%), transparent 62%), var(--ba-color-ink); } .ba-conditions-use :where(.ba-heading, .ba-heading h2) { color: var(--ba-color-surface); } .ba-conditions-use .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-conditions-use > .ba-container > .ba-text { color: rgb(255 255 255 / 76%); } .ba-conditions-list-card { display: flex; flex-direction: column; gap: 0.85rem; border-color: rgb(148 230 0 / 38%); color: var(--ba-color-surface); background: rgb(255 255 255 / 7%); box-shadow: none; } .ba-conditions-list-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-conditions-list-card .ba-text { padding-block: 0.2rem 0.75rem; border-bottom: 1px solid rgb(255 255 255 / 13%); color: rgb(255 255 255 / 78%); } .ba-conditions-list-card--warning { border-color: rgb(255 255 255 / 22%); background: rgb(7 81 155 / 28%); } .ba-conditions-responsibility { background: linear-gradient(90deg, transparent 0 70%, rgb(148 230 0 / 10%) 70% 100%), var(--ba-color-surface); } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-responsibility-grid.ba-conditions-responsibility-grid.ba-conditions-responsibility-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-responsibility-card { min-height: 14rem; border-top: 0.4rem solid var(--ba-color-blue); } .ba-responsibility-card--strong { color: var(--ba-color-surface); border-color: var(--ba-color-brand-bright); background: var(--ba-color-blue-dark); box-shadow: var(--ba-shadow-dark); } .ba-responsibility-card--strong :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-conditions-contract-note { display: grid; grid-template-columns: minmax(14rem, 0.65fr) minmax(0, 1.35fr); gap: var(--ba-space-4); align-items: center; border: 0; color: var(--ba-color-ink); background: var(--ba-color-brand-bright); } .ba-conditions-contract-note :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-conditions-faq { background: var(--ba-color-canvas); } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-faq .ba-faq .ba-heading.ba-heading { margin-top: 0.7rem; padding: 1rem 1.15rem; border-left: 0.35rem solid var(--ba-color-brand-bright); border-radius: var(--ba-radius-sm) var(--ba-radius-sm) 0 0; color: var(--ba-color-surface); background: var(--ba-color-blue-dark); } .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-faq .ba-faq .ba-text.ba-text { margin-top: -0.55rem; padding: 0.95rem 1.15rem 1.1rem; border: 1px solid var(--ba-color-line); border-top: 0; border-radius: 0 0 var(--ba-radius-sm) var(--ba-radius-sm); color: var(--ba-color-muted); background: var(--ba-color-surface); } @media (max-width: 64rem) { .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-process-grid.ba-conditions-process-grid.ba-conditions-process-grid, .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-included-grid.ba-conditions-included-grid.ba-conditions-included-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 58rem) { .ba-page-condiciones-alquiler .ba-conditions-hero-container { grid-template-columns: 1fr; } .ba-conditions-price-card { max-width: 36rem; } } @media (max-width: 46rem) { .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-process-grid.ba-conditions-process-grid.ba-conditions-process-grid, .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-included-grid.ba-conditions-included-grid.ba-conditions-included-grid, .ba-page-condiciones-alquiler.ba-page-condiciones-alquiler.ba-page-condiciones-alquiler .ba-conditions-responsibility-grid.ba-conditions-responsibility-grid.ba-conditions-responsibility-grid, .ba-conditions-contract-note { grid-template-columns: 1fr; } .ba-conditions-step, .ba-condition-card, .ba-responsibility-card { min-height: 0; } .ba-conditions-responsibility { background: var(--ba-color-surface); } } .ba-page-resenas .ba-reviews-hero { color: var(--ba-color-surface); background: radial-gradient(circle at 88% 20%, rgb(148 230 0 / 22%), transparent 24rem), linear-gradient(135deg, var(--ba-color-blue-dark), var(--ba-color-ink)); } .ba-page-resenas .ba-reviews-hero-container, .ba-page-resenas .ba-reviews-policy-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(19rem, 0.8fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; } .ba-page-resenas .ba-reviews-hero :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-resenas .ba-reviews-hero .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-page-resenas .ba-reviews-hero .ba-heading--display { max-width: 14ch; } .ba-page-resenas .ba-reviews-hero-content > .ba-text { max-width: 44rem; color: rgb(255 255 255 / 82%); } .ba-page-resenas .ba-reviews-trust-card { border: 1px solid rgb(255 255 255 / 18%); color: var(--ba-color-surface); background: rgb(255 255 255 / 8%); box-shadow: var(--ba-shadow-dark); } .ba-page-resenas .ba-reviews-trust-card :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-resenas .ba-reviews-trust-card .ba-text--small { color: var(--ba-color-brand-bright); font-weight: 900; letter-spacing: 0.12em; } .ba-page-resenas .ba-reviews-list { background: var(--ba-color-canvas); } .ba-page-resenas.ba-page-resenas .ba-reviews-grid.ba-reviews-grid, .ba-page-resenas.ba-page-resenas .ba-review-topics.ba-review-topics { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-page-resenas .ba-review-gallery-image { aspect-ratio: 3 / 4; overflow: hidden; background: transparent; } .ba-page-resenas .ba-review-gallery-image img { display: block; width: 100%; height: 100%; object-fit: cover; } .ba-page-resenas .ba-review-placeholder { display: flex; min-height: 15rem; flex-direction: column; justify-content: space-between; gap: 1.25rem; border: 2px dashed rgb(7 81 155 / 24%); background: rgb(255 255 255 / 72%); box-shadow: none; } .ba-page-resenas .ba-review-placeholder .ba-placeholder { color: var(--ba-color-muted); background: transparent; } .ba-page-resenas .ba-reviews-values { background: linear-gradient(90deg, var(--ba-color-brand-bright) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-page-resenas .ba-review-topic { min-height: 12rem; border-top: 0.4rem solid var(--ba-color-blue); } .ba-page-resenas .ba-reviews-policy { color: var(--ba-color-surface); background: var(--ba-color-blue-dark); } .ba-page-resenas .ba-reviews-policy :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-resenas .ba-reviews-policy .ba-heading--eyebrow { color: var(--ba-color-brand-bright); } .ba-page-resenas .ba-review-rule { padding: 0.9rem 1rem; border-left: 0.3rem solid var(--ba-color-brand-bright); color: rgb(255 255 255 / 82%); background: rgb(255 255 255 / 6%); } .ba-page-resenas .ba-reviews-google { color: var(--ba-color-ink); border: 0; background: var(--ba-color-brand-bright); box-shadow: var(--ba-shadow-dark); } .ba-page-resenas .ba-reviews-google :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-resenas .ba-reviews-google .ba-placeholder { padding: 0.85rem; border-radius: var(--ba-radius-sm); color: var(--ba-color-ink); background: rgb(255 255 255 / 58%); } .ba-page-resenas .ba-reviews-final { background: var(--ba-color-canvas); } .ba-page-resenas .ba-reviews-final-cta { color: var(--ba-color-surface); background: radial-gradient(circle at 82% 20%, rgb(148 230 0 / 18%), transparent 20rem), var(--ba-color-ink); } .ba-page-resenas .ba-reviews-final-cta :where(.ba-heading, .ba-text) { color: inherit; } .ba-page-resenas .ba-reviews-final-cta .ba-text--small { color: rgb(255 255 255 / 70%); } @media (max-width: 58rem) { .ba-page-resenas .ba-reviews-hero-container, .ba-page-resenas .ba-reviews-policy-grid { grid-template-columns: 1fr; } .ba-page-resenas .ba-reviews-trust-card, .ba-page-resenas .ba-reviews-google { max-width: 40rem; } } @media (max-width: 46rem) { .ba-page-resenas.ba-page-resenas .ba-reviews-grid.ba-reviews-grid, .ba-page-resenas.ba-page-resenas .ba-review-topics.ba-review-topics { grid-template-columns: 1fr; } .ba-page-resenas .ba-review-placeholder, .ba-page-resenas .ba-review-topic { min-height: 0; } .ba-page-resenas .ba-reviews-hero .ba-heading--display { letter-spacing: 0.02em; line-height: 1.08; } } .ba-page-afiliados { --ba-riders-lime: #94e600; --ba-riders-cyan: #00b8ff; --ba-riders-blue: #07519b; --ba-riders-violet: #6647f5; --ba-riders-ink: #061a27; --ba-riders-cream: #f7f8f2; } .ba-page-afiliados.ba-page-afiliados .ba-riders-hero-section.ba-riders-hero-section { padding-block: 0; } .ba-page-afiliados .ba-riders-hero { position: relative; isolation: isolate; min-height: clamp(42rem, 78vh, 52rem); display: flex; align-items: center; overflow: hidden; color: var(--ba-color-surface); background: radial-gradient(circle at 82% 18%, rgb(0 184 255 / 26%), transparent 22rem), radial-gradient(circle at 8% 92%, rgb(148 230 0 / 20%), transparent 24rem), linear-gradient(125deg, var(--ba-riders-ink) 0 52%, var(--ba-color-blue-dark) 76%, var(--ba-riders-blue) 100%); } .ba-page-afiliados .ba-riders-hero::before { position: absolute; z-index: -1; top: -8rem; right: -5rem; width: 25rem; aspect-ratio: 1; border: 4rem solid rgb(148 230 0 / 12%); border-radius: 50%; content: ""; } .ba-page-afiliados .ba-riders-hero-container { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: center; padding-block: clamp(4.5rem, 8vw, 7rem); } .ba-page-afiliados .ba-riders-hero :where(.ba-heading, .ba-heading h1, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-afiliados .ba-riders-hero .ba-heading--eyebrow { color: var(--ba-riders-lime); } .ba-page-afiliados .ba-riders-hero .ba-heading--display { max-width: 10ch; font-size: clamp(3.2rem, 2.2rem + 3.2vw, 6.1rem); } .ba-page-afiliados .ba-riders-hero-content > .ba-text--lead { max-width: 36rem; color: rgb(255 255 255 / 82%); } .ba-page-afiliados .ba-riders-status { max-width: 39rem; padding: 1rem 1.2rem; border: 1px solid rgb(148 230 0 / 38%); border-left: 0.35rem solid var(--ba-riders-lime); border-radius: var(--ba-radius-sm); color: rgb(255 255 255 / 78%); background: rgb(255 255 255 / 7%); } .ba-page-afiliados.ba-page-afiliados .ba-riders-image-placeholder.ba-riders-image-placeholder { width: 100%; height: clamp(25rem, 42vw, 35rem); display: block; border: 1px dashed rgb(255 255 255 / 52%); border-radius: 2rem 2rem 2rem 0.45rem; background: linear-gradient(145deg, transparent 42%, rgb(148 230 0 / 28%) 42% 55%, transparent 55%), radial-gradient(circle at 66% 28%, rgb(0 184 255 / 55%), transparent 38%), linear-gradient(145deg, rgb(255 255 255 / 12%), rgb(255 255 255 / 3%)); box-shadow: var(--ba-shadow-dark); object-fit: cover; } .ba-page-afiliados .ba-riders-network { background: linear-gradient(90deg, var(--ba-riders-lime) 0 0.45rem, transparent 0.45rem), var(--ba-color-surface); } .ba-page-afiliados .ba-riders-network .ba-text--lead { max-width: 52rem; } .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-category-grid.ba-riders-category-grid.ba-riders-category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--ba-space-3); } .ba-page-afiliados .ba-riders-category-card { position: relative; min-height: 12.5rem; overflow: hidden; border: 0; color: var(--ba-color-surface); background: var(--ba-riders-ink); box-shadow: var(--ba-shadow-dark); } .ba-page-afiliados .ba-riders-category-card::after { position: absolute; right: -2.2rem; bottom: -2.2rem; width: 7rem; aspect-ratio: 1; border: 1rem solid rgb(148 230 0 / 16%); border-radius: 50%; content: ""; } .ba-page-afiliados .ba-riders-category-card :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-page-afiliados .ba-riders-category-card:nth-child(2) { background: var(--ba-riders-blue); } .ba-page-afiliados .ba-riders-category-card:nth-child(3) { color: var(--ba-riders-ink); background: var(--ba-riders-lime); } .ba-page-afiliados .ba-riders-category-card:nth-child(4) { background: linear-gradient(145deg, var(--ba-riders-violet), var(--ba-riders-blue)); } .ba-page-afiliados .ba-riders-accessories { background: radial-gradient(circle at 92% 10%, rgb(148 230 0 / 18%), transparent 25rem), var(--ba-riders-cream); } .ba-page-afiliados .ba-riders-accessories .ba-heading--eyebrow, .ba-page-afiliados .ba-riders-professionals .ba-heading--eyebrow, .ba-page-afiliados .ba-riders-protection .ba-heading--eyebrow { width: fit-content; padding: 0.5rem 0.8rem; border-radius: var(--ba-radius-pill); color: var(--ba-riders-ink); background: var(--ba-riders-lime); } .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-product-grid.ba-riders-product-grid.ba-riders-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--ba-space-3); } .ba-page-afiliados .ba-riders-product-card { min-height: 25rem; display: flex; flex-direction: column; gap: var(--ba-space-3); border: 1px solid rgb(7 81 155 / 20%); border-top: 0.42rem solid var(--ba-riders-blue); box-shadow: 0 1.4rem 3rem rgb(7 20 25 / 12%); } .ba-page-afiliados .ba-riders-product-card:nth-child(2) { border-top-color: var(--ba-riders-lime); } .ba-page-afiliados .ba-riders-product-card:nth-child(3) { border-top-color: var(--ba-riders-violet); } .ba-page-afiliados.ba-page-afiliados .ba-riders-product-image.ba-riders-product-image { width: 100%; height: 12rem; display: block; border: 1px dashed rgb(7 81 155 / 42%); border-radius: var(--ba-radius-md); background: linear-gradient(135deg, transparent 38%, rgb(0 184 255 / 18%) 38% 58%, transparent 58%), linear-gradient(145deg, #e7f5fb, #f5f8f3); object-fit: cover; } .ba-page-afiliados .ba-riders-product-card .ba-placeholder, .ba-page-afiliados .ba-riders-service-card .ba-placeholder, .ba-page-afiliados .ba-riders-collaboration-card .ba-placeholder { margin-top: auto; padding: 0.85rem 1rem; border: 1px dashed rgb(7 81 155 / 34%); border-radius: var(--ba-radius-sm); color: #315568; background: #eef7fb; font-size: var(--ba-text-sm); font-weight: 700; line-height: 1.45; } .ba-page-afiliados .ba-riders-professionals { color: var(--ba-color-surface); background: radial-gradient(circle at 12% 18%, rgb(0 184 255 / 18%), transparent 24rem), var(--ba-riders-ink); } .ba-page-afiliados .ba-riders-professionals > .ba-container > :where(.ba-heading, .ba-heading h2) { color: inherit; } .ba-page-afiliados .ba-riders-professionals .ba-riders-service-card { color: var(--ba-color-ink); } .ba-page-afiliados .ba-riders-protection { background: linear-gradient(115deg, rgb(0 184 255 / 10%), transparent 58%), var(--ba-color-surface); } .ba-page-afiliados .ba-riders-service-card { min-height: 31rem; display: flex; flex-direction: column; gap: var(--ba-space-3); border: 0; border-top: 0.42rem solid var(--ba-riders-cyan); } .ba-page-afiliados .ba-riders-service-card:nth-child(2) { border-top-color: var(--ba-riders-lime); } .ba-page-afiliados.ba-page-afiliados .ba-riders-service-image.ba-riders-service-image { width: 100%; height: 13.5rem; display: block; border: 1px dashed rgb(7 81 155 / 42%); border-radius: var(--ba-radius-md); background: radial-gradient(circle at 72% 30%, rgb(148 230 0 / 34%), transparent 34%), linear-gradient(145deg, #dff6ff, #eef2ff); object-fit: cover; } .ba-page-afiliados .ba-riders-process { color: var(--ba-color-surface); background: linear-gradient(125deg, var(--ba-color-blue-dark), var(--ba-riders-blue)); } .ba-page-afiliados .ba-riders-process :where(.ba-heading, .ba-heading h2) { color: inherit; } .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-process .ba-process-grid.ba-process-grid.ba-process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ba-page-afiliados .ba-riders-process .ba-process-step { position: relative; min-height: 14rem; padding-top: 4.5rem; border-color: rgb(255 255 255 / 18%); color: var(--ba-color-surface); background: rgb(255 255 255 / 8%); box-shadow: none; } .ba-page-afiliados .ba-riders-process .ba-process-step::before { position: absolute; top: 1.35rem; left: 1.35rem; width: 2.4rem; height: 0.38rem; border-radius: var(--ba-radius-pill); background: var(--ba-riders-lime); content: ""; } .ba-page-afiliados .ba-riders-process .ba-process-step :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-page-afiliados .ba-riders-criteria { background: var(--ba-riders-cream); } .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-criteria-grid.ba-riders-criteria-grid.ba-riders-criteria-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ba-page-afiliados .ba-riders-criterion { min-height: 12rem; border: 0; border-left: 0.4rem solid var(--ba-riders-lime); background: var(--ba-color-surface); } .ba-page-afiliados .ba-riders-criterion:nth-child(even) { border-left-color: var(--ba-riders-cyan); } .ba-page-afiliados .ba-riders-transparency { color: var(--ba-riders-ink); background: linear-gradient(90deg, rgb(255 255 255 / 0%) 0 65%, rgb(255 255 255 / 34%) 65% 100%), var(--ba-riders-lime); } .ba-page-afiliados .ba-riders-transparency :where(.ba-heading, .ba-text, p) { color: inherit; } .ba-page-afiliados .ba-riders-transparency .ba-container { padding: clamp(1.5rem, 2vw, 2.5rem); border-radius: var(--ba-radius-lg); background: rgb(255 255 255 / 40%); } .ba-page-afiliados .ba-riders-collaboration { color: var(--ba-color-surface); background: radial-gradient(circle at 88% 15%, rgb(148 230 0 / 18%), transparent 22rem), linear-gradient(125deg, var(--ba-riders-ink), var(--ba-riders-violet)); } .ba-page-afiliados .ba-riders-collaboration > .ba-container > :where(.ba-heading, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-afiliados .ba-riders-collaboration .ba-heading--eyebrow { color: var(--ba-riders-lime); } .ba-page-afiliados .ba-riders-collaboration-grid { align-items: stretch; } .ba-page-afiliados.ba-page-afiliados .ba-riders-brochure-placeholder.ba-riders-brochure-placeholder { width: 100%; height: 30rem; display: block; border: 1px dashed rgb(255 255 255 / 56%); border-radius: var(--ba-radius-lg); background: linear-gradient(145deg, transparent 35%, rgb(148 230 0 / 26%) 35% 52%, transparent 52%), radial-gradient(circle at 70% 25%, rgb(0 184 255 / 48%), transparent 36%), rgb(255 255 255 / 7%); box-shadow: var(--ba-shadow-dark); object-fit: cover; } .ba-page-afiliados .ba-riders-collaboration-card { min-height: 30rem; display: flex; flex-direction: column; justify-content: center; gap: var(--ba-space-4); border: 0; color: var(--ba-riders-ink); background: var(--ba-color-surface); } .ba-page-afiliados .ba-riders-collaboration-card .ba-button { align-self: flex-start; } .ba-page-afiliados .ba-riders-final { padding-top: 0; color: var(--ba-color-surface); background: var(--ba-riders-ink); } .ba-page-afiliados .ba-riders-final-cta { border: 1px solid rgb(148 230 0 / 28%); background: linear-gradient(115deg, rgb(148 230 0 / 13%) 0 38%, transparent 38%), var(--ba-riders-ink); } .ba-page-afiliados .ba-riders-final-cta :where(.ba-heading, .ba-text, p) { color: inherit; } @media (max-width: 68rem) { .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-category-grid.ba-riders-category-grid.ba-riders-category-grid, .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-criteria-grid.ba-riders-criteria-grid.ba-riders-criteria-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 58rem) { .ba-page-afiliados .ba-riders-hero-container { grid-template-columns: 1fr; } .ba-page-afiliados .ba-riders-hero .ba-heading--display { max-width: 12ch; } .ba-page-afiliados.ba-page-afiliados .ba-riders-image-placeholder.ba-riders-image-placeholder { height: 22rem; } } @media (max-width: 52rem) { .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-product-grid.ba-riders-product-grid.ba-riders-product-grid, .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-process .ba-process-grid.ba-process-grid.ba-process-grid { grid-template-columns: 1fr; } .ba-page-afiliados .ba-riders-product-card, .ba-page-afiliados .ba-riders-service-card, .ba-page-afiliados .ba-riders-process .ba-process-step { min-height: 0; } } @media (max-width: 46rem) { .ba-page-afiliados .ba-riders-hero { min-height: 0; } .ba-page-afiliados .ba-riders-hero-container { padding-block: 4rem; } .ba-page-afiliados .ba-riders-hero .ba-heading--display { font-size: clamp(2.35rem, 11vw, 3.35rem); line-height: 1.06; letter-spacing: 0.03em; } .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-category-grid.ba-riders-category-grid.ba-riders-category-grid, .ba-page-afiliados.ba-page-afiliados.ba-page-afiliados .ba-riders-criteria-grid.ba-riders-criteria-grid.ba-riders-criteria-grid { grid-template-columns: 1fr; } .ba-page-afiliados .ba-riders-category-card, .ba-page-afiliados .ba-riders-criterion { min-height: 0; } .ba-page-afiliados .ba-riders-collaboration-card, .ba-page-afiliados.ba-page-afiliados .ba-riders-brochure-placeholder.ba-riders-brochure-placeholder { min-height: 0; height: auto; } .ba-page-afiliados.ba-page-afiliados .ba-riders-brochure-placeholder.ba-riders-brochure-placeholder { aspect-ratio: 4 / 5; } .ba-page-afiliados .ba-riders-collaboration-card .ba-button { width: 100%; align-self: stretch; } } .ba-page-error-404 .ba-error-hero { position: relative; isolation: isolate; overflow: hidden; color: var(--ba-color-surface); background: linear-gradient(125deg, var(--ba-color-ink) 25%, var(--ba-color-blue-dark) 100%); } .ba-page-error-404 .ba-error-layout { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); min-height: 38rem; padding-block: clamp(3rem, 7vw, 6rem); } .ba-page-error-404 .ba-error-map { position: relative; isolation: isolate; display: grid; place-items: center; min-width: 0; aspect-ratio: 1; background-image: linear-gradient(rgb(255 255 255 / 5%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 5%) 1px, transparent 1px); background-size: 3rem 3rem; border-radius: var(--ba-radius-lg); } .ba-page-error-404 .ba-error-map::before { content: ''; position: absolute; z-index: -1; inset: 14% 12%; border: 0.6rem solid var(--ba-color-brand-bright); border-left-color: transparent; border-radius: 2rem 4rem 4rem 2rem; transform: rotate(-14deg); opacity: 0.85; pointer-events: none; } .ba-page-error-404 .ba-error-map::after { content: ''; position: absolute; width: 1.25rem; height: 1.25rem; left: 9%; bottom: 20%; background: var(--ba-color-brand-bright); border: 0.3rem solid var(--ba-color-ink); border-radius: 50%; box-shadow: 0 0 0 0.35rem rgb(148 230 0 / 20%); pointer-events: none; } .ba-page-error-404 .ba-error-number { margin: 0; color: var(--ba-color-surface); font-family: var(--ba-font-display); font-size: clamp(8rem, 19vw, 16rem); font-weight: 900; line-height: 1; letter-spacing: -0.04em; text-shadow: 0.04em 0.04em 0 var(--ba-color-blue); } .ba-page-error-404 .ba-error-copy { min-width: 0; gap: var(--ba-space-4); } .ba-page-error-404 .ba-error-eyebrow { margin: 0; color: var(--ba-color-brand-bright); font-size: var(--ba-text-xs); font-weight: 800; letter-spacing: 0.1em; } .ba-page-error-404 .ba-error-title { max-width: 15ch; margin: 0; color: var(--ba-color-surface); font-size: clamp(2.5rem, 4.5vw, 4rem); line-height: 1.05; } .ba-page-error-404 .ba-error-text { max-width: 49ch; margin: 0; color: var(--ba-color-surface); } .ba-page-error-404 .ba-error-actions { display: flex; flex-wrap: wrap; gap: var(--ba-space-3); } .ba-page-error-404.ba-page-error-404 .ba-button--secondary.ba-button, .ba-page-error-404.ba-page-error-404 .ba-error-bikes.ba-button { color: var(--ba-color-surface); background: transparent; border-color: var(--ba-color-surface); } .ba-page-error-404.ba-page-error-404 .ba-error-bikes.ba-button { border: 0; padding-inline: 0; text-decoration: underline; text-underline-offset: 0.3em; } .ba-page-error-404.ba-page-error-404 .ba-button--secondary.ba-button:hover, .ba-page-error-404.ba-page-error-404 .ba-error-bikes.ba-button:hover { color: var(--ba-color-brand-bright); } .ba-page-error-404 .ba-button:focus-visible { outline: 3px solid var(--ba-color-brand-bright); outline-offset: 5px; } @media (max-width: 52rem) { .ba-page-error-404 .ba-error-layout { grid-template-columns: 1fr; gap: var(--ba-space-5); min-height: 0; } .ba-page-error-404 .ba-error-map { width: min(100%, 23rem); justify-self: center; aspect-ratio: 1.5; } .ba-page-error-404 .ba-error-number { font-size: clamp(8rem, 35vw, 12rem); } .ba-page-error-404 .ba-error-title { max-width: 18ch; } } @media (max-width: 36rem) { .ba-page-error-404 .ba-error-actions { flex-direction: column; } .ba-page-error-404.ba-page-error-404 .ba-error-actions .ba-button.ba-button { width: 100%; } } @media (prefers-reduced-motion: reduce) { .ba-page-error-404 .ba-button { transition: none; transform: none; } } .ba-page-error-404.ba-page-error-404, .ba-page-error-404 .ba-error-hero, .ba-page-error-404 .ba-error-map, .ba-page-error-404 .ba-error-copy, .ba-page-error-404 .ba-error-actions { padding: 0; } .ba-page-error-404 .ba-error-layout { padding-inline: 0; } .ba-page-error-404 .ba-error-map::before { width: 76%; height: 72%; } .ba-page-propuesta-publicidad { --ba-proposal-ink: #061116; --ba-proposal-panel: #0b1d24; --ba-proposal-lime: var(--ba-color-brand-bright); background: #eef2ef; } .ba-page-propuesta-publicidad .ba-proposal-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(4rem, 8vw, 7.5rem); color: var(--ba-color-surface); background: radial-gradient(circle at 85% 18%, rgb(7 81 155 / 55%), transparent 24rem), linear-gradient(118deg, var(--ba-proposal-ink) 0 58%, var(--ba-color-blue-dark) 100%); } .ba-page-propuesta-publicidad .ba-proposal-hero::before, .ba-page-propuesta-publicidad .ba-proposal-hero::after { position: absolute; z-index: -1; content: ""; } .ba-page-propuesta-publicidad .ba-proposal-hero::before { top: -13rem; right: -10rem; width: 34rem; aspect-ratio: 1; border: 4.5rem solid rgb(148 230 0 / 11%); border-radius: 50%; } .ba-page-propuesta-publicidad .ba-proposal-hero::after { right: 0; bottom: 0; width: min(42rem, 68vw); height: 0.5rem; background: var(--ba-proposal-lime); } .ba-page-propuesta-publicidad .ba-proposal-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.65fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; } .ba-page-propuesta-publicidad .ba-proposal-hero-copy { gap: 0.9rem; } .ba-page-propuesta-publicidad .ba-proposal-hero-copy :where(.ba-heading, .ba-heading h1, .ba-text, .ba-text p) { color: inherit; } .ba-page-propuesta-publicidad .ba-proposal-hero-copy .ba-heading--eyebrow { color: var(--ba-proposal-lime); } .ba-page-propuesta-publicidad .ba-proposal-hero-copy .ba-heading--display { max-width: 12ch; margin-bottom: var(--ba-space-3); font-size: clamp(3rem, 2rem + 3.2vw, 6rem); line-height: 0.98; } .ba-page-propuesta-publicidad .ba-proposal-pitch-line { max-width: 57rem; margin: 0; color: rgb(255 255 255 / 82%); } .ba-page-propuesta-publicidad .ba-proposal-pitch-line.ba-text--lead { color: var(--ba-color-surface); font-weight: 760; } .ba-page-propuesta-publicidad .ba-proposal-hero-panel { position: relative; overflow: hidden; padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid rgb(148 230 0 / 35%); color: var(--ba-color-surface); background: rgb(255 255 255 / 8%); box-shadow: var(--ba-shadow-dark); backdrop-filter: blur(0.8rem); } .ba-page-propuesta-publicidad .ba-proposal-hero-panel::after { position: absolute; right: -3rem; bottom: -3rem; width: 9rem; aspect-ratio: 1; border: 1.25rem solid rgb(148 230 0 / 14%); border-radius: 50%; content: ""; } .ba-page-propuesta-publicidad .ba-proposal-hero-panel :where(.ba-heading, .ba-heading h2, .ba-text, .ba-text p) { color: inherit; } .ba-page-propuesta-publicidad .ba-proposal-panel-kicker { color: var(--ba-proposal-lime); font-weight: 900; letter-spacing: 0.12em; } .ba-page-propuesta-publicidad .ba-proposal-tags { display: flex; flex-wrap: wrap; gap: 0.65rem; margin-top: var(--ba-space-3); } .ba-page-propuesta-publicidad .ba-proposal-tag { width: fit-content; margin: 0; padding: 0.45rem 0.75rem; border: 1px solid rgb(255 255 255 / 22%); border-radius: var(--ba-radius-pill); background: rgb(255 255 255 / 8%); font-weight: 750; } .ba-page-propuesta-publicidad .ba-proposal-form-section { padding-block: clamp(3rem, 6vw, 6rem); } .ba-page-propuesta-publicidad .ba-proposal-form-layout { display: grid; grid-template-columns: minmax(15rem, 0.58fr) minmax(0, 1.42fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; } .ba-page-propuesta-publicidad .ba-proposal-form-guide { position: sticky; top: 2rem; padding: clamp(1.25rem, 2vw, 2rem); border-left: 0.4rem solid var(--ba-proposal-lime); border-radius: 0 var(--ba-radius-md) var(--ba-radius-md) 0; background: rgb(255 255 255 / 66%); } .ba-page-propuesta-publicidad .ba-proposal-form-guide .ba-heading--eyebrow { color: var(--ba-color-blue); } .ba-page-propuesta-publicidad .ba-proposal-scope-note { padding: 1rem; border-radius: var(--ba-radius-sm); color: var(--ba-color-muted); background: #e2e9e6; } .ba-page-propuesta-publicidad .ba-proposal-back-link { margin-top: var(--ba-space-2); } .ba-page-propuesta-publicidad .ba-proposal-form-card { min-width: 0; padding: clamp(1rem, 3vw, 2.5rem); border: 1px solid rgb(7 81 155 / 14%); border-top: 0.45rem solid var(--ba-proposal-lime); background: var(--ba-color-surface); box-shadow: 0 1.75rem 4rem rgb(7 20 25 / 13%); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-form-fields-wrapper"] { gap: 0; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__indicators--type-progress_bar { margin-bottom: 2rem; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__indicators__indicator__progress { height: 1rem; overflow: hidden; border-radius: var(--ba-radius-pill); color: var(--ba-color-surface); background: #dce4e1; font-size: 0.72rem; font-weight: 900; line-height: 1rem; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__indicators__indicator__progress__meter { min-width: 2.8rem; width: var(--e-form-steps-indicator-progress-meter-width, 17%); border-radius: inherit; color: var(--ba-proposal-ink); background: linear-gradient(90deg, var(--ba-color-brand), var(--ba-proposal-lime)); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-type-step"] { margin: 0 0 1.25rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ba-color-line); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-hidden"] { display: none; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__step { display: flex; flex-wrap: wrap; margin-inline: -0.5rem; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__step[class~="elementor-hidden"] { display: none; } .ba-page-propuesta-publicidad .ba-proposal-form .e-field-step::before { display: block; color: var(--ba-color-blue); font-size: var(--ba-text-xs); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; content: attr(data-label); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"] { min-width: 0; width: 100%; display: flex; flex-wrap: wrap; align-content: flex-start; margin-bottom: 1.15rem; padding-inline: 0.5rem; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-50"] { width: 50%; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-33"] { width: 33.333%; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-25"] { width: 25%; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"] > label, .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-label"] { width: 100%; margin-bottom: 0.45rem; color: var(--ba-proposal-ink); font-size: 0.96rem; font-weight: 800; line-height: 1.35; } .ba-page-propuesta-publicidad .ba-proposal-form :where(input[class~="elementor-field"], textarea[class~="elementor-field"], select[class~="elementor-field"]) { width: 100%; min-height: 3.25rem; border: 1px solid #b9c6c1; border-radius: 0.7rem; color: var(--ba-proposal-ink); background: #fbfcfb; font: inherit; line-height: 1.4; transition: border-color var(--ba-transition), box-shadow var(--ba-transition), background-color var(--ba-transition); } .ba-page-propuesta-publicidad .ba-proposal-form textarea[class~="elementor-field"] { min-height: 7rem; resize: vertical; } .ba-page-propuesta-publicidad .ba-proposal-form :where(input[class~="elementor-field"], textarea[class~="elementor-field"], select[class~="elementor-field"]):focus { border-color: var(--ba-color-focus); background: var(--ba-color-surface); box-shadow: 0 0 0 0.2rem rgb(11 114 231 / 15%); outline: 0; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-subgroup"] { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem 1rem; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-option"] { min-height: 2.75rem; display: flex; align-items: flex-start; gap: 0.6rem; padding: 0.65rem 0.75rem; border: 1px solid #d7dfdc; border-radius: 0.65rem; background: #f7f9f8; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-option"] :where(input[type="checkbox"], input[type="radio"]) { width: 1.2rem; height: 1.2rem; flex: 0 0 1.2rem; margin: 0.12rem 0 0; accent-color: var(--ba-color-blue); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-option"] label { cursor: pointer; line-height: 1.35; } .ba-page-propuesta-publicidad .ba-proposal-form .ba-form__binary [class~="elementor-field-subgroup"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-type-acceptance"] [class~="elementor-field-option"] { border-color: rgb(7 81 155 / 24%); background: #eef6fb; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-message"] { margin-top: 0.55rem; font-weight: 750; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__buttons { gap: 0.75rem; margin-top: 0.75rem; } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button, button[type="submit"]) { min-height: 3.25rem; border: 2px solid transparent; border-radius: 0.75rem; font-family: var(--ba-font-body); font-size: var(--ba-text-sm); font-weight: 900; line-height: 1.15; transition: transform var(--ba-transition), background-color var(--ba-transition), box-shadow var(--ba-transition); } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button-next, button[type="submit"]) { color: var(--ba-proposal-ink); background: var(--ba-proposal-lime); box-shadow: 0 0.75rem 1.5rem rgb(121 201 0 / 22%); } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__buttons__wrapper__button-previous { color: var(--ba-color-blue); border-color: var(--ba-color-blue); background: var(--ba-color-surface); } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button, button[type="submit"]):hover { transform: translateY(-2px); } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button, button[type="submit"]):focus-visible { outline: 3px solid var(--ba-color-focus); outline-offset: 3px; } .ba-page-propuesta-publicidad .ba-proposal-privacy-link { margin: 1rem auto 0; padding: 0.45rem 0.7rem; border: 0; font-size: var(--ba-text-xs); box-shadow: none; } @media (max-width: 58rem) { .ba-page-propuesta-publicidad .ba-proposal-hero-grid, .ba-page-propuesta-publicidad .ba-proposal-form-layout { grid-template-columns: 1fr; } .ba-page-propuesta-publicidad .ba-proposal-hero-copy .ba-heading--display { max-width: 14ch; } .ba-page-propuesta-publicidad .ba-proposal-hero-panel { max-width: 42rem; } .ba-page-propuesta-publicidad .ba-proposal-form-guide { position: static; } } @media (max-width: 48rem) { .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-50"], .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-33"], .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"][class~="elementor-col-25"] { width: 100%; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-subgroup"] { grid-template-columns: 1fr; } .ba-page-propuesta-publicidad .ba-proposal-form .ba-form__binary [class~="elementor-field-subgroup"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 30rem) { .ba-page-propuesta-publicidad .ba-proposal-hero { padding-block: 3.5rem; } .ba-page-propuesta-publicidad .ba-proposal-hero-copy .ba-heading--display { font-size: clamp(2.6rem, 13vw, 3.8rem); } .ba-page-propuesta-publicidad .ba-proposal-form-card { padding-inline: 0.65rem; } .ba-page-propuesta-publicidad .ba-proposal-form [class~="elementor-field-group"] { padding-inline: 0.35rem; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__buttons { flex-direction: column; flex-wrap: nowrap; } .ba-page-propuesta-publicidad .ba-proposal-form .e-form__buttons__wrapper { min-width: 0; width: 100%; flex: 0 0 auto; } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button, button[type="submit"]) { max-width: 100%; width: 100%; } } @media (prefers-reduced-motion: reduce) { .ba-page-propuesta-publicidad *, .ba-page-propuesta-publicidad *::before, .ba-page-propuesta-publicidad *::after { scroll-behavior: auto; transition: none; } .ba-page-propuesta-publicidad .ba-proposal-form :where(.e-form__buttons__wrapper__button, button[type="submit"]):hover { transform: none; } } @media (prefers-reduced-motion: reduce) { .ba-page *, .ba-page *::before, .ba-page *::after { scroll-behavior: auto; } }