/* ============================================================
   TSC — Design System 2026
   Charte : bleu #0c3678 · rouge #db0a09 · fond blanc/bleu clair
   ============================================================ */

:root {
  --tsc-blue: #0c3678;
  --tsc-blue-deep: #082a5e;
  --tsc-blue-soft: #1e4f9c;
  --tsc-blue-mist: #eef3fb;
  --tsc-red: #db0a09;
  --tsc-red-deep: #b50807;
  --tsc-ink: #0a1c34;
  --tsc-slate: #45587a;
  --tsc-line: #e0e8f4;
  --tsc-white: #ffffff;
  --tsc-radius-lg: 26px;
  --tsc-radius-md: 18px;
  --tsc-radius-sm: 14px;
  --tsc-shadow: 0 12px 40px -12px rgba(12, 54, 120, 0.18);
  --tsc-shadow-soft: 0 6px 24px -10px rgba(12, 54, 120, 0.14);
}

/* ============ Base / typo ============ */
body {
  background: var(--tsc-white);
  color: var(--tsc-ink);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5 {
  color: var(--tsc-ink);
  letter-spacing: -0.02em;
  font-weight: 800;
  line-height: 1.12;
}
p { color: var(--tsc-slate); }
a { color: var(--tsc-blue); transition: color .25s ease; }
a:hover { color: var(--tsc-red); }

/* Kickette (petit libellé rouge au-dessus des titres) */
.tsc-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--tsc-red);
  margin-bottom: .6rem;
}
.tsc-kicker::before {
  content: "";
  width: 26px; height: 3px;
  background: linear-gradient(90deg, var(--tsc-red), var(--tsc-blue));
  border-radius: 3px;
}
.tsc-kicker.is-center { justify-content: center; }
.tsc-kicker.is-center::after {
  content: "";
  width: 26px; height: 3px;
  background: linear-gradient(90deg, var(--tsc-blue), var(--tsc-red));
  border-radius: 3px;
}

/* Motif logo : double barre diagonale (écho TSC) */
.tsc-motif {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}
.tsc-motif span {
  width: 6px; height: 22px;
  border-radius: 3px;
  transform: skewX(-18deg);
}
.tsc-motif span:nth-child(1) { background: var(--tsc-blue); }
.tsc-motif span:nth-child(2) { background: var(--tsc-red); }
.tsc-motif span:nth-child(3) { background: var(--tsc-blue-soft); height: 15px; }

/* ============ Header ============ */
.is-style-header-fixed {
  background: rgba(255,255,255,.86);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--tsc-line);
}
.wp-block-site-logo img {
  border-radius: var(--tsc-radius-sm);
  height: auto !important;
}
/* lien nav actif */
.wp-block-navigation a { font-weight: 600; }
.wp-block-navigation a:hover { color: var(--tsc-red) !important; }
.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .current_page_item > a { color: var(--tsc-red) !important; }

/* ============ Boutons ============ */
.wp-block-button__link {
  border-radius: 999px !important;
  padding: .95rem 2rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  border: none !important;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease !important;
}
.wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px -10px rgba(12, 54, 120, .45);
}
/* CTA primaire rouge */
.wp-block-button.is-style-fill .wp-block-button__link,
.tsc-btn-red .wp-block-button__link,
a.tsc-cta {
  background: var(--tsc-red) !important;
  color: #fff !important;
}
.wp-block-button.is-style-fill .wp-block-button__link:hover,
a.tsc-cta:hover { background: var(--tsc-red-deep) !important; }

/* ============ Images ============ */
.wp-block-image img,
.wp-block-cover,
figure.wp-block-image {
  border-radius: var(--tsc-radius-lg);
  overflow: hidden;
}
.wp-block-image img {
  box-shadow: var(--tsc-shadow-soft);
}

/* ============ Cartes / colonnes ============ */
.wp-block-column {
  border-radius: var(--tsc-radius-lg);
}
.tsc-card {
  border-radius: var(--tsc-radius-lg);
  background: var(--tsc-white);
  border: 1px solid var(--tsc-line);
  box-shadow: var(--tsc-shadow-soft);
  padding: 2rem;
  overflow: hidden;
  transition: transform .28s ease, box-shadow .28s ease;
}
/* image pleine-largeur en haut de carte */
.tsc-card > .wp-block-image { margin: 0; }
.tsc-card > .wp-block-image img { border-radius: 0; box-shadow: none; }
.tsc-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--tsc-shadow);
}
/* carte avec bande d'accent supérieure (écho logo) */
.tsc-card-accent {
  position: relative;
  overflow: hidden;
}
.tsc-card-accent::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--tsc-blue) 0%, var(--tsc-blue) 55%, var(--tsc-red) 55%, var(--tsc-red) 100%);
}

/* ============ Sections courbes / chevauchements ============ */
.tsc-curve-top    { border-radius: 56px 56px 0 0 !important; }
.tsc-curve-bottom { border-radius: 0 0 56px 56px !important; }
.tsc-curve-both   { border-radius: 56px !important; }
.tsc-overlap-up   { margin-top: -56px; position: relative; z-index: 2; }
.tsc-overlap-down { margin-bottom: -56px; position: relative; z-index: 2; }
.tsc-band {
  background: var(--tsc-blue);
  color: #fff;
  border-radius: var(--tsc-radius-lg);
  overflow: hidden;
}
.tsc-band p, .tsc-band h2, .tsc-band h3 { color: #fff; }

/* séparateur vague (SVG inline placé entre sections) */
.tsc-wave {
  display: block;
  width: 100%;
  height: 90px;
  line-height: 0;
}
.tsc-wave svg { width: 100%; height: 90px; }

/* ============ Cover / héro ============ */
.wp-block-cover {
  border-radius: 0 0 56px 56px;
}
.wp-block-cover .wp-block-cover__inner-container {
  width: min(1140px, 92%);
}

/* ============ Footer ============ */
footer, .wp-block-template-part footer {
  background: var(--tsc-blue) !important;
  color: #fff !important;
}
footer a, .wp-block-template-part footer a { color: #fff !important; }
footer a:hover, .wp-block-template-part footer a:hover { color: #ffb3b3 !important; }

/* ============ Barre d'actions flottante ============ */
.tsc-fab {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9999;
  display: flex;
  gap: 10px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--tsc-line);
  box-shadow: 0 -10px 30px -12px rgba(12,54,120,.22);
}
.tsc-fab a {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: .85rem .5rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .95rem;
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease;
}
.tsc-fab a:active { transform: scale(.97); }
.tsc-fab .fab-call  { background: var(--tsc-blue); color: #fff; }
.tsc-fab .fab-wa    { background: #25D366; color: #fff; }
.tsc-fab .fab-quote { background: var(--tsc-red); color: #fff; }
.tsc-fab svg { width: 18px; height: 18px; flex: none; }

/* Sur desktop : masquer la barre flottante (le header porte les CTA) */
@media (min-width: 782px) {
  .tsc-fab { display: none; }
}
/* Laisse un espace bas sur mobile pour ne pas masquer le contenu */
@media (max-width: 781px) {
  body { padding-bottom: 76px; }
  h1 { font-size: 2rem !important; }
  h2 { font-size: 1.6rem !important; }
  .wp-block-cover { border-radius: 0 0 34px 34px; }
  .tsc-curve-top, .tsc-curve-bottom, .tsc-curve-both { border-radius: 34px !important; }
}

/* ============ Animations discrètes ============ */
@keyframes tscFadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}
.tsc-anim { animation: tscFadeUp .7s ease both; }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}
