/* ============================================================
   TANIA GOMBERT · Components shared (footer, signature, etc.)
   Charte Anita 2024 · CSS variables tokens
   ============================================================ */

/* === Footer custom signé Tania — supersedes Zakra footer === */
.tg-footer {
  background: var(--tg-noir);
  color: var(--tg-creme);
  padding: var(--tg-sp-5) 0 var(--tg-sp-3);
  border-top: 4px solid var(--tg-rouge);
  font-family: var(--tg-font-sans);
}
.tg-footer .tg-footer-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 var(--tg-sp-4);
}
.tg-footer .tg-footer-baseline {
  font-family: var(--tg-font-accent);
  color: var(--tg-rouge);
  font-size: 1.4rem;
  margin-bottom: var(--tg-sp-3);
}
.tg-footer .tg-footer-credit {
  font-size: var(--tg-fs-small);
  color: rgba(250, 243, 232, 0.7);
  margin-top: var(--tg-sp-3);
  padding-top: var(--tg-sp-3);
  border-top: 1px solid rgba(250, 243, 232, 0.15);
}
.tg-footer a {
  color: var(--tg-creme);
  text-decoration: none;
  border-bottom: 1px solid rgba(172, 12, 46, 0.5);
  transition: border-color 0.2s ease;
}
.tg-footer a:hover { border-bottom-color: var(--tg-rouge); }

/* === Boutons CTA généraux (réutilisables hors article) === */
.tg-btn-primary {
  display: inline-block;
  padding: 0.95rem 1.85rem;
  background: var(--tg-rouge);
  color: var(--tg-creme);
  font-family: var(--tg-font-sans);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid var(--tg-rouge);
  border-radius: var(--tg-cta-radius);
  transition: all 0.22s ease;
}
.tg-btn-primary:hover {
  background: var(--tg-rouge-dark);
  border-color: var(--tg-rouge-dark);
  color: var(--tg-creme);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(172, 12, 46, 0.28);
}
.tg-btn-secondary {
  display: inline-block;
  padding: 0.95rem 1.85rem;
  background: transparent;
  color: var(--tg-rouge);
  font-family: var(--tg-font-sans);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid var(--tg-rouge);
  border-radius: var(--tg-cta-radius);
  transition: all 0.22s ease;
}
.tg-btn-secondary:hover {
  background: var(--tg-rouge);
  color: var(--tg-creme);
}

/* === Hero éditorial (homepage + pages clés) === */
.tg-hero {
  padding: var(--tg-sp-6) 0 var(--tg-sp-5);
  background: var(--tg-creme);
  position: relative;
}
.tg-hero .tg-hero-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 var(--tg-sp-4);
}
.tg-hero .tg-hero-eyebrow {
  font-size: 12px;
  letter-spacing: var(--tg-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--tg-rouge);
  font-weight: 600;
  margin-bottom: var(--tg-sp-2);
}
.tg-hero h1 {
  font-family: var(--tg-font-serif);
  font-size: var(--tg-fs-h1);
  line-height: var(--tg-lh-heading);
  color: var(--tg-marine);
  margin-bottom: var(--tg-sp-3);
  max-width: 800px;
}
.tg-hero h1 em {
  font-family: var(--tg-font-accent);
  color: var(--tg-rouge);
  font-style: italic;
}
.tg-hero .tg-hero-lede {
  font-size: 1.2rem;
  color: var(--tg-gris);
  max-width: 680px;
  margin-bottom: var(--tg-sp-4);
  line-height: 1.6;
}

/* === Card éditoriale (services, articles, projets) === */
.tg-card {
  background: white;
  border: 1px solid var(--tg-filet);
  border-left: 3px solid var(--tg-rouge);
  padding: var(--tg-sp-3);
  border-radius: 0 4px 4px 0;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tg-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--tg-shadow-soft);
}
.tg-card .tg-card-eyebrow {
  font-size: 10px;
  letter-spacing: var(--tg-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--tg-rouge);
  font-weight: 600;
  margin-bottom: var(--tg-sp-1);
}
.tg-card h3 {
  font-family: var(--tg-font-serif);
  font-size: var(--tg-fs-h3);
  color: var(--tg-marine);
  margin-bottom: var(--tg-sp-1);
  line-height: 1.25;
}
.tg-card p {
  font-family: var(--tg-font-sans);
  font-size: var(--tg-fs-small);
  color: var(--tg-gris);
  line-height: 1.55;
}

/* === Filet de séparation (utilitaire) === */
.tg-rule {
  border: none;
  height: 1px;
  background: var(--tg-taupe);
  margin: var(--tg-sp-4) auto;
  max-width: 100px;
}
.tg-rule-rouge {
  border: none;
  height: 2px;
  background: var(--tg-rouge);
  margin: var(--tg-sp-4) auto;
  max-width: 60px;
}