/*
Theme Name: Astra Child - Les Petits Zounous Eveilles
Description: Theme enfant d'Astra. Charte graphique, composants reutilisables et redirections. Ne pas modifier le theme parent.
Author: Codexcia
Template: astra
Version: 1.1.0
Text Domain: astra-child
*/

/* ============ 1. JETONS DE DESIGN ============ */
:root{
  --z-rouge:#D92D20; --z-rouge-fonce:#B8241A; --z-rouge-vif:#FC3C3C;
  --z-vert:#4F7A1A; --z-menthe:#3CB484; --z-bleu:#0C54B4;
  --z-jaune:#FFD43C; --z-orange:#E8833C;
  --z-creme:#FFF6F0; --z-rose:#FCE0E4; --z-blanc:#FFFFFF;
  --z-texte:#33302E; --z-texte-clair:#6B6560;
  --z-rayon:18px; --z-pilule:999px;
  --z-ombre:0 6px 24px rgba(51,48,46,.10);
  --z-ombre-forte:0 12px 32px rgba(51,48,46,.15);
}
body{color:var(--z-texte);}

/* ============ 2. TITRES ============ */
.z-surtitre{display:inline-block;font-family:'Nunito',sans-serif;font-weight:700;
  font-size:.8rem;letter-spacing:.09em;text-transform:uppercase;color:var(--z-rouge);
  background:var(--z-blanc);border:2px solid var(--z-rose);padding:6px 16px;
  border-radius:var(--z-pilule);}
.z-surtitre .elementor-heading-title{font:inherit;color:inherit;}
.z-titre{font-family:'Fredoka',sans-serif;font-weight:600;line-height:1.2;letter-spacing:-.01em;}

/* ============ 3. BOUTONS ============ */
.elementor-button,.ast-button,.wp-block-button__link,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.wpforms-submit{
  font-family:'Nunito',sans-serif !important;font-weight:700 !important;
  border-radius:var(--z-pilule) !important;min-height:48px;
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none !important;transition:background-color .15s,transform .15s,box-shadow .15s;}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.wpforms-submit,.ast-button,.wp-block-button__link{
  background-color:var(--z-rouge) !important;color:var(--z-blanc) !important;
  border:2px solid var(--z-rouge) !important;padding:15px 32px !important;}
.woocommerce a.button:hover,.woocommerce button.button:hover,.wpforms-submit:hover,
.ast-button:hover,.wp-block-button__link:hover{
  background-color:var(--z-rouge-fonce) !important;border-color:var(--z-rouge-fonce) !important;}
.elementor-button:hover{transform:translateY(-2px);box-shadow:var(--z-ombre-forte);}

/* ============ 4. HEROS ============ */
.z-hero{position:relative;isolation:isolate;overflow:hidden;}
.z-hero::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,246,240,.98) 0%,rgba(255,246,240,.96) 34%,
    rgba(255,246,240,.80) 50%,rgba(255,246,240,.30) 74%,rgba(255,246,240,0) 100%);}
.z-hero > .e-con-inner,.z-hero > .elementor-element{position:relative;z-index:1;}
.z-hero__texte{max-width:600px;}

/* ============ 5. CARTES ============ */
.z-carte{display:flex;flex-direction:column;align-self:stretch;
  transition:transform .2s,box-shadow .2s;}
.z-carte:hover{transform:translateY(-4px);box-shadow:var(--z-ombre-forte) !important;}
.z-carte .elementor-widget-image img{width:100%;height:190px;object-fit:cover;border-radius:12px;}
.z-carte .elementor-widget-button{margin-top:auto;padding-top:8px;}
.z-carte__age{display:inline-block;background:var(--z-jaune);color:var(--z-texte);
  font-family:'Nunito',sans-serif;font-weight:700;font-size:.8rem;
  padding:4px 12px;border-radius:var(--z-pilule);}
.z-etape__num{display:flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:50%;background:var(--z-jaune);color:var(--z-texte);
  font-family:'Fredoka',sans-serif;font-weight:600;font-size:1.5rem;line-height:1;}

/* ============ 6. LISTES, FORMULAIRES, BOUTIQUE ============ */
.elementor-icon-list-icon i{color:var(--z-vert);}
.wpforms-container .wpforms-field-label{font-family:'Nunito',sans-serif;font-weight:700;color:var(--z-texte);}
.wpforms-container input[type=text],.wpforms-container input[type=email],
.wpforms-container input[type=tel],.wpforms-container textarea,.wpforms-container select{
  border:2px solid var(--z-rose) !important;border-radius:12px !important;
  padding:12px 14px !important;font-family:'Nunito',sans-serif !important;}
.wpforms-container input:focus,.wpforms-container textarea:focus{border-color:var(--z-rouge) !important;}
.woocommerce ul.products li.product .price{color:var(--z-rouge);font-weight:700;}
.woocommerce span.onsale{background:var(--z-vert);border-radius:var(--z-pilule);}
.woocommerce ul.products li.product a img{border-radius:var(--z-rayon);}

/* ============ 7. EN-TETE ET PIED DE PAGE ============ */
.site-header{box-shadow:0 2px 12px rgba(51,48,46,.06);}
.main-header-menu > .menu-item > .menu-link{font-family:'Nunito',sans-serif;font-weight:700;}
.site-footer h4,.site-footer .wp-block-heading{font-family:'Fredoka',sans-serif;color:var(--z-texte);}
.site-footer ul.wp-block-list{list-style:none;margin-left:0;padding-left:0;}
.site-footer ul.wp-block-list li{margin-bottom:8px;}

/* ============ 8. ACCESSIBILITE ============ */
a:focus-visible,button:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible,.elementor-button:focus-visible{
  outline:3px solid var(--z-bleu);outline-offset:3px;border-radius:4px;}


/* ============ 10. PANNEAU DU HEROS ============ */
/* L image de marque porte deja du texte : on pose le discours sur un panneau opaque */
.z-hero__texte{background:rgba(255,255,255,.94);border-radius:var(--z-rayon);
  padding:34px 36px;box-shadow:var(--z-ombre);backdrop-filter:blur(2px);}
@media (max-width:767px){.z-hero__texte{padding:24px 20px;}}


/* ============ 11. ECHELLE TYPOGRAPHIQUE ============ */
/* Le corps de texte est pilote par Astra : 18px bureau, 17px tablette et mobile. */
/* Titres des encadres de reassurance : ils etaient identiques a leur description. */
.elementor-icon-box-title,.elementor-icon-box-title span{
  font-family:'Fredoka',sans-serif !important;font-weight:600 !important;
  font-size:20px !important;line-height:1.3 !important;color:var(--z-texte);
  margin-bottom:6px !important;}
.elementor-icon-box-description{font-size:16px;line-height:1.6;color:var(--z-texte-clair);}
/* Intertitre du heros, plus genereux */
.z-hero__texte .elementor-widget-text-editor{font-size:19px;line-height:1.65;}
/* Etiquettes : surtitre et pastille d age */
.z-surtitre{font-size:14px;}
.z-carte__age{font-size:14px;}
/* Cartes et listes */
.z-carte .elementor-widget-text-editor{font-size:17px;line-height:1.65;color:var(--z-texte-clair);}
.elementor-icon-list-text{font-size:17px;}
/* FAQ : les questions doivent se lire comme des questions */
.elementor-accordion .elementor-tab-title{font-family:'Fredoka',sans-serif !important;
  font-size:19px !important;font-weight:600 !important;line-height:1.4 !important;padding:18px 20px !important;}
.elementor-accordion .elementor-tab-content{font-size:17px;line-height:1.7;}
/* Boutons */
.elementor-button,.ast-button,.wpforms-submit{font-size:17px !important;}
@media (max-width:767px){
  .elementor-icon-box-title,.elementor-icon-box-title span{font-size:19px !important;}
  .z-hero__texte .elementor-widget-text-editor{font-size:17px;}
  .elementor-accordion .elementor-tab-title{font-size:18px !important;}
}

/* ============ 9. RESPONSIVE ============ */
@media (max-width:1100px){
  .z-hero::before{background:rgba(255,246,240,.94);}
  .z-hero__texte{max-width:none;}
}
@media (max-width:767px){
  .z-carte .elementor-widget-image img{height:160px;}
  .elementor-button{width:100%;}
}