body.ff-public-shell {
    --ff-ink: #f7f1df;
    --ff-muted: #bfb29c;
    --ff-soft: #8f8476;
    --ff-panel: rgba(32, 23, 19, 0.72);
    --ff-panel-strong: rgba(24, 17, 14, 0.9);
    --ff-border: rgba(214, 177, 92, 0.22);
    --ff-border-strong: rgba(214, 177, 92, 0.4);
    --ff-accent: #d6b15c;
    --ff-accent-2: #f08d49;
    --ff-accent-3: #8d5536;
    --ff-glow: rgba(240, 141, 73, 0.18);
    background:
        radial-gradient(circle at top left, rgba(240, 141, 73, 0.12), transparent 32%),
        radial-gradient(circle at 85% 18%, rgba(214, 177, 92, 0.14), transparent 28%),
        linear-gradient(180deg, #120e0b 0%, #17110d 36%, #0f0a08 100%);
    color: var(--ff-ink);
}

/* Global anti-overflow for extreme zoom levels */
html, body { max-width: 100%; overflow-x: hidden; }
* { box-sizing: border-box; }
img, video, iframe { max-width: 100%; height: auto; }

/* Keep hero badge container padded on narrow / high-zoom */
#hero-badge-wrap { inset: auto 0 22px 0; padding: 0 16px; }
.hero-float-badge { width: calc(100% - 32px); left: 16px; right: 16px; }

/* Section padding scales with zoom */
section, .hp-sec { padding-left: clamp(14px, 4vw, 32px); padding-right: clamp(14px, 4vw, 32px); }

body.ff-public-shell::before {
    background:
        radial-gradient(circle at 20% 15%, rgba(240, 141, 73, 0.12), transparent 24%),
        radial-gradient(circle at 85% 0%, rgba(214, 177, 92, 0.12), transparent 20%),
        linear-gradient(180deg, rgba(18, 14, 11, 0.1), rgba(18, 14, 11, 0.5)) !important;
    opacity: 1;
}

body.ff-public-shell a {
    transition: color 0.25s ease, border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

body.ff-public-shell #main-nav {
    position: static !important;
    top: auto !important;
    inset: auto !important;
    z-index: 60;
    background: rgba(20, 14, 11, 0.86) !important;
    border-bottom: 1px solid rgba(214, 177, 92, 0.14) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.22) !important;
}

body.ff-public-shell #main-nav.scrolled {
    background: rgba(20, 14, 11, 0.95) !important;
    border-bottom-color: rgba(214, 177, 92, 0.28) !important;
}

body.ff-public-shell .logo-icon {
    height: 122px !important;
    filter: drop-shadow(0 10px 22px rgba(240, 141, 73, 0.22)) !important;
}

body.ff-public-shell .nav-link-luxury {
    color: rgba(247, 241, 223, 0.82) !important;
    border-radius: 999px;
    letter-spacing: 0.02em;
}

body.ff-public-shell .nav-link-luxury::before {
    display: none;
}

body.ff-public-shell .nav-link-luxury:hover,
body.ff-public-shell .nav-link-luxury.nav-link-active {
    color: #fff7e8 !important;
    background: linear-gradient(135deg, rgba(214, 177, 92, 0.18), rgba(240, 141, 73, 0.16)) !important;
    box-shadow: inset 0 0 0 1px rgba(214, 177, 92, 0.18);
}

body.ff-public-shell .btn-luxury-gold,
body.ff-public-shell .btn-gold {
    background: linear-gradient(135deg, var(--ff-accent), var(--ff-accent-2)) !important;
    color: #1c120d !important;
    border-radius: 999px !important;
    box-shadow: 0 14px 28px rgba(240, 141, 73, 0.2) !important;
}

body.ff-public-shell .btn-luxury-outline,
body.ff-public-shell .btn-outline,
body.ff-public-shell .btn-outline-gold {
    background: rgba(255, 248, 235, 0.03) !important;
    color: var(--ff-ink) !important;
    border: 1px solid var(--ff-border-strong) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

body.ff-public-shell .btn-luxury-gold:hover,
body.ff-public-shell .btn-gold:hover,
body.ff-public-shell .btn-luxury-outline:hover,
body.ff-public-shell .btn-outline:hover,
body.ff-public-shell .btn-outline-gold:hover {
    transform: translateY(-2px);
}

body.ff-public-shell .hero-section {
    padding-top: 7rem !important;
    padding-bottom: 4.5rem !important;
}

body.ff-public-shell .hero-title,
body.ff-public-shell .cta-title,
body.ff-public-shell .section-title,
body.ff-public-shell .recipe-detail-title,
body.ff-public-shell .section-heading {
    color: #fff7ea !important;
    font-family: Georgia, serif !important;
    letter-spacing: -0.03em;
}

body.ff-public-shell .hero-title {
    font-size: clamp(2.8rem, 5vw, 5.2rem) !important;
    max-width: 11ch;
    margin-left: auto;
    margin-right: auto;
}

body.ff-public-shell .hero-title .accent,
body.ff-public-shell .hero-subtitle strong,
body.ff-public-shell .section-link,
body.ff-public-shell .news-date,
body.ff-public-shell .event-date-badge,
body.ff-public-shell .event-date-badge.past-badge {
    color: var(--ff-accent) !important;
}

body.ff-public-shell .hero-subtitle,
body.ff-public-shell .cta-subtitle,
body.ff-public-shell .recipe-description,
body.ff-public-shell .news-excerpt,
body.ff-public-shell .event-desc,
body.ff-public-shell .value-description,
body.ff-public-shell .team-bio,
body.ff-public-shell .philosophy-text,
body.ff-public-shell .resource-card-desc,
body.ff-public-shell .video-desc,
body.ff-public-shell .hack-desc,
body.ff-public-shell .card-desc {
    color: var(--ff-muted) !important;
}

body.ff-public-shell .stats-section,
body.ff-public-shell .search-filter-bar,
body.ff-public-shell .section-alt,
body.ff-public-shell .cta-section {
    border-color: rgba(214, 177, 92, 0.12) !important;
}

body.ff-public-shell .stat-number {
    color: #fff2cf !important;
    text-shadow: 0 0 24px rgba(214, 177, 92, 0.16);
}

body.ff-public-shell .stat-label,
body.ff-public-shell .event-meta,
body.ff-public-shell .video-meta,
body.ff-public-shell .resource-card-meta,
body.ff-public-shell .card-meta {
    color: var(--ff-soft) !important;
}

body.ff-public-shell .recipe-card,
body.ff-public-shell .news-card,
body.ff-public-shell .event-card,
body.ff-public-shell .resource-card,
body.ff-public-shell .video-card,
body.ff-public-shell .value-card,
body.ff-public-shell .team-member,
body.ff-public-shell .philosophy-card,
body.ff-public-shell .hack-card,
body.ff-public-shell .profile-card,
body.ff-public-shell .recipe-detail-card,
body.ff-public-shell .article-box,
body.ff-public-shell .event-modal-box,
body.ff-public-shell .modal-box {
    background: linear-gradient(180deg, rgba(37, 27, 22, 0.86), rgba(22, 16, 13, 0.94)) !important;
    border: 1px solid var(--ff-border) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3) !important;
}

body.ff-public-shell .recipe-card:hover,
body.ff-public-shell .news-card:hover,
body.ff-public-shell .event-card:hover,
body.ff-public-shell .resource-card:hover,
body.ff-public-shell .video-card:hover,
body.ff-public-shell .value-card:hover,
body.ff-public-shell .hack-card:hover {
    transform: translateY(-8px) !important;
    border-color: var(--ff-border-strong) !important;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(214, 177, 92, 0.08) inset !important;
}

body.ff-public-shell .recipe-image,
body.ff-public-shell .news-img,
body.ff-public-shell .event-img,
body.ff-public-shell .resource-card-thumb,
body.ff-public-shell .card-thumb,
body.ff-public-shell .video-thumb {
    background-color: #2a1e18;
}

body.ff-public-shell .news-img-placeholder,
body.ff-public-shell .event-img-placeholder,
body.ff-public-shell .resource-card-thumb,
body.ff-public-shell .card-thumb,
body.ff-public-shell .video-thumb,
body.ff-public-shell .team-avatar,
body.ff-public-shell .value-icon {
    background: linear-gradient(135deg, rgba(214, 177, 92, 0.22), rgba(141, 85, 54, 0.3)) !important;
}

body.ff-public-shell .search-input,
body.ff-public-shell .luxury-input,
body.ff-public-shell .input-luxury,
body.ff-public-shell .lux-input,
body.ff-public-shell .code-box {
    border-radius: 18px !important;
}

body.ff-public-shell .filter-panel,
body.ff-public-shell .ingredients-container,
body.ff-public-shell .description-box {
    background: rgba(27, 19, 15, 0.82) !important;
    border-color: var(--ff-border) !important;
}

body.ff-public-shell .section-title {
    margin-bottom: 2.5rem !important;
}

body.ff-public-shell .section-link {
    font-weight: 700 !important;
}

body.ff-public-shell .section-link:hover {
    color: #f6c98d !important;
}

body.ff-public-shell .section-title::after,
body.ff-public-shell .footer-heading::after {
    background: linear-gradient(90deg, var(--ff-accent), var(--ff-accent-2)) !important;
}

body.ff-public-shell .footer-heading,
body.ff-public-shell .footer-link,
body.ff-public-shell footer p,
body.ff-public-shell .social-icon-luxury {
    color: var(--ff-ink) !important;
}

body.ff-public-shell footer {
    background: linear-gradient(180deg, rgba(19, 13, 11, 0.95), rgba(10, 8, 7, 0.98)) !important;
    border-top: 1px solid rgba(214, 177, 92, 0.16) !important;
}

body.ff-public-shell .footer-link {
    color: var(--ff-muted) !important;
}

body.ff-public-shell .footer-link:hover,
body.ff-public-shell .social-icon-luxury:hover {
    color: #fff2dc !important;
}

body.ff-public-shell .social-icon-luxury {
    background: rgba(255, 248, 235, 0.04) !important;
    border-color: rgba(214, 177, 92, 0.2) !important;
}

body.ff-public-shell .social-icon-luxury:hover {
    background: linear-gradient(135deg, rgba(214, 177, 92, 0.2), rgba(240, 141, 73, 0.18)) !important;
    border-color: rgba(214, 177, 92, 0.4) !important;
}

body.ff-public-shell #scroll-to-top-btn {
    background: linear-gradient(135deg, var(--ff-accent), var(--ff-accent-2)) !important;
    box-shadow: 0 14px 30px rgba(240, 141, 73, 0.26) !important;
}

body.ff-public-shell .cta-section {
    background:
        radial-gradient(circle at top, rgba(214, 177, 92, 0.08), transparent 30%),
        linear-gradient(135deg, rgba(36, 24, 20, 0.96), rgba(17, 11, 9, 0.98)) !important;
}

body.ff-public-shell .tab-nav {
    border-bottom-color: rgba(214, 177, 92, 0.16) !important;
}

body.ff-public-shell .tab-btn.active {
    color: #fff1d0 !important;
    border-bottom-color: var(--ff-accent) !important;
}

body.ff-public-shell .event-date-badge {
    background: rgba(214, 177, 92, 0.11) !important;
    border-color: rgba(214, 177, 92, 0.26) !important;
}

body.ff-public-shell .event-date-badge.past-badge {
    background: rgba(255, 248, 235, 0.04) !important;
    border-color: rgba(214, 177, 92, 0.14) !important;
}

body.ff-public-shell .team-avatar,
body.ff-public-shell .value-icon {
    box-shadow: 0 18px 35px rgba(141, 85, 54, 0.16) !important;
}

body.ff-public-shell .team-name,
body.ff-public-shell .value-title,
body.ff-public-shell .recipe-title,
body.ff-public-shell .news-title,
body.ff-public-shell .event-title,
body.ff-public-shell .resource-card-title,
body.ff-public-shell .video-title,
body.ff-public-shell .card-title {
    color: #fff4e3 !important;
}

@media (max-width: 900px) {
    body.ff-public-shell .hero-title {
        max-width: 100%;
    }

    body.ff-public-shell .recipe-grid,
    body.ff-public-shell .news-grid,
    body.ff-public-shell .events-grid,
    body.ff-public-shell .values-grid,
    body.ff-public-shell .team-grid,
    body.ff-public-shell .resource-grid {
        gap: 1.5rem !important;
    }
}