/* ============================================================
   EYYAW v219 — Fondation design éditoriale
   Sortir du style IA / Vercel / Linear / glassmorphism
   Activable : html[data-eyyaw-design="v219"]
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600;9..144,700;9..144,800;9..144,900&family=Inter+Tight:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ============================================================
   1. TOKENS
   ============================================================ */
html[data-eyyaw-design="v219"] {
  /* --- Palette éditoriale chaude --- */
  --v219-cream: #FAF7F2;
  --v219-paper: #FFFFFF;
  --v219-sand: #EDE6DA;
  --v219-ink: #1A1614;
  --v219-ink-soft: #3D3631;
  --v219-ink-muted: #6B6156;
  --v219-rule: #D9CFC0;
  --v219-sienna: #B85C38;
  --v219-ochre: #C89B3C;
  --v219-olive: #5C6B3F;
  --v219-terracotta: #A34A2B;

  /* --- Bridge vers les tokens existants --- */
  --bg: #FAF7F2;
  --surface: transparent;
  --surface-2: #EDE6DA;
  --text: #1A1614;
  --text-muted: #6B6156;
  --text-dim: rgba(26,22,20,.42);
  --border: #D9CFC0;
  --border-strong: rgba(26,22,20,.22);
  --accent: #B85C38;
  --accent-contrast: #FFFFFF;
  --gold: #C89B3C;
  --gold-bright: #B85C38;
  --gold-dim: rgba(184,92,56,.35);
  --gold-glow: rgba(184,92,56,.08);

  /* --- Fonts --- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
}

/* ============================================================
   2. RESET — base
   ============================================================ */
html[data-eyyaw-design="v219"],
html[data-eyyaw-design="v219"] body {
  background-color: #FAF7F2 !important;
  color: #1A1614 !important;
  font-family: var(--font-body) !important;
  font-feature-settings: 'ss01', 'cv01', 'cv11';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html[data-eyyaw-design="v219"] body {
  font-size: 16px;
  line-height: 1.6;
}

/* ============================================================
   3. TYPOGRAPHIE
   ============================================================ */

/* Titres : Fraunces, très gras, tracking serré */
html[data-eyyaw-design="v219"] h1,
html[data-eyyaw-design="v219"] h2,
html[data-eyyaw-design="v219"] .h1,
html[data-eyyaw-design="v219"] .h2,
html[data-eyyaw-design="v219"] .display,
html[data-eyyaw-design="v219"] .hero-title,
html[data-eyyaw-design="v219"] .hero-title-type,
html[data-eyyaw-design="v219"] .hero-display,
html[data-eyyaw-design="v219"] .hero-morph h1,
html[data-eyyaw-design="v219"] .gd-hero-title,
html[data-eyyaw-design="v219"] .art-title,
html[data-eyyaw-design="v219"] .ins-title,
html[data-eyyaw-design="v219"] .editorial-section h2,
html[data-eyyaw-design="v219"] .section h2,
html[data-eyyaw-design="v219"] [class*="section-title"] {
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-variation-settings: "opsz" 96, "SOFT" 0, "WONK" 0 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.02 !important;
  color: #1A1614 !important;
}

/* H3, H4 : serif aussi mais plus léger */
html[data-eyyaw-design="v219"] h3,
html[data-eyyaw-design="v219"] h4,
html[data-eyyaw-design="v219"] .h3,
html[data-eyyaw-design="v219"] .h4,
html[data-eyyaw-design="v219"] .card-title,
html[data-eyyaw-design="v219"] .gd-chapter-title {
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  color: #1A1614 !important;
}

/* Eyebrow : mono, sobre, sans pilule */
html[data-eyyaw-design="v219"] .eyebrow,
html[data-eyyaw-design="v219"] .art-eyebrow,
html[data-eyyaw-design="v219"] .gd-eyebrow,
html[data-eyyaw-design="v219"] .gd-hero-tag,
html[data-eyyaw-design="v219"] .gd-final-cta-label,
html[data-eyyaw-design="v219"] .gd-block-label {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  color: #B85C38 !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
}

html[data-eyyaw-design="v219"] .eyebrow::before,
html[data-eyyaw-design="v219"] .eyebrow::after { display: none !important; }

/* Gros "display" : plus grand et plus serré */
html[data-eyyaw-design="v219"] .display,
html[data-eyyaw-design="v219"] .hero-title-type,
html[data-eyyaw-design="v219"] .hero-display,
html[data-eyyaw-design="v219"] .ins-title {
  font-size: clamp(2.6rem, 7vw, 5.6rem) !important;
}

/* Lead : plus grand, plus lisible */
html[data-eyyaw-design="v219"] .lead,
html[data-eyyaw-design="v219"] .section-lead,
html[data-eyyaw-design="v219"] .hero-lead,
html[data-eyyaw-design="v219"] .art-lead,
html[data-eyyaw-design="v219"] .gd-hero-lead,
html[data-eyyaw-design="v219"] .ins-lead {
  font-family: var(--font-body) !important;
  font-size: clamp(1.06rem, 1.3vw, 1.25rem) !important;
  line-height: 1.55 !important;
  color: #6B6156 !important;
  max-width: 65ch !important;
}

/* ============================================================
   4. TUER LE GLASSMORPHISM
   ============================================================ */
html[data-eyyaw-design="v219"] .card,
html[data-eyyaw-design="v219"] .cap-card,
html[data-eyyaw-design="v219"] .domain-card,
html[data-eyyaw-design="v219"] .service-card,
html[data-eyyaw-design="v219"] .insight-card,
html[data-eyyaw-design="v219"] .problem-card,
html[data-eyyaw-design="v219"] .method-step,
html[data-eyyaw-design="v219"] .gd-toc-item,
html[data-eyyaw-design="v219"] .gd-chapter,
html[data-eyyaw-design="v219"] .art-related-card,
html[data-eyyaw-design="v219"] [class*="-card"] {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
}

/* Cartes = filet supérieur + padding vertical (style magazine) */
html[data-eyyaw-design="v219"] .card,
html[data-eyyaw-design="v219"] .cap-card,
html[data-eyyaw-design="v219"] .domain-card,
html[data-eyyaw-design="v219"] .service-card,
html[data-eyyaw-design="v219"] .insight-card,
html[data-eyyaw-design="v219"] .problem-card {
  border-top: 1px solid #D9CFC0 !important;
  border-bottom: none !important;
  padding: 36px 0 32px !important;
}

/* Hover : filet devient plus foncé, pas de lift */
html[data-eyyaw-design="v219"] .card:hover,
html[data-eyyaw-design="v219"] .cap-card:hover,
html[data-eyyaw-design="v219"] .domain-card:hover,
html[data-eyyaw-design="v219"] .service-card:hover,
html[data-eyyaw-design="v219"] .insight-card:hover,
html[data-eyyaw-design="v219"] .problem-card:hover {
  transform: none !important;
  border-top-color: #B85C38 !important;
  box-shadow: none !important;
}

/* ============================================================
   5. BOUTONS — Éditorial, pas SaaS pill
   ============================================================ */
html[data-eyyaw-design="v219"] .btn,
html[data-eyyaw-design="v219"] .btn-morph,
html[data-eyyaw-design="v219"] .gd-nav-btn,
html[data-eyyaw-design="v219"] .gd-end-btn,
html[data-eyyaw-design="v219"] .gd-cta-btn,
html[data-eyyaw-design="v219"] .art-cta-btn,
html[data-eyyaw-design="v219"] .ins-cta,
html[data-eyyaw-design="v219"] .cap-link {
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 14px 24px !important;
  border-radius: 0 !important;
  border: 1px solid #1A1614 !important;
  background: #1A1614 !important;
  color: #FAF7F2 !important;
  transition: all .2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html[data-eyyaw-design="v219"] .btn::before,
html[data-eyyaw-design="v219"] .btn-morph::before { display: none !important; }

html[data-eyyaw-design="v219"] .btn:hover,
html[data-eyyaw-design="v219"] .btn-morph:hover,
html[data-eyyaw-design="v219"] .gd-nav-btn:hover,
html[data-eyyaw-design="v219"] .gd-end-btn:hover,
html[data-eyyaw-design="v219"] .gd-cta-btn:hover,
html[data-eyyaw-design="v219"] .art-cta-btn:hover {
  background: transparent !important;
  color: #1A1614 !important;
  transform: none !important;
}

/* Bouton primaire = accent sienna */
html[data-eyyaw-design="v219"] .btn-primary,
html[data-eyyaw-design="v219"] .btn-morph.primary,
html[data-eyyaw-design="v219"] .gd-cta-primary,
html[data-eyyaw-design="v219"] .gd-end-btn-primary,
html[data-eyyaw-design="v219"] .art-cta-primary,
html[data-eyyaw-design="v219"] .ins-cta {
  background: #B85C38 !important;
  border-color: #B85C38 !important;
  color: #FAF7F2 !important;
}

html[data-eyyaw-design="v219"] .btn-primary:hover,
html[data-eyyaw-design="v219"] .btn-morph.primary:hover,
html[data-eyyaw-design="v219"] .gd-cta-primary:hover,
html[data-eyyaw-design="v219"] .gd-end-btn-primary:hover,
html[data-eyyaw-design="v219"] .art-cta-primary:hover,
html[data-eyyaw-design="v219"] .ins-cta:hover {
  background: #1A1614 !important;
  border-color: #1A1614 !important;
  color: #FAF7F2 !important;
}

/* Boutons ghost = texte + soulignement */
html[data-eyyaw-design="v219"] .btn-ghost,
html[data-eyyaw-design="v219"] .gd-cta-ghost,
html[data-eyyaw-design="v219"] .gd-end-btn-ghost,
html[data-eyyaw-design="v219"] .art-cta-ghost {
  background: transparent !important;
  color: #1A1614 !important;
  border-color: #1A1614 !important;
}
html[data-eyyaw-design="v219"] .btn-ghost:hover,
html[data-eyyaw-design="v219"] .gd-cta-ghost:hover,
html[data-eyyaw-design="v219"] .gd-end-btn-ghost:hover,
html[data-eyyaw-design="v219"] .art-cta-ghost:hover {
  background: #1A1614 !important;
  color: #FAF7F2 !important;
}

/* ============================================================
   6. HEADER — Sortir du glass
   ============================================================ */
html[data-eyyaw-design="v219"] .elite-header {
  background: rgba(250,247,242,.92) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid #D9CFC0 !important;
}

html[data-eyyaw-design="v219"] .elite-header.scrolled {
  background: rgba(250,247,242,.98) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-eyyaw-design="v219"] .brand-logo-img {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

/* ============================================================
   7. BLOBS / ORBES / DÉGRADÉS DE FOND — Supprimés
   ============================================================ */
html[data-eyyaw-design="v219"] .blob-container,
html[data-eyyaw-design="v219"] .blob,
html[data-eyyaw-design="v219"] [class*="orb"],
html[data-eyyaw-design="v219"] [class*="glow"] {
  display: none !important;
}

html[data-eyyaw-design="v219"] body::before,
html[data-eyyaw-design="v219"] body::after {
  display: none !important;
}

/* ============================================================
   8. TYPOGRAPHIE — Styles éditoriaux
   ============================================================ */

/* Drop cap sur le premier paragraphe des articles */
html[data-eyyaw-design="v219"] .art-content > .prose p:first-of-type::first-letter,
html[data-eyyaw-design="v219"] .gd-chapter-body > p:first-of-type::first-letter {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 4.5em;
  line-height: .85;
  float: left;
  margin: 6px 14px 0 0;
  color: #B85C38;
}

/* Filet fin pour séparer les sections */
html[data-eyyaw-design="v219"] .editorial-section + .editorial-section,
html[data-eyyaw-design="v219"] section + section {
  border-top: 1px solid #D9CFC0;
}

/* ============================================================
   9. ANNULER LES EFFETS "IA"
   ============================================================ */

/* Plus de dégradés de texte */
html[data-eyyaw-design="v219"] .gold,
html[data-eyyaw-design="v219"] [class*="gradient"],
html[data-eyyaw-design="v219"] [style*="background-clip"] {
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  color: #B85C38 !important;
}

/* Plus de border-radius partout */
html[data-eyyaw-design="v219"] [class*="rounded"],
html[data-eyyaw-design="v219"] .gd-toc-status,
html[data-eyyaw-design="v219"] .gd-end-icon,
html[data-eyyaw-design="v219"] .art-share-btn,
html[data-eyyaw-design="v219"] .gd-share-btn {
  border-radius: 0 !important;
}

/* Le pouce du scrollbar aussi */
html[data-eyyaw-design="v219"] ::-webkit-scrollbar-thumb {
  background: #1A1614 !important;
  border-radius: 0 !important;
}

/* Sélection de texte */
html[data-eyyaw-design="v219"] ::selection {
  background: #B85C38;
  color: #FAF7F2;
}

/* ============================================================
   10. OVERRIDES SPÉCIFIQUES ARTIZLABS (dark brutaliste)
   À décommenter quand on activera v220-artizlabs
   ============================================================ */

/* Pour l'instant, sur artizlabs, on garde le dark */
html[data-eyyaw-design="v219"] body[data-site="artizlabs"] {
  /* rien pour l'instant */
}