/** * FlyRent — Nuova Homepage v2 * Every rule is scoped under body.flyrent-homepage-custom so the active theme, * Bootstrap and Motors styles (e.g. a[href^="tel"]) cannot override it. */ /* ── 1. Tokens & base ───────────────────────────────────────────── */ body.flyrent-homepage-custom { --fly-blue: #0A4193; --fly-blue-700: #08326F; --fly-blue-50: #EAF0F9; --fly-navy: #061A3A; --fly-red: #E2000C; --fly-red-700: #B5000A; --fly-ink: #0E1B33; --fly-muted: #4A5872; --fly-line: #DCE3EE; --fly-soft: #F2F5FA; --fly-white: #FFFFFF; --fly-wa: #0B7F43; --fly-wa-700: #086535; --fly-font-display: 'Montserrat', 'Figtree', system-ui, sans-serif; --fly-font-text: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; --fly-radius: 12px; --fly-radius-lg: 20px; --fly-shadow: 0 1px 2px rgba(14, 27, 51, .06), 0 8px 24px -8px rgba(14, 27, 51, .14); --fly-shadow-lg: 0 2px 4px rgba(14, 27, 51, .05), 0 24px 48px -16px rgba(10, 65, 147, .28); --fly-ease: cubic-bezier(.16, 1, .3, 1); --fly-gutter: clamp(16px, 3.4vw, 72px); --fly-section: clamp(64px, 8vw, 112px); margin: 0; background: var(--fly-white); } /* Base type and resets apply only to the plugin's own regions, never to the site's Elementor header/footer rendered around them. */ body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) { color: var(--fly-ink); font-family: var(--fly-font-text); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* Theme sets overflow-x:hidden on html/body, which turns body into a scroll box and breaks the sticky header. */ html.fly-html, html.fly-html body.flyrent-homepage-custom { overflow-x: clip; overflow-y: visible; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer), body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) *, body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) *::before, body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) *::after { box-sizing: border-box; } body.flyrent-homepage-custom ::selection { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, address) { margin: 0; padding: 0; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(h1, h2, h3, h4) { font-family: var(--fly-font-display); color: inherit; font-weight: 800; line-height: 1.12; letter-spacing: -0.02em; text-wrap: balance; text-transform: none; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(ul, ol)[role="list"], body.flyrent-homepage-custom .fly-steps-list { list-style: none; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(img) { max-width: 100%; height: auto; display: block; border: 0; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(address) { font-style: normal; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(a) { color: inherit; text-decoration: none; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(a, button, [tabindex]):focus-visible { outline: 3px solid var(--fly-blue); outline-offset: 3px; border-radius: 6px; } body.flyrent-homepage-custom :where(.fly-main, .fly-servicebar, .fly-header, .fly-footer) :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; text-transform: none; letter-spacing: normal; box-shadow: none; } body.flyrent-homepage-custom .fly-icon { width: 20px; height: 20px; flex: none; } body.flyrent-homepage-custom .fly-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* Full width: every section spans the page, only a side gutter; long text keeps its own measure. */ body.flyrent-homepage-custom .fly-container { width: 100%; max-width: none; margin-inline: 0; padding-inline: var(--fly-gutter); } body.flyrent-homepage-custom .fly-main { display: block; overflow-x: clip; } body.flyrent-homepage-custom.fly-menu-open { overflow: hidden; } body.flyrent-homepage-custom .fly-skip-link { position: absolute; left: 16px; top: -60px; z-index: 10000; background: var(--fly-blue); color: var(--fly-white); padding: 10px 16px; border-radius: 8px; font-weight: 600; } body.flyrent-homepage-custom .fly-skip-link:focus { top: 12px; } /* ── 2. Buttons & links ─────────────────────────────────────────── */ body.flyrent-homepage-custom .fly-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 12px 22px; border-radius: 10px; border: 2px solid transparent; font-family: var(--fly-font-display); font-size: 15px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-decoration: none; white-space: nowrap; transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s var(--fly-ease), box-shadow .2s ease; } body.flyrent-homepage-custom .fly-btn:active { transform: translateY(1px); } body.flyrent-homepage-custom .fly-btn .fly-icon { width: 18px; height: 18px; transition: transform .25s var(--fly-ease); } body.flyrent-homepage-custom .fly-btn:hover .fly-icon-arrow-right { transform: translateX(3px); } body.flyrent-homepage-custom .fly-btn-sm { min-height: 42px; padding: 8px 16px; font-size: 14px; } body.flyrent-homepage-custom .fly-btn-lg { min-height: 56px; padding: 14px 26px; font-size: 16px; } body.flyrent-homepage-custom .fly-btn-block { width: 100%; } body.flyrent-homepage-custom a.fly-btn-primary, body.flyrent-homepage-custom .fly-btn-primary { background: var(--fly-red); color: var(--fly-white); box-shadow: 0 6px 16px -6px rgba(226, 0, 12, .55); } body.flyrent-homepage-custom a.fly-btn-primary:hover { background: var(--fly-red-700); color: var(--fly-white); } body.flyrent-homepage-custom a.fly-btn-outline, body.flyrent-homepage-custom .fly-btn-outline { background: var(--fly-white); color: var(--fly-blue); border-color: var(--fly-blue); } body.flyrent-homepage-custom a.fly-btn-outline:hover { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom a.fly-btn-light, body.flyrent-homepage-custom .fly-btn-light { background: var(--fly-white); color: var(--fly-blue); } body.flyrent-homepage-custom a.fly-btn-light:hover { background: var(--fly-blue-50); color: var(--fly-blue-700); } body.flyrent-homepage-custom a.fly-btn-whatsapp, body.flyrent-homepage-custom .fly-btn-whatsapp { background: var(--fly-wa); color: var(--fly-white); } body.flyrent-homepage-custom a.fly-btn-whatsapp:hover { background: var(--fly-wa-700); color: var(--fly-white); } body.flyrent-homepage-custom a.fly-text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--fly-blue); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } body.flyrent-homepage-custom a.fly-text-link:hover { color: var(--fly-blue-700); text-decoration-thickness: 2px; } body.flyrent-homepage-custom .fly-text-link .fly-icon { width: 18px; height: 18px; } body.flyrent-homepage-custom .fly-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; color: var(--fly-blue); background: var(--fly-blue-50); } body.flyrent-homepage-custom a.fly-icon-btn:hover, body.flyrent-homepage-custom .fly-icon-btn:hover { background: #DCE6F5; color: var(--fly-blue-700); } /* ── 3. Service bar & header ────────────────────────────────────── */ body.flyrent-homepage-custom .fly-servicebar { background: var(--fly-navy); color: #C9D5EA; font-size: 14px; } body.flyrent-homepage-custom .fly-servicebar-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 40px; } body.flyrent-homepage-custom .fly-servicebar-info { display: flex; gap: 28px; align-items: center; } body.flyrent-homepage-custom .fly-servicebar-item, body.flyrent-homepage-custom a.fly-servicebar-link { display: inline-flex; align-items: center; gap: 8px; } body.flyrent-homepage-custom .fly-servicebar .fly-icon { width: 16px; height: 16px; opacity: .8; } body.flyrent-homepage-custom .fly-servicebar-links { display: flex; align-items: center; gap: 24px; } body.flyrent-homepage-custom a.fly-servicebar-link { color: var(--fly-white); font-weight: 600; } body.flyrent-homepage-custom a.fly-servicebar-link:hover { text-decoration: underline; text-underline-offset: 4px; } body.flyrent-homepage-custom .fly-servicebar :where(a):focus-visible { outline-color: var(--fly-white); } body.flyrent-homepage-custom .fly-header { position: sticky; top: 0; z-index: 900; background: var(--fly-white); border-bottom: 1px solid var(--fly-line); transition: box-shadow .25s ease; } body.flyrent-homepage-custom.admin-bar .fly-header { top: 32px; } body.flyrent-homepage-custom .fly-header.is-scrolled { box-shadow: 0 8px 24px -12px rgba(14, 27, 51, .25); } body.flyrent-homepage-custom .fly-header-inner { display: flex; align-items: center; gap: 20px; min-height: 76px; } body.flyrent-homepage-custom .fly-header-actions .fly-btn { white-space: nowrap; } body.flyrent-homepage-custom .fly-brand { flex: none; display: block; } body.flyrent-homepage-custom .fly-brand-logo { width: 150px; height: auto; } body.flyrent-homepage-custom .fly-nav-desktop { margin-left: auto; } body.flyrent-homepage-custom .fly-nav-list { display: flex; gap: 4px; list-style: none; } body.flyrent-homepage-custom a.fly-nav-link { display: block; padding: 10px 12px; border-radius: 8px; font-family: var(--fly-font-display); font-size: 14.5px; font-weight: 600; color: var(--fly-ink); white-space: nowrap; } body.flyrent-homepage-custom a.fly-nav-link:hover { color: var(--fly-blue); background: var(--fly-blue-50); } body.flyrent-homepage-custom .fly-header-actions { display: flex; align-items: center; gap: 10px; } body.flyrent-homepage-custom .fly-mobile-menu { position: fixed; inset: 0; top: var(--fly-menu-top, 76px); z-index: 899; background: var(--fly-white); overflow-y: auto; padding: 8px var(--fly-gutter) 32px; border-top: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-mobile-menu[hidden] { display: none; } body.flyrent-homepage-custom .fly-mobile-nav-list { list-style: none; margin-bottom: 24px; } body.flyrent-homepage-custom .fly-mobile-nav-list li { border-bottom: 1px solid var(--fly-line); } body.flyrent-homepage-custom a.fly-mobile-link { display: block; padding: 16px 0; font-family: var(--fly-font-display); font-size: 18px; font-weight: 700; color: var(--fly-ink); } body.flyrent-homepage-custom a.fly-mobile-link:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-mobile-ctas { display: grid; gap: 12px; } body.flyrent-homepage-custom .fly-mobile-hours { margin-top: 16px; font-size: 14px; color: var(--fly-muted); text-align: center; } body.flyrent-homepage-custom .fly-hamburger { display: grid; gap: 5px; width: 20px; } body.flyrent-homepage-custom .fly-hamburger span { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .25s var(--fly-ease), opacity .2s ease; } body.flyrent-homepage-custom .fly-mobile-toggle[aria-expanded="true"] .fly-hamburger span:nth-child(1) { transform: translateY(7px) rotate(45deg); } body.flyrent-homepage-custom .fly-mobile-toggle[aria-expanded="true"] .fly-hamburger span:nth-child(2) { opacity: 0; } body.flyrent-homepage-custom .fly-mobile-toggle[aria-expanded="true"] .fly-hamburger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } @media (min-width: 1100px) { body.flyrent-homepage-custom .fly-mobile-toggle, body.flyrent-homepage-custom .fly-header-call { display: none; } } @media (min-width: 1100px) and (max-width: 1399px) { body.flyrent-homepage-custom .fly-header-wa span { display: none; } body.flyrent-homepage-custom .fly-header-wa { width: 42px; padding: 0; } body.flyrent-homepage-custom a.fly-nav-link { padding-inline: 9px; font-size: 14px; } } @media (max-width: 1099px) { body.flyrent-homepage-custom .fly-nav-desktop, body.flyrent-homepage-custom .fly-header-quote { display: none; } body.flyrent-homepage-custom .fly-header-actions { margin-left: auto; } } @media (max-width: 860px) { body.flyrent-homepage-custom .fly-servicebar-hours { display: none; } } @media (max-width: 640px) { body.flyrent-homepage-custom .fly-servicebar { display: none; } body.flyrent-homepage-custom .fly-header-inner { min-height: 64px; gap: 12px; } body.flyrent-homepage-custom .fly-brand-logo { width: 118px; } body.flyrent-homepage-custom .fly-header-wa span { display: none; } body.flyrent-homepage-custom .fly-header-wa { width: 44px; padding: 0; min-height: 44px; } body.flyrent-homepage-custom .fly-mobile-menu { --fly-menu-top: 64px; } } @media (max-width: 782px) { body.flyrent-homepage-custom.admin-bar .fly-header { top: 0; } } /* Site Elementor header: its mobile container uses a negative bottom margin to overlap page content; on this page content must start below it. */ body.flyrent-homepage-custom #masthead > .elementor > .e-con, body.flyrent-homepage-custom #masthead > .elementor > .e-con > .e-con { --margin-top: 0px; --margin-bottom: 0px; } /* ── 4. Hero: offers carousel ───────────────────────────────────── */ body.flyrent-homepage-custom .fly-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--fly-soft); padding-block: clamp(32px, 5vw, 64px) clamp(28px, 4vw, 48px); } body.flyrent-homepage-custom .fly-hero-swoosh { position: absolute; z-index: 0; pointer-events: none; left: -22%; bottom: -17%; width: 160%; height: 64%; } body.flyrent-homepage-custom .fly-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; } body.flyrent-homepage-custom .fly-hero-grid > * { min-width: 0; } body.flyrent-homepage-custom .fly-hero-title { font-size: clamp(2.5rem, 1.2rem + 3.4vw, 5rem); line-height: 1.04; color: var(--fly-ink); letter-spacing: -0.035em; } body.flyrent-homepage-custom .fly-hero-lead { margin-top: 18px; max-width: 46ch; font-size: clamp(1.02rem, .9rem + .35vw, 1.25rem); color: var(--fly-muted); } /* "senza vincoli": the logo swoosh is drawn under the words once, on load. */ body.flyrent-homepage-custom .fly-hero-accent { position: relative; display: inline-block; white-space: nowrap; } body.flyrent-homepage-custom .fly-hero-underline { position: absolute; left: -2%; bottom: -0.2em; width: 104%; height: 0.36em; overflow: visible; pointer-events: none; } body.flyrent-homepage-custom .fly-hero-underline path { stroke-dasharray: 460; stroke-dashoffset: 0; } @media (prefers-reduced-motion: no-preference) { body.flyrent-homepage-custom .fly-hero-underline path { animation: fly-draw 1.1s var(--fly-ease) .35s both; } body.flyrent-homepage-custom .fly-hero-underline path + path { animation-delay: .6s; } } @keyframes fly-draw { from { stroke-dashoffset: 460; } to { stroke-dashoffset: 0; } } body.flyrent-homepage-custom .fly-hero-partners { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 16px; font-size: 15px; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-hero-partners span { display: inline-flex; align-items: center; gap: 5px; } body.flyrent-homepage-custom .fly-hero-partners span + span::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--fly-red); margin-right: 8px; } body.flyrent-homepage-custom .fly-hero-partners strong { font-family: var(--fly-font-display); font-weight: 800; color: var(--fly-ink); } /* ── Instant Match Finder ───────────────────────────────────────── */ body.flyrent-homepage-custom .fly-hero-finder-card { margin-top: clamp(20px, 2.4vw, 30px); padding: clamp(16px, 1.8vw, 24px); background: var(--fly-white); border: 1px solid var(--fly-line); border-radius: var(--fly-radius-lg); box-shadow: 0 4px 20px -8px rgba(10, 65, 147, .16), 0 1px 3px rgba(10, 65, 147, .05); } body.flyrent-homepage-custom .fly-finder-tabs { display: flex; gap: 4px; padding: 4px; background: var(--fly-soft); border-radius: 12px; margin-bottom: 16px; } body.flyrent-homepage-custom .fly-finder-tab { flex: 1; padding: 8px 10px; border-radius: 8px; font-family: var(--fly-font-display); font-size: 13px; font-weight: 700; color: var(--fly-muted); text-align: center; transition: all .2s ease; white-space: nowrap; } body.flyrent-homepage-custom .fly-finder-tab:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-finder-tab.is-active { background: var(--fly-white); color: var(--fly-blue); box-shadow: 0 2px 6px rgba(10, 65, 147, .12); } body.flyrent-homepage-custom .fly-finder-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: flex-end; } /* Two rows: the two selects, then "anticipo zero" + submit, so labels and values never get cut. */ @media (min-width: 580px) { body.flyrent-homepage-custom .fly-finder-fields { grid-template-columns: 1fr 1fr; align-items: end; row-gap: 14px; } body.flyrent-homepage-custom .fly-finder-field--check { align-self: center; } body.flyrent-homepage-custom .fly-finder-field--action .fly-btn { width: 100%; } } body.flyrent-homepage-custom .fly-finder-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; } body.flyrent-homepage-custom .fly-finder-label { font-size: 11.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--fly-muted); } /* A site stylesheet hides native selects (opacity:0, visibility:hidden) for Motors widgets. */ body.flyrent-homepage-custom select.fly-finder-select { display: block; position: relative; opacity: 1; visibility: visible; pointer-events: auto; display: block; width: 100%; min-height: 44px; margin: 0; padding: 8px 30px 8px 12px; font: 600 14px/1.3 var(--fly-font-text); color: var(--fly-ink); background-color: var(--fly-soft); border: 1px solid var(--fly-line); border-radius: 10px; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230A4193' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; transition: border-color .2s ease, background-color .2s ease; } body.flyrent-homepage-custom select.fly-finder-select:hover { border-color: #B9C6DC; } body.flyrent-homepage-custom select.fly-finder-select:focus { outline: none; background-color: var(--fly-white); border-color: var(--fly-blue); box-shadow: 0 0 0 3px rgba(10, 65, 147, .15); } body.flyrent-homepage-custom .fly-finder-check-label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 2px; cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--fly-ink); white-space: nowrap; user-select: none; } body.flyrent-homepage-custom .fly-finder-check-input { position: absolute; opacity: 0; width: 1px; height: 1px; } body.flyrent-homepage-custom .fly-finder-box { flex: none; position: relative; width: 18px; height: 18px; border-radius: 5px; border: 2px solid #B9C6DC; background: var(--fly-white); transition: all .15s ease; } body.flyrent-homepage-custom .fly-finder-box::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 9px; border: solid var(--fly-white); border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform .2s var(--fly-ease); } body.flyrent-homepage-custom .fly-finder-check-input:checked + .fly-finder-box { background: var(--fly-blue); border-color: var(--fly-blue); } body.flyrent-homepage-custom .fly-finder-check-input:checked + .fly-finder-box::after { transform: rotate(45deg) scale(1); } body.flyrent-homepage-custom .fly-finder-submit { min-height: 44px; padding: 10px 18px; font-size: 14.5px; width: 100%; } body.flyrent-homepage-custom .fly-finder-perks { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--fly-line); font-size: 12.5px; font-weight: 600; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-finder-perk { display: inline-flex; align-items: center; gap: 6px; } body.flyrent-homepage-custom .fly-finder-perk .fly-icon { width: 14px; height: 14px; color: var(--fly-blue); } body.flyrent-homepage-custom .fly-hero-offers { display: flex; flex-direction: column; gap: 20px; } body.flyrent-homepage-custom .fly-hero-media { position: relative; order: -1; aspect-ratio: 4 / 3; max-height: 62vh; margin-inline: auto; width: 100%; } /* Outer span: carousel slide. Inner .fly-hero-fit: same zoom/centre for every car (photo-fit.js, 90% of the box). Image: contained with a soft contact shadow. */ body.flyrent-homepage-custom .fly-hero-car { position: absolute; z-index: 1; inset: 0; display: block; opacity: 0; transform: translateX(calc(var(--fly-dir, 1) * 48px)) scale(.97); transition: opacity .6s var(--fly-ease), transform .9s var(--fly-ease); } body.flyrent-homepage-custom .fly-hero-car.is-active { opacity: 1; transform: none; } body.flyrent-homepage-custom:not(.fly-js) .fly-hero-car:first-of-type { opacity: 1; transform: none; } body.flyrent-homepage-custom .fly-hero-fit { position: absolute; inset: 0; display: block; transform-origin: 50% 50%; transition: transform .5s var(--fly-ease); } body.flyrent-homepage-custom .fly-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 26px 22px rgba(6, 26, 58, .28)); } body.flyrent-homepage-custom .fly-offer-card { position: relative; background: var(--fly-white); border-radius: var(--fly-radius-lg); box-shadow: var(--fly-shadow-lg); padding: clamp(20px, 2.4vw, 30px); } body.flyrent-homepage-custom .fly-offer-card[hidden] { display: none; } body.flyrent-homepage-custom .fly-js .fly-offer-card.is-active { animation: fly-card-in .55s var(--fly-ease) both; } @keyframes fly-card-in { from { opacity: .15; transform: translateX(calc(var(--fly-dir, 1) * 14px)); } to { opacity: 1; transform: none; } } body.flyrent-homepage-custom .fly-offer-flag { position: absolute; top: 0; right: 24px; transform: translateY(-50%); font-family: var(--fly-font-display); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--fly-white); background: var(--fly-blue); padding: 6px 12px; border-radius: 8px; box-shadow: 0 6px 14px -6px rgba(10, 65, 147, .6); } body.flyrent-homepage-custom .fly-offer-title { font-size: clamp(1.25rem, 1.05rem + .7vw, 1.6rem); font-weight: 700; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-offer-title a:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-offer-price { display: flex; align-items: baseline; gap: 6px; margin-top: 14px; color: var(--fly-red); font-family: var(--fly-font-display); } body.flyrent-homepage-custom .fly-offer-amount { font-size: clamp(2.6rem, 2rem + 2.2vw, 3.6rem); font-weight: 800; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom .fly-offer-period { font-size: 1.1rem; font-weight: 700; } body.flyrent-homepage-custom .fly-offer-price--ask { font-size: 1.5rem; font-weight: 800; } body.flyrent-homepage-custom .fly-offer-vat { margin-top: 4px; font-size: 13px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-specs { display: flex; flex-wrap: wrap; gap: 0; margin-top: 18px; border-top: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-spec { flex: 1 1 0; min-width: 0; padding: 12px 14px 0 0; } body.flyrent-homepage-custom .fly-spec + .fly-spec { padding-left: 14px; border-left: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-spec dt { font-size: 12px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-spec dd { margin: 2px 0 0; font-family: var(--fly-font-display); font-size: 15px; font-weight: 700; color: var(--fly-ink); white-space: nowrap; } body.flyrent-homepage-custom .fly-offer-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; } body.flyrent-homepage-custom .fly-hero-controls { display: flex; align-items: center; gap: 12px; } body.flyrent-homepage-custom .fly-round-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--fly-white); color: var(--fly-blue); box-shadow: var(--fly-shadow); transition: background-color .2s ease, color .2s ease; } body.flyrent-homepage-custom .fly-round-btn:hover { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom .fly-hero-dots { display: flex; gap: 6px; } body.flyrent-homepage-custom .fly-hero-dot { position: relative; width: 28px; height: 44px; } body.flyrent-homepage-custom .fly-hero-dot::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; border-radius: 4px; background: #B9C6DC; transition: background-color .2s ease; } body.flyrent-homepage-custom .fly-hero-dot.is-active::before { background: var(--fly-blue); } body.flyrent-homepage-custom a.fly-hero-more { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-family: var(--fly-font-display); font-size: 14px; font-weight: 700; color: var(--fly-blue); } body.flyrent-homepage-custom a.fly-hero-more:hover { color: var(--fly-blue-700); text-decoration: underline; text-underline-offset: 4px; } body.flyrent-homepage-custom .fly-hero-more .fly-icon { width: 16px; height: 16px; } body.flyrent-homepage-custom .fly-hero-fallback { margin-top: 8px; } @media (min-width: 1024px) { body.flyrent-homepage-custom .fly-hero { padding-block: clamp(40px, 4vw, 72px) clamp(36px, 3.5vw, 64px); } body.flyrent-homepage-custom .fly-hero-grid { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); column-gap: clamp(40px, 4.5vw, 96px); align-items: center; min-height: min(760px, calc(100svh - 170px)); } body.flyrent-homepage-custom .fly-hero-copy { display: flex; flex-direction: column; max-width: 720px; } body.flyrent-homepage-custom .fly-hero-offers { display: flex; flex-direction: column; gap: 0; } body.flyrent-homepage-custom .fly-hero-media { order: -1; aspect-ratio: 16 / 10; max-height: none; width: 100%; margin: 0; } body.flyrent-homepage-custom .fly-hero-swoosh { left: -14%; bottom: -8%; width: 128%; height: 62%; } /* Offer card: one horizontal band overlapping the bottom of the photo. */ body.flyrent-homepage-custom .fly-hero-cards { position: relative; z-index: 2; margin: clamp(-72px, -4vw, -40px) auto 0; width: min(100%, 820px); container-type: inline-size; } /* Title | price, then the specs on a full row, then the actions: specs never collide. */ body.flyrent-homepage-custom .fly-offer-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: clamp(20px, 2.4vw, 40px); row-gap: 4px; padding: clamp(20px, 1.8vw, 28px) clamp(22px, 2.2vw, 34px); } body.flyrent-homepage-custom .fly-offer-card[hidden] { display: none; } body.flyrent-homepage-custom .fly-offer-title { grid-column: 1; grid-row: 1; } body.flyrent-homepage-custom .fly-offer-price { grid-column: 2; grid-row: 1; margin-top: 0; justify-content: flex-end; } body.flyrent-homepage-custom .fly-offer-vat { grid-column: 2; grid-row: 2; margin-top: 0; text-align: right; } body.flyrent-homepage-custom .fly-offer-card .fly-specs { grid-column: 1 / -1; grid-row: 3; margin-top: 12px; flex-wrap: nowrap; } body.flyrent-homepage-custom .fly-offer-card .fly-spec { flex: 0 0 auto; padding-right: clamp(14px, 1.4vw, 24px); } body.flyrent-homepage-custom .fly-offer-card .fly-spec + .fly-spec { padding-left: clamp(14px, 1.4vw, 24px); } body.flyrent-homepage-custom .fly-offer-actions { grid-column: 1 / -1; grid-row: 4; margin-top: 14px; justify-content: flex-end; } body.flyrent-homepage-custom .fly-offer-price--ask { grid-row: 1 / 3; align-self: center; } body.flyrent-homepage-custom .fly-hero-controls { margin: 18px auto 0; width: min(100%, 820px); } body.flyrent-homepage-custom .fly-hero--empty .fly-hero-grid { grid-template-columns: minmax(0, 720px); min-height: 0; } } @media (max-width: 1023px) { body.flyrent-homepage-custom .fly-hero-swoosh { left: -34%; bottom: -16%; width: 170%; height: 56%; } body.flyrent-homepage-custom .fly-hero-media { max-width: 520px; margin-block: 8px -8px; } body.flyrent-homepage-custom .fly-hero-cards { position: relative; z-index: 1; } } @media (max-width: 480px) { body.flyrent-homepage-custom .fly-finder-fields { grid-template-columns: 1fr; } body.flyrent-homepage-custom .fly-finder-tabs { overflow-x: auto; scrollbar-width: none; } body.flyrent-homepage-custom .fly-finder-tab { font-size: 12px; padding: 7px 8px; } body.flyrent-homepage-custom .fly-spec { flex-basis: 50%; } body.flyrent-homepage-custom .fly-spec:nth-child(3) { padding-left: 0; border-left: 0; } body.flyrent-homepage-custom .fly-offer-actions .fly-btn { flex: 1 1 auto; } body.flyrent-homepage-custom a.fly-hero-more { font-size: 13px; } } /* ── 5. Online strip ────────────────────────────────────────────── */ body.flyrent-homepage-custom .fly-online-strip { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom .fly-online-strip-inner { display: flex; align-items: center; gap: 18px; padding-block: 18px; } body.flyrent-homepage-custom .fly-online-strip-icon { width: 28px; height: 28px; opacity: .9; } body.flyrent-homepage-custom .fly-online-strip-text { flex: 1; font-size: 16px; color: #D8E3F5; } body.flyrent-homepage-custom .fly-online-strip-text strong { font-family: var(--fly-font-display); font-weight: 700; color: var(--fly-white); margin-right: 6px; } body.flyrent-homepage-custom .fly-online-strip :where(a):focus-visible { outline-color: var(--fly-white); } @media (max-width: 720px) { body.flyrent-homepage-custom .fly-online-strip-inner { flex-wrap: wrap; } body.flyrent-homepage-custom .fly-online-strip-icon { display: none; } body.flyrent-homepage-custom .fly-online-strip-text { flex-basis: 100%; } body.flyrent-homepage-custom .fly-online-strip .fly-btn { width: 100%; } } /* ── 6. Sections ────────────────────────────────────────────────── */ body.flyrent-homepage-custom .fly-section { padding-block: var(--fly-section); } body.flyrent-homepage-custom .fly-section-head { margin-bottom: clamp(28px, 4vw, 48px); } body.flyrent-homepage-custom .fly-section-head--split { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap; } body.flyrent-homepage-custom .fly-section-title { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.8rem); color: var(--fly-ink); } body.flyrent-homepage-custom .fly-section-lead { margin-top: 12px; max-width: 58ch; font-size: 1.08rem; color: var(--fly-muted); } /* Pathways tabs */ body.flyrent-homepage-custom .fly-tablist { display: inline-flex; gap: 4px; padding: 5px; margin-bottom: 28px; background: var(--fly-soft); border-radius: 14px; border: 1px solid var(--fly-line); max-width: 100%; overflow-x: auto; scrollbar-width: none; } body.flyrent-homepage-custom .fly-tablist[hidden] { display: none; } body.flyrent-homepage-custom .fly-tab { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; min-height: 48px; padding: 10px 20px; border-radius: 10px; font-family: var(--fly-font-display); font-size: 15px; font-weight: 700; color: var(--fly-muted); transition: background-color .2s ease, color .2s ease, box-shadow .2s ease; } body.flyrent-homepage-custom .fly-tab:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-tab[aria-selected="true"] { background: var(--fly-white); color: var(--fly-blue); box-shadow: var(--fly-shadow); } body.flyrent-homepage-custom .fly-panel { display: grid; gap: clamp(24px, 4vw, 64px); align-items: center; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding: clamp(24px, 4vw, 48px); border-radius: var(--fly-radius-lg); background: linear-gradient(135deg, var(--fly-navy), var(--fly-blue)); color: var(--fly-white); } body.flyrent-homepage-custom .fly-panel + .fly-panel { margin-top: 16px; } body.flyrent-homepage-custom .is-tabbed .fly-panel + .fly-panel { margin-top: 0; } body.flyrent-homepage-custom .fly-panel[hidden] { display: none; } body.flyrent-homepage-custom .is-tabbed .fly-panel:not([hidden]) { animation: fly-panel-in .45s var(--fly-ease) both; } @keyframes fly-panel-in { from { opacity: .3; transform: translateY(6px); } to { opacity: 1; transform: none; } } body.flyrent-homepage-custom .fly-panel-for { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #B9CBEA; } body.flyrent-homepage-custom .is-tabbed .fly-panel-for { display: none; } body.flyrent-homepage-custom .fly-panel-title { margin-top: 8px; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); color: var(--fly-white); } body.flyrent-homepage-custom .is-tabbed .fly-panel-title { margin-top: 0; } body.flyrent-homepage-custom .fly-panel-text { margin-top: 14px; max-width: 52ch; font-size: 1.08rem; color: #D8E3F5; } body.flyrent-homepage-custom .fly-panel-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 26px; } body.flyrent-homepage-custom .fly-panel a.fly-text-link { color: var(--fly-white); } body.flyrent-homepage-custom .fly-panel :where(a):focus-visible { outline-color: var(--fly-white); } body.flyrent-homepage-custom .fly-panel-points { display: grid; } body.flyrent-homepage-custom .fly-panel-points li { display: flex; align-items: center; gap: 14px; padding-block: 14px; border-bottom: 1px solid rgba(255, 255, 255, .16); font-weight: 600; color: var(--fly-white); } body.flyrent-homepage-custom .fly-panel-points li:first-child { border-top: 1px solid rgba(255, 255, 255, .16); } body.flyrent-homepage-custom .fly-panel-points .fly-icon { width: 24px; height: 24px; padding: 4px; border-radius: 50%; color: var(--fly-blue); background: var(--fly-white); } @media (max-width: 860px) { body.flyrent-homepage-custom .fly-panel { grid-template-columns: 1fr; } body.flyrent-homepage-custom .fly-tablist { display: flex; width: 100%; } body.flyrent-homepage-custom .fly-tab { flex: 1 0 auto; justify-content: center; padding-inline: 14px; font-size: 14px; } body.flyrent-homepage-custom .fly-tab .fly-icon { display: none; } } /* Offers grid */ /* Offers: premium horizontal slider on night navy, catalog cards. */ body.flyrent-homepage-custom .fly-offers { position: relative; overflow: hidden; background: var(--fly-navy); color: var(--fly-white); padding-bottom: clamp(48px, 6vw, 88px); } body.flyrent-homepage-custom .fly-offers-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 20px 40px; margin-bottom: clamp(24px, 3vw, 40px); } body.flyrent-homepage-custom .fly-offers .fly-section-title { font-size: clamp(2rem, 1.3rem + 2.4vw, 3.6rem); letter-spacing: -0.03em; } body.flyrent-homepage-custom .fly-offers-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 20px; } body.flyrent-homepage-custom .fly-offers-tools[hidden] { display: none; } body.flyrent-homepage-custom .fly-offers-chips { display: flex; flex-wrap: wrap; gap: 8px; } body.flyrent-homepage-custom .fly-offers-chip { min-height: 44px; padding: 10px 18px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22); color: #D8E3F5; font-family: var(--fly-font-display); font-size: 14.5px; font-weight: 700; transition: background-color .2s ease, color .2s ease, border-color .2s ease; } body.flyrent-homepage-custom .fly-offers-chip:hover { border-color: rgba(255, 255, 255, .6); color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-chip[aria-pressed="true"] { background: var(--fly-white); border-color: var(--fly-white); color: var(--fly-navy); } body.flyrent-homepage-custom .fly-offers-arrows { display: flex; gap: 10px; } body.flyrent-homepage-custom .fly-offers .fly-round-btn { width: 52px; height: 52px; background: rgba(255, 255, 255, .08); color: var(--fly-white); box-shadow: none; border: 1px solid rgba(255, 255, 255, .2); } body.flyrent-homepage-custom .fly-offers .fly-round-btn:hover:not(:disabled) { background: var(--fly-white); color: var(--fly-navy); } body.flyrent-homepage-custom .fly-offers .fly-round-btn:disabled { opacity: .35; cursor: default; } body.flyrent-homepage-custom .fly-offers-track { display: flex; gap: clamp(16px, 1.6vw, 28px); margin: 0; list-style: none; padding: 8px var(--fly-gutter) 28px; scroll-padding-inline: var(--fly-gutter); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; } body.flyrent-homepage-custom .fly-offers-track::-webkit-scrollbar { display: none; } body.flyrent-homepage-custom .fly-offers-track.is-dragging { cursor: grabbing; scroll-snap-type: none; } body.flyrent-homepage-custom .fly-offers-track.is-dragging * { pointer-events: none; } body.flyrent-homepage-custom .fly-offers-track > li { flex: 0 0 clamp(290px, 27vw, 460px); scroll-snap-align: start; } body.flyrent-homepage-custom .fly-offers-track > li[hidden] { display: none; } body.flyrent-homepage-custom .fly-offers-track :where(a):focus-visible { outline-color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-track:focus-visible { outline: 2px solid rgba(255, 255, 255, .6); outline-offset: -2px; } body.flyrent-homepage-custom .fly-offers-more-link { display: flex; flex-direction: column; justify-content: flex-end; gap: 12px; height: 100%; min-height: 360px; padding: clamp(24px, 2.4vw, 36px); border-radius: 18px; border: 2px dashed rgba(255, 255, 255, .28); color: var(--fly-white); transition: border-color .2s ease, background-color .2s ease; } body.flyrent-homepage-custom .fly-offers-more-link:hover { border-color: var(--fly-white); background: rgba(255, 255, 255, .05); color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-more-title { font-family: var(--fly-font-display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.2rem); font-weight: 800; line-height: 1.1; } body.flyrent-homepage-custom .fly-offers-more-text { color: #C9D5EA; max-width: 30ch; } body.flyrent-homepage-custom .fly-offers-more-go { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-top: 8px; border-radius: 50%; background: var(--fly-red); color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-progress { position: relative; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .14); overflow: hidden; } body.flyrent-homepage-custom .fly-offers-progress span { position: absolute; top: 0; bottom: 0; left: 0; width: 30%; border-radius: 3px; background: var(--fly-white); transition: left .25s ease-out, width .25s ease-out; } @media (max-width: 640px) { body.flyrent-homepage-custom .fly-offers-track > li { flex-basis: 84%; } body.flyrent-homepage-custom .fly-offers-arrows { display: none; } } body.flyrent-homepage-custom .fly-offers .fly-section-title { color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers .fly-section-lead { color: #C9D5EA; max-width: 56ch; } body.flyrent-homepage-custom .fly-offers :where(a):focus-visible { outline-color: var(--fly-white); } /* Offers garage: showroom stage for the selected offer (home-showcase.js) */ body.flyrent-homepage-custom .fly-garage { position: relative; isolation: isolate; overflow: hidden; margin-bottom: clamp(12px, 1.6vw, 24px); color: var(--fly-white); --gx: 0; --gy: 0; } body.flyrent-homepage-custom .fly-garage-scene { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: #030B1C; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 86%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 86%, transparent 100%); } body.flyrent-homepage-custom .fly-garage-scene > * { position: absolute; } body.flyrent-homepage-custom .fly-garage-wall { inset: 0 0 34% 0; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 180px), radial-gradient(ellipse 55% 70% at 66% 78%, rgba(38, 104, 226, .38), transparent 70%), linear-gradient(180deg, #030B1C 0%, #0A2350 100%); } /* Ceiling light strips */ body.flyrent-homepage-custom .fly-garage-tube { top: calc(9% + var(--t) * 6.5%); left: calc(46% - var(--t) * 5%); right: calc(10% - var(--t) * 5%); height: calc(2px + var(--t) * 1px); border-radius: 4px; background: #EAF2FF; box-shadow: 0 0 10px 1px rgba(160, 200, 255, .8), 0 0 42px 6px rgba(60, 125, 255, .35); } /* Red brand neon along the back wall */ body.flyrent-homepage-custom .fly-garage-neon { left: 38%; right: 0; top: 64%; height: 2px; background: linear-gradient(90deg, transparent, var(--fly-red) 18%, #FF3A44 60%, transparent); box-shadow: 0 0 16px 2px rgba(226, 0, 12, .6), 0 0 60px 8px rgba(226, 0, 12, .25); } body.flyrent-homepage-custom .fly-garage-brand { right: calc(var(--fly-gutter) - .04em); top: 12%; font-family: var(--fly-font-display); font-size: clamp(4.5rem, 13vw, 15rem); font-weight: 800; line-height: .8; letter-spacing: -0.045em; text-transform: uppercase; white-space: nowrap; color: transparent; -webkit-text-stroke: 1.5px rgba(160, 196, 255, .22); translate: calc(var(--gx) * -16px) 0; transition: translate .8s var(--fly-ease); } body.flyrent-homepage-custom .fly-garage-spot { left: 30%; right: -10%; top: 0; bottom: 18%; background: conic-gradient(from 160deg at 62% -6%, transparent 0deg, rgba(175, 205, 255, .1) 10deg, rgba(205, 225, 255, .22) 20deg, rgba(175, 205, 255, .1) 30deg, transparent 40deg); -webkit-mask-image: linear-gradient(to bottom, #000 30%, transparent 100%); mask-image: linear-gradient(to bottom, #000 30%, transparent 100%); mix-blend-mode: screen; translate: calc(var(--gx) * 14px) 0; transition: translate .8s var(--fly-ease); } body.flyrent-homepage-custom .fly-garage-floor { left: 0; right: 0; bottom: 0; height: 34%; overflow: hidden; background: radial-gradient(ellipse 34% 55% at 66% 30%, rgba(100, 160, 255, .32), transparent 70%), linear-gradient(180deg, #0B2552, #030B1C 90%); } body.flyrent-homepage-custom .fly-garage-floor::before { content: ""; position: absolute; inset: 0 -60% -40%; background: repeating-linear-gradient(90deg, rgba(120, 170, 255, .16) 0 1px, transparent 1px 96px), repeating-linear-gradient(0deg, rgba(120, 170, 255, .12) 0 1px, transparent 1px 56px); transform: perspective(420px) rotateX(64deg); transform-origin: 50% 0; -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .2), #000 30%, transparent 85%); mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .2), #000 30%, transparent 85%); } /* Speed streaks, played on each car change */ body.flyrent-homepage-custom .fly-garage-streaks { inset: 20% 0 18% 30%; overflow: hidden; } body.flyrent-homepage-custom .fly-garage-streaks i { position: absolute; left: 100%; width: 45%; height: 2px; border-radius: 2px; opacity: 0; background: linear-gradient(90deg, transparent, rgba(215, 232, 255, .85), transparent); } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(1) { top: 22%; } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(2) { top: 38%; width: 30%; } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(3) { top: 51%; width: 60%; } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(4) { top: 63%; } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(5) { top: 74%; width: 35%; background: linear-gradient(90deg, transparent, rgba(255, 90, 98, .8), transparent); } body.flyrent-homepage-custom .fly-garage-streaks i:nth-child(6) { top: 86%; width: 50%; } body.flyrent-homepage-custom .fly-garage-inner { position: relative; display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.5fr); align-items: center; gap: clamp(16px, 3vw, 56px); min-height: clamp(460px, 40vw, 680px); padding-block: clamp(36px, 4.4vw, 72px); } body.flyrent-homepage-custom .fly-garage-info { position: relative; z-index: 2; } body.flyrent-homepage-custom .fly-garage-count { font-family: var(--fly-font-display); font-size: 14px; font-weight: 800; letter-spacing: .2em; color: #7F96BE; font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom .fly-garage-count [data-g="n"] { color: var(--fly-white); } body.flyrent-homepage-custom .fly-garage-count-sep { margin-inline: .5em; color: #3E5680; } body.flyrent-homepage-custom .fly-garage-kicker { display: inline-flex; margin-top: 18px; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(255, 70, 80, .55); background: rgba(226, 0, 12, .16); color: #FFC2C5; font-family: var(--fly-font-display); font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } body.flyrent-homepage-custom .fly-garage-kicker.is-brand { border-color: rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .07); color: #D8E3F5; } body.flyrent-homepage-custom .fly-garage-name { margin-top: 14px; font-family: var(--fly-font-display); font-size: clamp(1.9rem, 1.1rem + 2.1vw, 3.4rem); font-weight: 800; line-height: 1.02; letter-spacing: -0.03em; color: var(--fly-white); text-wrap: balance; } body.flyrent-homepage-custom .fly-garage-price { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 0 4px; margin-top: 18px; color: #FF2E3A; font-family: var(--fly-font-display); font-weight: 800; text-shadow: 0 0 28px rgba(226, 0, 12, .45); } body.flyrent-homepage-custom .fly-garage-amount { font-size: clamp(3rem, 1.9rem + 3.4vw, 5.6rem); line-height: .86; letter-spacing: -0.045em; font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom .fly-garage-cur { margin-left: .12em; font-size: clamp(1.6rem, 1.1rem + 1.3vw, 2.6rem); line-height: 1; } body.flyrent-homepage-custom .fly-garage-price small { margin: 0 0 4px 12px; font-family: var(--fly-font-text); font-size: 12.5px; font-weight: 700; line-height: 1.35; letter-spacing: .06em; text-transform: uppercase; color: #9DB0D1; text-shadow: none; } body.flyrent-homepage-custom .fly-garage-stats { display: grid; gap: 12px; max-width: 440px; margin-top: clamp(20px, 2.4vw, 32px); } body.flyrent-homepage-custom .fly-garage-stat { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 14px; } body.flyrent-homepage-custom .fly-garage-stat dt { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8FA6CC; } body.flyrent-homepage-custom .fly-garage-stat dd { display: flex; align-items: center; gap: 14px; margin: 0; } body.flyrent-homepage-custom .fly-garage-stat b { flex: none; min-width: 8.6em; font-family: var(--fly-font-display); font-size: 15px; font-weight: 700; color: var(--fly-white); font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom .fly-garage-stat.is-zero b { color: #8EC1FF; } body.flyrent-homepage-custom .fly-garage-bar { flex: 1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3px; height: 10px; } body.flyrent-homepage-custom .fly-garage-bar i { border-radius: 2px; background: rgba(255, 255, 255, .1); transform: skewX(-20deg); transition: background-color .25s ease calc(var(--s) * 30ms), box-shadow .25s ease calc(var(--s) * 30ms); } body.flyrent-homepage-custom .fly-garage-bar i.is-on { background: linear-gradient(180deg, #6EAEFF, #2168E0); box-shadow: 0 0 8px rgba(70, 140, 255, .55); } body.flyrent-homepage-custom .fly-garage-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(22px, 2.6vw, 34px); } body.flyrent-homepage-custom a.fly-garage-wa { border-color: rgba(255, 255, 255, .35); color: var(--fly-white); background: rgba(255, 255, 255, .04); } body.flyrent-homepage-custom a.fly-garage-wa:hover { background: var(--fly-white); border-color: var(--fly-white); color: var(--fly-navy); } body.flyrent-homepage-custom .fly-garage-stage { position: relative; display: block; align-self: stretch; min-height: clamp(300px, 32vw, 580px); color: inherit; transform: perspective(1400px) rotateY(calc(var(--gx) * 4deg)) translateX(calc(var(--gx) * 8px)); transition: transform .8s var(--fly-ease), filter 1.4s ease .6s; } body.flyrent-homepage-custom .fly-garage-platform { position: absolute; left: 3%; right: 3%; bottom: 10%; height: 0; } body.flyrent-homepage-custom .fly-garage-platform::before { content: ""; position: absolute; left: 4%; right: 4%; top: 0; height: 90px; translate: 0 -50%; border-radius: 50%; background: radial-gradient(closest-side, rgba(120, 175, 255, .42), rgba(30, 80, 170, .22) 62%, transparent 100%); } body.flyrent-homepage-custom .fly-garage-platform-ring { position: absolute; left: 0; width: 100%; aspect-ratio: 1; top: 0; translate: 0 -50%; border-radius: 50%; transform: scaleY(.2); border: 2px solid rgba(140, 190, 255, .6); box-shadow: 0 0 28px rgba(80, 150, 255, .55), inset 0 0 44px rgba(80, 150, 255, .35); background: repeating-conic-gradient(rgba(170, 210, 255, .5) 0 .8deg, transparent .8deg 10deg); -webkit-mask-image: radial-gradient(closest-side, transparent 88%, #000 89%); mask-image: radial-gradient(closest-side, transparent 88%, #000 89%); } body.flyrent-homepage-custom .fly-garage-car { position: absolute; inset: 0 1% 9% 1%; will-change: transform, opacity; } body.flyrent-homepage-custom .fly-garage-car:not(.is-active) { opacity: 0; } body.flyrent-homepage-custom .fly-garage-fit { position: absolute; inset: 0; transform-origin: 0 0; } body.flyrent-homepage-custom .fly-garage-fit img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: 50% 100%; } body.flyrent-homepage-custom .fly-garage-img { filter: drop-shadow(0 16px 14px rgba(0, 0, 0, .55)); } body.flyrent-homepage-custom .fly-garage-refl { display: none; opacity: .3; filter: blur(1.5px); transform-origin: 50% var(--yb, 100%); transform: scaleY(-1); -webkit-mask-image: linear-gradient(to bottom, transparent calc(var(--yb, 100%) - var(--rh, 30%)), #000 var(--yb, 100%)); mask-image: linear-gradient(to bottom, transparent calc(var(--yb, 100%) - var(--rh, 30%)), #000 var(--yb, 100%)); } body.flyrent-homepage-custom .fly-garage-car.has-refl .fly-garage-refl { display: block; } body.flyrent-homepage-custom .fly-garage-pause { position: absolute; right: 0; bottom: clamp(12px, 1.6vw, 24px); z-index: 3; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .25); background: rgba(3, 11, 28, .5); color: var(--fly-white); } body.flyrent-homepage-custom .fly-garage-pause[hidden] { display: none; } body.flyrent-homepage-custom .fly-garage-pause:hover { background: var(--fly-white); color: var(--fly-navy); } body.flyrent-homepage-custom .fly-garage-pause .is-play, body.flyrent-homepage-custom .fly-garage-pause[aria-pressed="true"] .is-pause { display: none; } body.flyrent-homepage-custom .fly-garage-pause[aria-pressed="true"] .is-play { display: inline; } /* The card on stage, with the autoplay timer (its animationend advances the garage) */ body.flyrent-homepage-custom .fly-offers .fly-cat-card.is-garage { box-shadow: 0 0 0 2px #5C9DFF, 0 22px 44px -14px rgba(40, 120, 255, .65); } body.flyrent-homepage-custom .fly-offers .fly-cat-card.is-garage::after { content: ""; position: absolute; z-index: 3; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #2168E0, #6EAEFF); transform-origin: 0 50%; transform: scaleX(0); } body.flyrent-homepage-custom .fly-offers.is-autoplay .fly-cat-card.is-garage::after { animation: fly-garage-timer var(--fly-garage-ms, 6500ms) linear forwards; } body.flyrent-homepage-custom .fly-offers.is-autoplay.is-held .fly-cat-card.is-garage::after { animation-play-state: paused; } @keyframes fly-garage-timer { to { transform: scaleX(1); } } @media (prefers-reduced-motion: no-preference) { body.flyrent-homepage-custom .fly-garage-platform-ring { animation: fly-garage-spin 14s linear infinite; } /* Lights off until the garage scrolls into view, then they flicker on */ body.flyrent-homepage-custom .fly-garage.is-dark .fly-garage-tube { opacity: .05; } body.flyrent-homepage-custom .fly-garage.is-dark :is(.fly-garage-neon, .fly-garage-spot, .fly-garage-brand) { opacity: 0; } body.flyrent-homepage-custom .fly-garage.is-dark .fly-garage-floor { opacity: .25; } body.flyrent-homepage-custom .fly-garage.is-dark .fly-garage-stage { filter: brightness(.1) saturate(.3); } body.flyrent-homepage-custom .fly-garage.is-dark .fly-garage-info > * { opacity: 0; transform: translateY(18px); } body.flyrent-homepage-custom .fly-garage-info > * { transition: opacity .7s var(--fly-ease), transform .7s var(--fly-ease); } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(1) { transition-delay: 1s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(2) { transition-delay: 1.08s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(3) { transition-delay: 1.16s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(4) { transition-delay: 1.24s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(5) { transition-delay: 1.32s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > :nth-child(6) { transition-delay: 1.4s; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-tube { animation: fly-garage-flicker .9s linear calc(.1s + var(--t) * .22s) both; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-neon { animation: fly-garage-flicker 1s linear .75s both; } body.flyrent-homepage-custom .fly-garage.is-lit :is(.fly-garage-spot, .fly-garage-brand, .fly-garage-floor) { animation: fly-garage-fade 1.2s ease .5s both; } } @keyframes fly-garage-spin { from { transform: scaleY(.2) rotate(0); } to { transform: scaleY(.2) rotate(360deg); } } @keyframes fly-garage-flicker { 0% { opacity: .05; } 8% { opacity: 1; } 13% { opacity: .15; } 22% { opacity: 1; } 27% { opacity: .3; } 36%, 100% { opacity: 1; } } @keyframes fly-garage-fade { from { opacity: 0; } to { opacity: 1; } } /* ── Garage Responsive Refinement (The Claude Standard) ───────────── */ @media (max-width: 960px) { body.flyrent-homepage-custom .fly-garage { margin-bottom: 24px; } body.flyrent-homepage-custom .fly-garage-inner { grid-template-columns: minmax(0, 1fr); gap: 0; min-height: 0; padding-block: 16px 28px; } body.flyrent-homepage-custom .fly-garage-stage { order: -1; min-height: 0; height: clamp(230px, 52vw, 340px); aspect-ratio: auto; transform: none; position: relative; overflow: hidden; border-radius: var(--fly-radius-lg); background: radial-gradient(ellipse 65% 55% at 50% 45%, rgba(38, 104, 226, .35), transparent 75%), #050E24; } /* Ancoraggio preciso degli elementi di scena al solo palco dell'auto */ body.flyrent-homepage-custom .fly-garage-wall { inset: 0 0 calc(100% - clamp(230px, 52vw, 340px)) 0; } body.flyrent-homepage-custom .fly-garage-floor { top: calc(clamp(230px, 52vw, 340px) * 0.44); height: calc(clamp(230px, 52vw, 340px) * 0.56); bottom: auto; } body.flyrent-homepage-custom .fly-garage-neon { left: 0; right: 0; top: calc(clamp(230px, 52vw, 340px) * 0.46); height: 2px; } body.flyrent-homepage-custom .fly-garage-tube { top: calc(6% + var(--t) * 4.5%); left: calc(15% - var(--t) * 3%); right: calc(15% - var(--t) * 3%); } body.flyrent-homepage-custom .fly-garage-spot { left: -15%; right: -15%; top: 0; bottom: calc(100% - clamp(230px, 52vw, 340px)); } body.flyrent-homepage-custom .fly-garage-brand { top: 14px; right: 20px; font-size: clamp(3.2rem, 12vw, 5.5rem); letter-spacing: -0.035em; opacity: 0.22; pointer-events: none; } body.flyrent-homepage-custom .fly-garage-streaks { inset: 0 0 calc(100% - clamp(230px, 52vw, 340px)) 0; } body.flyrent-homepage-custom .fly-garage-info { padding-top: 20px; } /* Su mobile/tablet i testi non attendono il delay artificiale di 1.5s */ body.flyrent-homepage-custom .fly-garage.is-dark .fly-garage-info > * { opacity: 1; transform: none; } body.flyrent-homepage-custom .fly-garage.is-lit .fly-garage-info > * { transition: none; } body.flyrent-homepage-custom .fly-garage-name { font-size: clamp(1.5rem, 5vw, 2.2rem); margin-top: 10px; } body.flyrent-homepage-custom .fly-garage-price { margin-top: 12px; gap: 4px 8px; } body.flyrent-homepage-custom .fly-garage-amount { font-size: clamp(2.8rem, 7vw, 4rem); } body.flyrent-homepage-custom .fly-garage-pause { top: 28px; right: var(--fly-gutter); bottom: auto; width: 40px; height: 40px; background: rgba(3, 11, 28, .75); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-color: rgba(255, 255, 255, .3); } } @media (max-width: 640px) { body.flyrent-homepage-custom .fly-offers-chips { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; padding-bottom: 4px; -webkit-overflow-scrolling: touch; } body.flyrent-homepage-custom .fly-offers-chips::-webkit-scrollbar { display: none; } body.flyrent-homepage-custom .fly-offers-chip { flex: none; white-space: nowrap; } body.flyrent-homepage-custom .fly-garage-stage { height: clamp(200px, 58vw, 260px); border-radius: var(--fly-radius); } body.flyrent-homepage-custom .fly-garage-wall { inset: 0 0 calc(100% - clamp(200px, 58vw, 260px)) 0; } body.flyrent-homepage-custom .fly-garage-floor { top: calc(clamp(200px, 58vw, 260px) * 0.42); height: calc(clamp(200px, 58vw, 260px) * 0.58); } body.flyrent-homepage-custom .fly-garage-neon { top: calc(clamp(200px, 58vw, 260px) * 0.45); } body.flyrent-homepage-custom .fly-garage-spot { bottom: calc(100% - clamp(200px, 58vw, 260px)); } body.flyrent-homepage-custom .fly-garage-brand { top: 10px; right: 14px; font-size: clamp(2.6rem, 11vw, 3.8rem); opacity: 0.18; } body.flyrent-homepage-custom .fly-garage-streaks { inset: 0 0 calc(100% - clamp(200px, 58vw, 260px)) 0; } body.flyrent-homepage-custom .fly-garage-pause { top: 24px; right: calc(var(--fly-gutter) + 6px); width: 36px; height: 36px; } body.flyrent-homepage-custom .fly-garage-kicker { margin-top: 8px; font-size: 11.5px; padding: 4px 10px; } body.flyrent-homepage-custom .fly-garage-name { font-size: clamp(1.35rem, 5.2vw, 1.8rem); margin-top: 8px; } body.flyrent-homepage-custom .fly-garage-price { margin-top: 8px; align-items: baseline; } body.flyrent-homepage-custom .fly-garage-amount { font-size: clamp(2.4rem, 8.5vw, 3.2rem); } body.flyrent-homepage-custom .fly-garage-cur { font-size: 1.35rem; } body.flyrent-homepage-custom .fly-garage-price small { margin: 0 0 0 8px; font-size: 11.5px; line-height: 1.25; } /* Barre statistiche Need for Speed perfettamente proporzionate */ body.flyrent-homepage-custom .fly-garage-stats { display: grid; gap: 10px; margin-top: 14px; max-width: 100%; } body.flyrent-homepage-custom .fly-garage-stat { display: flex; align-items: center; justify-content: space-between; gap: 8px; } body.flyrent-homepage-custom .fly-garage-stat dt { flex: 0 0 72px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #8FA6CC; } body.flyrent-homepage-custom .fly-garage-stat dd { flex: 1; display: flex; align-items: center; gap: 10px; margin: 0; min-width: 0; } body.flyrent-homepage-custom .fly-garage-bar { flex: 1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5px; height: 8px; min-width: 50px; } body.flyrent-homepage-custom .fly-garage-bar i { border-radius: 1.5px; } body.flyrent-homepage-custom .fly-garage-stat b { flex: 0 0 auto; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--fly-white); white-space: nowrap; } /* Azioni: Scopri offerta e WhatsApp affiancati */ body.flyrent-homepage-custom .fly-garage-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; } body.flyrent-homepage-custom .fly-garage-actions .fly-btn { width: 100%; justify-content: center; padding-inline: 8px; font-size: 13.5px; min-height: 44px; white-space: nowrap; } } @media (max-width: 370px) { body.flyrent-homepage-custom .fly-garage-actions { grid-template-columns: 1fr; } body.flyrent-homepage-custom .fly-garage-stat dt { flex: 0 0 64px; font-size: 10.5px; } body.flyrent-homepage-custom .fly-garage-stat b { font-size: 12.5px; } } body.flyrent-homepage-custom .fly-car-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: clamp(16px, 2vw, 24px); list-style: none; } body.flyrent-homepage-custom .fly-car-card { position: relative; display: flex; flex-direction: column; background: var(--fly-white); color: var(--fly-ink); border-radius: var(--fly-radius-lg); overflow: hidden; box-shadow: 0 18px 40px -20px rgba(3, 14, 36, .6); transition: transform .35s var(--fly-ease), box-shadow .35s var(--fly-ease); } body.flyrent-homepage-custom .fly-car-card:hover { transform: translateY(-4px); box-shadow: 0 28px 50px -22px rgba(3, 14, 36, .75); } body.flyrent-homepage-custom .fly-car-media { position: relative; aspect-ratio: 16 / 10; background: linear-gradient(180deg, #F4F7FB 0%, #E6ECF5 100%); } body.flyrent-homepage-custom .fly-car-media img { position: absolute; inset: 6% 6% 2%; width: 88%; height: 92%; object-fit: contain; filter: drop-shadow(0 14px 12px rgba(6, 26, 58, .22)); mix-blend-mode: multiply; transition: transform .5s var(--fly-ease); } body.flyrent-homepage-custom .fly-car-card:hover .fly-car-media img { transform: scale(1.04); } /* Normalized catalog photos: car already centred on flat #EEF1F6, so the frame matches it exactly. */ body.flyrent-homepage-custom .fly-car-media.is-flat { background: #EEF1F6; } body.flyrent-homepage-custom .fly-car-media.is-flat img { inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; mix-blend-mode: normal; } body.flyrent-homepage-custom .fly-car-badge { position: absolute; top: 14px; left: 14px; font-family: var(--fly-font-display); font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--fly-white); background: var(--fly-blue); padding: 4px 10px; border-radius: 6px; } body.flyrent-homepage-custom .fly-car-body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; } body.flyrent-homepage-custom .fly-car-name { font-size: 1.15rem; font-weight: 700; color: var(--fly-ink); min-height: 2.5em; } body.flyrent-homepage-custom a.fly-car-link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; } body.flyrent-homepage-custom a.fly-car-link:focus-visible { outline: none; } body.flyrent-homepage-custom .fly-car-card:has(a.fly-car-link:focus-visible) { outline: 3px solid var(--fly-white); outline-offset: 4px; } body.flyrent-homepage-custom .fly-specs--inline { margin-top: 14px; } body.flyrent-homepage-custom .fly-specs--inline .fly-spec { padding-top: 10px; } body.flyrent-homepage-custom .fly-specs--inline .fly-spec dd { font-size: 14px; } body.flyrent-homepage-custom .fly-car-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 18px; } body.flyrent-homepage-custom .fly-car-price { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 4px; color: var(--fly-red); font-family: var(--fly-font-display); } body.flyrent-homepage-custom .fly-car-amount { font-size: 2rem; font-weight: 800; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom .fly-car-period { font-weight: 700; } body.flyrent-homepage-custom .fly-car-vat { flex-basis: 100%; margin-top: 4px; font-family: var(--fly-font-text); font-size: 12px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-car-price--ask { font-size: 1.15rem; font-weight: 800; } body.flyrent-homepage-custom .fly-car-go { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--fly-blue-50); color: var(--fly-blue); transition: background-color .2s ease, color .2s ease; } body.flyrent-homepage-custom .fly-car-card:hover .fly-car-go { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-empty { max-width: 560px; padding: 32px; border-radius: var(--fly-radius-lg); background: rgba(255, 255, 255, .08); } body.flyrent-homepage-custom .fly-offers-empty h3 { font-size: 1.4rem; color: var(--fly-white); } body.flyrent-homepage-custom .fly-offers-empty p { margin: 10px 0 20px; color: #D2DEF3; } /* Included: blue stage with a real offer and its fee receipt (own car vs rental) */ body.flyrent-homepage-custom .fly-included { background: var(--fly-white); overflow-x: clip; } body.flyrent-homepage-custom .fly-included-inner { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.3fr); gap: clamp(32px, 4.2vw, 80px); align-items: center; } body.flyrent-homepage-custom .fly-included-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; font-family: var(--fly-font-display); font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--fly-red); } body.flyrent-homepage-custom .fly-included-eyebrow::before { content: ""; width: 32px; height: 3px; border-radius: 3px; background: currentColor; } body.flyrent-homepage-custom .fly-included-title { font-size: clamp(2.4rem, 1.2rem + 3.4vw, 4.8rem); line-height: 1.02; letter-spacing: -0.04em; } body.flyrent-homepage-custom .fly-included-title span { display: block; color: var(--fly-blue); } body.flyrent-homepage-custom .fly-included-copy .fly-section-lead { margin-top: 20px; max-width: 46ch; font-size: clamp(1.05rem, .95rem + .3vw, 1.25rem); } body.flyrent-homepage-custom .fly-included-copy .fly-btn { margin-top: 30px; } body.flyrent-homepage-custom .fly-included-note { margin-top: 14px; color: var(--fly-muted); font-size: 14.5px; } body.flyrent-homepage-custom .fly-included-stage { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); grid-template-rows: auto 1fr; align-items: end; gap: 0 clamp(8px, 1.4vw, 24px); min-height: clamp(560px, 44vw, 700px); padding: clamp(22px, 2.6vw, 44px); border-radius: 32px; color: var(--fly-white); background: radial-gradient(ellipse 70% 55% at 18% 92%, #2A6FD8 0%, transparent 62%), linear-gradient(150deg, #0A4193 0%, #062B66 100%); box-shadow: 0 50px 90px -46px rgba(10, 65, 147, .75); } body.flyrent-homepage-custom .fly-included-swoosh { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; clip-path: inset(0 round 32px); pointer-events: none; } body.flyrent-homepage-custom .fly-compare { grid-column: 1 / -1; grid-row: 1; justify-self: start; align-self: start; display: inline-flex; gap: 4px; padding: 5px; border-radius: 999px; background: rgba(3, 18, 48, .35); border: 1px solid rgba(255, 255, 255, .18); } body.flyrent-homepage-custom .fly-compare[hidden] { display: none; } body.flyrent-homepage-custom .fly-compare-btn { min-height: 44px; padding: 10px 18px; border-radius: 999px; color: #D8E3F5; font-family: var(--fly-font-display); font-size: 14px; font-weight: 700; transition: background-color .25s ease, color .25s ease; } body.flyrent-homepage-custom .fly-compare-btn:hover { color: var(--fly-white); } body.flyrent-homepage-custom .fly-compare-btn[aria-pressed="true"] { background: var(--fly-white); color: var(--fly-blue); } body.flyrent-homepage-custom .fly-included-car { grid-column: 1; grid-row: 2; z-index: 1; align-self: end; width: 185%; max-width: none; margin: 0 -55% -1% -30%; filter: drop-shadow(0 30px 24px rgba(2, 12, 34, .5)); } body.flyrent-homepage-custom .fly-receipt-wrap { position: relative; grid-column: 2; grid-row: 2; z-index: 2; align-self: center; justify-self: end; width: 100%; max-width: 520px; filter: drop-shadow(0 34px 40px rgba(2, 14, 40, .45)); rotate: -1.5deg; } body.flyrent-homepage-custom .fly-receipt { --zz: 9px; position: relative; padding: clamp(22px, 2.2vw, 36px) clamp(22px, 2.2vw, 36px) calc(clamp(22px, 2.2vw, 36px) + var(--zz)); border-radius: 20px 20px 0 0; background: var(--fly-white); color: var(--fly-ink); -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - var(--zz)) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--zz) * 2) var(--zz) repeat-x; mask: linear-gradient(#000 0 0) top / 100% calc(100% - var(--zz)) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--zz) * 2) var(--zz) repeat-x; } body.flyrent-homepage-custom .fly-receipt[data-mode="fly"] [data-when="own"], body.flyrent-homepage-custom .fly-receipt[data-mode="own"] [data-when="fly"] { display: none; } body.flyrent-homepage-custom .fly-receipt-head { padding-bottom: 16px; border-bottom: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-receipt-kicker { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-receipt-model { margin-top: 4px; font-family: var(--fly-font-display); font-size: clamp(1.2rem, 1rem + .6vw, 1.55rem); font-weight: 800; letter-spacing: -0.01em; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-receipt-lines { display: grid; gap: 2px; padding-block: 14px; } body.flyrent-homepage-custom .fly-receipt-lines li { display: flex; align-items: center; gap: 12px; min-height: 44px; font-size: clamp(15px, .9rem + .2vw, 17px); font-weight: 600; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-receipt-check { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--fly-blue); color: var(--fly-white); transition: background-color .3s ease, box-shadow .3s ease; } body.flyrent-homepage-custom .fly-receipt-check .fly-icon { width: 16px; height: 16px; } body.flyrent-homepage-custom .fly-receipt-euro { display: none; font-family: var(--fly-font-display); font-size: 14px; font-weight: 800; } body.flyrent-homepage-custom .fly-receipt[data-mode="own"] .fly-receipt-check { background: #FFF1F2; color: var(--fly-red-700); box-shadow: inset 0 0 0 1.5px #F4B9BD; } body.flyrent-homepage-custom .fly-receipt[data-mode="own"] .fly-receipt-check .fly-icon { display: none; } body.flyrent-homepage-custom .fly-receipt[data-mode="own"] .fly-receipt-euro { display: inline; } body.flyrent-homepage-custom .fly-receipt-item { min-width: 0; } body.flyrent-homepage-custom .fly-receipt-dots { flex: 1; min-width: 16px; border-bottom: 2px dotted var(--fly-line); transform: translateY(4px); } body.flyrent-homepage-custom .fly-receipt-val { flex: none; font-size: 14px; font-weight: 700; color: var(--fly-blue); } body.flyrent-homepage-custom .fly-receipt-val [data-when] { display: inline-block; } body.flyrent-homepage-custom .fly-receipt[data-mode="own"] .fly-receipt-val { color: var(--fly-red-700); } body.flyrent-homepage-custom .fly-receipt-total { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding-top: 18px; border-top: 2px dashed var(--fly-line); } body.flyrent-homepage-custom .fly-receipt-label { display: grid; font-family: var(--fly-font-display); font-weight: 800; font-size: 1.05rem; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-receipt-label small { font-family: var(--fly-font-text); font-weight: 500; font-size: 14px; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-receipt-price { display: grid; justify-items: end; color: var(--fly-red); font-family: var(--fly-font-display); } body.flyrent-homepage-custom .fly-receipt-price > [data-when="fly"] { font-size: clamp(2.4rem, 1.6rem + 1.8vw, 3.6rem); font-weight: 800; line-height: 1; letter-spacing: -0.035em; font-variant-numeric: tabular-nums; white-space: nowrap; } body.flyrent-homepage-custom .fly-receipt-unknown { font-size: clamp(1.3rem, 1.05rem + .6vw, 1.7rem); font-weight: 800; line-height: 1.1; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-receipt-price small { margin-top: 4px; font-family: var(--fly-font-text); font-size: 12.5px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-receipt-stamp { position: absolute; right: -18px; top: -22px; rotate: 12deg; padding: 7px 12px 6px; border: 3px solid var(--fly-red); border-radius: 10px; outline: 1.5px solid var(--fly-red); outline-offset: 2px; font-family: var(--fly-font-display); font-size: 14px; font-weight: 800; line-height: 1.05; letter-spacing: .1em; text-align: center; text-transform: uppercase; color: var(--fly-red); background: var(--fly-white); box-shadow: 0 10px 20px -8px rgba(2, 14, 40, .45); pointer-events: none; } body.flyrent-homepage-custom .fly-receipt[data-mode="own"] + .fly-receipt-stamp { display: none; } @media (prefers-reduced-motion: no-preference) { body.flyrent-homepage-custom .fly-receipt-val [data-when] { animation: fly-receipt-flip .5s var(--fly-ease) calc(var(--i) * 130ms) both; } body.flyrent-homepage-custom .fly-receipt[data-mode="fly"] .fly-receipt-check .fly-icon, body.flyrent-homepage-custom .fly-receipt[data-mode="own"] .fly-receipt-euro { animation: fly-receipt-pop .45s cubic-bezier(.3, 1.6, .5, 1) calc(var(--i) * 130ms) both; } body.flyrent-homepage-custom .fly-receipt.is-stamping + .fly-receipt-stamp { animation: fly-receipt-stamp .45s cubic-bezier(.2, 1.3, .4, 1) .75s both; } body.flyrent-homepage-custom .fly-included-car { transition: translate 1s var(--fly-ease), opacity .6s ease; } body.flyrent-homepage-custom.fly-js .fly-included:not(.is-in) .fly-included-car { translate: -12% 0; opacity: 0; } } @keyframes fly-receipt-flip { from { opacity: 0; transform: perspective(300px) rotateX(-80deg); } to { opacity: 1; transform: none; } } @keyframes fly-receipt-pop { from { transform: scale(.3); opacity: 0; } to { transform: none; opacity: 1; } } @keyframes fly-receipt-stamp { 0% { opacity: 0; scale: 2.2; } 60% { opacity: 1; scale: .94; } 100% { opacity: 1; scale: 1; } } @media (max-width: 1100px) { body.flyrent-homepage-custom .fly-included-inner { grid-template-columns: minmax(0, 1fr); } body.flyrent-homepage-custom .fly-included-stage { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; justify-items: center; min-height: 0; padding-top: clamp(20px, 4vw, 32px); } body.flyrent-homepage-custom .fly-compare { grid-column: 1; justify-self: center; } body.flyrent-homepage-custom .fly-included-car { grid-column: 1; grid-row: 2; width: min(92%, 560px); margin: 8px 0 -16%; justify-self: center; } body.flyrent-homepage-custom .fly-receipt-stamp { right: -6px; } body.flyrent-homepage-custom .fly-receipt-wrap { grid-column: 1; grid-row: 3; justify-self: center; max-width: 560px; rotate: none; } } @media (max-width: 480px) { body.flyrent-homepage-custom .fly-included-stage { padding: 16px 12px 18px; border-radius: 24px; } body.flyrent-homepage-custom .fly-included-swoosh { clip-path: inset(0 round 24px); } body.flyrent-homepage-custom .fly-included-car { margin-bottom: -10%; } body.flyrent-homepage-custom .fly-receipt { padding-inline: 18px; } body.flyrent-homepage-custom .fly-receipt-label { white-space: nowrap; } body.flyrent-homepage-custom .fly-compare-btn { padding: 10px 13px; font-size: 13px; } body.flyrent-homepage-custom .fly-receipt-lines li { gap: 10px; } body.flyrent-homepage-custom .fly-receipt-dots { min-width: 8px; } } /* Steps */ body.flyrent-homepage-custom .fly-steps-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); counter-reset: none; position: relative; } body.flyrent-homepage-custom .fly-step { position: relative; padding-top: 76px; } body.flyrent-homepage-custom .fly-step-num { position: absolute; top: 0; left: 0; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--fly-white); color: var(--fly-blue); border: 2px solid var(--fly-blue); font-family: var(--fly-font-display); font-size: 1.35rem; font-weight: 800; } body.flyrent-homepage-custom .fly-step:first-child .fly-step-num { background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom .fly-step:not(:last-child)::before { content: ""; position: absolute; top: 27px; left: 64px; right: calc(-1 * clamp(20px, 3vw, 40px) + 8px); height: 2px; background: var(--fly-line); } body.flyrent-homepage-custom .fly-step-title { font-size: 1.3rem; font-weight: 700; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-step-text { margin-top: 10px; color: var(--fly-muted); max-width: 38ch; } @media (max-width: 820px) { body.flyrent-homepage-custom .fly-steps-list { grid-template-columns: 1fr; gap: 28px; } body.flyrent-homepage-custom .fly-step { padding: 0 0 0 76px; min-height: 56px; } body.flyrent-homepage-custom .fly-step:not(:last-child)::before { top: 64px; left: 27px; right: auto; bottom: -24px; width: 2px; height: auto; background: var(--fly-line); } } /* Why */ body.flyrent-homepage-custom .fly-paths { background: var(--fly-soft); } body.flyrent-homepage-custom .fly-why { background: var(--fly-soft); } body.flyrent-homepage-custom .fly-partners { margin-top: 30px; } body.flyrent-homepage-custom .fly-partners-title { font-size: 13px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-partners-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-top: 12px; list-style: none; } body.flyrent-homepage-custom .fly-partner-tile { display: grid; gap: 4px; padding: 20px 22px; border-radius: 16px; background: var(--fly-white); border: 1px solid var(--fly-line); box-shadow: 0 6px 16px -10px rgba(10, 65, 147, .25); container-type: inline-size; min-width: 0; } /* Name scales with its own tile so the longest (STELLANTIS) always fits. */ body.flyrent-homepage-custom .fly-partner-name { font-family: var(--fly-font-display); font-size: clamp(.95rem, 11cqi, 1.6rem); font-weight: 800; letter-spacing: .05em; white-space: nowrap; text-transform: uppercase; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-partner-role { font-size: 13.5px; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-faq { background: var(--fly-white); } body.flyrent-homepage-custom .fly-faq-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 96px); align-items: start; } body.flyrent-homepage-custom .fly-faq-intro { position: sticky; top: 110px; } body.flyrent-homepage-custom .fly-faq-intro .fly-btn { margin-top: 24px; } body.flyrent-homepage-custom .fly-faq-list { border-top: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-faq-item { border-bottom: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 22px; cursor: pointer; list-style: none; font-family: var(--fly-font-display); font-size: clamp(1.05rem, .95rem + .35vw, 1.3rem); font-weight: 700; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-faq-item summary::-webkit-details-marker { display: none; } body.flyrent-homepage-custom .fly-faq-item summary:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-faq-icon { position: relative; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--fly-blue-50); } body.flyrent-homepage-custom .fly-faq-icon::before, body.flyrent-homepage-custom .fly-faq-icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; border-radius: 2px; background: var(--fly-blue); transition: transform .3s var(--fly-ease); } body.flyrent-homepage-custom .fly-faq-icon::after { transform: rotate(90deg); } body.flyrent-homepage-custom .fly-faq-item[open] .fly-faq-icon::after { transform: rotate(0deg); } body.flyrent-homepage-custom .fly-faq-item p { padding: 0 56px 24px 0; max-width: 70ch; color: var(--fly-muted); font-size: 1.02rem; } @media (max-width: 900px) { body.flyrent-homepage-custom .fly-faq-grid { grid-template-columns: minmax(0, 1fr); } body.flyrent-homepage-custom .fly-faq-intro { position: static; } body.flyrent-homepage-custom .fly-faq-item p { padding-right: 0; } } body.flyrent-homepage-custom .fly-why-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; } body.flyrent-homepage-custom .fly-why-intro { position: sticky; top: 120px; } body.flyrent-homepage-custom .fly-partner { margin-top: 28px; padding: 18px 22px; background: var(--fly-white); border-radius: var(--fly-radius); border: 1px solid var(--fly-line); display: inline-block; } body.flyrent-homepage-custom .fly-partner img { width: 260px; } body.flyrent-homepage-custom .fly-stats { display: flex; flex-wrap: wrap; gap: 28px 40px; margin-top: 32px; } body.flyrent-homepage-custom .fly-stat { display: flex; flex-direction: column-reverse; } body.flyrent-homepage-custom .fly-stat dd { margin: 0; font-family: var(--fly-font-display); font-size: 2.2rem; font-weight: 800; line-height: 1; color: var(--fly-blue); letter-spacing: -0.02em; } body.flyrent-homepage-custom .fly-stat dt { margin-top: 6px; font-size: 14px; color: var(--fly-muted); } body.flyrent-homepage-custom .fly-reasons { display: grid; } body.flyrent-homepage-custom .fly-reason { display: flex; gap: 20px; padding-block: 26px; border-top: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-reason:last-child { border-bottom: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-reason-icon { width: 28px; height: 28px; margin-top: 2px; color: var(--fly-blue); } body.flyrent-homepage-custom .fly-reason-title { font-size: 1.25rem; font-weight: 700; color: var(--fly-ink); } body.flyrent-homepage-custom .fly-reason-text { margin-top: 8px; color: var(--fly-muted); max-width: 56ch; } @media (max-width: 900px) { body.flyrent-homepage-custom .fly-why-grid { grid-template-columns: 1fr; } body.flyrent-homepage-custom .fly-why-intro { position: static; } } /* Contact */ body.flyrent-homepage-custom .fly-contact { background: var(--fly-white); color: var(--fly-ink); padding-block: var(--fly-section); border-top: 1px solid var(--fly-line); } body.flyrent-homepage-custom .fly-contact-grid { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 80px); align-items: center; } body.flyrent-homepage-custom .fly-contact-title { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.1rem); color: var(--fly-ink); } body.flyrent-homepage-custom .fly-contact-lead { margin-top: 14px; max-width: 50ch; font-size: 1.1rem; color: var(--fly-muted); } body.flyrent-homepage-custom a.fly-contact-phone { display: inline-flex; align-items: center; gap: 14px; margin-top: 28px; font-family: var(--fly-font-display); font-size: clamp(1.7rem, 1.2rem + 2vw, 2.5rem); font-weight: 800; letter-spacing: -0.01em; color: var(--fly-ink); font-variant-numeric: tabular-nums; } body.flyrent-homepage-custom a.fly-contact-phone:hover { color: var(--fly-blue); } body.flyrent-homepage-custom .fly-contact-phone .fly-icon { width: 30px; height: 30px; color: var(--fly-blue); } body.flyrent-homepage-custom .fly-contact-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; } body.flyrent-homepage-custom .fly-office { padding: clamp(24px, 3vw, 36px); border-radius: var(--fly-radius-lg); background: var(--fly-blue); color: var(--fly-white); } body.flyrent-homepage-custom .fly-office-title { font-size: 1.25rem; font-weight: 700; color: var(--fly-white); margin-bottom: 18px; } body.flyrent-homepage-custom .fly-office-row { display: flex; gap: 12px; align-items: flex-start; padding-block: 10px; color: #DCE5F3; } body.flyrent-homepage-custom .fly-office-row + .fly-office-row { border-top: 1px solid rgba(255, 255, 255, .1); } body.flyrent-homepage-custom .fly-office-row .fly-icon { margin-top: 3px; color: #B9CBEA; } body.flyrent-homepage-custom .fly-office-row a { color: var(--fly-white); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(255, 255, 255, .4); } body.flyrent-homepage-custom .fly-office a.fly-office-map { margin-top: 16px; color: var(--fly-white); } body.flyrent-homepage-custom .fly-office :where(a):focus-visible { outline-color: var(--fly-white); } @media (max-width: 900px) { body.flyrent-homepage-custom .fly-contact-grid { grid-template-columns: 1fr; } } @media (max-width: 480px) { body.flyrent-homepage-custom .fly-contact-actions .fly-btn { width: 100%; } } /* ── 7. Footer ──────────────────────────────────────────────────── */ body.flyrent-homepage-custom .fly-footer { background: #041330; color: #AFC0DC; padding-block: 64px 28px; font-size: 15px; } body.flyrent-homepage-custom .fly-footer-grid { display: grid; grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 2.6fr)); gap: 40px; } body.flyrent-homepage-custom .fly-footer-logo { display: inline-block; } body.flyrent-homepage-custom .fly-footer-logo img { width: 150px; } body.flyrent-homepage-custom .fly-footer-bio { margin-top: 18px; max-width: 40ch; } body.flyrent-homepage-custom .fly-footer-heading { font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fly-white); margin-bottom: 16px; } body.flyrent-homepage-custom .fly-footer-col ul { display: grid; gap: 10px; list-style: none; } body.flyrent-homepage-custom .fly-footer a { color: #D5DFEF; } body.flyrent-homepage-custom .fly-footer a:hover { color: var(--fly-white); text-decoration: underline; text-underline-offset: 4px; } body.flyrent-homepage-custom .fly-footer :where(a):focus-visible { outline-color: var(--fly-white); } body.flyrent-homepage-custom .fly-footer-contacts a { display: inline-flex; align-items: center; gap: 10px; } body.flyrent-homepage-custom .fly-footer-contacts .fly-icon { width: 18px; height: 18px; color: #8FA9D6; } body.flyrent-homepage-custom .fly-footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 48px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13.5px; color: #93A6C6; } body.flyrent-homepage-custom .fly-footer-bottom a.fly-back-to-top { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; } body.flyrent-homepage-custom .fly-back-to-top .fly-icon { width: 16px; height: 16px; transform: rotate(-45deg); } @media (max-width: 900px) { body.flyrent-homepage-custom .fly-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } body.flyrent-homepage-custom .fly-footer-brand { grid-column: 1 / -1; } } @media (max-width: 480px) { body.flyrent-homepage-custom .fly-footer-grid { grid-template-columns: 1fr; gap: 32px; } } /* ── 8. Reduced motion ──────────────────────────────────────────── */ @media (prefers-reduced-motion: reduce) { body.flyrent-homepage-custom *, body.flyrent-homepage-custom *::before, body.flyrent-homepage-custom *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } body.flyrent-homepage-custom .fly-hero-car { transform: none; } } @media (prefers-reduced-motion: no-preference) { html:has(body.flyrent-homepage-custom) { scroll-behavior: smooth; scroll-padding-top: 90px; } } /* ── Narrow phones: hero finder tabs must fit the card (they used to force the whole hero 20px wider) ── */ @media (max-width: 480px) { body.flyrent-homepage-custom .fly-finder-tab { white-space: normal; padding: 8px 4px; font-size: 12px; line-height: 1.2; } } /* Offer filter chips scroll inside the card instead of widening the whole header row */ @media (max-width: 640px) { body.flyrent-homepage-custom .fly-offers-head, body.flyrent-homepage-custom .fly-offers-tools { min-width: 0; max-width: 100%; } body.flyrent-homepage-custom .fly-offers-tools { width: 100%; } body.flyrent-homepage-custom .fly-offers-chips { min-width: 0; max-width: 100%; } }