@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@600;700&display=swap');

:root {
  --bh-yellow: #FFC928;
  --bh-brown: #35170C;
  --bh-orange: #D98B00;
  --bh-coral-soft: #F6D7C8;
  --bh-yellow-soft: #FFF7DF;
  --bh-brown-hover: #2A1209;
  --bh-warm-white: #FFFDF8;
  --bh-muted: #71645E;
  --bh-surface: #FFFFFF;
  --bh-border: #E9DED5;
  --bh-dark-gray: #4A4A4A;
  --bh-dark-gray-hover: #3F3F3F;
}

body {
  font-family: 'Inter', sans-serif;
  background: linear-gradient(180deg, var(--bh-warm-white) 0%, #ffffff 75%);
  color: var(--bh-muted);
}

h1,
h2,
h3,
.hero-header h1,
.product-section h2,
.contact-section h2 {
  font-family: 'Poppins', sans-serif;
  color: var(--bh-brown);
}

a {
  color: var(--bh-orange);
}

a:hover {
  color: var(--bh-brown);
}

/* Home page overrides */
.hero {
  background: linear-gradient(130deg, var(--bh-yellow-soft) 0%, #FFF1CC 52%, var(--bh-coral-soft) 100%) !important;
  color: var(--bh-brown) !important;
}

.hero-header h1,
.typewriter-wrapper {
  color: var(--bh-brown) !important;
  text-shadow: none !important;
}

.typewriter-wrapper {
  font-family: 'Poppins', sans-serif !important;
}

.hero-logo,
.hero-header img {
  border-color: rgba(53, 23, 12, 0.18) !important;
  background: var(--bh-warm-white) !important;
}

.background {
  opacity: 0.1 !important;
}

.about-section .description,
.about-content p,
.project-item .description,
.contact-section p,
.contact-item,
.feature-intro,
.about-tagline,
footer {
  color: var(--bh-muted) !important;
}

.about-section strong,
.product-section strong {
  color: var(--bh-brown) !important;
}

.linkedin-cta,
.visit-btn,
#accept-cookies,
.company-about-cta,
.feature-btn,
.about-cta,
.visit-btn2 {
  background: var(--bh-brown) !important;
  color: var(--bh-yellow) !important;
  border: 1px solid rgba(255, 201, 40, 0.35) !important;
  box-shadow: 0 10px 22px rgba(53, 23, 12, 0.16) !important;
}

.linkedin-cta:hover,
.visit-btn:hover,
#accept-cookies:hover,
.company-about-cta:hover,
.feature-btn:hover,
.about-cta:hover,
.visit-btn2:hover {
  background: var(--bh-brown-hover) !important;
  color: var(--bh-yellow) !important;
}

.linkedin-cta svg {
  fill: var(--bh-yellow) !important;
}

.contact-section a svg {
  fill: var(--bh-orange) !important;
}

.contact-section,
.product-section,
#best-practices,
.objective,
.intro {
  background: var(--bh-warm-white) !important;
  border: 1px solid var(--bh-border) !important;
}

/* Notre produit: boutons en gris fonce + texte blanc */
.product-section .visit-btn,
.product-section .feature-btn,
.product-section .visit-btn2 {
  background: var(--bh-dark-gray) !important;
  color: #FFFFFF !important;
  border: 1px solid #5A5A5A !important;
}

.product-section .visit-btn:hover,
.product-section .feature-btn:hover,
.product-section .visit-btn2:hover {
  background: var(--bh-dark-gray-hover) !important;
  color: #FFFFFF !important;
}

.image-sequence h2,
.projects-section h2,
.about-section h2,
.video-title,
.contact-section h2 {
  color: var(--bh-brown) !important;
}

footer {
  background: rgba(255, 253, 248, 0.95) !important;
  border: 1px solid var(--bh-border);
}

footer a,
#legal-link,
.contact-section a,
.contact-item a {
  color: var(--bh-orange) !important;
}

#cookie-banner {
  background: rgba(53, 23, 12, 0.96) !important;
  color: var(--bh-warm-white) !important;
}

#cookie-banner span,
#cookie-banner a {
  color: var(--bh-warm-white) !important;
}

#legal-modal > div {
  background: var(--bh-warm-white) !important;
  color: var(--bh-muted) !important;
}

nav a {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  color: var(--bh-brown) !important;
  background: #F9E29D !important;
  border: 1px solid rgba(53, 23, 12, 0.14);
}

nav a:hover {
  color: var(--bh-brown) !important;
  background: #F4D36A !important;
}

/* About page specific adjustments */
.back-link {
  color: var(--bh-brown) !important;
  border-color: var(--bh-border) !important;
  background: linear-gradient(180deg, #ffffff 0%, #FFF7DF 100%) !important;
}

.intro-text .name {
  color: var(--bh-orange) !important;
}

.intro-text h2::after,
.objective h2::after {
  background: var(--bh-orange) !important;
}

.objective {
  border-left: 4px solid var(--bh-orange) !important;
}

/* Redirect pages */
body > p {
  max-width: 560px;
  margin: 12vh auto;
  padding: 18px 22px;
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  color: var(--bh-brown);
  background: var(--bh-warm-white);
  border: 1px solid var(--bh-border);
  border-radius: 12px;
}