/*!
 * WEVAL MASTER THEME · D439
 * Référentiel unique typographique + chromatique
 * Source: doctrine 439 - mode YACINE
 */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&family=Playfair+Display:wght@400;500;600;700;800&display=swap');

:root {
  /* === COULEURS MASTER === */
  --weval-bg: #FAF8F5;          /* Cream principal */
  --weval-bg-alt: #F7F5F0;      /* Cream alt (cards) */
  --weval-bg-dark: #0B0D14;     /* Dark mode toggle */
  --weval-text: #1B1B1F;        /* Texte principal */
  --weval-text-muted: #5A6480;  /* Texte secondaire */
  --weval-border: #E8E2D9;      /* Bordures */
  
  --weval-primary: #3730A3;     /* Violet principal (slogan, CTA) */
  --weval-primary-2: #4F46E5;   /* Violet btn principal */
  --weval-accent: #6F5CFF;      /* Accent secondaire */
  --weval-success: #047857;     /* Vert savings */
  --weval-warn: #B45309;        /* Orange */
  --weval-danger: #B91C1C;      /* Rouge */
  
  /* === TYPOGRAPHIE MASTER === */
  --weval-font-body: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --weval-font-heading: 'Instrument Serif', 'Playfair Display', Georgia, serif;
  --weval-font-mono: 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;
}

/* === APPLY GLOBALLY (high specificity) === */
html, body {
  background: var(--weval-bg) !important;
  color: var(--weval-text);
  font-family: var(--weval-font-body) !important;
  font-feature-settings: 'kern' 1, 'liga' 1;
  -webkit-font-smoothing: antialiased;
}

/* Sauf si page volontairement dark (booking, contact, etc) - keep their bg */
html body[style*="background:#0"], 
html body[style*="background-color:#0"],
html body.dark-theme,
html body[data-theme="dark"] {
  background: var(--weval-bg-dark) !important;
  color: #fff;
}

/* Headings master font */
html body h1, html body h2, html body h3 {
  font-family: var(--weval-font-heading) !important;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
html body h4, html body h5, html body h6 {
  font-family: var(--weval-font-body) !important;
  font-weight: 700;
}

/* Paragraphes / body text */
html body p, html body li, html body span:not([class*="serif"]):not([class*="instrument"]):not([class*="font-family"]) {
  font-family: var(--weval-font-body) !important;
}

/* Hero body paragraph - max-width pour ne pas être trop large (Yacine: tout centrer c'est moche) */
html body section h1 + p,
html body section h1 ~ p:first-of-type,
html body main h1 + p {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* Generic body paragraph after hero (description type) */
html body main > p,
html body section > p {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

/* Buttons and links - keep DM Sans body */
html body button, html body .btn, html body a {
  font-family: var(--weval-font-body) !important;
}

/* Override Arial fallback (was lazy default) */
html body[style*="Arial"], 
html body * {
  font-family: var(--weval-font-body), Arial, sans-serif;
}
html body h1, html body h2, html body h3 {
  font-family: var(--weval-font-heading) !important;
}

/* Constellation pattern for hero (subtle SVG bg) */
html body section.hero,
html body main > section:first-of-type {
  background-image: radial-gradient(circle at 20% 20%, rgba(111, 92, 255, 0.04) 0, transparent 30%),
                    radial-gradient(circle at 80% 80%, rgba(55, 48, 163, 0.03) 0, transparent 35%);
  background-attachment: fixed;
}

/* Button primary uniformity */
html body button.primary, 
html body a.btn-primary,
html body a[href*="services"][class*="services"],
html body a.btn-services {
  background: var(--weval-primary) !important;
  color: #fff !important;
  border-radius: 60px !important;
  padding: 14px 32px;
  font-weight: 600;
}


/* === D440 stronger hero alignment === */
html body section h1, html body main h1 {
  text-align: center !important;
}
html body section h1 + p,
html body section h1 ~ p,
html body main h1 + p {
  text-align: center !important;
  max-width: 720px;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body section h1 ~ p span,
html body main h1 ~ p span {
  display: block;
  text-align: center !important;
}
html body section a.services-button,
html body section button.services-button {
  margin-left: auto !important;
  margin-right: auto !important;
  display: block;
}

/* === D440 v3 ULTRA SPECIFICITY anti-React inline === */
html body .hero-title,
html body section .hero-title,
html body .hero-subtitle,
html body section .hero-subtitle,
html body p.hero-subtitle,
html body section p.hero-subtitle,
html body section h1 + p,
html body section h1 ~ p,
html body main h1 + p,
html body main h1 ~ p {
  text-align: center !important;
}
html body section h1 + p span,
html body section h1 ~ p span,
html body p.hero-subtitle span {
  display: block !important;
  text-align: center !important;
}

/* D444 logo + no italic - mode YACINE */
html body em, html body i { font-style: normal !important; font-weight: 600 !important; }
html body .logo, html body header .brand { font-size: 1.5rem !important; }