/*
Theme Name: Cadence
Theme URI: https://cadence-endurance.com
Author: Cadence (Aurélie Habasque)
Description: Site vitrine de Cadence — l'app d'entraînement d'endurance pensée pour le cheval. Thème sur-mesure, fidèle aux maquettes (handoff design). Vouvoiement sur le site.
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
License: All rights reserved
Text Domain: cadence
*/

/* ============================================================
   TOKENS (charte Cadence — source : handoff design)
   ============================================================ */
:root{
  --creme:#FFF3DF;
  --encre:#173F2A;
  --encre-d:#0D2417;
  --prairie:#2FA85B;
  --soleil:#FFC02E;
  --soleil-d:#D39A00;
  --corail:#FF6F5E;
  --corail-d:#EF5D4C;
  --rouge:#D6452F;
  --txt:#4F6357;       /* texte courant sur fond clair */
  --txt-prose:#3A4842; /* corps d'article */
  --txt-3:#8A9690;     /* métadonnées */
  --serif:'Fraunces',Georgia,serif;
  --ui:'Inter',system-ui,-apple-system,sans-serif;
  --hand:'Caveat',cursive;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--creme);color:var(--encre);font-family:var(--ui);line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;margin:0;}
p{margin:0;}

/* Conteneurs */
.cad-container{max-width:1180px;margin:0 auto;padding:0 40px;}
.cad-container-wide{max-width:1240px;margin:0 auto;padding:0 40px;}

/* Sections */
.cad-section{padding:96px 0;}

/* Eyebrow (sur-titre) */
.cad-eyebrow{font-family:var(--ui);font-size:13px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--prairie);}
.cad-eyebrow--soleil{color:var(--soleil);}
.cad-eyebrow--light{color:var(--soleil);}

/* Signature manuscrite */
.cad-hand{font-family:var(--hand);color:var(--soleil);font-weight:700;}

/* Tracé pointillé animé du héros — largeur de base (fallback sans JS ; le JS anime 0→54px) */
.cad-trace-dots{width:54px;}

/* ============================================================
   BOUTONS
   ============================================================ */
.cad-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--ui);font-weight:600;font-size:16px;
  padding:15px 28px;border-radius:13px;cursor:pointer;border:1.5px solid transparent;transition:background .15s,color .15s,border-color .15s;line-height:1;}
.cad-btn--sm{font-size:15px;padding:11px 20px;border-radius:11px;}
.cad-btn--coral{background:var(--corail);color:#fff;}
.cad-btn--coral:hover{background:var(--corail-d);}
.cad-btn--soleil{background:var(--soleil);color:var(--encre);font-weight:700;}
.cad-btn--soleil:hover{background:#F0B21F;}
.cad-btn--cream{background:var(--creme);color:var(--encre);}
.cad-btn--cream:hover{background:#fff;}
/* outline crème translucide (sur photo / fond sombre) */
.cad-btn--ghost{background:rgba(255,243,223,.14);color:var(--creme);border-color:rgba(255,243,223,.55);backdrop-filter:blur(4px);}
.cad-btn--ghost:hover{background:rgba(255,243,223,.26);}
/* lien-action souligné */
.cad-link{font-family:var(--ui);font-size:16px;font-weight:600;color:var(--prairie);cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.cad-link:hover{color:var(--encre);}

/* ============================================================
   LOGO (reconstitution fidèle aux maquettes : pointillé jaune + fanion corail + mot)
   ============================================================ */
.cad-logo{display:inline-flex;align-items:center;gap:9px;}
.cad-logo__dots{width:40px;height:6px;background-image:radial-gradient(circle,var(--soleil) 2px,transparent 2.3px);background-size:10px 6px;background-repeat:repeat-x;}
.cad-logo__flag{width:0;height:0;border-style:solid;border-width:5px 0 5px 10px;border-color:transparent transparent transparent var(--corail);margin-left:-3px;}
.cad-logo__mark{flex-shrink:0;display:block;}
.cad-logo__word{font-family:var(--serif);font-size:26px;font-weight:600;letter-spacing:.3px;margin-left:2px;color:var(--encre);}
.cad-logo--light .cad-logo__word{color:var(--creme);}

/* ============================================================
   NAVIGATION
   ============================================================ */
.cad-nav{position:relative;z-index:20;}
.cad-nav--solid,.cad-nav--cream{position:sticky;top:0;}
.cad-nav__inner{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px;}
.cad-nav--overlay .cad-nav__inner{padding-top:26px;padding-bottom:26px;}
.cad-nav__links{display:flex;align-items:center;gap:30px;}
.cad-nav__menu{display:flex;gap:26px;font-family:var(--ui);font-size:15px;font-weight:500;}
.cad-nav__menu a{color:var(--encre);opacity:.92;}
.cad-nav__menu a:hover{opacity:1;}
.cad-nav__menu a.is-active{font-weight:700;border-bottom:2px solid var(--prairie);padding-bottom:2px;}
.cad-nav__cta{display:flex;align-items:center;gap:14px;}
/* variante claire (sur photo/hero sombre) */
.cad-nav--overlay .cad-logo__word{color:var(--creme);}
.cad-nav--overlay .cad-nav__menu a{color:rgba(255,243,223,.92);}
.cad-nav--overlay .cad-nav__menu a.is-active{border-bottom-color:var(--soleil);}
.cad-nav--overlay .cad-login{color:var(--creme);background:rgba(255,243,223,.16);border:1.5px solid rgba(255,243,223,.45);}
.cad-nav--overlay .cad-login:hover{background:rgba(255,243,223,.28);}
/* variante solide (fond vert-encre) */
.cad-nav--solid{background:var(--encre);}
.cad-nav--solid .cad-logo__word{color:var(--creme);}
.cad-nav--solid .cad-nav__menu a{color:rgba(255,243,223,.92);}
.cad-nav--solid .cad-nav__menu a.is-active{border-bottom-color:var(--soleil);}
.cad-nav--solid .cad-login{color:var(--creme);background:transparent;border:1.5px solid rgba(255,243,223,.45);}
/* variante crème (fond clair) */
.cad-nav--cream{background:var(--creme);border-bottom:1px solid rgba(23,63,42,.12);}
.cad-login{font-family:var(--ui);font-size:15px;font-weight:600;padding:9px 18px;border-radius:11px;cursor:pointer;border:1.5px solid rgba(23,63,42,.3);color:var(--encre);background:transparent;transition:background .15s;}

/* Burger (mobile) — masqué en desktop */
.cad-burger{display:none;background:none;border:0;cursor:pointer;width:30px;height:24px;position:relative;}
.cad-burger span{display:block;position:absolute;height:2.5px;width:100%;left:0;border-radius:2px;background:var(--encre);transition:.2s;}
.cad-nav--overlay .cad-burger span,.cad-nav--solid .cad-burger span{background:var(--creme);}
.cad-burger span:nth-child(1){top:3px;}
.cad-burger span:nth-child(2){top:11px;}
.cad-burger span:nth-child(3){top:19px;}

/* ============================================================
   ONGLETS "Pour qui"
   ============================================================ */
.cad-tab{font-family:var(--ui);font-weight:600;font-size:15px;padding:11px 24px;border-radius:30px;cursor:pointer;
  transition:all .15s;background:transparent;color:var(--encre);border:1.5px solid rgba(23,63,42,.28);}
.cad-tab.is-active{background:var(--encre);color:var(--creme);border-color:var(--encre);}
.cad-tabpanel{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:40px;}
.cad-tabpanel[hidden]{display:none;}

/* ============================================================
   FOOTER
   ============================================================ */
.cad-footer{background:var(--encre-d);padding:64px 0 36px;}
.cad-footer__top{display:flex;justify-content:space-between;gap:50px;flex-wrap:wrap;}
.cad-footer__brand{max-width:300px;}
.cad-footer__sign{font-family:var(--hand);font-size:24px;color:var(--soleil);margin:16px 0 0;}
.cad-footer__desc{font-family:var(--ui);font-size:14px;line-height:1.6;color:rgba(255,243,223,.6);margin:6px 0 0;}
.cad-footer__cols{display:flex;gap:64px;flex-wrap:wrap;}
.cad-footer__col{display:flex;flex-direction:column;gap:12px;font-family:var(--ui);font-size:14px;}
.cad-footer__col a{color:rgba(255,243,223,.75);}
.cad-footer__col a:hover{color:var(--creme);}
.cad-footer__col-title{font-weight:700;color:var(--creme);margin-bottom:2px;}
.cad-footer__bottom{border-top:1px solid rgba(255,243,223,.13);margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--ui);font-size:13px;color:rgba(255,243,223,.5);}

/* ============================================================
   BLOG — filtres, prose article, sommaire
   ============================================================ */
.cad-filter{font-family:var(--ui);font-size:14px;font-weight:600;color:#173F2A;background:transparent;border:1.5px solid rgba(23,63,42,.25);padding:9px 18px;border-radius:30px;cursor:pointer;text-decoration:none;display:inline-block;white-space:nowrap;}
.cad-filter.is-active{background:#173F2A;color:#FFF3DF;border-color:#173F2A;}
.cad-filter:hover{border-color:rgba(23,63,42,.5);}
.cad-card-article{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 12px 30px -18px rgba(23,63,42,.35);display:block;}
.cad-tag{font-family:var(--ui);font-size:12px;font-weight:700;padding:5px 12px;border-radius:20px;}
.cad-tag-niveau{font-family:var(--ui);font-size:11px;font-weight:600;color:var(--txt-3);border:1px solid rgba(23,63,42,.2);padding:4px 10px;border-radius:20px;}

/* Léger soulèvement au survol des cartes de fonctionnalités/principes */
.cad-feature-card{transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease;}
.cad-feature-card:hover{transform:translateY(-5px);box-shadow:0 22px 40px -24px rgba(23,63,42,.45);}
@media (prefers-reduced-motion:reduce){.cad-feature-card:hover{transform:none;}}

.cad-prose p{font-family:var(--ui);font-size:18px;line-height:1.72;color:var(--txt-prose);margin:20px 0 0;}
.cad-prose h2{font-family:var(--serif);font-size:30px;font-weight:600;color:#173F2A;line-height:1.2;margin:54px 0 0;letter-spacing:-.3px;}
.cad-prose ul,.cad-prose ol{font-family:var(--ui);font-size:18px;line-height:1.72;color:var(--txt-prose);margin:18px 0 0;padding-left:22px;}
.cad-prose li{margin:8px 0 0;}
.cad-prose img{border-radius:14px;}
details>summary{list-style:none;}
details>summary::-webkit-details-marker{display:none;}
.cad-toc a{font-family:var(--ui);font-size:14px;line-height:1.4;color:var(--txt);text-decoration:none;display:block;}
.cad-toc a:hover{color:var(--corail);}

/* FAQ — accordéon */
.cad-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;font-family:var(--ui);font-size:17px;font-weight:600;color:var(--encre);}
.cad-faq-icon{flex-shrink:0;color:var(--prairie);font-size:24px;line-height:1;transition:transform .25s ease;}
.cad-faq-item[open] .cad-faq-icon{transform:rotate(45deg);}
.cad-faq-item p{font-family:var(--ui);font-size:16px;line-height:1.65;color:var(--txt);margin:14px 0 0;}

/* Barre à défilement horizontal (filtres mobile) */
.cad-scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:wrap;}
.cad-scroll-x::-webkit-scrollbar{display:none;}
.cad-nv-filter{transition:outline .12s;}
.cad-nv-filter.is-active{outline:2px solid #173F2A;outline-offset:1px;}

/* ============================================================
   BLOCS CADENCE (articles) — éditables, style porté par le thème
   ============================================================ */
.cad-box{border-radius:18px;padding:28px 30px;margin:34px 0;}
.cad-box__label{font-family:'Inter',sans-serif;font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 14px;}
.cad-box--essentiel{background:#173F2A;color:#FFF3DF;}
.cad-box--essentiel .cad-box__label{color:#FFC02E;}
.cad-box--essentiel ul,.cad-box--essentiel li{color:#FFF3DF;font-size:15.5px;line-height:1.6;}
.cad-box--science{background:rgba(255,192,46,.16);border-left:4px solid #FFC02E;border-radius:0 14px 14px 0;padding:22px 28px;}
.cad-box--science .cad-box__label{color:#b07d00;}
.cad-box--science p:not(.cad-box__label){color:#5b4a1f;font-size:16px;line-height:1.6;margin:0;}
.cad-box--cavaliers{background:rgba(255,111,94,.1);border-left:4px solid #FF6F5E;border-radius:0 14px 14px 0;padding:22px 28px;}
.cad-box--cavaliers .cad-box__label{color:#D6452F;}
.cad-box--cavaliers p:not(.cad-box__label){color:#7a3a30;font-size:16px;line-height:1.6;margin:0;}

/* Encart CTA */
.cad-cta{background:#2FA85B;border-radius:20px;padding:30px 34px;margin:36px 0;}
.cad-cta__title{font-family:'Fraunces',Georgia,serif;font-size:23px;font-weight:600;color:#fff;margin:0;}
.cad-cta__text{font-family:'Inter',sans-serif;font-size:15px;line-height:1.55;color:rgba(255,255,255,.92);margin:8px 0 16px;}
.cad-cta .wp-block-button__link{background:#FFF3DF;color:#173F2A;border-radius:12px;font-weight:700;}

/* Repères chiffrés */
.cad-reperes{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0;}
.cad-repere{flex:1;min-width:150px;background:#fff;border:1px solid rgba(23,63,42,.1);border-radius:14px;padding:22px 24px;}
.cad-repere__num{font-family:'Fraunces',Georgia,serif;font-size:38px;font-weight:600;line-height:1;margin:0;}
.cad-repere__num--green{color:#2FA85B;}
.cad-repere__num--coral{color:#FF6F5E;}
.cad-repere__num--ink{color:#173F2A;}
.cad-repere__cap{font-family:'Inter',sans-serif;font-size:14px;color:#4f6357;margin:6px 0 0;}

/* Étapes numérotées */
.cad-steps2 .cad-step{display:flex;gap:16px;align-items:flex-start;margin-top:16px;}
.cad-step__num{flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#2FA85B;color:#fff;font-family:'Inter',sans-serif;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0;}
.cad-step__txt{font-family:'Inter',sans-serif;font-size:16.5px;line-height:1.6;color:#3a4842;margin:0;padding-top:3px;}

/* FAQ + Sources (blocs Détails) */
.cad-faq2{border-top:1px solid rgba(23,63,42,.15);padding:18px 0;}
.cad-faq2 summary{font-family:'Inter',sans-serif;font-size:17px;font-weight:600;color:#173F2A;cursor:pointer;}
.cad-faq2 p{font-family:'Inter',sans-serif;font-size:16px;line-height:1.65;color:#4f6357;margin:12px 0 0;}
.cad-sources{background:#fff;border:1px solid rgba(23,63,42,.1);border-radius:14px;padding:18px 22px;margin:36px 0;}
.cad-sources summary{font-family:'Inter',sans-serif;font-size:13px;font-weight:600;color:#8a9690;text-transform:uppercase;letter-spacing:1px;cursor:pointer;}
.cad-sources p{font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.6;color:#8a9690;margin:12px 0 0;}

/* ============================================================
   RESPONSIVE (base — les maquettes mobile détaillées viendront affiner)
   ============================================================ */
@media (max-width:860px){
  .cad-container,.cad-container-wide{padding:0 22px;}
  .cad-section{padding:64px 0;}
  .cad-burger{display:block;}
  .cad-nav__inner{position:relative;}
  .cad-nav__links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:18px;background:var(--creme);border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 18px 30px -20px rgba(23,63,42,.4);padding:22px;}
  .cad-nav__links.is-open{display:flex;}
  .cad-nav__menu{flex-direction:column;align-items:flex-start;gap:16px;}
  .cad-nav__menu a{color:#173F2A !important;opacity:1;font-size:17px;border-bottom:0 !important;}
  .cad-nav__menu a.is-active{color:#258049 !important;}
  .cad-nav__cta{flex-direction:column;align-items:stretch;gap:10px;}
  .cad-nav__cta .cad-login{display:block;text-align:center;color:#173F2A;border-color:rgba(23,63,42,.3);background:#fff;}
  .cad-nav__cta .cad-btn--coral{justify-content:center;}
  .cad-grid-4,.cad-grid-3,.cad-grid-2,.cad-tabpanel,.cad-nv-grid{grid-template-columns:1fr !important;}
  .cad-article-grid{grid-template-columns:1fr !important;}
  .cad-article-aside{display:none !important;}
  h1{font-size:42px !important;}
  h2{font-size:32px !important;}
}
