/**
 * Guest marketing design tokens
 * ─────────────────────────────────────────────────────────────────────────────
 * BREAKPOINTS
 *   Mobile:  0–767px   (--theme-bp-mobile-max)
 *   Tablet:  768–1023px
 *   Desktop: 1024px+   (--theme-bp-nav-desktop)
 *
 * TYPE SCALE (mobile → desktop)
 *   Bottom nav label     11px / 600
 *   Eyebrow, footer hdg  12px / 600 caps
 *   Body sm, footer link 14px / 500
 *   Body, inputs         16px / 400  (inputs min 16px on mobile — no iOS zoom)
 *   Lead                 17px / 400
 *   H3                   24px / 600
 *   H2                   clamp 1.65→2.25rem / 600 serif
 *   H1 / hero            clamp 1.85→3.75rem / 600 serif
 *
 * CONTROLS (height matches across inputs + buttons)
 *   Mobile  44px (2.75rem)
 *   Tablet  46px (2.875rem)
 *   Desktop 48px (3rem)
 *   Button text: 14px mobile/tablet → 15px desktop / weight 600
 *
 * Scope: .guest-marketing-canvas, .lb-sales, .lb-page, .guest-public-shell
 */

.guest-marketing-canvas,
.lb-sales,
.lb-page,
.guest-public-shell {
    /* Palette */
    --lb-ink: #15201b;
    --lb-muted: #63736b;
    --lb-paper: #f7faf6;
    --lb-soft: #edf5ef;
    --lb-line: #dfe9df;
    --lb-lime: #b8da16;
    --lb-green: #0f766e;
    --lb-green-hover: #0d665f;

    /* Font families */
    --lb-font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --lb-font-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;

    /* Type scale — mobile first */
    --lb-text-2xs: 0.6875rem;   /* 11px — bottom nav */
    --lb-text-xs: 0.75rem;      /* 12px — labels, eyebrows */
    --lb-text-sm: 0.875rem;     /* 14px — body sm, buttons */
    --lb-text-base: 1rem;       /* 16px — body */
    --lb-text-md: 1.0625rem;    /* 17px — lead */
    --lb-text-lg: 1.1875rem;    /* 19px — subtitles */
    --lb-text-xl: 1.3125rem;    /* 21px */
    --lb-text-2xl: 1.5rem;     /* 24px — h3 */
    --lb-text-h2: clamp(1.65rem, 4.2vw, 2.25rem);
    --lb-text-h1: clamp(1.85rem, 5vw, 2.75rem);
    --lb-text-hero: clamp(2rem, 5.8vw, 3.75rem);

    --lb-weight-regular: 400;
    --lb-weight-medium: 500;
    --lb-weight-semibold: 600;

    --lb-leading-tight: 1.08;
    --lb-leading-snug: 1.35;
    --lb-leading-normal: 1.55;
    --lb-leading-relaxed: 1.65;

    --lb-tracking-caps: 0.12em;

    /* Spacing */
    --lb-space-1: 0.25rem;
    --lb-space-2: 0.5rem;
    --lb-space-3: 0.75rem;
    --lb-space-4: 1rem;
    --lb-space-5: 1.25rem;
    --lb-space-6: 1.5rem;
    --lb-space-8: 2rem;

    /* Controls — 44px touch minimum on mobile */
    --lb-control-h: 2.75rem;
    --lb-control-px: 1rem;
    --lb-control-radius: 999px;
    --lb-control-font: var(--lb-text-base);
    --lb-control-border: 1px solid var(--lb-line);

    --lb-btn-h: var(--lb-control-h);
    --lb-btn-px: 1.25rem;
    --lb-btn-font: var(--lb-text-sm);
    --lb-btn-weight: var(--lb-weight-semibold);

    --lb-section-pad: clamp(1.5rem, 4vw, 2.5rem);
    --lb-stack-gap: var(--lb-space-4);
}

@media (min-width: 768px) {
    .guest-marketing-canvas,
    .lb-sales,
    .lb-page,
    .guest-public-shell {
        --lb-control-h: 2.875rem;
        --lb-btn-px: 1.375rem;
        --lb-section-pad: clamp(2rem, 3.5vw, 2.75rem);
        --lb-stack-gap: var(--lb-space-5);
    }
}

@media (min-width: 1024px) {
    .guest-marketing-canvas,
    .lb-sales,
    .lb-page,
    .guest-public-shell {
        --lb-control-h: 3rem;
        --lb-btn-font: 0.9375rem;
        --lb-btn-px: 1.5rem;
        --lb-section-pad: clamp(2.25rem, 3vw, 3rem);
    }
}

/* Base typography */
.guest-marketing-canvas,
.lb-sales,
.lb-page,
.guest-public-shell {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-base);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-normal);
    color: var(--lb-ink);
}

.guest-marketing-canvas .lb-serif,
.lb-sales .lb-serif,
.lb-page .lb-serif,
.guest-marketing-canvas h1,
.lb-sales h1,
.lb-page h1 {
    font-family: var(--lb-font-serif);
    font-weight: var(--lb-weight-semibold);
    letter-spacing: -0.02em;
}

/* Semantic type roles */
.lb-t-hero {
    font-family: var(--lb-font-serif);
    font-size: var(--lb-text-hero);
    font-weight: var(--lb-weight-semibold);
    line-height: var(--lb-leading-tight);
    letter-spacing: -0.02em;
}

.lb-t-h1 {
    font-family: var(--lb-font-serif);
    font-size: var(--lb-text-h1);
    font-weight: var(--lb-weight-semibold);
    line-height: var(--lb-leading-tight);
}

.lb-t-h2,
.lb-heading {
    font-family: var(--lb-font-serif);
    font-size: var(--lb-text-h2);
    font-weight: var(--lb-weight-semibold);
    line-height: var(--lb-leading-tight);
}

.lb-t-h3,
.lb-type-title {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-2xl);
    font-weight: var(--lb-weight-semibold);
    line-height: var(--lb-leading-snug);
}

.lb-t-lead,
.lb-type-lead {
    font-size: var(--lb-text-md);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-snug);
    color: var(--lb-muted);
}

.lb-t-body,
.lb-type-body {
    font-size: var(--lb-text-base);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-relaxed);
    color: var(--lb-muted);
}

.lb-t-body-sm,
.lb-type-body-sm {
    font-size: var(--lb-text-sm);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-normal);
    color: var(--lb-muted);
}

.lb-t-caption,
.lb-type-caption {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-2xs);
    font-weight: var(--lb-weight-medium);
    line-height: var(--lb-leading-snug);
    color: var(--lb-muted);
}

.lb-copy,
.lb-type-copy {
    font-size: var(--lb-text-base);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-relaxed);
    color: var(--lb-muted);
}

.lb-card {
    border-radius: 1rem;
    border: 1px solid var(--lb-line);
    background: #fffefb;
}

@media (min-width: 768px) {
    .lb-card {
        border-radius: 1.05rem;
    }
}

@media (min-width: 1024px) {
    .lb-card {
        border-radius: 1.125rem;
    }
}

.lb-t-eyebrow,
.lb-type-eyebrow,
.lb-pill {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-xs);
    font-weight: var(--lb-weight-semibold);
    line-height: 1;
    letter-spacing: var(--lb-tracking-caps);
    text-transform: uppercase;
}

.lb-t-footer-title {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-xs);
    font-weight: var(--lb-weight-semibold);
    line-height: 1;
    letter-spacing: var(--lb-tracking-caps);
    text-transform: uppercase;
    color: #94a39a;
}

.lb-t-footer-link {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-sm);
    font-weight: var(--lb-weight-medium);
    line-height: var(--lb-leading-snug);
    color: #4f5f57;
}

.lb-t-footer-copy {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-sm);
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-relaxed);
    color: var(--lb-muted);
}

.lb-t-legal {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-xs);
    font-weight: var(--lb-weight-medium);
    line-height: var(--lb-leading-normal);
    color: #94a39a;
}

.lb-t-header-link {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-sm);
    font-weight: var(--lb-weight-medium);
    line-height: 1;
}

.lb-t-drawer-title {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-xs);
    font-weight: var(--lb-weight-semibold);
    line-height: 1;
    letter-spacing: var(--lb-tracking-caps);
    text-transform: uppercase;
    color: #94a39a;
}

.lb-t-drawer-link {
    display: flex;
    align-items: center;
    gap: var(--lb-space-3);
    min-height: var(--lb-control-h);
    padding: 0 var(--lb-space-3);
    border-radius: 0.95rem;
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-base);
    font-weight: var(--lb-weight-medium);
    line-height: 1;
    color: #475569;
    text-decoration: none;
    transition: background 0.18s ease, color 0.18s ease;
}

.lb-t-drawer-link:hover {
    background: #f8fafc;
    color: #0f172a;
}

.lb-t-drawer-link.is-active {
    background: var(--lb-green);
    color: #fff;
}

.lb-t-nav {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-2xs);
    font-weight: var(--lb-weight-semibold);
    line-height: 1;
}

/* Unified controls */
.lb-btn,
.lb-button,
.localboost-button-primary,
.localboost-button-secondary,
.lb-button-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--lb-space-2);
    min-height: var(--lb-btn-h);
    padding: 0 var(--lb-btn-px);
    border-radius: var(--lb-control-radius);
    font-family: var(--lb-font-sans);
    font-size: var(--lb-btn-font);
    font-weight: var(--lb-btn-weight);
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.lb-btn--block,
.lb-button.lb-type-btn,
.lb-button-soft.lb-type-btn {
    width: 100%;
}

.lb-form-row .lb-btn:not(.lb-btn--icon) {
    width: 100%;
}

@media (min-width: 640px) {
    .lb-btn--block-sm {
        width: auto;
    }

    .lb-form-row--inline .lb-btn {
        width: auto;
    }
}

.lb-btn--primary,
.lb-button,
.localboost-button-primary {
    border: 0;
    background: var(--lb-green);
    color: #fff;
    box-shadow: 0 14px 28px -18px rgba(15, 118, 110, 0.75);
}

.lb-btn--primary:hover,
.lb-button:hover,
.localboost-button-primary:hover {
    transform: translateY(-1px);
    background: var(--lb-green-hover);
}

.lb-btn--secondary,
.lb-button-soft,
.localboost-button-secondary {
    border: var(--lb-control-border);
    background: color-mix(in srgb, var(--lb-lime) 28%, #fff);
    color: #324706;
    box-shadow: none;
}

.lb-btn--secondary:hover,
.lb-button-soft:hover,
.localboost-button-secondary:hover {
    transform: translateY(-1px);
    background: color-mix(in srgb, var(--lb-lime) 40%, #fff);
}

.lb-btn--ghost {
    border: var(--lb-control-border);
    background: #fffefb;
    color: var(--lb-ink);
}

.lb-btn--icon {
    width: var(--lb-control-h);
    min-width: var(--lb-control-h);
    padding: 0;
    flex-shrink: 0;
}

/* Form fields */
.lb-field {
    display: flex;
    flex-direction: column;
    gap: var(--lb-space-2);
}

.lb-input,
.lb-field input[type="email"],
.lb-field input[type="text"],
.lb-field input[type="search"],
.lb-field input[type="tel"],
.lb-field textarea,
.guest-marketing-canvas .lb-form-input {
    width: 100%;
    min-height: var(--lb-control-h);
    padding: 0 var(--lb-control-px);
    border: var(--lb-control-border);
    border-radius: var(--lb-control-radius);
    background: #fffefb;
    font-family: var(--lb-font-sans);
    font-size: max(16px, var(--lb-control-font));
    font-weight: var(--lb-weight-regular);
    line-height: var(--lb-leading-normal);
    color: var(--lb-ink);
    outline: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.lb-input::placeholder {
    color: #94a39a;
}

.lb-input:focus,
.lb-field input:focus,
.guest-marketing-canvas .lb-form-input:focus {
    border-color: color-mix(in srgb, var(--lb-green) 55%, var(--lb-line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lb-green) 14%, transparent);
}

.lb-form-row {
    display: flex;
    flex-direction: column;
    gap: var(--lb-space-2);
}

.lb-form-row .lb-btn--primary {
    flex-shrink: 0;
}

@media (min-width: 640px) {
    .lb-form-row--inline {
        flex-direction: row;
        align-items: stretch;
    }

    .lb-form-row--inline .lb-input {
        flex: 1;
        min-width: 0;
    }

    .lb-form-row--inline .lb-btn:not(.lb-btn--icon) {
        width: auto;
        flex-shrink: 0;
    }
}

/* Footer */
.lb-footer-section {
    display: grid;
    gap: var(--lb-stack-gap);
}

.lb-footer-links {
    display: grid;
    gap: var(--lb-space-3);
}

.lb-footer-links a {
    text-decoration: none;
    transition: color 0.18s ease;
}

.lb-footer-links a:hover {
    color: var(--lb-green);
}

/* Bottom nav */
.guest-mobile-bottom-nav__item {
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-2xs);
    font-weight: var(--lb-weight-semibold);
    line-height: 1;
    color: #737373;
}

.guest-mobile-bottom-nav__item.is-active {
    color: var(--lb-green);
}

.guest-mobile-bottom-nav__icon-wrap {
    width: var(--lb-control-h);
    height: var(--lb-control-h);
    border-radius: 1rem;
    background: #f5f5f4;
}

.guest-mobile-bottom-nav__item.is-active .guest-mobile-bottom-nav__icon-wrap {
    background: color-mix(in srgb, var(--lb-green) 10%, #fff);
}

/* Mobile drawer — matches bottom nav active pattern */
.lb-mobile-drawer__backdrop {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(21, 32, 27, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.lb-mobile-drawer {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    width: min(100%, 22rem);
    max-width: 100%;
    border-right: 1px solid var(--lb-line);
    background: #fffefb;
    box-shadow: 24px 0 80px -32px rgba(16, 37, 31, 0.28);
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

.lb-mobile-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--lb-space-3);
    padding: var(--lb-space-4) var(--lb-space-4) var(--lb-space-3);
    border-bottom: 1px solid var(--lb-line);
}

.lb-mobile-drawer__brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
}

.lb-mobile-drawer__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--lb-control-h);
    height: var(--lb-control-h);
    border: 1px solid var(--lb-line);
    border-radius: 999px;
    background: #fffefb;
    color: #4f5f57;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.lb-mobile-drawer__close:hover {
    border-color: color-mix(in srgb, var(--lb-green) 35%, var(--lb-line));
    color: var(--lb-green);
}

.lb-mobile-drawer__nav {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: var(--lb-space-4);
    -webkit-overflow-scrolling: touch;
    background: #fffefb;
}

.lb-mobile-drawer__section {
    margin-bottom: var(--lb-space-3);
    color: #94a39a;
}

.lb-mobile-drawer__links {
    display: flex;
    flex-direction: column;
    gap: var(--lb-space-2);
    width: 100%;
}

.lb-mobile-drawer__link {
    display: flex;
    align-items: center;
    gap: var(--lb-space-3);
    width: 100%;
    min-height: var(--lb-control-h);
    padding: 0 var(--lb-space-3);
    border-radius: 1rem;
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-base);
    font-weight: var(--lb-weight-medium);
    line-height: 1;
    color: #4f5f57;
    text-decoration: none;
    transition: background 0.18s ease, color 0.18s ease;
}

.lb-mobile-drawer__link:hover {
    background: rgba(255, 255, 252, 0.92);
    color: var(--lb-ink);
}

.lb-mobile-drawer__link.is-active {
    background: color-mix(in srgb, var(--lb-green) 8%, #fff);
    color: var(--lb-green);
    font-weight: var(--lb-weight-semibold);
}

.lb-mobile-drawer__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--lb-control-h);
    height: var(--lb-control-h);
    border-radius: 1rem;
    background: #f3f4f2;
    color: #6b7a72;
    font-size: 1.05rem;
    transition: background 0.18s ease, color 0.18s ease;
}

.lb-mobile-drawer__link.is-active .lb-mobile-drawer__icon {
    background: color-mix(in srgb, var(--lb-green) 12%, #fff);
    color: var(--lb-green);
}

.lb-mobile-drawer__label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lb-mobile-drawer__active-dot {
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 999px;
    background: var(--lb-green);
}

.lb-mobile-drawer__lang {
    padding: 0 var(--lb-space-4) var(--lb-space-4);
}

.lb-mobile-drawer__lang-grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--lb-space-2);
}

.lb-mobile-drawer__lang-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--lb-space-2);
    min-height: 2.25rem;
    padding: 0 var(--lb-space-3);
    border: 1px solid var(--lb-line);
    border-radius: 999px;
    background: #fffefb;
    font-family: var(--lb-font-sans);
    font-size: var(--lb-text-sm);
    font-weight: var(--lb-weight-medium);
    line-height: 1;
    color: #4f5f57;
    text-decoration: none;
    transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.lb-mobile-drawer__lang-btn.is-active {
    border-color: color-mix(in srgb, var(--lb-green) 45%, var(--lb-line));
    background: color-mix(in srgb, var(--lb-green) 8%, #fff);
    color: var(--lb-green);
    font-weight: var(--lb-weight-semibold);
}

.lb-mobile-drawer__footer {
    flex-shrink: 0;
    margin-top: auto;
    padding: var(--lb-space-4);
    padding-bottom: max(var(--lb-space-4), env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--lb-line);
    background: #f7faf6;
}

.lb-mobile-drawer__footer-copy {
    margin-bottom: var(--lb-space-3);
    text-align: center;
}

.lb-mobile-drawer__actions {
    display: grid;
    gap: var(--lb-space-2);
}

.lb-static-tab {
    min-height: var(--lb-control-h);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {
    .lb-static-tabs {
        flex-direction: column;
    }

    .lb-static-tab {
        width: 100%;
    }
}

/* Section spacing token */
.lb-sales .lb-section,
.lb-page .lb-section,
.guest-public-shell .lb-section {
    padding-block: var(--lb-section-pad);
}

.lb-page .lb-wrap,
.lb-sales .lb-wrap {
    width: min(100%, var(--theme-page-max-width, 90rem));
    max-width: var(--theme-page-max-width, 90rem);
    margin-inline: auto;
    padding-inline: var(--lb-space-4);
}

@media (min-width: 768px) {
    .lb-page .lb-wrap,
    .lb-sales .lb-wrap {
        padding-inline: var(--lb-space-5);
    }
}

@media (min-width: 1024px) {
    .lb-page .lb-wrap,
    .lb-sales .lb-wrap {
        padding-inline: var(--lb-space-6);
    }
}