/*
Theme Name: Cap Vitrage
Description: Thème enfant de Kadence pour Cap Vitrage — plateforme de formation au métier du pare-brise.
Author: O'concept-e
Template: kadence
Version: 1.0.0
Text Domain: cap-vitrage
*/
 
/* ==========================================================================
   1. Palette Cap Vitrage — relevée dans le logo
   ========================================================================== */
:root {
--global-palette1: #0A82B0; /* bleu vitrage — boutons, liens */
--global-palette2: #065A7C; /* bleu foncé — survol */
--global-palette3: #072236; /* bleu nuit — titres */
--global-palette4: #2C4658; /* texte courant */
--global-palette5: #5B7488; /* texte secondaire */
--global-palette6: #D6E1E8; /* bordures */
--global-palette7: #F2F6F8; /* fond clair */
--global-palette8: #FFFFFF;
--global-palette9: #FFFFFF;
 
--cv-nuit: #072236;
--cv-bleu: #0A82B0;
--cv-bleu-fonce: #065A7C;
--cv-gris: #F2F6F8;
--cv-ambre: #9A5B12;
--cv-ambre-fond: #FBEEDC;
 
--global-body-font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
--global-heading-font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
}
 
/* ==========================================================================
   2. Typographie
   ========================================================================== */
body {
font-family: var(--global-body-font-family);
font-size: 17px;
line-height: 1.65;
color: var(--global-palette4);
}
 
h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title {
font-family: var(--global-heading-font-family);
color: var(--global-palette3);
letter-spacing: -0.02em;
text-wrap: balance;
}
 
h1 { font-weight: 700; line-height: 1.1; }
h2 { font-weight: 700; line-height: 1.15; }
h3 { font-weight: 600; line-height: 1.25; }
 
/* ==========================================================================
   3. Boutons
   ========================================================================== */
.wp-block-button__link,
.button,
input[type="submit"],
.kb-button {
font-family: var(--global-heading-font-family);
font-weight: 600;
letter-spacing: 0.01em;
border-radius: 8px;
}
 
/* ==========================================================================
   4. Mentions « à confirmer » — jamais décoratif, uniquement informatif
   ========================================================================== */
.cv-a-confirmer {
display: inline-block;
background: var(--cv-ambre-fond);
color: var(--cv-ambre);
font-size: 0.85em;
font-weight: 500;
padding: 2px 10px;
border-radius: 4px;
}
 
/* ==========================================================================
   5. Mention légale des tarifs — obligatoire à côté de chaque prix
   ========================================================================== */
.cv-mention-tarif {
display: block;
font-size: 0.85em;
color: var(--global-palette5);
margin-top: 4px;
line-height: 1.4;
}
 
/* ==========================================================================
   6. Accessibilité
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
outline: 3px solid var(--cv-bleu);
outline-offset: 2px;
}
 
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
}
}
 
/* ==========================================================================
   7. Cartes de formation
   ========================================================================== */
.cv-carte {
background: var(--global-palette8);
border: 1px solid var(--global-palette6);
border-radius: 12px;
padding: 28px 24px;
height: 100%;
display: flex;
flex-direction: column;
box-shadow: 0 1px 2px rgba(7,34,54,.05), 0 12px 28px -18px rgba(7,34,54,.25);
}
.cv-carte h3 { margin-top: 0; }
.cv-carte .cv-modalites {
font-size: .92rem;
color: var(--global-palette5);
border-top: 1px solid var(--global-palette6);
padding-top: 14px;
margin-top: auto;
}
.cv-prix {
font-family: var(--global-heading-font-family);
font-size: 1.75rem;
font-weight: 700;
color: var(--cv-nuit);
letter-spacing: -.02em;
display: block;
margin-top: 14px;
}
.wp-block-columns .wp-block-column { display: flex; }
.wp-block-columns .wp-block-column > .wp-block-group { width: 100%; }
 
/* ==========================================================================
   8. Étapes numérotées
   ========================================================================== */
.cv-etapes { counter-reset: cvetape; list-style: none; padding-left: 0; }
.cv-etapes li {
counter-increment: cvetape;
position: relative;
padding-left: 56px;
margin-bottom: 22px;
}
.cv-etapes li::before {
content: counter(cvetape);
position: absolute;
left: 0; top: 0;
width: 38px; height: 38px;
border-radius: 50%;
background: var(--cv-bleu);
color: #fff;
font-family: var(--global-heading-font-family);
font-weight: 700;
display: flex; align-items: center; justify-content: center;
}
 
/* ==========================================================================
   9. Barre fixe mobile
   ========================================================================== */
.cv-barre-mobile { display: none; }
@media (max-width: 900px) {
.cv-barre-mobile {
display: grid;
grid-template-columns: 1fr 1.4fr 1fr;
gap: 6px;
position: fixed;
left: 0; right: 0; bottom: 0;
z-index: 9999;
background: var(--cv-nuit);
padding: 8px;
padding-bottom: calc(8px + env(safe-area-inset-bottom));
box-shadow: 0 -4px 16px rgba(7,34,54,.28);
}
.cv-barre-mobile a {
display: flex; align-items: center; justify-content: center;
gap: 6px;
min-height: 46px;
border-radius: 8px;
font-family: var(--global-heading-font-family);
font-size: .93rem;
font-weight: 600;
text-decoration: none;
color: #fff;
background: rgba(255,255,255,.1);
}
.cv-barre-mobile a.cv-principal { background: var(--cv-bleu); }
.cv-barre-mobile a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
body { padding-bottom: 74px; }
}
 
/* ==========================================================================
   10. Sections
   ========================================================================== */
.cv-section-claire { background: var(--cv-gris); }
.wp-block-table td, .wp-block-table th { padding: 10px 14px; }
.wp-block-table figcaption { font-size: .85rem; color: var(--global-palette5); }
.wp-block-columns .wp-block-column { flex-direction: column; }