:root { --hb-fab-size: 3.25rem; --hb-fab-gap: 1rem; --hb-fab-safe-right: calc(var(--hb-fab-size) + var(--hb-fab-gap) + 0.35rem); --hb-fab-safe-bottom: calc(var(--hb-fab-size) + var(--hb-fab-gap)); --hb-dock-safe-bottom: 0px; --hb-cookie-clearance: 0px; --hb-cookie-width-cap: 14.5rem; } body:has(.ls-dock), html:has(.ls-dock) { --hb-dock-safe-bottom: 3.85rem; } body:has(.ls-dock__wa) .whatsapp-float, body:has(.ls-dock) .whatsapp-float, html:has(.ls-dock) .whatsapp-float { display: none !important; visibility: hidden !important; pointer-events: none !important; } .hb-cookie-banner { position: fixed; z-index: 40; top: auto; left: 0.75rem; right: auto; bottom: calc(0.75rem + var(--hb-dock-safe-bottom)); max-width: min(var(--hb-cookie-width-cap), calc(100vw - var(--hb-fab-safe-right) - 1.25rem)); margin: 0; padding: 0.65rem 0.8rem; border-radius: 12px; background: #111; color: #f5f5f5; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28); font-size: 0.82rem; line-height: 1.35; display: flex; flex-direction: column; gap: 0.5rem; pointer-events: auto; } @media (max-width: 899px) { :root { --hb-cookie-width-cap: 18rem; } .hb-cookie-banner { left: 0.5rem; right: auto; bottom: calc(0.5rem + max(var(--hb-dock-safe-bottom), 0px)); max-width: min(var(--hb-cookie-width-cap), calc(100vw - var(--hb-fab-safe-right) - 0.85rem)); padding: 0.45rem 0.55rem; font-size: 0.74rem; line-height: 1.3; gap: 0.4rem; } body:not(:has(.ls-dock)) .hb-cookie-banner { bottom: 0.5rem; } } @media (max-height: 560px) { .hb-cookie-banner { padding: 0.4rem 0.55rem; font-size: 0.72rem; line-height: 1.25; gap: 0.3rem; max-width: min(20rem, calc(100vw - var(--hb-fab-safe-right) - 0.85rem)); } .hb-cookie-banner p { margin: 0; } .hb-cookie-banner button { min-height: 36px; padding: 0.35rem 0.9rem; } .hb-cookie-actions .hb-cookie-link { min-height: 36px; } html.hb-cookie-open, body.hb-cookie-open, body:has(#hb-cookie-banner:not([hidden])) { --hb-cookie-clearance: 5.5rem; } html.hb-cookie-open .scroll-indicator, body.hb-cookie-open .scroll-indicator, body:has(#hb-cookie-banner:not([hidden])) .scroll-indicator, html.hb-cookie-open .pf-hint, body.hb-cookie-open .pf-hint, body:has(#hb-cookie-banner:not([hidden])) .pf-hint, html.hb-cookie-open .ls-scroll, body.hb-cookie-open .ls-scroll, body:has(#hb-cookie-banner:not([hidden])) .ls-scroll { display: none; } } @media (min-width: 900px) and (min-height: 561px) { html.hb-cookie-open .pf-hint, body.hb-cookie-open .pf-hint, body:has(#hb-cookie-banner:not([hidden])) .pf-hint, html.hb-cookie-open .ls-scroll, body.hb-cookie-open .ls-scroll, body:has(#hb-cookie-banner:not([hidden])) .ls-scroll, html.hb-cookie-open .pm-scroll, body.hb-cookie-open .pm-scroll, body:has(#hb-cookie-banner:not([hidden])) .pm-scroll { padding-inline-start: calc(var(--hb-cookie-width-cap) + 2.25rem); box-sizing: border-box; } } html.hb-cookie-open, body.hb-cookie-open, body:has(#hb-cookie-banner:not([hidden])) { --hb-cookie-clearance: 10.25rem; scroll-padding-bottom: calc(var(--hb-cookie-clearance) + var(--hb-dock-safe-bottom) + var(--hb-fab-safe-bottom)); } @media (max-width: 899px) { html.hb-cookie-open, body.hb-cookie-open, body:has(#hb-cookie-banner:not([hidden])) { --hb-cookie-clearance: 8rem; } } html.hb-cookie-open .ls-hero__copy, body.hb-cookie-open .ls-hero__copy, body:has(#hb-cookie-banner:not([hidden])) .ls-hero__copy, html.hb-cookie-open .pf-hero__copy, body.hb-cookie-open .pf-hero__copy, body:has(#hb-cookie-banner:not([hidden])) .pf-hero__copy, html.hb-cookie-open .pm-hero__copy, body.hb-cookie-open .pm-hero__copy, body:has(#hb-cookie-banner:not([hidden])) .pm-hero__copy, html.hb-cookie-open .pr-hero__copy, body.hb-cookie-open .pr-hero__copy, body:has(#hb-cookie-banner:not([hidden])) .pr-hero__copy, html.hb-cookie-open .hero-content, body.hb-cookie-open .hero-content, body:has(#hb-cookie-banner:not([hidden])) .hero-content { padding-bottom: calc(var(--hb-cookie-clearance) + 0.75rem); padding-right: max(0.5rem, calc(var(--hb-fab-safe-right) * 0.35)); box-sizing: border-box; } html.hb-cookie-open .pf-hero__frame, body.hb-cookie-open .pf-hero__frame, body:has(#hb-cookie-banner:not([hidden])) .pf-hero__frame, html.hb-cookie-open .ls-hero__cut, body.hb-cookie-open .ls-hero__cut, body:has(#hb-cookie-banner:not([hidden])) .ls-hero__cut, html.hb-cookie-open .pr-hero, body.hb-cookie-open .pr-hero, body:has(#hb-cookie-banner:not([hidden])) .pr-hero, html.hb-cookie-open header.hero, body.hb-cookie-open header.hero, body:has(#hb-cookie-banner:not([hidden])) header.hero, html.hb-cookie-open .pf-hero, body.hb-cookie-open .pf-hero, body:has(#hb-cookie-banner:not([hidden])) .pf-hero, html.hb-cookie-open .ls-hero, body.hb-cookie-open .ls-hero, body:has(#hb-cookie-banner:not([hidden])) .ls-hero { box-sizing: border-box; padding-bottom: var(--hb-cookie-clearance); margin-bottom: calc(var(--hb-dock-safe-bottom) + 0.35rem); } html.hb-cookie-open footer, body.hb-cookie-open footer, body:has(#hb-cookie-banner:not([hidden])) footer { padding-bottom: var(--hb-cookie-clearance); box-sizing: border-box; } .pr-hero__meta { padding-inline-end: max(1rem, var(--hb-fab-safe-right)) !important; box-sizing: border-box; overflow-x: clip; } .pr-hero__meta > * { padding-inline-end: max(0.5rem, var(--hb-fab-safe-right)) !important; max-width: 100%; box-sizing: border-box; } @media (max-width: 899px) { html.hb-cookie-open .pr-hero, body.hb-cookie-open .pr-hero, body:has(#hb-cookie-banner:not([hidden])) .pr-hero { min-height: 100vh !important; min-height: 100dvh !important; margin-bottom: 0 !important; padding-bottom: calc(var(--hb-cookie-clearance) + 1.25rem) !important; } html.hb-cookie-open .pr-hero__meta, body.hb-cookie-open .pr-hero__meta, body:has(#hb-cookie-banner:not([hidden])) .pr-hero__meta { padding-inline-start: 0; padding-inline-end: max(1rem, var(--hb-fab-safe-right)) !important; padding-bottom: 0.85rem; box-sizing: border-box; } } html.hb-cookie-open .pr-hero__meta, body.hb-cookie-open .pr-hero__meta, body:has(#hb-cookie-banner:not([hidden])) .pr-hero__meta { max-width: 100%; padding-right: max(0.75rem, var(--hb-fab-safe-right)); box-sizing: border-box; } html.hb-cookie-open .pm-ticket__label, body.hb-cookie-open .pm-ticket__label, body:has(#hb-cookie-banner:not([hidden])) .pm-ticket__label, html.hb-cookie-open .pm-menublock__h, body.hb-cookie-open .pm-menublock__h, body:has(#hb-cookie-banner:not([hidden])) .pm-menublock__h, html.hb-cookie-open .pm-rail__label, body.hb-cookie-open .pm-rail__label, body:has(#hb-cookie-banner:not([hidden])) .pm-rail__label { max-width: calc(100% - min(15rem, 42vw)); box-sizing: border-box; } .pf-hint, .scroll-hint, .ls-scroll, .scroll-indicator, .pm-scroll { max-width: calc(100% - var(--hb-fab-safe-right) - 0.35rem); box-sizing: border-box; padding-inline-end: 0.5rem; } .pr-scroll { right: var(--hb-fab-safe-right) !important; } html.hb-cookie-open .scroll-indicator, body.hb-cookie-open .scroll-indicator, body:has(#hb-cookie-banner:not([hidden])) .scroll-indicator { bottom: calc(var(--hb-cookie-clearance) + var(--hb-dock-safe-bottom) + 0.75rem) !important; max-width: min(16rem, calc(100% - var(--hb-fab-safe-right) - 1rem)); box-sizing: border-box; z-index: 2; } html.hb-cookie-open .pf-hint, body.hb-cookie-open .pf-hint, body:has(#hb-cookie-banner:not([hidden])) .pf-hint, html.hb-cookie-open .scroll-hint, body.hb-cookie-open .scroll-hint, body:has(#hb-cookie-banner:not([hidden])) .scroll-hint, html.hb-cookie-open .ls-scroll, body.hb-cookie-open .ls-scroll, body:has(#hb-cookie-banner:not([hidden])) .ls-scroll, html.hb-cookie-open .pm-scroll, body.hb-cookie-open .pm-scroll, body:has(#hb-cookie-banner:not([hidden])) .pm-scroll { max-width: calc(100% - var(--hb-fab-safe-right) - 0.75rem) !important; padding-inline-end: var(--hb-fab-safe-right) !important; padding-bottom: calc(0.85rem + var(--hb-dock-safe-bottom)) !important; text-align: left !important; align-items: flex-start !important; box-sizing: border-box; } @media (max-width: 899px) { html.hb-cookie-open .ls-hero, body.hb-cookie-open .ls-hero, body:has(#hb-cookie-banner:not([hidden])) .ls-hero, html.hb-cookie-open .pf-hero, body.hb-cookie-open .pf-hero, body:has(#hb-cookie-banner:not([hidden])) .pf-hero, html.hb-cookie-open header.hero, body.hb-cookie-open header.hero, body:has(#hb-cookie-banner:not([hidden])) header.hero { position: relative; } html.hb-cookie-open .pf-hero__frame, body.hb-cookie-open .pf-hero__frame, body:has(#hb-cookie-banner:not([hidden])) .pf-hero__frame, html.hb-cookie-open .ls-hero__cut, body.hb-cookie-open .ls-hero__cut, body:has(#hb-cookie-banner:not([hidden])) .ls-hero__cut { min-height: calc(100vh - 2.5rem) !important; padding-bottom: calc(var(--hb-cookie-clearance) + var(--hb-dock-safe-bottom) + 2.75rem) !important; } html.hb-cookie-open .pf-hint, body.hb-cookie-open .pf-hint, body:has(#hb-cookie-banner:not([hidden])) .pf-hint, html.hb-cookie-open .ls-scroll, body.hb-cookie-open .ls-scroll, body:has(#hb-cookie-banner:not([hidden])) .ls-scroll, html.hb-cookie-open .pm-scroll, body.hb-cookie-open .pm-scroll, body:has(#hb-cookie-banner:not([hidden])) .pm-scroll { position: fixed !important; left: 0.75rem !important; right: auto !important; bottom: calc(var(--hb-cookie-clearance) + var(--hb-dock-safe-bottom) + 0.5rem) !important; width: auto !important; max-width: calc(100vw - var(--hb-fab-safe-right) - 1.5rem) !important; margin: 0 !important; padding: 0.35rem 0.5rem !important; text-align: left !important; align-items: flex-start !important; background: transparent !important; z-index: 36; box-sizing: border-box; pointer-events: auto; } } html.hb-cookie-open .pr-scroll, body.hb-cookie-open .pr-scroll, body:has(#hb-cookie-banner:not([hidden])) .pr-scroll { left: auto !important; right: var(--hb-fab-safe-right) !important; bottom: calc(var(--hb-cookie-clearance) + var(--hb-dock-safe-bottom) + 0.5rem) !important; transform: rotate(180deg) !important; text-align: center !important; } .hb-cookie-banner[hidden] { display: none !important; } .hb-cookie-banner p { margin: 0; opacity: 0.92; } .hb-cookie-banner a { color: #c8e6c9; text-decoration: underline; } .hb-cookie-actions { display: flex; flex-wrap: wrap; gap: 0.5rem 0.75rem; align-items: center; pointer-events: auto; } .hb-cookie-banner button { appearance: none; border: 0; border-radius: 8px; min-height: 44px; min-width: 44px; padding: 0.55rem 1.15rem; font: inherit; font-weight: 600; letter-spacing: 0.01em; cursor: pointer; background: #f5f5f5; color: #111; position: relative; z-index: 1; pointer-events: auto; touch-action: manipulation; -webkit-user-select: none; user-select: none; } .hb-cookie-banner button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; } .hb-cookie-banner .hb-cookie-link { font-size: 0.88rem; color: #e6e6e6; text-underline-offset: 2px; } .hb-cookie-actions .hb-cookie-link { display: inline-flex; align-items: center; min-height: 44px; } .hb-legal-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 0.65rem 0 0; font-size: 0.85rem; } .hb-legal-links a { color: inherit; text-decoration: underline; opacity: 0.85; display: inline-flex; align-items: center; min-height: 24px; } .hb-legal-links a:hover { opacity: 1; }