/*
Theme Name: Cabanelle
Theme URI: https://cabanelle.fr
Description: Thème Cabanelle — chambre d'enfant, textile et éveil. Enfant d'Astra.
Author: Cabanelle
Template: astra
Version: 1.0.0
Text Domain: cabanelle
*/

/* ============================================================
   1. TOKENS — palette et typo distinctes de Patiora (anti-footprint)
   ============================================================ */
:root{
  --cb-ground:#FBF8F3;
  --cb-surface:#FFFFFF;
  --cb-warm:#F2EBE0;
  --cb-ink:#2A2E33;
  --cb-ink-2:#565C64;
  --cb-muted:#878D95;
  --cb-line:#E4DCD0;
  --cb-primary:#46586B;
  --cb-primary-2:#5D7387;
  --cb-primary-soft:#E3E9EF;
  --cb-accent:#C9973F;
  --cb-accent-soft:#F6ECD8;
  --cb-alert:#A85842;

  --cb-serif:"Petrona",Georgia,serif;
  --cb-sans:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --cb-max:1220px;
  --cb-gut:clamp(1rem,3vw,2.4rem);
  --cb-radius:10px;
}

/* ============================================================
   2. BASE
   ============================================================ */
body{
  background:var(--cb-ground);color:var(--cb-ink);
  font-family:var(--cb-sans);font-size:16.5px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.entry-title,.woocommerce-loop-product__title,.product_title{
  font-family:var(--cb-serif);font-weight:600;color:var(--cb-ink);
  text-wrap:balance;letter-spacing:-.005em;
}
h1{font-size:clamp(2rem,4.2vw,2.9rem);line-height:1.14}
h2{font-size:clamp(1.45rem,2.8vw,2rem);line-height:1.2}
h3{font-size:1.18rem;line-height:1.3}
a{color:var(--cb-primary);text-underline-offset:.16em}
a:hover{color:var(--cb-accent)}
:focus-visible{outline:2px solid var(--cb-primary);outline-offset:3px}

.cb-wrap{max-width:var(--cb-max);margin-inline:auto;padding-inline:var(--cb-gut)}
.cb-kicker{
  font-size:.75rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--cb-accent);font-weight:700;
}

/* Boutons — arrondis doux, à l'opposé des angles nets de Patiora */
.cb-btn,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce a.button.alt,.woocommerce button.button.alt{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:var(--cb-primary);color:#fff;
  font-family:var(--cb-sans);font-weight:700;font-size:.93rem;
  padding:.8rem 1.5rem;border:0;border-radius:999px;
  text-decoration:none;line-height:1.2;cursor:pointer;
  transition:background .18s ease,transform .18s ease;
}
.cb-btn:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{
  background:#3A4A5A;color:#fff;transform:translateY(-1px);
}
.cb-btn--soft{background:var(--cb-accent-soft);color:var(--cb-ink)}
.cb-btn--soft:hover{background:#EFE0C4;color:var(--cb-ink)}

/* ============================================================
   3. HEADER — logo centré, structure différente de Patiora
   ============================================================ */
.cb-announce{
  background:var(--cb-warm);color:var(--cb-ink-2);
  font-size:.8rem;text-align:center;padding:.55rem 1rem;
}
.cb-header{background:var(--cb-surface);border-bottom:1px solid var(--cb-line)}
.cb-header__inner{
  max-width:var(--cb-max);margin-inline:auto;padding:1.3rem var(--cb-gut) 1rem;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;
}
.cb-header__left,.cb-header__right{display:flex;align-items:center;gap:1.1rem;font-size:.88rem}
.cb-header__right{justify-content:flex-end}
.cb-header a{color:var(--cb-ink-2);text-decoration:none}
.cb-header a:hover{color:var(--cb-primary)}
.cb-logo{justify-self:center;display:block;text-decoration:none}
.cb-logo img{height:2.7rem;width:auto;display:block}
.cb-logo span{
  font-family:var(--cb-serif);font-size:1.7rem;font-weight:600;color:var(--cb-ink);
}
.cb-nav{background:var(--cb-surface);border-bottom:1px solid var(--cb-line)}
.cb-nav__inner{
  max-width:var(--cb-max);margin-inline:auto;padding:0 var(--cb-gut);
  display:flex;justify-content:center;gap:.3rem;flex-wrap:wrap;
}
.cb-nav a{
  padding:.8rem 1.05rem;font-size:.92rem;font-weight:600;
  color:var(--cb-ink);text-decoration:none;border-radius:999px;
}
.cb-nav a:hover{background:var(--cb-primary-soft);color:var(--cb-primary)}
.cb-nav a.is-mag{color:var(--cb-accent)}

/* ============================================================
   4. HERO — split éditorial, pas de bandeau pleine largeur
   ============================================================ */
.cb-hero{padding:clamp(2.4rem,5vw,4rem) 0}
.cb-hero__inner{
  max-width:var(--cb-max);margin-inline:auto;padding-inline:var(--cb-gut);
  display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(1.5rem,4vw,3.5rem);
  align-items:center;
}
.cb-hero__media{
  border-radius:var(--cb-radius);overflow:hidden;background:var(--cb-warm);
  aspect-ratio:4/3;
}
.cb-hero__media img{width:100%;height:100%;object-fit:cover;display:block}
.cb-hero h1{margin:.7rem 0 1rem}
.cb-hero p{color:var(--cb-ink-2);font-size:1.06rem;margin:0 0 1.6rem;max-width:32rem}

/* ============================================================
   5. RAYONS — cartes en grille éditoriale
   ============================================================ */
.cb-section{padding:clamp(2.6rem,5vw,4.2rem) 0}
.cb-section--warm{background:var(--cb-warm)}
.cb-section__head{
  max-width:var(--cb-max);margin:0 auto clamp(1.4rem,3vw,2.2rem);
  padding-inline:var(--cb-gut);
}
.cb-section__head p{color:var(--cb-ink-2);max-width:38rem;margin:.55rem 0 0}
.cb-grid{
  max-width:var(--cb-max);margin-inline:auto;padding-inline:var(--cb-gut);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1.4rem;
}
.cb-card{
  background:var(--cb-surface);border:1px solid var(--cb-line);
  border-radius:var(--cb-radius);overflow:hidden;text-decoration:none;
  display:flex;flex-direction:column;
  transition:transform .2s ease,box-shadow .2s ease;
}
.cb-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(42,46,51,.07)}
.cb-card__media{aspect-ratio:1/1;background:var(--cb-accent-soft);overflow:hidden}
.cb-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.cb-card__body{padding:1rem 1.1rem 1.3rem}
.cb-card__body h3{margin:0 0 .3rem;font-size:1.08rem}
.cb-card__body p{margin:0;font-size:.88rem;color:var(--cb-muted);line-height:1.5}

/* ============================================================
   6. WOOCOMMERCE
   ============================================================ */
.woocommerce ul.products li.product{
  background:var(--cb-surface);border:1px solid var(--cb-line);
  border-radius:var(--cb-radius);padding:0 0 1.1rem;text-align:left;overflow:hidden;
}
.woocommerce ul.products li.product a img{margin-bottom:.85rem}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1rem;padding:0 1rem;margin-bottom:.3rem;
}
.woocommerce ul.products li.product .price{
  padding:0 1rem;color:var(--cb-ink);font-family:var(--cb-sans);font-weight:700;
}
.woocommerce span.onsale{
  background:var(--cb-accent);color:#fff;border-radius:999px;
  font-family:var(--cb-sans);font-weight:700;font-size:.74rem;
  min-height:0;min-width:0;padding:.28rem .7rem;line-height:1.2;
}
.woocommerce div.product p.price{color:var(--cb-ink);font-weight:700;font-size:1.45rem}

.cb-help{
  border:1px solid var(--cb-line);background:var(--cb-accent-soft);
  border-radius:var(--cb-radius);padding:1.05rem 1.15rem;margin:1.3rem 0;
}
.cb-help h4{margin:0 0 .45rem;font-family:var(--cb-sans);font-size:.94rem;font-weight:700}
.cb-help ul{margin:0;padding-left:1.1rem;font-size:.9rem;color:var(--cb-ink-2)}

/* ============================================================
   7. MAGAZINE
   ============================================================ */
.cb-mag-hero{
  background:var(--cb-primary-soft);
  padding:clamp(2.4rem,5vw,3.6rem) 0;
}
.cb-mag-hero .cb-wrap{max-width:46rem}
.entry-content{font-size:1.05rem;line-height:1.72}
.entry-content p{margin-bottom:1.15rem}
.entry-content h1,.entry-content h2,.entry-content h3,.wp-block-heading{
  font-family:var(--cb-serif)!important;font-weight:600;color:var(--cb-ink);
}
.entry-content h2{font-size:clamp(1.35rem,2.5vw,1.8rem);margin:2.2rem 0 .7rem}
.entry-content h3{font-size:1.16rem;margin:1.7rem 0 .5rem}
.page .entry-content,.single .entry-content{max-width:44rem}

/* ============================================================
   8. FOOTER
   ============================================================ */
.cb-footer{background:var(--cb-primary);color:#D9E1E9;font-size:.89rem}
.cb-footer__inner{
  max-width:var(--cb-max);margin-inline:auto;padding:3rem var(--cb-gut) 1.4rem;
  display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:2rem;
}
.cb-footer h4{
  color:#fff;font-family:var(--cb-sans);font-size:.79rem;letter-spacing:.12em;
  text-transform:uppercase;margin:0 0 .85rem;font-weight:700;
}
.cb-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.cb-footer a{color:#D9E1E9;text-decoration:none}
.cb-footer a:hover{color:#fff;text-decoration:underline}
.cb-footer__brand p{margin:.8rem 0 0;color:#AEBAC6;max-width:22rem;line-height:1.6}
.cb-footer__legal{
  max-width:var(--cb-max);margin-inline:auto;padding:1.1rem var(--cb-gut) 2.4rem;
  border-top:1px solid #56697C;color:#A4B1BE;font-size:.81rem;
  display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;
}

/* ============================================================
   9. NEUTRALISATION ASTRA (cf gotcha : .ast-container en flex)
   ============================================================ */
.cabanelle-fullwidth .site-content > .ast-container{
  display:block;max-width:none;width:100%;padding:0;margin:0;
}
.cabanelle-fullwidth #primary,
.cabanelle-fullwidth .content-area,
.cabanelle-fullwidth .site-main{width:100%;max-width:none;margin:0;padding:0;float:none}
.cabanelle-fullwidth .ast-separate-container .ast-article-single,
.cabanelle-fullwidth .ast-separate-container .ast-article-post,
.cabanelle-fullwidth .ast-separate-container .site-main{background:transparent;padding:0;border:0;margin:0}
.cabanelle-fullwidth .entry-header,
.cabanelle-fullwidth .ast-single-post-order,
.cabanelle-fullwidth #secondary{display:none}
.cabanelle-fullwidth .site-content{padding:0}
.site-footer,.ast-primary-header-bar,.main-header-bar{display:none!important}

/* ============================================================
   10. RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .cb-hero__inner{grid-template-columns:1fr}
  .cb-footer__inner{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .cb-header__inner{grid-template-columns:1fr;justify-items:center;gap:.7rem}
  .cb-header__left,.cb-header__right{justify-content:center}
  .cb-nav__inner{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start}
  .cb-nav a{white-space:nowrap}
  .cb-footer__inner{grid-template-columns:1fr}
}

/* Icônes de repli dans les vignettes : sans contrainte, le SVG occupe
   toute la zone média et écrase la composition. */
.cb-card__media{display:flex;align-items:center;justify-content:center}
.cb-card__media svg{
  width:34%;height:34%;color:var(--cb-primary);
  stroke:currentColor;fill:none;
}
.cb-hero__media{display:flex;align-items:center;justify-content:center}
.cb-hero__media svg{width:26%;height:26%;color:var(--cb-primary)}
