/*
 * Beelivery 2026 design: shared header, footer and design tokens.
 * Class names are prefixed "bz-" so they never collide with Bootstrap 4 or the legacy beelivery.css.
 * Header colour comes from the EnvironmentColour app setting (production orange, QA green, dev blue);
 * the orange below is only the fallback.
 */
:root {
    --bz-orange: #FF6507;
    --bz-ink: #1F1A17;
    --bz-ink-2: #5C524C;
    --bz-cream: #FFF7F2;
    --bz-line: rgba(31, 26, 23, 0.12);
    --bz-pad-x: clamp(20px, 4vw, 56px);
    --bz-font: 'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.bz-header, .bz-header *, .bz-footer, .bz-footer * { box-sizing: border-box; }

/* ---------- Header ---------- */
.bz-header {
    position: sticky;
    top: 0;
    z-index: 1030; /* above Bootstrap's sticky elements, below its modals (1050) */
    background-color: var(--bz-orange);
    font-family: var(--bz-font);
    transition: box-shadow .3s;
}
.bz-header.bz-scrolled { box-shadow: 0 6px 20px rgba(31, 26, 23, 0.12); }
.bz-nav {
    padding: 0 var(--bz-pad-x);
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.bz-logo { display: flex; align-items: center; }
.bz-logo img { height: 44px; width: auto; display: block; }
.bz-header a.bz-link { display: block; }

.bz-nav-links { display: flex; align-items: center; gap: 4px; white-space: nowrap; margin: 0; }
.bz-header a.bz-link {
    padding: 10px 14px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.2;
    color: var(--bz-ink);
    text-decoration: none;
}
.bz-header a.bz-link:hover, .bz-header a.bz-link:focus-visible { background: rgba(0, 0, 0, 0.08); color: var(--bz-ink); text-decoration: none; }

.bz-header a.bz-account,
.bz-header a.bz-btn-dark {
    margin-left: 8px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.2;
    color: #fff;
    background: var(--bz-ink);
    text-decoration: none;
}
.bz-header a.bz-account { padding: 8px 16px 8px 8px; display: flex; align-items: center; gap: 8px; }
.bz-header a.bz-btn-dark { padding: 10px 20px; }
.bz-header a.bz-account:hover, .bz-header a.bz-btn-dark:hover,
.bz-header a.bz-account:focus-visible, .bz-header a.bz-btn-dark:focus-visible { background: #000; color: #fff; text-decoration: none; }
.bz-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--bz-orange);
    color: var(--bz-ink);
    font-size: 12px;
    font-weight: 800;
    display: grid;
    place-items: center;
}
.bz-avatar svg { width: 16px; height: 16px; }

/* Same breakpoint and rules as the new app's homepage header (Beelivery.Web home.css, max-width: 559px). */
@media (max-width: 559px) {
    .bz-hide-sm, .bz-account-label { display: none !important; }
    .bz-header a.bz-account { padding: 8px; }
    .bz-logo img { height: 38px; }
}

/* ---------- Footer ---------- */
.bz-footer {
    background: var(--bz-orange);
    color: var(--bz-ink);
    font-family: var(--bz-font);
    padding: clamp(56px, 7vw, 88px) var(--bz-pad-x) 32px;
}
.bz-footer-inner { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; gap: 56px; }
.bz-footer-top { display: flex; flex-wrap: wrap; gap: 48px 64px; justify-content: space-between; }
.bz-footer-brand { flex: 1 1 280px; max-width: 360px; display: flex; flex-direction: column; gap: 20px; }
.bz-footer-brand img { height: 44px; width: auto; align-self: flex-start; }
.bz-footer-brand p { margin: 0; font-size: 17px; line-height: 1.55; font-weight: 600; }
.bz-social { display: flex; gap: 10px; }
.bz-footer a.bz-social-link {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--bz-ink);
    color: #fff;
    display: grid;
    place-items: center;
}
.bz-footer a.bz-social-link:hover, .bz-footer a.bz-social-link:focus-visible { background: #000; color: #fff; text-decoration: none; }

.bz-footer-cols { flex: 2 1 520px; display: flex; flex-wrap: wrap; gap: 40px 56px; }
.bz-footer-col { flex: 1 1 160px; display: flex; flex-direction: column; gap: 14px; }
.bz-footer h3 {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bz-ink);
    opacity: 0.7;
    font-family: var(--bz-font);
}
.bz-footer a.bz-footer-link { font-size: 16px; font-weight: 600; color: var(--bz-ink); align-self: flex-start; text-decoration: none; }
.bz-footer a.bz-footer-link:hover, .bz-footer a.bz-footer-link:focus-visible { color: var(--bz-ink); text-decoration: underline; text-underline-offset: 4px; }

.bz-store-badges { display: flex; gap: 10px; flex-wrap: wrap; flex-direction: column; align-items: flex-start; }
.bz-footer a.bz-store {
    flex: none;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 18px 0 14px;
    border-radius: 12px;
    background: var(--bz-ink);
    color: #fff;
    text-decoration: none;
}
.bz-footer a.bz-store:hover, .bz-footer a.bz-store:focus-visible { background: #000; color: #fff; text-decoration: none; }
.bz-store-text { display: flex; flex-direction: column; line-height: 1.1; white-space: nowrap; }
.bz-store-small { font-size: 11px; font-weight: 600; color: #D9D0CA; }
.bz-store-big { font-size: 17px; font-weight: 700; }

.bz-footer-bottom {
    border-top: 1px solid rgba(31, 26, 23, 0.2);
    padding-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px 24px;
    flex-wrap: wrap;
    font-size: 14px;
    font-weight: 600;
}
.bz-footer-legal { display: flex; gap: 8px 24px; flex-wrap: wrap; }
.bz-footer-legal a { color: var(--bz-ink); text-decoration: none; }
.bz-footer-legal a:hover, .bz-footer-legal a:focus-visible { color: var(--bz-ink); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Shared page building blocks (2026 design) ---------- */
.bz-page, .bz-page * { box-sizing: border-box; }
.bz-page {
    font-family: var(--bz-font);
    color: var(--bz-ink);
    background: #fff;
    -webkit-font-smoothing: antialiased;
}
.bz-page h1, .bz-page h2, .bz-page h3 { font-family: var(--bz-font); color: inherit; margin: 0; }
.bz-page p, .bz-page dl, .bz-page dd, .bz-page ul { margin: 0; }
.bz-page a { color: inherit; }
.bz-page a:hover { text-decoration: none; }
.bz-wrap { max-width: 1200px; margin: 0 auto; padding-left: var(--bz-pad-x); padding-right: var(--bz-pad-x); }
.bz-eyebrow { font-size: 14px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: #C24E00; }
.bz-dark .bz-eyebrow { color: #FFB27F; }
.bz-h2 { font-size: clamp(30px, 3.6vw, 48px); line-height: 1.08; font-weight: 800; letter-spacing: -0.02em; text-wrap: balance; }
.bz-lead { font-size: 18px; line-height: 1.65; color: #3A332F; text-wrap: pretty; }
.bz-dark { background: var(--bz-ink); color: #fff; }
.bz-dark .bz-lead { color: #E3D9D2; }
.bz-stack { display: flex; flex-direction: column; gap: 18px; }

.bz-btn {
    display: inline-flex; align-items: center; gap: 8px;
    height: 52px; padding: 0 24px; border-radius: 999px;
    font-weight: 800; font-size: 16px; text-decoration: none; white-space: nowrap;
    border: 0; cursor: pointer;
}
.bz-page a.bz-btn-orange, .bz-btn-orange { background: var(--bz-orange); color: var(--bz-ink); }
.bz-page a.bz-btn-orange:hover, .bz-btn-orange:hover { background: #F05A00; color: var(--bz-ink); text-decoration: none; }
.bz-page a.bz-btn-ink, .bz-btn-ink { background: var(--bz-ink); color: #fff; }
.bz-page a.bz-btn-ink:hover, .bz-btn-ink:hover { background: #000; color: #fff; text-decoration: none; }
.bz-page a.bz-btn-ghost { height: 52px; padding: 0 20px; border: 1.5px solid rgba(255, 255, 255, 0.35); color: #fff; font-weight: 700; font-size: 15px; gap: 10px; }
.bz-page a.bz-btn-ghost:hover { border-color: #fff; color: #fff; }

.bz-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    gap: clamp(32px, 5vw, 72px);
    align-items: center;
    padding-top: clamp(64px, 9vw, 120px);
    padding-bottom: clamp(64px, 9vw, 120px);
}
.bz-photo { position: relative; border-radius: 28px; overflow: hidden; aspect-ratio: 4 / 3; background: #FFF1E7; }
.bz-dark .bz-photo { background: #2E2723; }
.bz-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Scroll reveal: only hides content once the script has run, so nothing disappears without JavaScript. */
@keyframes bz-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.bz-reveal-on [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.bz-reveal-on [data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .bz-reveal-on [data-reveal] { opacity: 1; transform: none; transition: none; }
    .bz-anim { animation: none !important; }
}

/* ---------- About page ---------- */
.bz-about-hero { position: relative; overflow: hidden; background: var(--bz-ink); color: #fff; }
.bz-about-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 30%; }
.bz-about-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(24,16,10,0.94) 0%, rgba(24,16,10,0.8) 42%, rgba(24,16,10,0.2) 78%, rgba(24,16,10,0.05) 100%); }
.bz-about-hero-inner { position: relative; padding-top: clamp(64px, 10vw, 128px); padding-bottom: clamp(56px, 8vw, 104px); display: flex; flex-direction: column; gap: 22px; }
.bz-about-hero .bz-eyebrow { align-self: flex-start; color: #FFB27F; }
.bz-about-hero h1 { max-width: 760px; font-size: clamp(38px, 5.6vw, 72px); line-height: 1.03; font-weight: 800; letter-spacing: -0.03em; text-wrap: balance; }
.bz-about-hero h1 sup { font-size: 0.45em; color: var(--bz-orange); }
.bz-about-hero p { max-width: 540px; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: #EDE5DF; text-wrap: pretty; }
.bz-about-hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 6px; }
.bz-about-hero-note { font-size: 13px; color: #BFB4AC; }
.bz-anim { animation: bz-in .7s both; }
.bz-d1 { animation-delay: .08s; } .bz-d2 { animation-delay: .16s; } .bz-d3 { animation-delay: .24s; } .bz-d4 { animation-delay: .3s; }
.bz-stars { display: flex; gap: 2px; }
.bz-stars span { width: 18px; height: 18px; background: #00B67A; display: grid; place-items: center; }

.bz-facts { background: var(--bz-orange); color: var(--bz-ink); }
.bz-facts dl { padding-top: clamp(28px, 4vw, 40px); padding-bottom: clamp(28px, 4vw, 40px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 32px; }
.bz-facts dl > div { display: flex; flex-direction: column-reverse; gap: 4px; }
.bz-facts dt { font-size: 15px; font-weight: 700; }
.bz-facts dd { font-size: clamp(34px, 4vw, 48px); line-height: 1; font-weight: 800; letter-spacing: -0.02em; }

.bz-about-who .bz-photo img { object-position: 58% 22%; }
.bz-about-tech .bz-photo img { object-position: 60% 18%; }
.bz-note-card { display: flex; flex-direction: column; gap: 6px; padding: 20px 22px; border-radius: 18px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); }
.bz-note-card h3 { font-size: 16px; font-weight: 800; color: #fff; }
.bz-note-card p { font-size: 16px; line-height: 1.6; color: #E3D9D2; }

.bz-press { padding-top: clamp(64px, 9vw, 120px); padding-bottom: clamp(64px, 9vw, 120px); display: flex; flex-direction: column; gap: clamp(28px, 4vw, 44px); }
.bz-press-head { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.bz-press-logos { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.bz-press-logos li { height: 96px; border-radius: 18px; background: #fff; border: 1px solid #F0E8E1; display: grid; place-items: center; padding: 0 12px; transition: transform .3s, box-shadow .3s; }
.bz-press-logos li:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(31,26,23,0.08); }
.bz-press-logos img { display: block; max-width: 78%; max-height: 42px; width: auto; height: auto; object-fit: contain; }
.bz-press-logos img.bz-h30 { max-height: 30px; }
.bz-press-logos img.bz-h34 { max-height: 34px; }
.bz-press-office { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; border-radius: 20px; background: #FFE6D2; }
.bz-press-office h3 { font-size: 18px; font-weight: 800; }
.bz-press-office span { font-size: 15px; color: #3A332F; }
.bz-page a.bz-pill-ink { height: 48px; padding: 0 20px; border-radius: 999px; background: var(--bz-ink); color: #fff; font-weight: 700; font-size: 15px; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.bz-page a.bz-pill-ink:hover { background: #000; color: #fff; }

.bz-contact { background: #fff; border-top: 1px solid #F0E8E1; }
.bz-contact-grid { padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 32px; align-items: start; }
.bz-contact h2 { font-size: clamp(26px, 2.8vw, 34px); font-weight: 800; letter-spacing: -0.01em; }
.bz-contact-intro { display: flex; flex-direction: column; gap: 12px; }
.bz-contact-intro p { font-size: 17px; line-height: 1.6; color: #3A332F; }
.bz-contact-links { display: flex; flex-direction: column; gap: 10px; }
.bz-page a.bz-row-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 0 20px; border-radius: 16px; background: #F7F3EF; font-weight: 800; font-size: 16px; text-decoration: none; color: var(--bz-ink); }
.bz-page a.bz-row-link:hover { background: #FFE6D2; color: var(--bz-ink); }
.bz-company { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 16px; border: 1px solid #F0E8E1; font-size: 14px; line-height: 1.6; color: #5E5550; }
.bz-company h3 { font-size: 15px; font-weight: 800; color: var(--bz-ink); }
.bz-page .bz-company a { font-weight: 700; color: var(--bz-ink); align-self: flex-start; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 900px) {
    .bz-about-tech .bz-photo { order: 1; }
    .bz-press-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bz-contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bz-company { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .bz-page a.bz-btn-ghost { white-space: normal; height: auto; min-height: 52px; padding: 10px 18px; text-align: left; }
    .bz-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bz-press-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bz-contact-grid { grid-template-columns: minmax(0, 1fr); }
    .bz-company { grid-column: auto; }
}

/* ---------- Terms & policies (/Disclaimer), 2026 design "Beelivery Policies" ---------- */
.bz-pol { background: #FBF7F3; }
.bz-pol-hero { background: var(--bz-ink); color: #fff; }
.bz-pol-hero-inner { padding-top: clamp(48px, 7vw, 88px); padding-bottom: clamp(40px, 5vw, 64px); display: flex; flex-direction: column; gap: 16px; }
.bz-pol-hero .bz-eyebrow { color: #FFB27F; }
.bz-pol-hero h1 { font-size: clamp(36px, 5vw, 64px); line-height: 1.04; font-weight: 800; letter-spacing: -0.03em; }
.bz-pol-hero p { max-width: 620px; font-size: clamp(16px, 1.3vw, 19px); line-height: 1.6; color: #E3D9D2; }
.bz-page a.bz-pol-help { height: 44px; padding: 0 18px; border-radius: 999px; background: var(--bz-orange); color: var(--bz-ink); font-weight: 800; font-size: 14px; display: inline-flex; align-items: center; margin-top: 6px; text-decoration: none; }
.bz-page a.bz-pol-help:hover { background: #F05A00; color: var(--bz-ink); }

.bz-pol-layout { padding-top: clamp(28px, 4vw, 48px); padding-bottom: 88px; display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.bz-pol-nav { position: sticky; top: 96px; z-index: 5; display: flex; flex-direction: column; gap: 4px; padding: 8px; background: #fff; border: 1px solid #F0E8E1; border-radius: 20px; overflow-x: auto; scrollbar-width: none; }
.bz-page a.bz-pol-tab { flex: none; display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 14px; border-radius: 12px; font-size: 14px; font-weight: 600; color: var(--bz-ink); white-space: nowrap; text-decoration: none; transition: background .2s; }
.bz-page a.bz-pol-tab:hover { background: #FFF1E7; color: var(--bz-ink); }
.bz-page a.bz-pol-tab.is-on { background: #FFE6D2; font-weight: 800; }
.bz-pol-dot { flex: none; width: 6px; height: 6px; border-radius: 50%; background: #D9D0CA; }
.bz-pol-tab.is-on .bz-pol-dot { background: var(--bz-orange); }

.bz-pol-sections { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.bz-pol-card { scroll-margin-top: 96px; background: #fff; border: 1px solid #F0E8E1; border-radius: 24px; padding: clamp(22px, 3vw, 36px); display: flex; flex-direction: column; gap: 18px; }
.bz-pol-audience { align-self: flex-start; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; color: var(--bz-ink); }
.bz-pol-card h2 { font-size: clamp(24px, 2.6vw, 32px); line-height: 1.15; font-weight: 800; letter-spacing: -0.01em; }
.bz-pol-card h3 { font-size: 15px; font-weight: 800; margin: 0; color: var(--bz-ink); }
.bz-pol-short { padding: 18px 20px; border-radius: 16px; background: #FFF6EF; display: flex; flex-direction: column; gap: 10px; }
.bz-pol-short ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.bz-pol-short li { display: flex; gap: 10px; font-size: 16px; line-height: 1.55; color: #3A332F; }
.bz-pol-bullet { flex: none; width: 6px; height: 6px; margin-top: 10px; border-radius: 50%; background: var(--bz-orange); }
.bz-pol-full { display: flex; flex-direction: column; gap: 10px; }
/* The approved wording, unchanged: its own heading repeats the card title, so it is not shown again. */
.bz-legal { padding: 20px; border-radius: 16px; border: 1px solid #E2D8D0; font-size: 15px; line-height: 1.7; color: #5E5550; overflow-wrap: anywhere; }
.bz-legal h2 { display: none; }
.bz-legal h3 { font-size: 16px; font-weight: 800; color: var(--bz-ink); margin: 18px 0 6px; }
.bz-legal p { margin: 0 0 10px; }
.bz-legal ul, .bz-legal ol { margin: 6px 0 12px; padding-left: 22px; }
.bz-legal table { width: 100%; border-collapse: collapse; margin: 10px 0; display: block; overflow-x: auto; }
.bz-legal td, .bz-legal th { text-align: left; padding: 6px 8px; border: 1px solid #F0E8E1; vertical-align: top; }
.bz-legal a { color: #C24E00; text-decoration: underline; }
.bz-page a.bz-pol-top { align-self: flex-start; font-size: 14px; font-weight: 700; color: #C24E00; }

.bz-pol-contact { border-radius: 24px; padding: clamp(22px, 3vw, 32px); background: var(--bz-ink); color: #fff; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 20px 32px; }
.bz-pol-contact > div { display: flex; flex-direction: column; gap: 6px; font-size: 15px; line-height: 1.6; color: #E3D9D2; }
.bz-pol-contact h2 { font-size: 22px; font-weight: 800; color: #fff; }
.bz-pol-contact strong { color: #fff; }
.bz-pol-contact a { color: #FFB27F; text-decoration: underline; }

@media (max-width: 900px) {
    .bz-pol-layout { grid-template-columns: minmax(0, 1fr); }
    .bz-pol-nav { flex-direction: row; top: 80px; }
    .bz-pol-card { scroll-margin-top: 150px; }
}
@media print {
    .bz-pol-nav, .bz-pol-top, .bz-pol-help { display: none !important; }
    .bz-pol-layout { grid-template-columns: minmax(0, 1fr); }
}
/* The old wording starts with line breaks after its (now hidden) heading: don't show that gap. */
.bz-legal h2 ~ br:nth-of-type(-n+3) { display: none; }