/*
Theme Name: Supertrainers
Theme URI: https://www.supertrainers.fr
Author: Marin — Supertrainers
Description: Thème block (FSE) Supertrainers — science du sport, design clair et actionnable. Design system encodé dans theme.json. Direction visuelle bleu / charbon / jaune / lavande / pêche.
Version: 0.1.0
Requires at least: 6.6
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: supertrainers
*/

/* ============================================================
   Composants réutilisables (utilisés dans les patterns / blocs)
   Les tokens viennent de theme.json -> variables --wp--preset--*
   ============================================================ */

:root{
  --st-blue: var(--wp--preset--color--blue);
  --st-blue-deep: var(--wp--preset--color--blue-deep);
  --st-blue-soft: var(--wp--preset--color--blue-soft);
  --st-charcoal: var(--wp--preset--color--charcoal);
  --st-ink: var(--wp--preset--color--ink);
  --st-cream: var(--wp--preset--color--cream);
  --st-yellow: var(--wp--preset--color--yellow);
  --st-yellow-deep: var(--wp--preset--color--yellow-deep);
  --st-lavender: var(--wp--preset--color--lavender);
  --st-peach: var(--wp--preset--color--peach);
  --st-border: var(--wp--preset--color--border);
}

body{ -webkit-font-smoothing: antialiased; }

/* Eyebrow (suréglage de section) */
.st-eyebrow{
  font-family: var(--wp--preset--font-family--jetbrains);
  font-size: .72rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--st-blue-deep); display: inline-flex; align-items: center; gap: .5rem;
}
.st-eyebrow::before{ content:""; width:22px; height:2px; background: var(--st-blue); border-radius:2px; }

/* Surligneur jaune sur un mot de titre */
.st-mark{ position:relative; white-space:nowrap; }
.st-mark::after{
  content:""; position:absolute; left:-2%; bottom:.06em; width:104%; height:.32em;
  background: var(--st-yellow); z-index:-1; border-radius:3px;
}

/* Boutons secondaires (le bouton primaire est géré par theme.json) */
.wp-block-button.is-style-st-yellow .wp-block-button__link{
  background: var(--st-yellow); color: var(--st-charcoal);
}
.wp-block-button.is-style-st-ghost .wp-block-button__link{
  background:#fff; color: var(--st-charcoal); border:1.5px solid var(--st-charcoal);
}
.wp-block-button.is-style-st-ghost .wp-block-button__link:hover{
  background: var(--st-charcoal); color:#fff;
}

/* Carte (univers, articles, produits) */
.st-card{
  background: var(--st-cream); border:1px solid var(--st-border); border-radius:22px;
  padding:26px; transition:.25s ease;
}
.st-card:hover{ transform: translateY(-6px); box-shadow:0 26px 44px -30px rgba(38,36,48,.4); }

/* Pastille d'icône colorée */
.st-ico{ width:54px; height:54px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.st-ico.is-blue{ background: var(--st-blue-soft); }
.st-ico.is-yellow{ background:#FEF1CC; }
.st-ico.is-lavender{ background:#ECECF6; }
.st-ico.is-peach{ background:#F8E6DB; }

/* Ruban défilant (réassurance) */
.st-ticker{ background: var(--st-charcoal); color:#fff; padding:14px 0; overflow:hidden; }

/* Section sombre arrondie (newsletter / destination) */
.st-band{ border-radius:30px; overflow:hidden; }