/* ===================================================================
   LAPPSHIELD — feuille de style du site
   Le header et le pied de page sont maintenant des parties de gabarit
   (Apparence > Éditeur). Ils s'affichent sur toutes les pages.
   =================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&family=Inter:wght@300;400;500&display=swap');

:root{
  --lapp-ivoire:#F8F3E9;
  --lapp-blanc:#FFFFFF;
  --lapp-or:#B08A3D;
  --lapp-texte:#2B2A25;
  --lapp-gris:#6E6A5C;
  --lapp-head:72px;
  --lapp-bar:0px;
  --lapp-logo:url('https://lappshield.com/wp-content/uploads/2026/08/8cde7750-LappShieldlogogold4Ktransparent.png');
  --lapp-hero:radial-gradient(120% 90% at 50% 8%, rgba(196,178,132,.30) 0%, rgba(58,58,46,0) 62%),
              linear-gradient(168deg, #4A4B3C 0%, #3A3A2E 46%, #262620 100%);
}
body.admin-bar{ --lapp-bar:32px; }
@media (max-width:782px){ body.admin-bar{ --lapp-bar:46px; } }

/* ---------- Reset des conteneurs ---------- */
html:root{ margin:0 !important; padding:0 !important; overflow-x:hidden; }
body{
  margin:0 !important; padding:0 !important; overflow-x:hidden;
  background:var(--lapp-ivoire);
  font-family:'Inter',sans-serif; color:var(--lapp-texte);
}
.wp-site-blocks,.wp-site-blocks > main,.entry-content,.wp-block-post-content,
main.wp-block-group{
  margin:0 !important; padding:0 !important; max-width:none !important; width:100% !important;
}
.entry-content > *,.wp-block-post-content > *{ max-width:none !important; }
h1,h2,h3,h4{ font-family:'Playfair Display',serif; }

/* Assembler applique un margin-block-start à tous les enfants du contenu */
html body .lapp-header,html body .lapp-overlay,html body .lapp-drawer,html body .lapp-foot,
html body .lapp-page,html body .lapp-nav-toggle,html body .lapp-hero,html body .lapp-section{
  margin:0 !important; margin-block-start:0 !important; margin-block-end:0 !important;
}
/* <p>/<br> insérés automatiquement par WordPress dans le contenu des pages */
body.home .entry-content > p,body.home .wp-block-post-content > p,
.lapp-products > p,.lapp-grid > p{ display:contents !important; }
body.home br,.lapp-products br,.lapp-grid br,.lapp-header br,
.lapp-drawer br,.lapp-hero br,.lapp-tech br,.lapp-foot br{ display:none !important; }

/* ===================================================================
   HEADER
   =================================================================== */
.lapp-nav-toggle{ position:absolute; width:0; height:0; opacity:0; pointer-events:none; }

.lapp-header{
  position:fixed !important; top:0; left:0; right:0; z-index:9990;
  height:calc(var(--lapp-head) + var(--lapp-bar));
  padding:var(--lapp-bar) 30px 0 !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  flex-wrap:nowrap !important; gap:0 !important;
  box-sizing:border-box;
  background-color:var(--lapp-blanc);
  color:var(--lapp-texte);
  border-bottom:1px solid #EDEAE1;
  font-family:'Inter',sans-serif;
  transition:background-color .35s ease, color .35s ease, border-bottom-color .35s ease;
}
.lapp-header > *{ margin:0 !important; }
.lapp-header a,.lapp-header label{
  color:inherit; text-decoration:none !important;
  box-shadow:none !important; background-color:transparent !important;
}
.lapp-header svg{ display:block; }

/* transparent en haut de l'accueil, blanc dès qu'on scrolle */
@keyframes lapp-header-solid{
  from{ background-color:rgba(255,255,255,0); color:#FFFFFF; border-bottom-color:rgba(255,255,255,0); }
  to  { background-color:#FFFFFF;             color:var(--lapp-texte); border-bottom-color:#EDEAE1; }
}
body.home .lapp-header{
  animation:lapp-header-solid both;
  animation-timeline:scroll(root);
  animation-range:0 200px;
}
.lapp-header:hover,
body:has(.lapp-nav-toggle:checked) .lapp-header{
  background-color:var(--lapp-blanc) !important;
  color:var(--lapp-texte) !important;
  border-bottom-color:#EDEAE1 !important;
}

.lapp-h-left{ display:flex !important; align-items:center; gap:28px; flex:1 1 0; min-width:0; }
.lapp-h-right{
  display:flex !important; align-items:center !important; gap:22px !important;
  flex:1 1 0; min-width:0; justify-content:flex-end !important;
  padding:0 !important; margin:0 !important; background:none !important;
}
.lapp-h-right > *{ margin:0 !important; }

.lapp-menu-btn,.lapp-search{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; font-weight:400; line-height:1; white-space:nowrap;
  cursor:pointer; border:none; padding:0; background:none; color:inherit;
  transition:opacity .2s ease;
}
.lapp-search span{ opacity:.72; }
.lapp-menu-btn:hover,.lapp-search:hover{ opacity:.6; }

.lapp-logo{ flex:0 0 auto; display:inline-flex; align-items:center; gap:10px; height:34px; line-height:0; }
.lapp-logo i,.lapp-foot-logo i{ display:block; background-image:var(--lapp-logo); background-repeat:no-repeat; }
.lapp-logo .lapp-mark{ width:30px; height:34px; background-size:53.8px auto;  background-position:-12.1px -1.6px; }
.lapp-logo .lapp-word{ width:99px; height:17px; background-size:125.2px auto; background-position:-13.1px -90.4px; }

.lapp-contact{ font-size:13px; line-height:1; white-space:nowrap; transition:opacity .2s ease; }
.lapp-contact:hover{ opacity:.6; }

/* ---------- Icônes WooCommerce (compte + panier) alignées sur le design ---------- */
.lapp-h-right .wc-block-customer-account,
.lapp-h-right .wp-block-woocommerce-customer-account,
.lapp-h-right .wc-block-mini-cart,
.lapp-h-right .wp-block-woocommerce-mini-cart{
  margin:0 !important; padding:0 !important; background:none !important;
  display:inline-flex !important; align-items:center !important;
}
.lapp-h-right .wc-block-customer-account a,
.lapp-h-right .wc-block-customer-account button,
.lapp-h-right .wc-block-mini-cart__button{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:22px !important; height:22px !important;
  padding:0 !important; margin:0 !important; border:none !important;
  background:none !important; box-shadow:none !important;
  color:inherit !important; font-size:0 !important; line-height:0 !important;
  cursor:pointer; transition:opacity .2s ease;
}
.lapp-h-right .wc-block-customer-account a:hover,
.lapp-h-right .wc-block-customer-account button:hover,
.lapp-h-right .wc-block-mini-cart__button:hover{ opacity:.6; }
.lapp-h-right .wc-block-customer-account svg,
.lapp-h-right .wc-block-mini-cart__button svg{
  width:21px !important; height:21px !important; fill:currentColor !important; display:block;
}
/* le libellé texte du panier est masqué, on ne garde que l'icône + le compteur */
.lapp-h-right .wc-block-mini-cart__amount,
.lapp-h-right .wc-block-customer-account__account-label{ display:none !important; }
.lapp-h-right .wc-block-mini-cart__badge{
  font-family:'Inter',sans-serif !important; font-size:9px !important; line-height:1 !important;
  background:none !important; color:inherit !important; border:none !important;
  padding:0 !important; min-width:0 !important;
  position:absolute; top:-2px; right:-6px;
}
.lapp-h-right .wc-block-mini-cart__quantity-badge{ position:relative; display:inline-flex; }

/* ===================================================================
   TIROIR
   =================================================================== */
.lapp-overlay{
  position:fixed; inset:0; z-index:9991;
  background:rgba(20,19,16,.55);
  opacity:0; visibility:hidden; cursor:pointer;
  transition:opacity .45s ease, visibility .45s ease;
}
.lapp-drawer{
  position:fixed !important; top:var(--lapp-bar); left:0; bottom:0; z-index:9992;
  width:355px; max-width:86vw;
  background:var(--lapp-blanc) !important;
  transform:translateX(-100%);
  transition:transform .5s cubic-bezier(.22,.61,.36,1);
  padding:30px 36px 40px !important; box-sizing:border-box;
  overflow-y:auto; font-family:'Inter',sans-serif; color:var(--lapp-texte);
}
.lapp-nav-toggle:checked ~ .lapp-overlay,
body:has(.lapp-nav-toggle:checked) .lapp-overlay{ opacity:1; visibility:visible; }
.lapp-nav-toggle:checked ~ .lapp-drawer,
body:has(.lapp-nav-toggle:checked) .lapp-drawer{ transform:translateX(0); }

.lapp-drawer a,.lapp-drawer label{
  text-decoration:none !important; box-shadow:none !important;
  background-color:transparent !important; border:none !important;
}
.lapp-drawer-close{
  display:inline-flex; align-items:center; gap:12px;
  font-size:13px; color:var(--lapp-texte); cursor:pointer; margin-bottom:40px; line-height:1;
  transition:color .2s ease;
}
.lapp-drawer-close:hover{ color:var(--lapp-or); }

/* menu du tiroir — modifiable par le client dans Apparence > Éditeur > Navigation */
.lapp-drawer .lapp-drawer-nav{ display:block !important; }
.lapp-drawer .wp-block-navigation__container{
  display:flex !important; flex-direction:column !important; gap:0 !important; align-items:flex-start !important;
}
.lapp-drawer .wp-block-navigation-item{ display:block !important; width:100%; }
.lapp-drawer .wp-block-navigation-item__content{
  display:block !important; font-family:'Inter',sans-serif !important;
  font-size:17px !important; color:var(--lapp-texte) !important;
  padding:12px 0 !important; line-height:1.3 !important; transition:color .2s ease;
}
.lapp-drawer .wp-block-navigation-item__content:hover{ color:var(--lapp-or) !important; }

.lapp-drawer-foot{ margin-top:34px; display:flex; flex-direction:column; }
.lapp-drawer-foot a{
  font-size:13px; color:var(--lapp-gris) !important; padding:7px 0; transition:color .2s ease;
}
.lapp-drawer-foot a:hover{ color:var(--lapp-or) !important; }

/* ===================================================================
   PAGE D'ACCUEIL
   =================================================================== */
.lapp-hero{
  position:relative; min-height:100vh;
  display:flex; align-items:flex-end; justify-content:center; text-align:center;
  padding:0 24px 84px; box-sizing:border-box;
  background-color:#3A3A2E; background-image:var(--lapp-hero);
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.lapp-hero::before{
  content:''; position:absolute; inset:0;
  background-image:var(--lapp-logo);
  background-size:min(34vw,340px) auto; background-position:center 38%; background-repeat:no-repeat;
  opacity:.13; pointer-events:none;
}
.lapp-hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(15,15,12,.55) 0%, rgba(15,15,12,0) 45%);
  pointer-events:none;
}
.lapp-hero-inner{ position:relative; z-index:2; max-width:780px; color:#fff; }
.lapp-hero-eyebrow{ font-size:11px; letter-spacing:.24em; text-transform:uppercase; margin:0 0 14px; color:#fff; opacity:.92; }
.lapp-hero-title{ font-family:'Playfair Display',serif; font-weight:500; font-size:clamp(30px,4.4vw,52px); line-height:1.15; margin:0 0 24px; color:#fff; }
.lapp-hero-link{
  display:inline-block; font-size:13px; color:#fff !important; text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,255,.75); padding-bottom:4px; transition:border-color .25s ease;
}
.lapp-hero-link:hover{ border-bottom-color:transparent; }

.lapp-section{ padding:88px 22px 96px; }
.lapp-section--white{ background:var(--lapp-blanc) !important; }
.lapp-section--ivory{ background:var(--lapp-ivoire) !important; }
.lapp-section--products{ padding-left:10px !important; padding-right:10px !important; }
.lapp-section-title{
  text-align:center; font-family:'Playfair Display',serif; font-weight:400;
  font-size:clamp(22px,2.5vw,32px); line-height:1.35;
  max-width:640px; margin:0 auto 54px !important; color:var(--lapp-texte);
}
.lapp-eyebrow{
  display:block; text-align:center; font-size:11px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--lapp-or); margin:0 0 14px;
}

.lapp-products{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; width:100%; }
.lapp-product,.lapp-tile{ display:block; text-decoration:none !important; color:inherit; box-shadow:none !important; }
.lapp-product-img{
  display:block; position:relative; aspect-ratio:4/5;
  background:linear-gradient(158deg,#FAF6EE 0%,#EFE7D6 100%);
  border:1px solid #EFE8D8; overflow:hidden;
}
.lapp-product-img::after,.lapp-tile-img::after{
  content:''; position:absolute; inset:0;
  background-image:var(--lapp-logo);
  background-size:44% auto; background-position:center; background-repeat:no-repeat;
  opacity:.15; transition:transform .6s ease;
}
.lapp-product:hover .lapp-product-img::after,.lapp-tile:hover .lapp-tile-img::after{ transform:scale(1.05); }
.lapp-product-tag{ display:block; margin-top:14px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--lapp-or); }
.lapp-product-name{ display:block; margin-top:5px; font-size:13.5px; color:var(--lapp-texte); }
.lapp-product-price{ display:block; margin-top:3px; font-size:13px; color:var(--lapp-gris); }

.lapp-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:1560px; margin:0 auto; }
.lapp-tile-img{
  display:block; position:relative; aspect-ratio:3/4;
  background:linear-gradient(158deg,#FBF7EE 0%,#F1E9D8 100%);
  border:1px solid #EFE8D8; overflow:hidden;
}
.lapp-tile-label{ display:block; margin-top:15px; text-align:center; font-size:13px; color:var(--lapp-texte); }

.lapp-tech{ display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:64px; max-width:1280px; margin:0 auto; }
.lapp-tech-media{
  position:relative; aspect-ratio:4/3;
  background:linear-gradient(150deg,#FFFFFF 0%,#EFE8D6 55%,#DCE6DB 100%);
  border:1px solid #EAE1CE;
}
.lapp-tech-media::after{
  content:''; position:absolute; inset:0;
  background-image:var(--lapp-logo);
  background-size:42% auto; background-position:center; background-repeat:no-repeat; opacity:.18;
}
.lapp-tech-text .lapp-eyebrow{ text-align:left; }
.lapp-tech-title{ font-family:'Playfair Display',serif; font-weight:400; font-size:clamp(24px,2.6vw,36px); line-height:1.25; margin:0 0 20px !important; }
.lapp-tech-text p{ font-size:14.5px; line-height:1.8; color:var(--lapp-gris); margin:0 0 16px !important; max-width:52ch; }
.lapp-link{
  display:inline-block; margin-top:10px; font-size:13px;
  color:var(--lapp-texte) !important; text-decoration:none !important;
  border-bottom:1px solid var(--lapp-or); padding-bottom:4px;
  transition:color .25s ease, border-color .25s ease;
}
.lapp-link:hover{ color:var(--lapp-or) !important; border-bottom-color:transparent; }

.lapp-center{ text-align:center; }
.lapp-btn-pill{
  display:inline-block; margin-top:52px; padding:15px 36px;
  border:1px solid #CBC5B5; border-radius:999px;
  font-size:13px; line-height:1;
  color:var(--lapp-texte) !important; text-decoration:none !important;
  background:transparent; box-shadow:none !important;
  transition:background-color .25s ease, border-color .25s ease, color .25s ease;
}
.lapp-btn-pill:hover{ background-color:var(--lapp-texte); border-color:var(--lapp-texte); color:var(--lapp-blanc) !important; }

/* ===================================================================
   PIED DE PAGE
   =================================================================== */
.lapp-foot{
  background:var(--lapp-ivoire) !important;
  padding:58px 24px 62px !important; text-align:center;
  font-family:'Inter',sans-serif; font-size:12.5px; color:var(--lapp-gris);
  border-top:1px solid #EDE6D6;
}
.lapp-foot-inner{ max-width:1100px; margin:0 auto; }
.lapp-foot-logo{
  display:inline-flex; align-items:center; gap:9px; height:28px; line-height:0;
  margin-bottom:26px; text-decoration:none !important;
}
.lapp-foot-logo .lapp-mark{ width:25px; height:28px; background-size:44.3px auto; background-position:-10px -1.3px; }
.lapp-foot-logo .lapp-word{ width:82px; height:14px; background-size:103.5px auto; background-position:-10.8px -74.7px; }
.lapp-foot-links{ display:flex; justify-content:center; flex-wrap:wrap; gap:26px; }
.lapp-foot-links a{ color:var(--lapp-gris) !important; text-decoration:none !important; transition:color .2s ease; }
.lapp-foot-links a:hover{ color:var(--lapp-or) !important; }
.lapp-foot-legal{ margin-top:24px; opacity:.75; }

/* ===================================================================
   PAGES INTÉRIEURES (boutique, produit, panier, compte…)
   =================================================================== */
body:not(.home) .wp-site-blocks > main,
body:not(.home) main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 40px) !important;
  padding-bottom:80px !important;
  background:var(--lapp-blanc);
  min-height:60vh;
}
body:not(.home) .wp-block-post-content,
body:not(.home) .entry-content{
  max-width:1280px !important; margin:0 auto !important;
  padding-left:24px !important; padding-right:24px !important;
}

/* ===================================================================
   MOBILE
   =================================================================== */
@media (max-width:900px){
  :root{ --lapp-head:58px; }
  .lapp-header{ padding-left:16px !important; padding-right:16px !important; }
  .lapp-search span,.lapp-menu-btn span,.lapp-contact{ display:none; }
  .lapp-h-left{ gap:18px; }
  .lapp-h-right{ gap:16px !important; }
  .lapp-logo{ transform:scale(.8); transform-origin:center; }
  .lapp-products{ grid-template-columns:repeat(2,1fr); gap:8px; }
  .lapp-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .lapp-section{ padding:62px 14px 70px; }
  .lapp-tech{ grid-template-columns:1fr; gap:30px; }
  .lapp-tech-text .lapp-eyebrow,.lapp-tech-title{ text-align:center; }
  .lapp-tech-text p{ max-width:none; }
  .lapp-hero{ padding-bottom:64px; }
}

/* ---------- Garde-fous ---------- */
.wp-site-blocks,.entry-content,.wp-block-post-content{ transform:none !important; filter:none !important; }


/* --- WPWriter addition --- */

/* ===================================================================
   Ajustements après vérification visuelle
   =================================================================== */

/* Ordre des plans : voile SOUS le header, tiroir AU-DESSUS.
   Le header reste donc net quand le menu est ouvert. */
.lapp-overlay{ z-index:9980 !important; }
.lapp-header{ z-index:9990 !important; }
.lapp-drawer{ z-index:9995 !important; }

/* le premier <a> du bloc HTML de droite = Contactez-nous, puis le cœur */
.lapp-wish{
  display:inline-flex !important; align-items:center; justify-content:center;
  width:22px; height:22px; line-height:0; color:inherit;
  transition:opacity .2s ease;
}
.lapp-wish:hover{ opacity:.6; }
/* le bloc HTML "Contactez-nous + cœur" doit s'aligner comme les autres icônes */
.lapp-h-right > a,
.lapp-h-right .lapp-contact{ display:inline-flex; align-items:center; }

/* gabarit fixe pour les trois icônes, quelle que soit leur origine */
.lapp-h-right .wp-block-woocommerce-customer-account,
.lapp-h-right .wc-block-mini-cart{
  width:22px !important; height:22px !important;
  min-width:0 !important; flex:0 0 auto !important;
}
.lapp-h-right .wc-block-customer-account__link{ width:22px !important; height:22px !important; }
.lapp-h-right .wc-block-customer-account svg{ width:21px !important; height:21px !important; }


/* --- WPWriter addition --- */

/* ===================================================================
   13. Tiroir — sous-catégories toujours déployées sous « Boutique »
   Le bloc Navigation de WordPress cache ses sous-menus par défaut
   (ils s'ouvrent au survol). Ici on les affiche en permanence,
   dans le flux, légèrement décalés vers la droite.
   =================================================================== */
.lapp-drawer .wp-block-navigation__submenu-container{
  position:static !important;
  display:block !important;
  opacity:1 !important; visibility:visible !important;
  transform:none !important; pointer-events:auto !important;
  width:auto !important; min-width:0 !important; height:auto !important;
  left:auto !important; top:auto !important;
  background:transparent !important; border:none !important; box-shadow:none !important;
  padding:2px 0 10px 18px !important; margin:0 !important;
}
.lapp-drawer .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container{
  border-left:1px solid #EDE6D6 !important;
  margin-left:2px !important;
}
.lapp-drawer .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  font-size:14px !important;
  color:var(--lapp-gris) !important;
  padding:8px 0 !important;
}
.lapp-drawer .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
  color:var(--lapp-or) !important;
}
/* pas de flèche de sous-menu, et le parent « Boutique » garde le style principal */
.lapp-drawer .wp-block-navigation__submenu-icon{ display:none !important; }
.lapp-drawer .wp-block-navigation-item.has-child > .wp-block-navigation-item__content{
  font-size:17px !important; color:var(--lapp-texte) !important; padding-bottom:4px !important;
}


/* --- WPWriter addition --- */

/* ===================================================================
   14. BOUTIQUE + PAGES CATÉGORIE
   =================================================================== */
.woocommerce main.wp-block-group,
body.post-type-archive-product main.wp-block-group,
body.tax-product_cat main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 46px) !important;
  padding-bottom:96px !important;
  background:var(--lapp-blanc);
}

/* fil d'Ariane */
.wc-block-breadcrumbs,
.woocommerce-breadcrumb{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  letter-spacing:.04em; color:var(--lapp-gris) !important;
  text-align:center; margin:0 0 18px !important;
}
.wc-block-breadcrumbs a,.woocommerce-breadcrumb a{
  color:var(--lapp-gris) !important; text-decoration:none !important;
}
.wc-block-breadcrumbs a:hover,.woocommerce-breadcrumb a:hover{ color:var(--lapp-or) !important; }

/* titre de la page / de la catégorie */
.wp-block-query-title,
.woocommerce-products-header__title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(28px,3.2vw,42px) !important; line-height:1.2 !important;
  text-align:center !important; color:var(--lapp-texte) !important;
  margin:0 auto 10px !important;
}
.wp-block-term-description{
  font-family:'Inter',sans-serif; font-size:14px; line-height:1.7;
  color:var(--lapp-gris); text-align:center; max-width:60ch; margin:0 auto !important;
}

/* barre « X résultats » + tri */
.wp-block-woocommerce-product-results-count,
.wc-block-product-results-count,
.woocommerce-result-count{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  color:var(--lapp-gris) !important; margin:0 !important;
}
.wp-block-woocommerce-catalog-sorting select,
.wc-block-catalog-sorting select,
.woocommerce-ordering select{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  color:var(--lapp-texte) !important;
  border:none !important; border-bottom:1px solid #E3DCC9 !important;
  border-radius:0 !important; background:transparent !important;
  padding:6px 22px 6px 0 !important; box-shadow:none !important;
}

/* grille produits */
.wc-block-product-template{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:34px 14px !important;
  margin:34px 0 0 !important; padding:0 !important; list-style:none !important;
}
.wc-block-product-template li.product,
.wc-block-product-template .wc-block-product{
  list-style:none !important; margin:0 !important; padding:0 !important;
  border:none !important; background:none !important; text-align:left !important;
}
/* visuel produit — cadrage portrait, comme la référence */
.wc-block-product-template .wc-block-components-product-image{
  margin:0 !important; overflow:hidden; background:#FAF6EE; border:1px solid #EFE8D8;
}
.wc-block-product-template .wc-block-components-product-image img{
  aspect-ratio:4/5 !important; width:100% !important; height:auto !important;
  object-fit:cover !important; display:block;
  transition:transform .7s cubic-bezier(.22,.61,.36,1);
}
.wc-block-product-template li.product:hover .wc-block-components-product-image img{ transform:scale(1.04); }

/* nom du produit */
.wc-block-product-template .wp-block-post-title,
.wc-block-product-template .wc-block-components-product-name{
  font-family:'Inter',sans-serif !important; font-weight:400 !important;
  font-size:13.5px !important; line-height:1.4 !important;
  color:var(--lapp-texte) !important;
  margin:14px 0 0 !important; letter-spacing:0 !important;
}
.wc-block-product-template .wp-block-post-title a,
.wc-block-product-template .wc-block-components-product-name{
  color:var(--lapp-texte) !important; text-decoration:none !important;
}
.wc-block-product-template .wp-block-post-title a:hover{ color:var(--lapp-or) !important; }

/* prix */
.wc-block-product-template .wc-block-components-product-price,
.wc-block-product-template .price{
  font-family:'Inter',sans-serif !important; font-size:13px !important;
  color:var(--lapp-gris) !important; margin:4px 0 0 !important;
}
.wc-block-product-template .wc-block-components-product-price__value{ font-weight:400 !important; }

/* pagination */
.wp-block-query-pagination{
  margin-top:64px !important; font-family:'Inter',sans-serif; font-size:13px;
  justify-content:center !important; gap:18px !important;
}
.wp-block-query-pagination a,.wp-block-query-pagination span{
  color:var(--lapp-texte) !important; text-decoration:none !important;
}
.wp-block-query-pagination .current{ color:var(--lapp-or) !important; }

@media (max-width:900px){
  .wc-block-product-template{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:26px 10px !important; }
  .woocommerce main.wp-block-group,
  body.post-type-archive-product main.wp-block-group,
  body.tax-product_cat main.wp-block-group{ padding-bottom:64px !important; }
}


/* --- WPWriter addition --- */

/* ===================================================================
   15. FICHE PRODUIT (gabarit unique, valable pour tous les produits)
   =================================================================== */
body.single-product main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 34px) !important;
  padding-bottom:90px !important;
  background:var(--lapp-blanc);
}
/* fil d'Ariane aligné à gauche sur la fiche produit */
body.single-product .wc-block-breadcrumbs{ text-align:left !important; margin-bottom:26px !important; }

/* galerie */
body.single-product .wc-block-product-gallery-large-image img,
body.single-product .wp-block-woocommerce-product-image img{
  aspect-ratio:4/5 !important; object-fit:cover !important;
  width:100% !important; height:auto !important;
  background:#FAF6EE; border:1px solid #EFE8D8;
}

/* titre + prix */
body.single-product .wp-block-post-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(26px,2.8vw,36px) !important; line-height:1.2 !important;
  color:var(--lapp-texte) !important; margin:0 0 6px !important;
}
body.single-product .wc-block-components-product-price{
  font-family:'Inter',sans-serif !important; font-size:17px !important;
  color:var(--lapp-texte) !important;
}
body.single-product .wc-block-components-product-summary,
body.single-product .wp-block-woocommerce-product-summary{
  font-family:'Inter',sans-serif !important; font-size:14px !important;
  line-height:1.75 !important; color:var(--lapp-gris) !important;
  margin-top:14px !important;
}

/* --- sélecteurs de déclinaison (Taille, Couleur) --- */
.wc-block-add-to-cart-with-options-variation-selector-attribute__name,
.wc-block-product-filter-chips__fieldset legend{
  font-family:'Inter',sans-serif !important; font-size:11px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-gris) !important; margin-bottom:10px !important;
}
.wc-block-product-filter-chips__items{ gap:8px !important; }
.wc-block-product-filter-chips__item{
  font-family:'Inter',sans-serif !important; font-size:13px !important;
  min-width:46px; padding:11px 16px !important;
  border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; color:var(--lapp-texte) !important;
  box-shadow:none !important; cursor:pointer;
  transition:border-color .2s ease, background-color .2s ease, color .2s ease;
}
.wc-block-product-filter-chips__item:hover{ border-color:var(--lapp-texte) !important; }
.wc-block-product-filter-chips__item[aria-checked="true"],
.wc-block-product-filter-chips__item.is-active,
.wc-block-product-filter-chips__item[data-selected="true"]{
  background:var(--lapp-texte) !important; border-color:var(--lapp-texte) !important;
  color:var(--lapp-blanc) !important;
}

/* quantité */
.wc-block-components-quantity-selector{
  border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; height:52px;
}
.wc-block-components-quantity-selector__input,
.wc-block-components-quantity-selector__button{
  font-family:'Inter',sans-serif !important; font-size:13px !important;
  color:var(--lapp-texte) !important; background:transparent !important; box-shadow:none !important;
}

/* bouton ajouter au panier */
.wc-block-components-product-button__button,
body.single-product .single_add_to_cart_button{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  letter-spacing:.1em !important; text-transform:uppercase !important;
  background:var(--lapp-texte) !important; color:var(--lapp-blanc) !important;
  border:1px solid var(--lapp-texte) !important; border-radius:0 !important;
  padding:0 34px !important; height:52px !important; min-height:52px !important;
  box-shadow:none !important; transition:background-color .25s ease, color .25s ease;
}
.wc-block-components-product-button__button:hover,
body.single-product .single_add_to_cart_button:hover{
  background:var(--lapp-or) !important; border-color:var(--lapp-or) !important; color:#fff !important;
}
.wp-block-woocommerce-add-to-cart-with-options{ margin-top:26px !important; }

/* description longue + caractéristiques */
body.single-product .wp-block-woocommerce-product-details,
body.single-product .wp-block-woocommerce-product-specifications{
  font-family:'Inter',sans-serif; font-size:14px; line-height:1.8; color:var(--lapp-gris);
  margin-top:34px !important; border-top:1px solid #EDE6D6; padding-top:26px;
}
body.single-product .wp-block-woocommerce-product-details h2,
body.single-product .wp-block-woocommerce-product-specifications h2,
body.single-product .wp-block-woocommerce-product-reviews h3{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:19px !important; color:var(--lapp-texte) !important;
}

/* blocs « vous aimerez aussi » / « similaires » / avis */
body.single-product .wp-block-woocommerce-product-collection h2{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(20px,2.2vw,26px) !important; color:var(--lapp-texte) !important;
}
body.single-product .wp-block-woocommerce-product-collection .wp-block-post-title{
  font-family:'Inter',sans-serif !important; font-size:13.5px !important; font-weight:400 !important;
  margin-top:14px !important;
}
body.single-product .wp-block-woocommerce-product-collection .wc-block-components-product-price{
  font-size:13px !important; color:var(--lapp-gris) !important;
}

@media (max-width:900px){
  body.single-product .wp-block-columns{ gap:26px !important; }
  body.single-product main.wp-block-group{ padding-bottom:64px !important; }
}


/* --- WPWriter addition --- */

/* libellés « Taille » / « Couleur » — le vrai sélecteur du bloc WooCommerce */
[class*="add-to-cart-with-options-variation-selector-attribute-name"],
span[class*="variation-selector-attribute-name"]{
  font-family:'Inter',sans-serif !important; font-size:11px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-gris) !important; font-weight:400 !important;
}
[class*="add-to-cart-with-options-variation-selector-attribute"]{ margin-bottom:18px !important; }


/* --- WPWriter addition --- */

/* ===================================================================
   16. Vitrine dynamique de l'accueil (produits « mis en avant »)
   =================================================================== */
.lapp-section--products .wp-block-woocommerce-product-collection{ margin:0 !important; }
.lapp-section--products .wc-block-product-template{ margin-top:34px !important; }
.lapp-section--products .wc-block-product-template li.product{ text-align:left !important; }

/* barre de chargement de WordPress : aux couleurs de la marque au lieu du noir */
.wp-interactivity-router-loading-bar{
  background:var(--lapp-or) !important; height:2px !important;
}


/* --- WPWriter addition --- */

/* ===================================================================
   17. Tiroir — liens secondaires plaqués en bas du panneau
   =================================================================== */
.lapp-drawer{
  display:flex !important;
  flex-direction:column !important;
}
.lapp-drawer > *{ flex:0 0 auto; }
.lapp-drawer .lapp-drawer-foot{
  margin-top:auto !important;
  padding-top:26px;
  border-top:1px solid #EDE6D6;
}


/* --- WPWriter addition --- */

/* ===================================================================
   18. Header mobile — le logo ne doit JAMAIS être chevauché
   (ces règles sont en fin de feuille : elles passent devant tout le reste)
   =================================================================== */
@media (max-width:900px){
  /* « Contactez-nous » quitte le header : il reste accessible dans le tiroir */
  html body .lapp-header .lapp-contact,
  html body .lapp-h-right .lapp-contact{ display:none !important; }
  /* libellés texte du burger et de la recherche : icônes seules */
  html body .lapp-menu-btn span,
  html body .lapp-search span{ display:none !important; }

  /* les deux côtés ont exactement la même largeur : le logo tombe
     donc au centre optique, quoi qu'il arrive */
  html body .lapp-h-left,
  html body .lapp-h-right{
    flex:1 1 0 !important; min-width:0 !important; white-space:nowrap;
  }
  html body .lapp-logo{ flex:0 0 auto !important; }
}

/* Très petits écrans : on ne garde que l'emblème, sans le nom.
   C'est la solution classique des maisons de luxe en mobile. */
@media (max-width:400px){
  html body .lapp-logo .lapp-word{ display:none !important; }
  html body .lapp-logo{ transform:none !important; height:32px; }
  html body .lapp-logo .lapp-mark{ width:28px; height:32px; background-size:50.6px auto; background-position:-11.4px -1.5px; }
  html body .lapp-header{ padding-left:14px !important; padding-right:14px !important; }
  html body .lapp-h-left{ gap:14px !important; }
  html body .lapp-h-right{ gap:14px !important; }
}


/* --- WPWriter addition --- */

/* ===================================================================
   19. PAGE TECHNOLOGIE (et gabarit réutilisable pour les pages
   éditoriales pleine largeur : il suffit d'envelopper le contenu
   dans <div class="lapp-page-tech">)
   =================================================================== */
body:has(.lapp-page-tech) .wp-site-blocks > main,
body:has(.lapp-page-tech) main.wp-block-group{
  padding:0 !important; background:var(--lapp-blanc);
}
body:has(.lapp-page-tech) .wp-block-post-content,
body:has(.lapp-page-tech) .entry-content{
  max-width:none !important; padding:0 !important; margin:0 !important;
}
html body .lapp-page-tech,html body .lapp-pagehead,
html body .lapp-pillars,html body .lapp-figures{
  margin:0 !important; margin-block-start:0 !important; margin-block-end:0 !important;
}

/* en-tête de page */
.lapp-pagehead{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 84px) !important;
  padding-bottom:88px !important;
  text-align:center;
}
.lapp-pagehead-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(30px,4vw,50px) !important; line-height:1.15 !important;
  color:var(--lapp-texte) !important; margin:0 auto 22px !important; max-width:16ch;
}
.lapp-pagehead-lead{
  font-family:'Inter',sans-serif; font-size:15.5px; line-height:1.85;
  color:var(--lapp-gris); max-width:62ch; margin:0 auto !important;
}

/* trois piliers */
.lapp-pillars{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:46px; max-width:1180px; margin:0 auto !important;
}
.lapp-pillar-mark{
  display:block; width:56px; height:56px; margin-bottom:22px;
  background-image:var(--lapp-logo); background-repeat:no-repeat;
  background-size:100.9px auto; background-position:-22.7px -2.9px;
  opacity:.85;
}
.lapp-pillar-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:21px !important; color:var(--lapp-texte) !important; margin:0 0 12px !important;
}
.lapp-pillar p{
  font-family:'Inter',sans-serif; font-size:14px; line-height:1.8;
  color:var(--lapp-gris); margin:0 !important;
}

/* bloc image + texte inversé */
.lapp-tech--rev .lapp-tech-media{ order:2; }
.lapp-tech--rev .lapp-tech-text{ order:1; }

/* repères numérotés */
.lapp-figures{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:42px; max-width:1180px; margin:0 auto !important;
}
.lapp-figure{ border-top:1px solid #E8E0CE; padding-top:24px; }
.lapp-figure-num{
  display:block; font-family:'Playfair Display',serif; font-size:22px;
  color:var(--lapp-or); margin-bottom:14px;
}
.lapp-figure-title{
  font-family:'Inter',sans-serif !important; font-weight:500 !important;
  font-size:14.5px !important; color:var(--lapp-texte) !important; margin:0 0 10px !important;
}
.lapp-figure p{
  font-family:'Inter',sans-serif; font-size:13.5px; line-height:1.75;
  color:var(--lapp-gris); margin:0 !important;
}

/* bandeau final */
.lapp-page-tech .lapp-center .lapp-btn-pill{ margin-top:8px; }

@media (max-width:900px){
  .lapp-pagehead{ padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 52px) !important; padding-bottom:56px !important; }
  .lapp-pillars,.lapp-figures{ grid-template-columns:1fr; gap:34px; }
  .lapp-tech--rev .lapp-tech-media{ order:1; }
  .lapp-tech--rev .lapp-tech-text{ order:2; }
}


/* --- WPWriter addition --- */

/* Correctif : le reset de marge annulait le centrage automatique.
   On neutralise seulement les marges verticales, pas les horizontales. */
html body .lapp-pillars,
html body .lapp-figures,
html body .lapp-tech{
  margin-top:0 !important; margin-bottom:0 !important;
  margin-left:auto !important; margin-right:auto !important;
  margin-block-start:0 !important; margin-block-end:0 !important;
}


/* --- WPWriter addition --- */

/* ===================================================================
   20. PANIER ET VALIDATION DE COMMANDE
   =================================================================== */
body.woocommerce-cart main.wp-block-group,
body.woocommerce-checkout main.wp-block-group,
body.page-id-24 main.wp-block-group,
body.page-id-25 main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 48px) !important;
  padding-bottom:96px !important;
  background:var(--lapp-blanc);
}

/* titre de la page */
body.woocommerce-cart .entry-content > h1,
body.woocommerce-checkout .entry-content > h1,
body.woocommerce-cart .wp-block-post-title,
body.woocommerce-checkout .wp-block-post-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(28px,3.2vw,40px) !important; line-height:1.2 !important;
  text-align:center !important; color:var(--lapp-texte) !important;
  margin:0 auto 44px !important;
}

/* mise en page à deux colonnes */
.wc-block-components-sidebar-layout{ gap:56px !important; }
.wc-block-cart, .wp-block-woocommerce-checkout{ max-width:1280px; margin:0 auto !important; }

/* en-tête du tableau */
.wc-block-cart-items__header{
  font-family:'Inter',sans-serif !important; font-size:11px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-gris) !important;
  border-bottom:1px solid #E8E0CE !important;
}
.wc-block-cart-items__row{ border-bottom:1px solid #F0EADC !important; }

/* visuel de la ligne produit */
.wc-block-cart-item__image img{
  border:1px solid #EFE8D8; background:#FAF6EE;
  aspect-ratio:4/5; object-fit:cover; width:100%; height:auto;
}

/* nom, prix, déclinaisons */
.wc-block-components-product-name{
  font-family:'Inter',sans-serif !important; font-size:14px !important;
  color:var(--lapp-texte) !important; text-decoration:none !important;
}
.wc-block-components-product-name:hover{ color:var(--lapp-or) !important; }
.wc-block-cart-item__prices .wc-block-components-product-price__value,
.wc-block-components-product-price__value{
  font-family:'Inter',sans-serif !important; font-size:13.5px !important;
  color:var(--lapp-texte) !important; font-weight:400 !important;
}
.wc-block-components-product-metadata{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  color:var(--lapp-gris) !important;
}

/* bouton supprimer */
.wc-block-cart-item__remove-link{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  color:var(--lapp-gris) !important; text-decoration:none !important;
}
.wc-block-cart-item__remove-link:hover{ color:var(--lapp-or) !important; }

/* colonne des totaux */
.wc-block-components-sidebar{
  background:var(--lapp-ivoire) !important;
  padding:32px 30px !important; box-sizing:border-box;
  border:1px solid #EDE6D6;
}
.wp-block-woocommerce-cart-order-summary-heading-block,
.wc-block-cart__totals-title,
.wc-block-components-totals-wrapper .wc-block-components-title{
  font-family:'Inter',sans-serif !important; font-size:11px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-gris) !important;
}
.wc-block-components-totals-item{
  font-family:'Inter',sans-serif !important; font-size:13.5px !important;
  color:var(--lapp-texte) !important;
}
.wc-block-components-totals-footer-item,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  font-family:'Playfair Display',serif !important; font-size:20px !important;
  color:var(--lapp-texte) !important; font-weight:400 !important;
}
.wc-block-components-totals-wrapper{ border-top-color:#E4DCC7 !important; }
.wc-block-components-panel__button,
.wc-block-components-totals-coupon__button{
  font-family:'Inter',sans-serif !important; font-size:13px !important;
  color:var(--lapp-texte) !important;
}

/* bouton principal : passer commande */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-container a,
.wp-block-woocommerce-checkout-actions-block button{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  letter-spacing:.1em !important; text-transform:uppercase !important;
  background:var(--lapp-texte) !important; color:var(--lapp-blanc) !important;
  border:1px solid var(--lapp-texte) !important; border-radius:0 !important;
  height:54px !important; min-height:54px !important; width:100%;
  display:flex !important; align-items:center; justify-content:center;
  box-shadow:none !important; text-decoration:none !important;
  transition:background-color .25s ease, border-color .25s ease;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-cart__submit-container a:hover,
.wp-block-woocommerce-checkout-actions-block button:hover{
  background:var(--lapp-or) !important; border-color:var(--lapp-or) !important; color:#fff !important;
}

/* champs de formulaire (commande) */
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-combobox-control input,
.wc-block-components-select__container select{
  font-family:'Inter',sans-serif !important; font-size:14px !important;
  border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; color:var(--lapp-texte) !important;
  box-shadow:none !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-combobox-control input:focus{
  border-color:var(--lapp-or) !important; outline:none !important;
}
.wc-block-components-text-input label,
.wc-block-components-checkbox__label,
.wc-block-components-radio-control__label{
  font-family:'Inter',sans-serif !important; color:var(--lapp-gris) !important;
}
.wc-block-components-title,
.wp-block-woocommerce-checkout-order-summary-block h2,
.wc-block-checkout__form h2{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  color:var(--lapp-texte) !important;
}
/* étapes du tunnel */
.wc-block-components-checkout-step__title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:19px !important; color:var(--lapp-texte) !important;
}
.wc-block-components-checkout-step__description{
  font-family:'Inter',sans-serif !important; font-size:13px !important; color:var(--lapp-gris) !important;
}

/* panier vide */
.wp-block-woocommerce-empty-cart-block{ text-align:center; }

@media (max-width:900px){
  .wc-block-components-sidebar-layout{ gap:32px !important; }
  .wc-block-components-sidebar{ padding:24px 20px !important; }
  body.woocommerce-cart main.wp-block-group,
  body.woocommerce-checkout main.wp-block-group{ padding-bottom:64px !important; }
}


/* --- WPWriter addition --- */

/* ---------- Correctifs panier / commande ---------- */

/* Le titre est un bloc « titre » dans le contenu, pas un titre d'article */
body.woocommerce-cart .entry-content h1.wp-block-heading,
body.woocommerce-checkout .entry-content h1.wp-block-heading,
body.page-id-24 h1.wp-block-heading,
body.page-id-25 h1.wp-block-heading{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(28px,3.2vw,40px) !important; line-height:1.2 !important;
  text-align:center !important; color:var(--lapp-texte) !important;
  margin:0 auto 44px !important; max-width:none !important;
}

/* Les deux colonnes doivent tenir côte à côte : on fixe la largeur de la
   colonne des totaux et on laisse la colonne produits absorber le reste.
   (Un gap ajouté sans réduire les largeurs faisait repasser à la ligne.) */
@media (min-width:901px){
  .wc-block-components-sidebar-layout{
    flex-wrap:nowrap !important;
    gap:48px !important;
    align-items:flex-start;
  }
  .wc-block-components-sidebar-layout > .wc-block-components-main{
    flex:1 1 auto !important; width:auto !important; min-width:0 !important;
    padding-right:0 !important;
  }
  .wc-block-components-sidebar-layout > .wc-block-components-sidebar{
    flex:0 0 380px !important; width:380px !important; max-width:380px !important;
    padding-left:30px !important;
  }
}
@media (max-width:900px){
  .wc-block-components-sidebar-layout{ flex-wrap:wrap !important; }
  .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
  .wc-block-components-sidebar-layout > .wc-block-components-main{
    flex:1 1 100% !important; width:100% !important; max-width:none !important;
  }
}


/* --- WPWriter addition --- */

/* ===================================================================
   21. En-tête simplifié du tunnel de commande
   Volontairement sobre et NON fixe : moins de distractions = moins
   d'abandons de panier. Retour au panier à gauche, logo au centre,
   réassurance « paiement sécurisé » à droite.
   =================================================================== */
body.woocommerce-checkout header.wp-block-template-part,
.lapp-checkout-header{ display:flex !important; }

.lapp-checkout-header{
  position:static !important;
  align-items:center !important; justify-content:space-between !important;
  flex-wrap:nowrap !important; gap:0 !important;
  height:80px; padding:0 30px !important; margin:0 !important;
  background:var(--lapp-blanc) !important;
  border-bottom:1px solid #EDEAE1;
  font-family:'Inter',sans-serif;
}
.lapp-checkout-header > *{ margin:0 !important; }
.lapp-checkout-header a{ text-decoration:none !important; box-shadow:none !important; }
.lapp-checkout-header svg{ display:block; }

.lapp-checkout-back,
.lapp-checkout-secure{
  display:inline-flex; align-items:center; gap:9px;
  flex:1 1 0; min-width:0; white-space:nowrap;
  font-size:12.5px; line-height:1; color:var(--lapp-gris) !important;
}
.lapp-checkout-secure{ justify-content:flex-end; }
.lapp-checkout-back:hover{ color:var(--lapp-texte) !important; }
.lapp-checkout-header .lapp-logo{ flex:0 0 auto !important; }

/* le tunnel n'a pas de header fixe : on retire le décalage prévu pour lui */
body.woocommerce-checkout main.wp-block-group,
body.page-id-25 main.wp-block-group{
  padding-top:56px !important;
}
/* et on masque le header principal sur cette page */
body.woocommerce-checkout .lapp-header,
body.woocommerce-checkout .lapp-drawer,
body.woocommerce-checkout .lapp-overlay{ display:none !important; }

@media (max-width:900px){
  .lapp-checkout-header{ height:64px; padding:0 16px !important; }
  .lapp-checkout-back span,.lapp-checkout-secure span{ display:none; }
}


/* --- WPWriter addition --- */

/* correctif : le conteneur <header> du gabarit doit rester pleine largeur */
body.woocommerce-checkout header.wp-block-template-part{
  display:block !important;
  width:100% !important; max-width:none !important;
  margin:0 !important; padding:0 !important;
}
body.woocommerce-checkout .lapp-checkout-header{ width:100% !important; max-width:none !important; }


/* --- WPWriter addition --- */

/* la barre d'admin recouvrait le haut de l'en-tête de commande */
body.admin-bar .lapp-checkout-header{
  height:calc(80px + var(--lapp-bar));
  padding-top:var(--lapp-bar) !important;
  box-sizing:border-box;
}
@media (max-width:900px){
  body.admin-bar .lapp-checkout-header{ height:calc(64px + var(--lapp-bar)); }
}


/* --- WPWriter addition --- */

/* ===================================================================
   22. Header — fondu progressif au lieu du basculement instantané
   Cause du problème : une animation CSS (liée au scroll) possédait les
   propriétés de couleur. Quand une animation contrôle une propriété,
   une transition ne peut plus s'y interpoler — la valeur de survol
   remplaçait donc l'animation d'un seul coup.
   Solution : plus d'animation. Une simple classe `.is-solid` posée par
   le script au scroll, et tout passe par des transitions CSS.
   =================================================================== */
html body .lapp-header{
  animation:none !important;
  transition:background-color .55s cubic-bezier(.33,0,.2,1),
             color .55s cubic-bezier(.33,0,.2,1),
             border-bottom-color .55s cubic-bezier(.33,0,.2,1),
             box-shadow .55s cubic-bezier(.33,0,.2,1) !important;
}
html body .lapp-header a,
html body .lapp-header label,
html body .lapp-header svg{
  transition:color .55s cubic-bezier(.33,0,.2,1), opacity .2s ease;
}

/* Accueil : transparent tant qu'on est en haut, sans survol, tiroir fermé.
   Conditionné à .lapp-js : si le script ne tourne pas, l'en-tête reste
   blanc en permanence plutôt que de devenir illisible. */
html.lapp-js body.home .lapp-header{
  background-color:rgba(255,255,255,0) !important;
  color:#FFFFFF !important;
  border-bottom-color:rgba(255,255,255,0) !important;
  box-shadow:none !important;
}
html.lapp-js body.home .lapp-header.is-solid,
html.lapp-js body.home .lapp-header:hover,
html.lapp-js body.home .lapp-header:focus-within,
html.lapp-js body:has(.lapp-nav-toggle:checked) .lapp-header{
  background-color:var(--lapp-blanc) !important;
  color:var(--lapp-texte) !important;
  border-bottom-color:#EDEAE1 !important;
}

/* respect du réglage système « réduire les animations » */
@media (prefers-reduced-motion:reduce){
  html body .lapp-header{ transition-duration:.01ms !important; }
}


/* --- WPWriter addition --- */

/* Note pour la maintenance — piège CSS à retenir :
   ne jamais faire cohabiter une @keyframes/animation et une transition
   sur les MÊMES propriétés d'un même élément. L'animation gagne, la
   transition ne peut pas s'interpoler, et tout changement d'état devient
   instantané. Ici on pilote donc l'état par une classe (.is-solid),
   pas par une animation liée au scroll. */


/* --- WPWriter addition --- */

/* ===================================================================
   23. RECHERCHE INSTANTANÉE DANS L'EN-TÊTE
   =================================================================== */
.lapp-search{
  display:inline-flex !important; align-items:center; gap:10px;
  margin:0; padding:0; border:none; background:none;
}
.lapp-search-ico{ display:inline-flex; cursor:pointer; color:inherit; }
.lapp-search-ico svg{ display:block; }
.lapp-search-input{
  border:none !important; outline:none !important; box-shadow:none !important;
  background:transparent !important; color:inherit !important;
  font-family:'Inter',sans-serif !important; font-size:13px !important;
  width:180px; padding:0 !important; margin:0 !important;
  transition:width .35s cubic-bezier(.33,0,.2,1);
  -webkit-appearance:none; appearance:none;
}
.lapp-search-input::placeholder{ color:currentColor; opacity:.68; }
.lapp-search-input:focus{ width:250px; }
.lapp-search-input::-webkit-search-cancel-button{ -webkit-appearance:none; }

/* panneau de résultats */
.lapp-search-panel{
  position:fixed; left:0; right:0;
  top:calc(var(--lapp-head) + var(--lapp-bar));
  z-index:9989;
  background:var(--lapp-blanc);
  border-bottom:1px solid #EDEAE1;
  box-shadow:0 26px 44px -32px rgba(43,42,37,.55);
  max-height:min(72vh,600px); overflow-y:auto;
  opacity:0; visibility:hidden; transform:translateY(-10px);
  transition:opacity .3s ease, transform .3s ease, visibility .3s ease;
  font-family:'Inter',sans-serif;
}
body.lapp-search-open .lapp-search-panel{ opacity:1; visibility:visible; transform:none; }
.lapp-search-inner{ max-width:1180px; margin:0 auto; padding:34px 30px 30px; }
.lapp-search-title{
  font-family:'Inter',sans-serif !important; font-weight:400 !important;
  font-size:11px !important; letter-spacing:.16em; text-transform:uppercase;
  color:var(--lapp-gris) !important; margin:0 0 14px !important;
}
.lapp-search-block + .lapp-search-block{ margin-top:30px; padding-top:26px; border-top:1px solid #F0EADC; }

.lapp-search-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:6px 20px; }
.lapp-res{
  display:flex; align-items:center; gap:14px;
  padding:9px 10px; margin:0 -10px; border-radius:2px;
  text-decoration:none !important; color:var(--lapp-texte) !important;
  transition:background-color .2s ease;
}
.lapp-res:hover{ background:var(--lapp-ivoire); }
.lapp-res-img{
  flex:0 0 auto; width:46px; height:58px; overflow:hidden;
  background:#FAF6EE; border:1px solid #EFE8D8;
}
.lapp-res-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.lapp-res-txt{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.lapp-res-nom{ font-size:13.5px; color:var(--lapp-texte); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lapp-res-prix{ font-size:12.5px; color:var(--lapp-gris); }
.lapp-res--page{ justify-content:space-between; }
.lapp-res-type{
  font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--lapp-or); flex:0 0 auto; margin-left:14px;
}
.lapp-search-empty{ font-size:13.5px; color:var(--lapp-gris); margin:0 !important; }
.lapp-search-all{
  display:inline-block; margin-top:26px; font-size:12.5px;
  color:var(--lapp-texte) !important; text-decoration:none !important;
  border-bottom:1px solid var(--lapp-or); padding-bottom:3px;
}
.lapp-search-all:hover{ color:var(--lapp-or) !important; }

/* pas de recherche dans le tunnel de commande */
body.woocommerce-checkout .lapp-search-panel{ display:none !important; }

/* ---------- mobile : le champ s'ouvre au toucher de la loupe ---------- */
@media (max-width:900px){
  html body .lapp-search-input{
    width:0; opacity:0; pointer-events:none;
    transition:width .3s ease, opacity .3s ease;
  }
  html body .lapp-search:focus-within .lapp-search-input{
    width:42vw; opacity:1; pointer-events:auto;
  }
  /* quand on cherche, on libère la place en masquant le logo */
  html body .lapp-header:has(.lapp-search-input:focus) .lapp-logo{
    opacity:0; pointer-events:none; transition:opacity .2s ease;
  }
  .lapp-search-inner{ padding:24px 16px 22px; }
  .lapp-search-list{ grid-template-columns:1fr; }
}


/* --- WPWriter addition --- */

/* ===================================================================
   24. GABARIT « DOCUMENT » (CGV, mentions légales, confidentialité,
   livraison & retours) + composants éditoriaux réutilisables.
   Envelopper le contenu dans <div class="lapp-doc"> ou <div class="lapp-page-tech">
   =================================================================== */
body:has(.lapp-doc) .wp-site-blocks > main,
body:has(.lapp-doc) main.wp-block-group{ padding:0 !important; background:var(--lapp-blanc); }
body:has(.lapp-doc) .wp-block-post-content,
body:has(.lapp-doc) .entry-content{ max-width:none !important; padding:0 !important; margin:0 !important; }
html body .lapp-doc,html body .lapp-doc-body,html body .lapp-doc-main,
html body .lapp-doc-aside,html body .lapp-contact-grid,html body .lapp-faq{
  margin-top:0 !important; margin-bottom:0 !important;
  margin-left:auto !important; margin-right:auto !important;
  margin-block-start:0 !important; margin-block-end:0 !important;
}

/* corps du document : sommaire collant + colonne de lecture */
.lapp-doc-body{
  display:grid; grid-template-columns:230px minmax(0,1fr);
  gap:64px; max-width:1080px; padding:72px 24px 96px;
}
.lapp-doc-aside{ position:sticky; top:calc(var(--lapp-head) + var(--lapp-bar) + 30px); align-self:start; }
.lapp-doc-aside h2{
  font-family:'Inter',sans-serif !important; font-weight:400 !important;
  font-size:11px !important; letter-spacing:.16em; text-transform:uppercase;
  color:var(--lapp-gris) !important; margin:0 0 16px !important;
}
.lapp-doc-aside a{
  display:block; font-family:'Inter',sans-serif; font-size:13px; line-height:1.5;
  color:var(--lapp-gris) !important; text-decoration:none !important;
  padding:7px 0 7px 14px; border-left:1px solid #EDE6D6;
  transition:color .2s ease, border-color .2s ease;
}
.lapp-doc-aside a:hover{ color:var(--lapp-or) !important; border-left-color:var(--lapp-or); }

.lapp-doc-main{ max-width:72ch; }
.lapp-doc-main h2{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(20px,2.2vw,26px) !important; color:var(--lapp-texte) !important;
  margin:0 0 16px !important; scroll-margin-top:calc(var(--lapp-head) + var(--lapp-bar) + 24px);
}
.lapp-doc-section + .lapp-doc-section{ margin-top:52px; padding-top:44px; border-top:1px solid #F0EADC; }
.lapp-doc-main h3{
  font-family:'Inter',sans-serif !important; font-weight:500 !important;
  font-size:14.5px !important; color:var(--lapp-texte) !important; margin:26px 0 10px !important;
}
.lapp-doc-main p,.lapp-doc-main li{
  font-family:'Inter',sans-serif; font-size:14.5px; line-height:1.85; color:var(--lapp-gris);
}
.lapp-doc-main p{ margin:0 0 14px !important; }
.lapp-doc-main ul{ margin:0 0 14px !important; padding-left:20px; }
.lapp-doc-main li{ margin-bottom:7px; }
.lapp-doc-main strong{ color:var(--lapp-texte); font-weight:500; }
.lapp-doc-main a{ color:var(--lapp-texte) !important; text-decoration:none !important; border-bottom:1px solid var(--lapp-or); }
.lapp-doc-main a:hover{ color:var(--lapp-or) !important; }

/* tableau simple (délais, tarifs) */
.lapp-table{ width:100%; border-collapse:collapse; margin:0 0 18px; font-family:'Inter',sans-serif; font-size:13.5px; }
.lapp-table th,.lapp-table td{ text-align:left; padding:12px 14px; border-bottom:1px solid #F0EADC; color:var(--lapp-gris); }
.lapp-table th{
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--lapp-texte); border-bottom-color:#E4DCC7; font-weight:400;
}
.lapp-table td:last-child{ text-align:right; color:var(--lapp-texte); white-space:nowrap; }

/* encadré d'avertissement (texte provisoire) */
.lapp-notice{
  display:block; background:#FBF6E8; border:1px solid #E8DCBC; border-left:3px solid var(--lapp-or);
  padding:16px 20px; margin:0 0 34px !important;
  font-family:'Inter',sans-serif; font-size:13px; line-height:1.7; color:#6B5B33;
}
.lapp-notice strong{ color:#4E421F; }

/* date de mise à jour */
.lapp-doc-date{
  font-family:'Inter',sans-serif; font-size:12px; letter-spacing:.06em;
  color:var(--lapp-gris); margin:14px 0 0 !important;
}

/* ---------- Contact ---------- */
.lapp-contact-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px; max-width:1180px;
}
.lapp-card{
  background:var(--lapp-blanc); border:1px solid #EFE8D8; padding:32px 28px;
  transition:box-shadow .3s ease, transform .3s ease;
}
.lapp-section--ivory .lapp-card{ background:var(--lapp-blanc); }
.lapp-card:hover{ box-shadow:0 20px 40px -32px rgba(43,42,37,.45); transform:translateY(-2px); }
.lapp-card-ico{
  display:block; width:40px; height:40px; margin-bottom:20px;
  background-image:var(--lapp-logo); background-repeat:no-repeat;
  background-size:72.1px auto; background-position:-16.2px -2.1px; opacity:.9;
}
.lapp-card h3{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:19px !important; color:var(--lapp-texte) !important; margin:0 0 10px !important;
}
.lapp-card p{ font-family:'Inter',sans-serif; font-size:14px; line-height:1.75; color:var(--lapp-gris); margin:0 0 12px !important; }
.lapp-card a{ font-family:'Inter',sans-serif; font-size:13.5px; color:var(--lapp-texte) !important;
  text-decoration:none !important; border-bottom:1px solid var(--lapp-or); padding-bottom:2px; }
.lapp-card a:hover{ color:var(--lapp-or) !important; }

/* formulaire Jetpack aux couleurs de la maison */
.lapp-form-wrap{ max-width:720px; }
.lapp-form-wrap input[type="text"],.lapp-form-wrap input[type="email"],
.lapp-form-wrap input[type="tel"],.lapp-form-wrap textarea,.lapp-form-wrap select{
  font-family:'Inter',sans-serif !important; font-size:14px !important;
  border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; color:var(--lapp-texte) !important;
  box-shadow:none !important; padding:13px 15px !important;
}
.lapp-form-wrap input:focus,.lapp-form-wrap textarea:focus{ border-color:var(--lapp-or) !important; outline:none !important; }
.lapp-form-wrap label{ font-family:'Inter',sans-serif !important; font-size:12.5px !important; color:var(--lapp-gris) !important; }
.lapp-form-wrap button[type="submit"],.lapp-form-wrap .wp-block-button__link{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  letter-spacing:.1em !important; text-transform:uppercase !important;
  background:var(--lapp-texte) !important; color:var(--lapp-blanc) !important;
  border:1px solid var(--lapp-texte) !important; border-radius:0 !important;
  padding:16px 34px !important; box-shadow:none !important;
  transition:background-color .25s ease, border-color .25s ease;
}
.lapp-form-wrap button[type="submit"]:hover,.lapp-form-wrap .wp-block-button__link:hover{
  background:var(--lapp-or) !important; border-color:var(--lapp-or) !important;
}

/* ---------- FAQ (accordéon natif, sans JavaScript) ---------- */
.lapp-faq{ max-width:820px; }
.lapp-faq details{ border-bottom:1px solid #EDE6D6; }
.lapp-faq summary{
  list-style:none; cursor:pointer; padding:22px 40px 22px 0; position:relative;
  font-family:'Inter',sans-serif; font-size:15px; color:var(--lapp-texte);
  transition:color .2s ease;
}
.lapp-faq summary::-webkit-details-marker{ display:none; }
.lapp-faq summary:hover{ color:var(--lapp-or); }
.lapp-faq summary::after{
  content:''; position:absolute; right:6px; top:50%; width:11px; height:11px;
  border-right:1px solid currentColor; border-bottom:1px solid currentColor;
  transform:translateY(-70%) rotate(45deg); transition:transform .3s ease;
}
.lapp-faq details[open] summary::after{ transform:translateY(-30%) rotate(-135deg); }
.lapp-faq details p{
  font-family:'Inter',sans-serif; font-size:14px; line-height:1.8;
  color:var(--lapp-gris); margin:0 0 22px !important; max-width:66ch;
}

@media (max-width:900px){
  .lapp-doc-body{ grid-template-columns:1fr; gap:34px; padding:44px 18px 64px; }
  .lapp-doc-aside{ position:static; }
  .lapp-doc-aside a{ display:inline-block; margin-right:8px; }
  .lapp-contact-grid{ grid-template-columns:1fr; gap:14px; }
}


/* --- WPWriter addition --- */
/* ===================================================================
   25. PIED DE PAGE EN COLONNES
   Toutes les politiques obligatoires y sont accessibles depuis
   n'importe quelle page du site (exigence légale + confiance client).
   =================================================================== */
html body .lapp-foot{ text-align:left !important; padding:64px 24px 40px !important; }
html body .lapp-foot-inner{ max-width:1280px !important; margin:0 auto !important; }

.lapp-foot-cols{
  display:grid;
  grid-template-columns:1.5fr repeat(4,minmax(0,1fr));
  gap:44px 34px;
  align-items:start;
}
html body .lapp-foot-cols{ margin:0 !important; margin-block-start:0 !important; }

.lapp-foot-col{ display:flex; flex-direction:column; }
.lapp-foot-col h3{
  font-family:'Inter',sans-serif !important; font-weight:400 !important;
  font-size:11px !important; letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-texte) !important; margin:0 0 16px !important;
}
.lapp-foot-col a{
  font-size:12.5px; line-height:1.5; color:var(--lapp-gris) !important;
  text-decoration:none !important; padding:6px 0; transition:color .2s ease;
}
.lapp-foot-col a:hover{ color:var(--lapp-or) !important; }

.lapp-foot-brand .lapp-foot-logo{ margin-bottom:18px !important; align-self:flex-start; }
.lapp-foot-brand p{
  font-size:12.5px; line-height:1.75; color:var(--lapp-gris);
  margin:0 !important; max-width:34ch;
}

html body .lapp-foot-legal{
  display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
  margin-top:52px !important; padding-top:24px;
  border-top:1px solid #E8DFCC; font-size:12px; opacity:1;
}
.lapp-foot-reassure{ color:var(--lapp-gris); }

@media (max-width:1100px){
  .lapp-foot-cols{ grid-template-columns:1fr 1fr 1fr; gap:38px 28px; }
  .lapp-foot-brand{ grid-column:1 / -1; }
}
@media (max-width:640px){
  html body .lapp-foot{ padding:48px 18px 34px !important; text-align:center !important; }
  .lapp-foot-cols{ grid-template-columns:1fr; gap:30px; }
  .lapp-foot-col{ align-items:center; }
  .lapp-foot-brand .lapp-foot-logo{ align-self:center; }
  .lapp-foot-brand p{ max-width:none; }
  html body .lapp-foot-legal{ justify-content:center; text-align:center; }
}

/* ---- retrait des marges auto d'Assembler sur les nouveaux blocs ---- */
html body .lapp-foot-cols,html body .lapp-foot-col,html body .lapp-foot-legal{
  margin-block-start:0 !important;
}

/* ---- gabarit « document » : le sommaire ne doit pas passer sous le header ---- */
.lapp-doc .lapp-doc-body{ padding-top:64px; }
.lapp-doc-main .lapp-table{ margin-top:6px; }
/* un tableau sans <thead> : la première colonne sert de libellé */
.lapp-table tr th:first-child{ width:58%; }


/* --- WPWriter addition --- */
/* mention de livraison en bas du tiroir (ce n'est pas un lien) */
.lapp-drawer-foot .lapp-drawer-ship{
  display:block; font-size:12px; color:var(--lapp-gris);
  padding:14px 0 0; margin-top:8px; border-top:1px solid #F2ECDE;
}


/* --- WPWriter addition --- */
/* ===================================================================
   26. Correctifs du gabarit « document »
   a) overflow-x:hidden sur html/body crée un conteneur de défilement :
      position:sticky ne fonctionne plus à l'intérieur. `clip` coupe
      le débordement SANS créer ce conteneur — le sommaire redevient
      collant. (Piège classique, à retenir.)
   b) le thème impose une largeur au <aside> : on la relâche pour
      qu'il occupe toute sa colonne de grille.
   =================================================================== */
html:root{ overflow-x:clip !important; }
body{ overflow-x:clip !important; }

html body .lapp-doc-aside{
  width:auto !important; max-width:none !important;
  float:none !important; box-sizing:border-box !important;
}


/* --- WPWriter addition --- */
/* Suite du correctif : le reset « margin-left/right:auto » de la section 24
   s'appliquait aussi aux deux colonnes du document. Sur un élément de
   grille étiré, des marges automatiques le font rétrécir à son contenu
   puis le centrent — d'où un sommaire deux fois trop étroit.
   Les colonnes du document sont donc explicitement calées à gauche. */
html body .lapp-doc-aside,
html body .lapp-doc-main{
  margin-left:0 !important; margin-right:0 !important;
}


/* --- WPWriter addition --- */
/* le formulaire de contact doit être centré dans sa section */
html body .lapp-form-wrap{
  margin-left:auto !important; margin-right:auto !important;
  margin-block-start:0 !important;
}
.lapp-form-wrap .wp-block-jetpack-contact-form{ margin:0 !important; }
/* case de consentement : la coche alignée sur la première ligne du texte */
.lapp-form-wrap .grunion-field-consent-wrap label,
.lapp-form-wrap .contact-form .grunion-field-consent-wrap{
  display:flex; align-items:flex-start; gap:10px;
}
.lapp-form-wrap .grunion-field-consent-wrap input[type="checkbox"]{ margin-top:3px; flex:0 0 auto; }


/* --- WPWriter addition --- */
/* ===================================================================
   27. BOUTIQUE — COLONNE DE FILTRES À GAUCHE
   Les filtres sont des blocs WooCommerce : les catégories, couleurs et
   tailles ajoutées plus tard depuis l'administration apparaissent
   automatiquement, sans toucher au code.
   =================================================================== */
html body .lapp-shop{
  display:grid !important;
  grid-template-columns:250px minmax(0,1fr);
  gap:56px;
  max-width:1560px;
  margin:34px auto 0 !important;
  padding:0 24px;
  align-items:start;
  box-sizing:border-box;
}
html body .lapp-shop > *{ margin-block-start:0 !important; }

/* la colonne de gauche reste visible pendant le défilement */
html body .lapp-shop-side{
  position:sticky; top:calc(var(--lapp-head) + var(--lapp-bar) + 28px);
  margin:0 !important; align-self:start;
}
html body .lapp-shop-main{ margin:0 !important; min-width:0; }
/* les blocs internes gardaient un alignement « large » hérité du gabarit */
html body .lapp-shop-main .alignwide,
html body .lapp-shop-main .wp-block-woocommerce-product-collection{
  width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important;
}
html body .lapp-shop-main .wc-block-product-template{ margin-top:22px !important; }

/* ---------- habillage des filtres ---------- */
.lapp-shop-side .wp-block-woocommerce-product-filters{ margin:0 !important; }
.lapp-shop-side .lapp-filter-title{
  font-family:'Inter',sans-serif !important; font-weight:400 !important;
  font-size:11px !important; letter-spacing:.16em !important; text-transform:uppercase !important;
  color:var(--lapp-gris) !important; margin:0 0 14px !important;
}
.lapp-shop-side .wp-block-woocommerce-product-filter-taxonomy,
.lapp-shop-side .wp-block-woocommerce-product-filter-attribute,
.lapp-shop-side .wp-block-woocommerce-product-filter-price,
.lapp-shop-side .wp-block-woocommerce-product-filter-status{
  padding:24px 0; border-top:1px solid #EDE6D6; margin:0 !important;
}
.lapp-shop-side .wp-block-woocommerce-product-filter-taxonomy:first-of-type{ border-top:none; padding-top:0; }

/* listes à cocher */
.lapp-shop-side .wc-block-product-filter-checkbox-list__list{
  list-style:none !important; margin:0 !important; padding:0 !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__item{
  display:flex !important; align-items:center; gap:10px; padding:6px 0 !important; margin:0 !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__label,
.lapp-shop-side .wc-block-product-filter-checkbox-list__text{
  font-family:'Inter',sans-serif !important; font-size:13.5px !important;
  color:var(--lapp-texte) !important; cursor:pointer;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__text-count{
  color:var(--lapp-gris) !important; font-size:12px !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__input-wrapper .wc-block-product-filter-checkbox-list__input{
  accent-color:var(--lapp-or); width:15px; height:15px; border-radius:0 !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__label:hover{ color:var(--lapp-or) !important; }

/* pastilles (couleur, taille) */
.lapp-shop-side .wc-block-product-filter-chips__items{ display:flex; flex-wrap:wrap; gap:7px; }
.lapp-shop-side .wc-block-product-filter-chips__item{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  padding:8px 13px !important; border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; color:var(--lapp-texte) !important;
  box-shadow:none !important; cursor:pointer;
  transition:border-color .2s ease, background-color .2s ease, color .2s ease;
}
.lapp-shop-side .wc-block-product-filter-chips__item:hover{ border-color:var(--lapp-texte) !important; }
.lapp-shop-side .wc-block-product-filter-chips__item[aria-checked="true"],
.lapp-shop-side .wc-block-product-filter-chips__item.is-active{
  background:var(--lapp-texte) !important; border-color:var(--lapp-texte) !important; color:var(--lapp-blanc) !important;
}

/* curseur de prix */
.lapp-shop-side .wc-block-product-filter-price-slider__range{ accent-color:var(--lapp-or); }
.lapp-shop-side .wc-block-product-filter-price-slider__content,
.lapp-shop-side .wc-block-product-filter-price-slider__left,
.lapp-shop-side .wc-block-product-filter-price-slider__right{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important; color:var(--lapp-gris) !important;
}

/* filtres actifs + bouton de réinitialisation */
.lapp-shop-side .wp-block-woocommerce-product-filter-active{ margin:0 0 6px !important; }
.lapp-shop-side .wc-block-product-filter-removable-chips__item{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  background:var(--lapp-ivoire) !important; border:1px solid #E4DCC7 !important;
  border-radius:0 !important; color:var(--lapp-texte) !important;
}
.lapp-shop-side .wc-block-product-filter-clear-button,
.lapp-shop-side .wp-block-woocommerce-product-filter-clear-button a{
  font-family:'Inter',sans-serif !important; font-size:12px !important;
  color:var(--lapp-gris) !important; text-decoration:none !important;
  border-bottom:1px solid var(--lapp-or); padding-bottom:2px;
}
.lapp-shop-side .wc-block-product-filter-clear-button:hover{ color:var(--lapp-or) !important; }

/* barre « X résultats » + tri, alignée au-dessus de la grille */
html body .lapp-shop-main .wp-block-woocommerce-product-results-count{ margin:0 !important; }

@media (max-width:1100px){
  html body .lapp-shop{ grid-template-columns:210px minmax(0,1fr); gap:34px; }
}
@media (max-width:900px){
  html body .lapp-shop{
    grid-template-columns:1fr; gap:0; padding:0 14px;
  }
  html body .lapp-shop-side{ position:static; margin-bottom:26px !important; }
  /* sur mobile, WooCommerce replie les filtres dans un tiroir déclenché
     par son propre bouton : on lui laisse la main */
  .lapp-shop-side .wp-block-woocommerce-product-filters{ width:100%; }
}


/* --- WPWriter addition --- */
/* les listes de filtres arrivent avec un cadre arrondi par défaut :
   on l'efface pour rester sur la ligne graphique de la Maison */
.lapp-shop-side .wc-block-product-filter-checkbox-list,
.lapp-shop-side .wc-block-product-filter-checkbox-list__list,
.lapp-shop-side .wp-block-woocommerce-product-filter-checkbox-list{
  border:none !important; border-radius:0 !important; background:transparent !important;
  padding:0 !important; box-shadow:none !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__item{ border:none !important; }
/* libellé et compteur sur la même ligne, compteur discret à droite */
.lapp-shop-side .wc-block-product-filter-checkbox-list__label{
  display:flex !important; align-items:center; justify-content:space-between;
  gap:10px; width:100%;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__text{ line-height:1.4; }
.lapp-shop-side .wc-block-product-filter-checkbox-list__text-count{ flex:0 0 auto; }
/* champs min / max du curseur de prix */
.lapp-shop-side .wc-block-product-filter-price-slider__content input{
  font-family:'Inter',sans-serif !important; font-size:12.5px !important;
  border:1px solid #DED7C4 !important; border-radius:0 !important;
  background:var(--lapp-blanc) !important; color:var(--lapp-texte) !important;
  box-shadow:none !important; padding:9px 11px !important;
}


/* --- WPWriter addition --- */
/* correctif : « space-between » repoussait le libellé au milieu de la
   ligne. Le libellé colle désormais à la case, le compteur part à droite. */
.lapp-shop-side .wc-block-product-filter-checkbox-list__label{
  justify-content:flex-start !important;
}
.lapp-shop-side .wc-block-product-filter-checkbox-list__text-count{
  margin-left:auto !important;
}
/* curseur de prix : piste visible et poignées aux couleurs de la Maison */
.lapp-shop-side .wc-block-product-filter-price-slider{ margin-top:4px; }
.lapp-shop-side .wc-block-product-filter-price-slider__range{
  --range-color:var(--lapp-or);
  height:2px; margin:14px 0 18px;
}
.lapp-shop-side .wc-block-product-filter-price-slider__content{
  display:flex; gap:10px; align-items:center;
}
.lapp-shop-side .wc-block-product-filter-price-slider__content > *{ flex:1 1 0; min-width:0; }


/* --- WPWriter addition --- */
/* le <fieldset> natif du navigateur ajoutait un cadre gris autour des listes */
.lapp-shop-side fieldset{
  border:none !important; margin:0 !important; padding:0 !important; min-width:0 !important;
}
.lapp-shop-side legend{ padding:0 !important; }

/* curseur de prix : la piste occupe toute la largeur, les deux champs
   se partagent la ligne du dessous (mon réglage précédent les mettait
   tous les trois côte à côte) */
.lapp-shop-side .wc-block-product-filter-price-slider__content{
  display:grid !important; grid-template-columns:1fr 1fr; gap:12px 10px; align-items:center;
}
.lapp-shop-side .wc-block-product-filter-price-slider__content > *{ flex:none !important; }
.lapp-shop-side .wc-block-product-filter-price-slider__range{
  grid-column:1 / -1; margin:6px 0 4px !important;
}
.lapp-shop-side .wc-block-product-filter-price-slider__left,
.lapp-shop-side .wc-block-product-filter-price-slider__right{ min-width:0; }
.lapp-shop-side .wc-block-product-filter-price-slider__left input,
.lapp-shop-side .wc-block-product-filter-price-slider__right input{ width:100% !important; }


/* --- WPWriter addition --- */
/* WooCommerce imposait ses propres largeurs aux deux champs de prix :
   on force la répartition en deux colonnes égales. */
.lapp-shop-side .wc-block-product-filter-price-slider__content{
  grid-template-columns:1fr 1fr !important;
}
.lapp-shop-side .wc-block-product-filter-price-slider__left,
.lapp-shop-side .wc-block-product-filter-price-slider__right{
  width:auto !important; max-width:none !important; flex:none !important;
}
.lapp-shop-side .wc-block-product-filter-price-slider__left input,
.lapp-shop-side .wc-block-product-filter-price-slider__right input{
  width:100% !important; min-width:0 !important; box-sizing:border-box !important;
  text-align:left !important;
}


/* --- WPWriter addition --- */
/* WooCommerce place les champs sur des lignes de grille NOMMÉES
   (« left-input » / « right-input »). En redéfinissant les colonnes,
   ces noms disparaissaient et les champs partaient n'importe où.
   On leur réattribue donc une position explicite. */
.lapp-shop-side .wc-block-product-filter-price-slider__range{ grid-column:1 / -1 !important; }
.lapp-shop-side .wc-block-product-filter-price-slider__left{ grid-column:1 !important; }
.lapp-shop-side .wc-block-product-filter-price-slider__right{ grid-column:2 !important; }


/* --- WPWriter addition --- */
/* curseur de prix : on rend la main à WooCommerce pour la mécanique
   (mon height:2px écrasait la zone des poignées) et on ne garde que
   la couleur de la Maison. */
.lapp-shop-side .wc-block-product-filter-price-slider__range{
  height:auto !important; border:none !important; background:transparent !important;
  --wp--preset--color--contrast:var(--lapp-texte);
}
.lapp-shop-side .wc-block-product-filter-price-slider__range .range-bar{
  background-color:var(--lapp-or) !important;
}
.lapp-shop-side .wc-block-product-filter-price-slider__range input[type="range"]{
  accent-color:var(--lapp-or);
}


/* --- WPWriter addition --- */
/* mes styles de champ s'appliquaient aussi aux deux input[type=range]
   du curseur : d'où le rectangle blanc bordé au-dessus des prix. */
.lapp-shop-side input[type="range"]{
  border:none !important; background:transparent !important;
  padding:0 !important; height:auto !important; box-shadow:none !important;
}


/* --- WPWriter addition --- */
/* ===================================================================
   28. FILTRE « TAILLE » — ORDRE PHYSIQUE, PAS ALPHABÉTIQUE
   Le bloc WooCommerce ne sait trier que par nom ou par nombre de
   résultats : on obtenait L, L/XL, M, S, S/M. On réordonne donc les
   pastilles en CSS, à partir de leur identifiant de terme.
   Pour ajouter une taille plus tard : créer le terme dans
   Produits → Attributs → Taille, puis ajouter une ligne ici avec le
   slug correspondant. Les tailles non listées se placent à la fin,
   dans l'ordre alphabétique (order:60 par défaut).
   =================================================================== */
.lapp-shop-side .wc-block-product-filter-chips__items{ display:flex !important; }
.lapp-shop-side .wc-block-product-filter-chips__item[id^="attribute/taille-"]{ order:60; }

.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xxs"]{ order:1; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xs"]{ order:2; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xs-s"]{ order:3; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-s"]{ order:4; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-s-m"]{ order:5; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-m"]{ order:6; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-m-l"]{ order:7; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-l"]{ order:8; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-l-xl"]{ order:9; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xl"]{ order:10; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xl-xxl"]{ order:11; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xxl"]{ order:12; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-xxxl"]{ order:13; }
/* tailles chiffrées (tour de tête) */
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-54"]{ order:20; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-55"]{ order:21; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-56"]{ order:22; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-57"]{ order:23; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-58"]{ order:24; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-59"]{ order:25; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-60"]{ order:26; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-61"]{ order:27; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-62"]{ order:28; }
/* « taille unique » toujours en dernier */
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-unique"]{ order:90; }
.lapp-shop-side .wc-block-product-filter-chips__item[id="attribute/taille-taille-unique"]{ order:90; }

/* la barre au-dessus de la grille n'a plus que le compteur de résultats */
html body .lapp-shop-main .wp-block-woocommerce-product-results-count{
  margin:0 0 4px !important; text-align:left !important;
}


/* --- WPWriter addition --- */
/* ===================================================================
   29. TIROIR — MENU PLUS AÉRÉ
   Cinq entrées seulement : on augmente la taille et l'interlettrage
   vertical pour que le menu occupe l'espace au lieu d'être tassé
   en haut du panneau.
   =================================================================== */
html body .lapp-drawer .wp-block-navigation-item__content{
  font-size:21px !important;
  line-height:1.28 !important;
  padding:17px 0 !important;
}
/* le bouton « Fermer » respire un peu plus avant la première entrée */
html body .lapp-drawer-close{ margin-bottom:52px !important; }

/* Trois respirations, comme trois familles :
   la nouveauté · la boutique · la marque.
   (Si le client réordonne le menu, ces respirations se déplaceront —
   sans rien casser : l'espacement redevient simplement régulier.) */
html body .lapp-drawer .wp-block-navigation__container > .wp-block-navigation-item:nth-child(1),
html body .lapp-drawer .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3){
  margin-bottom:22px !important;
}

@media (max-height:700px){
  html body .lapp-drawer .wp-block-navigation-item__content{
    font-size:19px !important; padding:13px 0 !important;
  }
  html body .lapp-drawer-close{ margin-bottom:34px !important; }
}


/* --- WPWriter addition --- */

/* ===================================================================
   22. BARRE DE CATÉGORIES DU VESTIAIRE
   Deuxième ligne du header, affichée uniquement dans l'univers
   « Le Vestiaire » (la catégorie mère, ses 4 sections et leurs
   sous-catégories). Le marquage est dans Apparence > Éditeur >
   Parties de modèle > En-tête (bloc HTML « lapp-catbar »).
   =================================================================== */
:root{ --lapp-catbar:46px; }

html body .lapp-catbar{
  display:none;
  position:fixed !important; left:0; right:0;
  top:calc(var(--lapp-head) + var(--lapp-bar));
  z-index:9989;
  height:var(--lapp-catbar);
  box-sizing:border-box;
  background:var(--lapp-blanc);
  border-bottom:1px solid #EDEAE1;
  margin:0 !important; margin-block-start:0 !important; margin-block-end:0 !important;
  padding:0 !important;
  font-family:'Inter',sans-serif;
}
html body .lapp-catbar .lapp-catbar-inner{
  display:flex !important; align-items:center; justify-content:center;
  gap:40px; height:100%; margin:0 !important; padding:0 30px !important;
  list-style:none !important; overflow-x:auto;
  scrollbar-width:none;
}
html body .lapp-catbar .lapp-catbar-inner::-webkit-scrollbar{ display:none; }
html body .lapp-catbar li{ list-style:none !important; margin:0 !important; padding:0 !important; }
html body .lapp-catbar a{
  display:inline-block; white-space:nowrap;
  font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; line-height:1;
  color:var(--lapp-gris) !important; text-decoration:none !important;
  box-shadow:none !important; background:none !important;
  padding-bottom:6px; border-bottom:1px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
html body .lapp-catbar a:hover{ color:var(--lapp-texte) !important; }

/* ---- affichage : uniquement dans l'univers Le Vestiaire ---- */
body.term-1393 .lapp-catbar,
body.term-1398 .lapp-catbar, body.term-1376 .lapp-catbar, body.term-1378 .lapp-catbar,
body.term-1379 .lapp-catbar, body.term-1401 .lapp-catbar, body.term-1402 .lapp-catbar,
body.term-1403 .lapp-catbar,
body.term-1394 .lapp-catbar, body.term-1395 .lapp-catbar, body.term-1396 .lapp-catbar,
body.term-1404 .lapp-catbar, body.term-1405 .lapp-catbar,
body.term-1399 .lapp-catbar, body.term-1406 .lapp-catbar, body.term-1407 .lapp-catbar,
body.term-1408 .lapp-catbar, body.term-1409 .lapp-catbar,
body.term-1400 .lapp-catbar, body.term-1410 .lapp-catbar, body.term-1411 .lapp-catbar{
  display:block !important;
}

/* ---- section active soulignée en or ---- */
body.term-1398 .lapp-catbar .cb-quotidien a, body.term-1376 .lapp-catbar .cb-quotidien a,
body.term-1378 .lapp-catbar .cb-quotidien a, body.term-1379 .lapp-catbar .cb-quotidien a,
body.term-1401 .lapp-catbar .cb-quotidien a, body.term-1402 .lapp-catbar .cb-quotidien a,
body.term-1403 .lapp-catbar .cb-quotidien a,
body.term-1394 .lapp-catbar .cb-spirituel a, body.term-1395 .lapp-catbar .cb-spirituel a,
body.term-1396 .lapp-catbar .cb-spirituel a, body.term-1404 .lapp-catbar .cb-spirituel a,
body.term-1405 .lapp-catbar .cb-spirituel a,
body.term-1400 .lapp-catbar .cb-enfants a, body.term-1410 .lapp-catbar .cb-enfants a,
body.term-1411 .lapp-catbar .cb-enfants a,
body.term-1399 .lapp-catbar .cb-performance a, body.term-1406 .lapp-catbar .cb-performance a,
body.term-1407 .lapp-catbar .cb-performance a, body.term-1408 .lapp-catbar .cb-performance a,
body.term-1409 .lapp-catbar .cb-performance a{
  color:var(--lapp-texte) !important;
  border-bottom-color:var(--lapp-or) !important;
}

/* ---- le contenu descend de la hauteur de la barre ---- */
body.term-1393 main.wp-block-group,
body.term-1398 main.wp-block-group, body.term-1376 main.wp-block-group,
body.term-1378 main.wp-block-group, body.term-1379 main.wp-block-group,
body.term-1401 main.wp-block-group, body.term-1402 main.wp-block-group,
body.term-1403 main.wp-block-group,
body.term-1394 main.wp-block-group, body.term-1395 main.wp-block-group,
body.term-1396 main.wp-block-group, body.term-1404 main.wp-block-group,
body.term-1405 main.wp-block-group,
body.term-1399 main.wp-block-group, body.term-1406 main.wp-block-group,
body.term-1407 main.wp-block-group, body.term-1408 main.wp-block-group,
body.term-1409 main.wp-block-group,
body.term-1400 main.wp-block-group, body.term-1410 main.wp-block-group,
body.term-1411 main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar) + var(--lapp-catbar) + 46px) !important;
}

@media (max-width:900px){
  :root{ --lapp-catbar:42px; }
  html body .lapp-catbar .lapp-catbar-inner{
    gap:26px; padding:0 16px !important; justify-content:flex-start;
  }
  html body .lapp-catbar a{ font-size:10.5px; letter-spacing:.16em; }
}


/* --- WPWriter addition --- */
/* ===================================================================
   30. NOUVELLE ARBORESCENCE — 5 FAMILLES
   Le menu passe de 5 à 7 entrées : les respirations de la section 29
   étaient calées sur l'ancien découpage, on les recale.
   Une seule respiration désormais : entre les 5 familles de la
   boutique et les 2 pages de marque.
   =================================================================== */
html body .lapp-drawer .wp-block-navigation__container > .wp-block-navigation-item:nth-child(1),
html body .lapp-drawer .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3){
  margin-bottom:0 !important;
}
html body .lapp-drawer .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5){
  margin-bottom:24px !important;
}
/* 7 entrées au lieu de 5 : on resserre légèrement pour rester lisible
   sans faire défiler le panneau */
html body .lapp-drawer .wp-block-navigation-item__content{
  font-size:19px !important; padding:14px 0 !important;
}

/* grille « Explorez les pièces de la Maison » — 5 familles de plain-pied */
html body .lapp-grid--5{ grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
@media (max-width:1100px){
  html body .lapp-grid--5{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:640px){
  html body .lapp-grid--5{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}


/* --- WPWriter addition --- */
/* ===================================================================
   31. CATALOGUE RÉEL — VISUELS CARRÉS
   Les photos du client sont toutes carrées (1254×1254). Le cadrage
   4/5 posé au début rognait donc 20 % de chaque image. On passe la
   grille, la galerie et le panier en 1/1 : plus aucun recadrage.
   =================================================================== */
html body .wc-block-product-template .wc-block-components-product-image img,
html body .wc-block-product-template .wp-block-woocommerce-product-image img{
  aspect-ratio:1/1 !important;
}
html body.single-product .wc-block-product-gallery-large-image img,
html body.single-product .wp-block-woocommerce-product-image img{
  aspect-ratio:1/1 !important;
}
html body .wc-block-cart-item__image img,
html body .lapp-res-img{ aspect-ratio:1/1 !important; }
html body .lapp-res-img{ height:46px; }

/* la vignette de recherche instantanée suit le même cadrage */
html body .lapp-res-img img{ aspect-ratio:1/1; object-fit:cover; }


/* --- WPWriter addition --- */
/* ===================================================================
   32. BARRE DES FAMILLES + BANNIÈRE DE CATÉGORIE
   Une seule bannière est écrite dans le gabarit pour chacune des 5
   familles ; la CSS n'affiche que celle qui correspond à la page.
   La barre se comporte comme un prolongement de l'en-tête et permet
   de passer d'une famille à l'autre en un clic.
   =================================================================== */
html body .lapp-fam-nav,
html body .lapp-fam-hero,
html body .lapp-fh{ margin:0 !important; margin-block-start:0 !important; }

.lapp-anchor{ display:block; height:0; scroll-margin-top:calc(var(--lapp-head) + var(--lapp-bar) + 54px); }

/* ---------- barre des familles ---------- */
.lapp-fam-nav{
  display:flex !important; justify-content:center; align-items:stretch;
  gap:clamp(18px,3vw,44px); flex-wrap:wrap;
  background:var(--lapp-blanc);
  border-bottom:1px solid #EDEAE1;
  padding:0 22px;
  position:sticky; top:calc(var(--lapp-head) + var(--lapp-bar)); z-index:9985;
}
.lapp-fam-link{
  font-family:'Inter',sans-serif; font-size:11.5px; letter-spacing:.18em;
  text-transform:uppercase; white-space:nowrap;
  color:var(--lapp-gris) !important; text-decoration:none !important;
  padding:17px 2px 15px; border-bottom:2px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
.lapp-fam-link:hover{ color:var(--lapp-texte) !important; }

/* état actif — famille courante */
body.term-quotidien   .lapp-fam-link[data-fam="quotidien"],
body.term-spirituel   .lapp-fam-link[data-fam="spirituel"],
body.term-performance .lapp-fam-link[data-fam="performance"],
body.term-enfants     .lapp-fam-link[data-fam="enfants"],
body.term-accessoires .lapp-fam-link[data-fam="accessoires"],
/* état actif hérité — on est dans une sous-catégorie */
body.term-casquettes .lapp-fam-link[data-fam="quotidien"],
body.term-berets .lapp-fam-link[data-fam="quotidien"],
body.term-bonnets-docker .lapp-fam-link[data-fam="quotidien"],
body.term-bonnets-urbains .lapp-fam-link[data-fam="quotidien"],
body.term-bobs .lapp-fam-link[data-fam="quotidien"],
body.term-kippas .lapp-fam-link[data-fam="spirituel"],
body.term-chechias .lapp-fam-link[data-fam="spirituel"],
body.term-shemaghs .lapp-fam-link[data-fam="spirituel"],
body.term-turbans .lapp-fam-link[data-fam="spirituel"],
body.term-foulards .lapp-fam-link[data-fam="spirituel"],
body.term-cyclisme .lapp-fam-link[data-fam="performance"],
body.term-natation .lapp-fam-link[data-fam="performance"],
body.term-running .lapp-fam-link[data-fam="performance"],
body.term-ski .lapp-fam-link[data-fam="performance"],
body.term-casquettes-enfant .lapp-fam-link[data-fam="enfants"],
body.term-casquettes-sahara .lapp-fam-link[data-fam="enfants"],
body.term-rangement-transport .lapp-fam-link[data-fam="accessoires"],
body.term-entretien .lapp-fam-link[data-fam="accessoires"],
body.term-bijouterie .lapp-fam-link[data-fam="accessoires"]{
  color:var(--lapp-texte) !important;
  border-bottom-color:var(--lapp-or);
}

/* ---------- bannière ---------- */
.lapp-fam-hero{ background:var(--lapp-ivoire); }
.lapp-fh{ display:none; }
body.term-quotidien   .lapp-fh[data-fam="quotidien"],
body.term-spirituel   .lapp-fh[data-fam="spirituel"],
body.term-performance .lapp-fh[data-fam="performance"],
body.term-enfants     .lapp-fh[data-fam="enfants"],
body.term-accessoires .lapp-fh[data-fam="accessoires"]{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(20px,4vw,56px); align-items:center;
  max-width:1440px; margin:0 auto !important;
  padding:clamp(34px,4vw,58px) clamp(20px,4vw,54px);
}
/* sur une page de famille, la bannière remplace le titre d'archive */
body.term-quotidien .wp-block-query-title, body.term-quotidien .wp-block-term-description, body.term-quotidien .wc-block-breadcrumbs,
body.term-spirituel .wp-block-query-title, body.term-spirituel .wp-block-term-description, body.term-spirituel .wc-block-breadcrumbs,
body.term-performance .wp-block-query-title, body.term-performance .wp-block-term-description, body.term-performance .wc-block-breadcrumbs,
body.term-enfants .wp-block-query-title, body.term-enfants .wp-block-term-description, body.term-enfants .wc-block-breadcrumbs,
body.term-accessoires .wp-block-query-title, body.term-accessoires .wp-block-term-description, body.term-accessoires .wc-block-breadcrumbs{
  display:none !important;
}

.lapp-fh-eyebrow{
  display:block; font-family:'Inter',sans-serif; font-size:11px;
  letter-spacing:.24em; text-transform:uppercase; color:var(--lapp-or);
}
html body .lapp-fh-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(36px,5.4vw,66px) !important; line-height:1 !important;
  letter-spacing:.02em; color:var(--lapp-texte) !important;
  margin:16px 0 12px !important; text-align:left !important; max-width:none !important;
}
html body .lapp-fh-baseline{
  font-family:'Playfair Display',serif; font-weight:400;
  font-size:clamp(17px,2vw,24px); line-height:1.3; color:var(--lapp-texte);
  margin:0 0 18px !important;
}
html body .lapp-fh-desc{
  font-family:'Inter',sans-serif; font-size:14px; line-height:1.75;
  color:var(--lapp-gris); max-width:46ch; margin:0 0 28px !important;
}
.lapp-fh-cta{ display:flex; gap:12px; flex-wrap:wrap; }
.lapp-btn-dark,.lapp-btn-outline{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:'Inter',sans-serif; font-size:12.5px; letter-spacing:.06em;
  padding:14px 26px; border-radius:0; text-decoration:none !important;
  box-shadow:none !important; transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.lapp-btn-dark{ background:var(--lapp-texte); border:1px solid var(--lapp-texte); color:var(--lapp-blanc) !important; }
.lapp-btn-dark:hover{ background:var(--lapp-or); border-color:var(--lapp-or); }
.lapp-btn-outline{ background:transparent; border:1px solid #CBC5B5; color:var(--lapp-texte) !important; }
.lapp-btn-outline:hover{ border-color:var(--lapp-texte); background:var(--lapp-blanc); }

/* visuels : trois pièces qui se chevauchent, fond blanc fondu dans l'ivoire */
.lapp-fh-media{ display:flex; align-items:center; justify-content:center; }
.lapp-fh-media img{
  display:block; height:auto; mix-blend-mode:multiply;
  filter:drop-shadow(0 26px 34px rgba(43,42,37,.14));
}
.lapp-fh-media img:nth-child(1){ width:44%; z-index:3; }
.lapp-fh-media img:nth-child(2){ width:36%; margin-left:-5%; z-index:2; }
.lapp-fh-media img:nth-child(3){ width:30%; margin-left:-4%; z-index:1; }

/* la colonne de filtres démarre sous la barre des familles */
html body .lapp-shop-side{ top:calc(var(--lapp-head) + var(--lapp-bar) + 78px); }

@media (max-width:900px){
  .lapp-fam-nav{ gap:16px; padding:0 12px; overflow-x:auto; justify-content:flex-start; flex-wrap:nowrap; }
  .lapp-fam-link{ font-size:10.5px; letter-spacing:.14em; padding:14px 2px 12px; }
  body.term-quotidien .lapp-fh[data-fam="quotidien"],
  body.term-spirituel .lapp-fh[data-fam="spirituel"],
  body.term-performance .lapp-fh[data-fam="performance"],
  body.term-enfants .lapp-fh[data-fam="enfants"],
  body.term-accessoires .lapp-fh[data-fam="accessoires"]{
    grid-template-columns:1fr; gap:24px; text-align:center; padding:30px 18px 34px;
  }
  html body .lapp-fh-title{ text-align:center !important; }
  html body .lapp-fh-desc{ max-width:none; margin-left:auto !important; margin-right:auto !important; }
  .lapp-fh-cta{ justify-content:center; }
  .lapp-fh-media{ order:-1; }
  html body .lapp-shop-side{ top:auto; }
}


/* --- WPWriter addition --- */
/* Le gabarit place ses enfants dans une mise en page « contrainte » :
   Assembler leur impose la largeur de contenu du thème (620 px).
   La barre et la bannière doivent occuper toute la largeur. */
html body .lapp-fam-nav,
html body .lapp-fam-hero,
html body .lapp-anchor{
  max-width:none !important; width:100% !important;
  margin-left:0 !important; margin-right:0 !important;
  box-sizing:border-box;
}


/* --- WPWriter addition --- */
/* ===================================================================
   33. CORRECTIF — la barre des familles doit prolonger l'en-tête
   Deux défauts visibles à l'ouverture du tiroir :
   a) le <main> des archives gardait un décalage de 46 px sous
      l'en-tête fixe, ce qui laissait passer une bande de contenu
      assombri entre l'en-tête et la barre ;
   b) la barre flottait donc seule au milieu du voile.
   On colle la barre sous l'en-tête : les deux ne forment plus qu'un
   bloc, et restent éclairés ensemble quand le menu est ouvert.
   (Le sélecteur exclut volontairement la fiche produit, qui a son
   propre décalage — section 15.)
   =================================================================== */
html body.post-type-archive-product main.wp-block-group,
html body.tax-product_cat main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar)) !important;
}

/* l'espace retiré est rendu aux pages sans bannière (boutique,
   sous-catégories) : le fil d'Ariane ne doit pas coller à la barre */
html body .wc-block-breadcrumbs{ margin-top:36px !important; }

/* la barre reprend exactement le fond de l'en-tête, sans liseré double */
html body .lapp-fam-nav{
  background:var(--lapp-blanc) !important;
  border-top:none !important;
}


/* --- WPWriter addition --- */
/* ===================================================================
   34. VRAIES PHOTOS À LA PLACE DES DÉGRADÉS
   =================================================================== */
/* vignettes de familles sur l'accueil */
.lapp-tile-img{ background:var(--lapp-blanc) !important; }
.lapp-tile-img img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block;
  transition:transform .7s cubic-bezier(.22,.61,.36,1);
}
.lapp-tile:hover .lapp-tile-img img{ transform:scale(1.04); }
/* le filigrane du logo n'a plus lieu d'être quand il y a une photo */
.lapp-tile-img:has(img)::after{ display:none !important; }

/* bloc Technologie : vue intérieure, c'est le sujet même de la page */
.lapp-tech-media--photo{ overflow:hidden; background:var(--lapp-blanc) !important; }
.lapp-tech-media--photo img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.lapp-tech-media--photo::after{ display:none !important; }

/* ===================================================================
   35. BANNIÈRES — les visuels deviennent des cartes assumées
   Le mode de fusion « multiply » faisait ressortir le fond des photos
   en carrés grisâtres sur l'ivoire. On assume trois cartes blanches
   qui se chevauchent : c'est net, et ça reste dans la palette.
   =================================================================== */
.lapp-fh-media img{
  mix-blend-mode:normal !important;
  background:var(--lapp-blanc);
  border:1px solid #EFE8D8;
  padding:0;
  box-shadow:0 22px 40px -26px rgba(43,42,37,.38) !important;
  filter:none !important;
}
.lapp-fh-media img:nth-child(1){ transform:translateY(6px); }
.lapp-fh-media img:nth-child(2){ transform:translateY(-10px); }
.lapp-fh-media img:nth-child(3){ transform:translateY(4px); }

/* ===================================================================
   36. BANDEAU DE RÉASSURANCE (fiche produit)
   =================================================================== */
.lapp-reassure{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0; margin-top:30px !important;
  border-top:1px solid #EDE6D6; border-bottom:1px solid #EDE6D6;
}
html body .lapp-reassure{ margin-bottom:0 !important; }
.lapp-reassure div{
  padding:20px 16px; text-align:center;
  font-family:'Inter',sans-serif;
}
.lapp-reassure div + div{ border-left:1px solid #F0EADC; }
.lapp-reassure strong{
  display:block; font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--lapp-texte); font-weight:400; margin-bottom:6px;
}
.lapp-reassure span{ font-size:12.5px; line-height:1.6; color:var(--lapp-gris); }

@media (max-width:600px){
  .lapp-reassure{ grid-template-columns:1fr; }
  .lapp-reassure div + div{ border-left:none; border-top:1px solid #F0EADC; }
}


/* --- WPWriter addition --- */
/* ===================================================================
   37. PAGE 404
   =================================================================== */
.lapp-404 .lapp-pagehead-title{ max-width:20ch; }
.lapp-404-liens{
  display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:30px;
}

/* ===================================================================
   38. PAGE « COMMANDE REÇUE »
   Premier écran après paiement : il doit rassurer et dire la suite.
   =================================================================== */
body.woocommerce-order-received main.wp-block-group,
.lapp-merci ~ *{ background:var(--lapp-blanc); }
html body .lapp-merci{
  margin:0 !important; margin-block-start:0 !important;
  background:var(--lapp-ivoire);
  padding:calc(var(--lapp-head) + var(--lapp-bar) + 60px) 24px 62px !important;
  text-align:center;
  width:100% !important; max-width:none !important; box-sizing:border-box;
}
html body .lapp-merci-titre{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(28px,3.6vw,44px) !important; line-height:1.15 !important;
  color:var(--lapp-texte) !important; margin:0 auto 18px !important; max-width:18ch;
}
html body .lapp-merci-lead{
  font-family:'Inter',sans-serif; font-size:15px; line-height:1.8;
  color:var(--lapp-gris); max-width:60ch; margin:0 auto !important;
}
.lapp-etapes{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px; max-width:900px; margin:42px auto 0 !important; text-align:left;
}
.lapp-etapes div{
  background:var(--lapp-blanc); border:1px solid #EFE8D8; padding:24px 22px;
}
.lapp-etape-num{
  display:block; font-family:'Playfair Display',serif; font-size:22px;
  color:var(--lapp-or); margin-bottom:12px;
}
.lapp-etapes strong{
  display:block; font-family:'Inter',sans-serif; font-weight:500; font-size:14px;
  color:var(--lapp-texte); margin-bottom:7px;
}
.lapp-etapes span:not(.lapp-etape-num){
  font-family:'Inter',sans-serif; font-size:13px; line-height:1.7; color:var(--lapp-gris);
}
.lapp-merci-cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:38px; }

/* le tunnel masque l'en-tête principal : sur la page de confirmation
   on le remet, le client doit pouvoir repartir naviguer */
body.woocommerce-order-received .lapp-header,
body.woocommerce-order-received .lapp-drawer,
body.woocommerce-order-received .lapp-overlay{ display:flex !important; }
body.woocommerce-order-received .lapp-drawer{ display:flex !important; }
body.woocommerce-order-received main.wp-block-group{ padding-top:0 !important; }

@media (max-width:800px){
  .lapp-etapes{ grid-template-columns:1fr; gap:12px; }
  html body .lapp-merci{ padding-top:calc(var(--lapp-head) + var(--lapp-bar) + 36px) !important; }
}

/* ===================================================================
   39. PAGE DE RÉSULTATS DE RECHERCHE
   =================================================================== */
body.search-results main.wp-block-group,
body.search-no-results main.wp-block-group{
  padding-top:calc(var(--lapp-head) + var(--lapp-bar)) !important;
}
body.search-results .wp-block-query-title,
body.search-no-results .wp-block-query-title{
  font-family:'Playfair Display',serif !important; font-weight:400 !important;
  font-size:clamp(24px,2.8vw,34px) !important; text-align:center !important;
  color:var(--lapp-texte) !important; margin:44px auto 26px !important;
}


/* --- WPWriter addition --- */

/* ============================================================
   40. FAMILLE PROFESSIONNEL
   ------------------------------------------------------------
   Police / Gendarmerie / CRS + Medical & Sante.
   Reprend a l'identique la mecanique des cinq autres familles.
   ============================================================ */

/* --- banniere de famille : meme grille que les autres --- */
body.term-professionnel        .lapp-fh[data-fam="professionnel"],
body.term-police-gendarmerie   .lapp-fh[data-fam="professionnel"],
body.term-medical-sante        .lapp-fh[data-fam="professionnel"]{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(20px,4vw,56px);
  align-items:center;
  max-width:1440px;
  padding:clamp(34px,4vw,58px) clamp(20px,4vw,54px);
  margin:0 auto !important;
}
@media (max-width:900px){
  body.term-professionnel      .lapp-fh[data-fam="professionnel"],
  body.term-police-gendarmerie .lapp-fh[data-fam="professionnel"],
  body.term-medical-sante      .lapp-fh[data-fam="professionnel"]{
    grid-template-columns:1fr;
    gap:24px;
    text-align:center;
    padding:30px 18px 34px;
  }
}

/* --- la banniere remplace le titre d'archive --- */
body.term-professionnel .wp-block-query-title,
body.term-professionnel .wp-block-term-description,
body.term-professionnel .wc-block-breadcrumbs{ display:none !important; }

/* --- etat actif dans la barre de familles --- */
body.term-professionnel      .lapp-fam-link[data-fam="professionnel"],
body.term-police-gendarmerie .lapp-fam-link[data-fam="professionnel"],
body.term-medical-sante      .lapp-fam-link[data-fam="professionnel"]{
  color:var(--lapp-texte) !important;
  border-bottom-color:var(--lapp-or);
}

/* ============================================================
   41. BARRE STICKY : etat actif recalcule sur les slugs
   ------------------------------------------------------------
   L'ancienne regle ciblait les identifiants de termes 1376-1411,
   supprimes lors de la refonte de l'arborescence : le soulignement
   or ne s'allumait plus. On repasse par les slugs, qui ne bougent
   pas quand les termes sont recrees.
   ============================================================ */

body.term-quotidien       .lapp-catbar .cb-quotidien a,
body.term-casquettes      .lapp-catbar .cb-quotidien a,
body.term-berets          .lapp-catbar .cb-quotidien a,
body.term-bonnets-docker  .lapp-catbar .cb-quotidien a,
body.term-bonnets-urbains .lapp-catbar .cb-quotidien a,
body.term-bobs            .lapp-catbar .cb-quotidien a,

body.term-spirituel .lapp-catbar .cb-spirituel a,
body.term-kippas    .lapp-catbar .cb-spirituel a,
body.term-chechias  .lapp-catbar .cb-spirituel a,
body.term-shemaghs  .lapp-catbar .cb-spirituel a,
body.term-turbans   .lapp-catbar .cb-spirituel a,
body.term-foulards  .lapp-catbar .cb-spirituel a,

body.term-performance .lapp-catbar .cb-performance a,
body.term-cyclisme    .lapp-catbar .cb-performance a,
body.term-natation    .lapp-catbar .cb-performance a,
body.term-running     .lapp-catbar .cb-performance a,
body.term-ski         .lapp-catbar .cb-performance a,

body.term-enfants            .lapp-catbar .cb-enfants a,
body.term-casquettes-enfant  .lapp-catbar .cb-enfants a,
body.term-casquettes-sahara  .lapp-catbar .cb-enfants a,

body.term-professionnel      .lapp-catbar .cb-professionnel a,
body.term-police-gendarmerie .lapp-catbar .cb-professionnel a,
body.term-medical-sante      .lapp-catbar .cb-professionnel a{
  color:var(--lapp-texte) !important;
  border-bottom-color:var(--lapp-or) !important;
}

/* ============================================================
   42. AVERTISSEMENTS REGLEMENTAIRES SUR FICHE PRODUIT
   ------------------------------------------------------------
   Insignes officiels soumis a autorisation, concepts medicaux
   non steriles : la mention doit se voir sans crier.
   ============================================================ */

.woocommerce-product-details__short-description .ls-avert,
.wp-block-post-content .ls-avert,
.entry-content .ls-avert{
  margin-top:22px;
  padding:14px 16px;
  border-left:2px solid var(--lapp-or);
  background:#F8F3E9;
  font-size:.86rem;
  line-height:1.55;
  color:var(--lapp-texte-doux,#6E6A5C);
}
.ls-avert strong{ color:var(--lapp-texte,#2B2A25); font-weight:600; }


/* --- WPWriter addition --- */


/* 42 bis — l'encart vit dans wc-block-product-description : on cible large */
body .ls-avert{
  display:block;
  margin-top:22px !important;
  padding:14px 16px !important;
  border-left:2px solid #B08A3D !important;
  background:#F8F3E9 !important;
  font-size:.86rem !important;
  line-height:1.55 !important;
  color:#6E6A5C !important;
}
body .ls-avert strong{ color:#2B2A25 !important; font-weight:600 !important; }


/* --- WPWriter addition --- */


/* ============================================================
   43. FILTRE CATEGORIES : on retire ce qui ne filtre rien
   ------------------------------------------------------------
   Sur /spirituel/, l'entree "Spirituel (21)" reprend la totalite
   de la page : cocher ne change rien. On la masque, les vraies
   sous-categories restent.
   Sur une page de sous-categorie, plus aucune entree n'a de sens :
   le bloc entier disparait.
   ------------------------------------------------------------
   :has() n'est pas connu des vieux navigateurs ; la regle y est
   simplement ignoree et le filtre s'affiche comme avant.
   ============================================================ */

body.term-quotidien     .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-quotidien"]),
body.term-spirituel     .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-spirituel"]),
body.term-performance   .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-performance"]),
body.term-enfants       .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-enfants"]),
body.term-accessoires   .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-accessoires"]),
body.term-professionnel .wc-block-product-filter-checkbox-list__item:has(input[id="taxonomy/product_cat-professionnel"]){
  display:none !important;
}

/* --- pages de sous-categorie : le bloc Categories n'a plus rien a dire --- */
body.term-casquettes         .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-casquettes-enfant  .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-casquettes-sahara  .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-berets             .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-bonnets-docker     .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-bonnets-urbains    .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-bobs               .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-kippas             .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-chechias           .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-shemaghs           .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-turbans            .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-foulards           .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-cyclisme           .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-natation           .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-running            .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-ski                .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-rangement-transport .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-entretien          .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-bijouterie         .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-police-gendarmerie .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]),
body.term-medical-sante      .wp-block-woocommerce-product-filter-taxonomy:has(input[id^="taxonomy/product_cat-"]){
  display:none !important;
}


/* --- WPWriter addition --- */


/* ============================================================
   44. TABLEAU D'ATTRIBUTS : on ne garde que Couleur et Gamme
   ------------------------------------------------------------
   Le bloc "Specifications produit" de WooCommerce affiche TOUS
   les attributs, y compris ceux marques non visibles — le flag
   is_visible n'est pas lu. On masque donc les lignes 3 et 4,
   Genre et Teinte, qui sont des cles de filtrage internes et
   n'apprennent rien a l'acheteur.
   Ordre garanti par la propriete "position" des attributs :
   1 Couleur · 2 Gamme · 3 Genre · 4 Teinte.
   ============================================================ */

tr.wp-block-product-specifications-item:nth-child(n+3){ display:none !important; }


/* --- WPWriter addition --- */


/* 44 bis — la colonne de gauche cassait "Couleur" en "Coule/ur" */
.wp-block-product-specifications table{ table-layout:auto !important; width:100% !important; }
.wp-block-product-specifications-item th,
.wp-block-product-specifications-item td:first-child{
  width:1%;
  white-space:nowrap !important;
  padding-right:24px !important;
}


/* --- WPWriter addition --- */


/* ============================================================
   45. VIGNETTES DE LA GRILLE : navigation entre les visuels
   ------------------------------------------------------------
   Fleches gauche/droite centrees verticalement sur l'image,
   revelees au survol. Au survol, l'image change toutes les
   2 secondes ; a la sortie, retour au premier visuel.
   Script : bloc <script id="lapp-vignettes"> du gabarit d'entete.
   ============================================================ */

.lapp-vign{ position:relative; }

.lapp-vign-piste{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
}

.lapp-vign-img{
  position:absolute !important;
  inset:0;
  width:100% !important;
  height:100% !important;
  object-fit:cover;
  opacity:0;
  transition:opacity .45s ease;
}
.lapp-vign-img.est-active{ opacity:1; }

/* --- les fleches --- */
.lapp-vign-fleche{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:34px; height:34px;
  padding:0; border:0; border-radius:50%;
  background:rgba(255,255,255,.86);
  color:#2B2A25;
  font-size:19px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  opacity:0;
  transition:opacity .25s ease, background .2s ease;
  box-shadow:0 1px 6px rgba(43,42,37,.14);
}
.lapp-vign-prev{ left:10px; }
.lapp-vign-next{ right:10px; }

.lapp-vign:hover .lapp-vign-fleche,
.lapp-vign:focus-within .lapp-vign-fleche{ opacity:1; }
.lapp-vign-fleche:hover{ background:#fff; }
.lapp-vign-fleche:focus-visible{ opacity:1; outline:2px solid #B08A3D; outline-offset:2px; }

/* --- compteur discret --- */
.lapp-vign-compte{
  position:absolute;
  bottom:10px; right:12px;
  z-index:4;
  font-size:.66rem;
  letter-spacing:.06em;
  color:#6E6A5C;
  background:rgba(255,255,255,.86);
  padding:3px 9px;
  border-radius:999px;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.lapp-vign:hover .lapp-vign-compte,
.lapp-vign:focus-within .lapp-vign-compte{ opacity:1; }

/* --- tactile : pas de survol, les fleches restent visibles --- */
@media (hover:none){
  .lapp-vign-fleche{ opacity:1; background:rgba(255,255,255,.92); }
  .lapp-vign-compte{ opacity:1; }
}

@media (max-width:600px){
  .lapp-vign-fleche{ width:30px; height:30px; font-size:17px; }
  .lapp-vign-prev{ left:6px; }
  .lapp-vign-next{ right:6px; }
}

@media (prefers-reduced-motion:reduce){
  .lapp-vign-img{ transition:none; }
}


/* --- WPWriter addition --- */


/* ============================================================
   46. VIGNETTES — GLISSEMENT ET SORTIE DES FLECHES
   ------------------------------------------------------------
   Remplace le fondu de la section 45 par un glissement lateral,
   et corrige les fleches qui restaient affichees apres un clic.
   ============================================================ */

/* --- le glissement --- */
/* Toutes les images attendent hors champ a droite ; l'active est
   au centre ; celle qui vient de sortir part vers la gauche.
   En marche arriere le script inverse simplement les roles. */

.lapp-vign-img{
  opacity:1 !important;
  transform:translateX(100%);
  transition:transform .55s cubic-bezier(.4,0,.2,1) !important;
  will-change:transform;
  backface-visibility:hidden;
}
.lapp-vign-img.est-active{ transform:translateX(0); }
.lapp-vign-img.va-gauche:not(.est-active){ transform:translateX(-100%); }

.lapp-vign-piste{ overflow:hidden; }

/* --- les fleches ne survivent plus au clic --- */
/* :focus-within restait vrai apres un clic souris : le bouton gardait
   le focus et les fleches ne disparaissaient plus a la sortie du survol.
   On ne garde l'affichage que pour le focus clavier (:focus-visible). */

.lapp-vign:focus-within .lapp-vign-fleche,
.lapp-vign:focus-within .lapp-vign-compte{ opacity:0; }

.lapp-vign:hover .lapp-vign-fleche,
.lapp-vign:hover .lapp-vign-compte{ opacity:1; }

.lapp-vign:has(.lapp-vign-fleche:focus-visible) .lapp-vign-fleche,
.lapp-vign:has(.lapp-vign-fleche:focus-visible) .lapp-vign-compte{ opacity:1; }

/* --- tactile : on re-affirme apres les regles ci-dessus --- */
@media (hover:none){
  .lapp-vign .lapp-vign-fleche,
  .lapp-vign .lapp-vign-compte,
  .lapp-vign:focus-within .lapp-vign-fleche,
  .lapp-vign:focus-within .lapp-vign-compte{ opacity:1; }
}

@media (prefers-reduced-motion:reduce){
  .lapp-vign-img{ transition:none !important; }
}


/* --- WPWriter addition --- */


/* ============================================================
   46 bis — LE GLISSEMENT PASSE DEVANT LE ZOOM AU SURVOL
   ------------------------------------------------------------
   La section 31 pose un zoom sur la vignette au survol :
   .wc-block-product-template li.product:hover ... img{transform:scale(1.04)}
   Sa specificite (0,4,1) ecrasait le translateX du carrousel, qui
   restait donc immobile. Sur les vignettes a carrousel, le
   glissement remplace le zoom — deux effets au meme endroit et
   au meme moment, c'etait un de trop.
   ============================================================ */

.lapp-vign .lapp-vign-img{
  transform:translateX(100%) !important;
}
.lapp-vign .lapp-vign-img.est-active{
  transform:translateX(0) !important;
}
.lapp-vign .lapp-vign-img.va-gauche:not(.est-active){
  transform:translateX(-100%) !important;
}

/* la piste garde le ratio carre meme si l'image est en position absolue */
.lapp-vign .lapp-vign-piste{
  aspect-ratio:1/1 !important;
  overflow:hidden !important;
}
.lapp-vign .lapp-vign-img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  aspect-ratio:auto !important;
}


/* --- WPWriter addition --- */


/* ============================================================
   47. HERO D'ACCUEIL — LE VISUEL REMPLACE LE DEGRADE
   ------------------------------------------------------------
   L'ancien hero occupait 100vh de fond olive avec le logo en
   filigrane : beaucoup de place pour rien dire. Le panoramique
   client prend le relais, et le texte passe dessous sur ivoire.
   La composition (visage a gauche, eclate a droite, sol au
   centre) ne supporte aucune surimpression : on ne recadre pas,
   on ne superpose pas.
   ============================================================ */

.lapp-hero{
  min-height:0 !important;
  height:auto !important;
  padding:0 0 clamp(38px,5vw,64px) !important;
  background:#F8F3E9 !important;
  background-image:none !important;
  display:block !important;
  text-align:center;
}
.lapp-hero::before,
.lapp-hero::after{ content:none !important; }   /* le filigrane du logo */

/* --- le visuel --- */
.lapp-hero-visuel{
  width:100%;
  margin:0 0 clamp(30px,4vw,52px);
  background:#F8F3E9;
  line-height:0;
}
.lapp-hero-visuel img{
  display:block;
  width:100%;
  height:auto;
  max-width:1920px;
  margin:0 auto;
}

/* --- le texte, sous l'image --- */
.lapp-hero-inner{
  max-width:760px !important;
  margin:0 auto !important;
  padding:0 24px !important;
  display:block !important;
  text-align:center;
}
.lapp-hero-eyebrow{
  color:#B08A3D !important;
  font-size:.72rem !important;
  letter-spacing:.22em !important;
  text-transform:uppercase;
  margin-bottom:14px !important;
}
.lapp-hero-title{
  color:#2B2A25 !important;
  font-size:clamp(2rem,4.4vw,3.3rem) !important;
  line-height:1.1 !important;
  margin:0 0 16px !important;
}
.lapp-hero-baseline{
  color:#6E6A5C;
  font-size:clamp(.95rem,1.4vw,1.08rem);
  line-height:1.65;
  max-width:44ch;
  margin:0 auto 30px;
}

/* --- les deux boutons --- */
.lapp-hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
}
.lapp-hero-btn{
  display:inline-block;
  padding:13px 26px;
  background:#2B2A25;
  color:#F8F3E9 !important;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none !important;
  border:1px solid #2B2A25;
  transition:background .25s ease, color .25s ease;
}
.lapp-hero-btn:hover{ background:#3A3A2E; border-color:#3A3A2E; }
.lapp-hero-btn--ligne{
  background:transparent;
  color:#2B2A25 !important;
  border-color:#C9C3B4;
}
.lapp-hero-btn--ligne:hover{ background:#fff; border-color:#B08A3D; }

/* l'ancien lien souligne du hero n'a plus lieu d'etre */
.lapp-hero-link{ display:none !important; }

@media (max-width:600px){
  .lapp-hero-cta{ flex-direction:column; align-items:stretch; }
  .lapp-hero-btn{ text-align:center; }
}


/* --- WPWriter addition --- */


/* 47 bis — le visuel touche les bords, la baseline respire */
.lapp-hero-visuel img{ max-width:none !important; }
.lapp-hero-baseline{ max-width:52ch; }


/* --- WPWriter addition --- */


/* ============================================================
   48. HERO D'ACCUEIL — PLEIN ECRAN, TEXTE SUR L'IMAGE
   ------------------------------------------------------------
   Remplace la mise en page de la section 47 : le visuel occupe
   toute la fenetre a l'arrivee et le texte revient par-dessus,
   pose en bas sur un voile ivoire qui garantit le contraste
   quel que soit le recadrage.
   ============================================================ */

.lapp-hero{
  position:relative !important;
  min-height:calc(100vh - 46px) !important;
  min-height:calc(100svh - 46px) !important;
  padding:0 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#F8F3E9 !important;
}

/* --- le visuel remplit toute la section --- */
.lapp-hero-visuel{
  position:absolute !important;
  inset:0 !important;
  margin:0 !important;
  z-index:0;
}
.lapp-hero-visuel picture{ display:block; height:100%; }
.lapp-hero-visuel img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:50% 42% !important;   /* garde le visage et l'eclate */
  margin:0 !important;
}

/* --- voile ivoire : monte du bas, laisse le haut intact --- */
.lapp-hero-voile{
  position:absolute;
  inset:auto 0 0 0;
  height:62%;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to top,
     rgba(248,243,233,.96) 0%,
     rgba(248,243,233,.88) 18%,
     rgba(248,243,233,.62) 38%,
     rgba(248,243,233,.22) 64%,
     rgba(248,243,233,0) 100%);
}

/* --- le texte, pose en bas --- */
.lapp-hero-inner{
  position:relative !important;
  z-index:2;
  max-width:760px !important;
  margin:0 auto !important;
  padding:0 24px clamp(48px,7vh,92px) !important;
  text-align:center;
}
.lapp-hero-title{
  text-shadow:0 1px 18px rgba(248,243,233,.75);
}
.lapp-hero-baseline{
  color:#5C584B;
  text-shadow:0 1px 14px rgba(248,243,233,.85);
}
.lapp-hero-eyebrow{
  text-shadow:0 1px 14px rgba(248,243,233,.9);
}
.lapp-hero-btn{
  box-shadow:0 2px 14px rgba(43,42,37,.10);
}
.lapp-hero-btn--ligne{
  background:rgba(255,255,255,.86) !important;
  border-color:#B9B2A1 !important;
}
.lapp-hero-btn--ligne:hover{
  background:#fff !important;
  border-color:#B08A3D !important;
}

/* --- mobile : on respire un peu, et on cadre sur le visage --- */
@media (max-width:781px){
  .lapp-hero{
    min-height:calc(88vh - 46px) !important;
    min-height:calc(88svh - 46px) !important;
  }
  .lapp-hero-visuel img{ object-position:38% 38% !important; }
  .lapp-hero-voile{ height:70%; }
}


/* --- WPWriter addition --- */


/* ============================================================
   48 bis — CADRAGE DU HERO
   ------------------------------------------------------------
   Un panoramique 2,4:1 dans une fenetre 16:9 perd un quart de sa
   largeur. Centrer coupait la visiere et le visage : on decale le
   point d'ancrage vers la gauche, ce qui sauve le sujet porte
   sans entamer l'eclate des trois couches (qui s'arrete a 75 %).
   Verifie du 1366x900 au 2560x1220.
   ============================================================ */

.lapp-hero-visuel img{ object-position:36% 42% !important; }

@media (max-width:781px){
  .lapp-hero{
    min-height:calc(70vh - 46px) !important;
    min-height:calc(70svh - 46px) !important;
  }
  .lapp-hero-visuel img{ object-position:30% 38% !important; }
  .lapp-hero-voile{ height:64%; }
  .lapp-hero-inner{ padding-bottom:clamp(34px,5vh,60px) !important; }
}


/* --- WPWriter addition --- */


/* ============================================================
   48 ter — HALO SOUS LE TEXTE PLUTOT QU'UN VOILE PLUS EPAIS
   ------------------------------------------------------------
   Densifier le degrade du bas suffisait a rendre le texte
   lisible, mais delavait la troisieme couche de l'eclate — le
   bleu marine de la doublure Fleur de Vie virait au gris.
   On concentre donc l'eclaircissement sous le bloc de texte :
   l'image garde ses noirs partout ailleurs.
   Contraste mesure du 1366x900 au 2560x1220, pixel le plus
   sombre sous chaque ligne : sur-titre 5,6:1 · titre 9,5:1 ·
   accroche 11,2:1 · boutons 10,2:1. Le seuil AA est a 4,5:1.
   ============================================================ */

.lapp-hero-inner{ isolation:isolate; }

.lapp-hero-inner::before{
  content:"";
  position:absolute;
  left:50%;
  top:46%;
  transform:translate(-50%,-50%);
  width:165%;
  height:200%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at center,
      rgba(248,243,233,.94) 0%,
      rgba(248,243,233,.90) 34%,
      rgba(248,243,233,.78) 52%,
      rgba(248,243,233,.34) 70%,
      rgba(248,243,233,0)   84%);
}

/* les ombres portees ne servent plus qu'a adoucir les bords du halo */
.lapp-hero-title{    text-shadow:0 1px 10px rgba(248,243,233,.55); }
.lapp-hero-baseline{ text-shadow:0 1px 8px  rgba(248,243,233,.55); }
.lapp-hero-eyebrow{  text-shadow:0 1px 8px  rgba(248,243,233,.7); }

@media (max-width:781px){
  .lapp-hero-inner::before{ width:210%; height:190%; }
}


/* --- WPWriter addition --- */

/* ============================================================
   49. LOGO — SOURCE HD AU LIEU DU 4K
   ------------------------------------------------------------
   Le fichier d'origine fait 4000 x 3800 px pour 480 Ko, alors que
   le mot « LappShield » du header n'est affiche qu'a 99 px de large.
   Le navigateur devait donc reduire l'image d'un facteur ~32 a chaque
   affichage : c'est cette reduction violente qui rendait les lettres
   sales, et c'est elle qui consommait memoire et CPU.

   On sert desormais deux tailles, calculees a partir du meme fichier
   par le CDN d'images du site (aucun nouveau fichier a gerer, et le
   client peut toujours remplacer le PNG d'origine dans la mediatheque) :
     --lapp-logo     400 px  -> header, pied de page, petits reperes
     --lapp-logo-lg  900 px  -> filigranes larges (hero, page Technologie)
   ============================================================ */

:root{
  --lapp-logo:url('https://i0.wp.com/lappshield.com/wp-content/uploads/2026/08/8cde7750-LappShieldlogogold4Ktransparent.png?fit=400%2C380&ssl=1') !important;
  --lapp-logo-lg:url('https://i0.wp.com/lappshield.com/wp-content/uploads/2026/08/8cde7750-LappShieldlogogold4Ktransparent.png?fit=900%2C855&ssl=1');
}

/* les deux seuls endroits ou le logo est affiche en grand */
.lapp-hero::before{ background-image:var(--lapp-logo-lg) !important; }
.lapp-tech-media::after{ background-image:var(--lapp-logo-lg) !important; }


/* --- WPWriter addition --- */

/* --- 49bis. Un seul fichier au lieu de deux ---------------------
   Verification faite en direct : le filigrane du hero (13 % d'opacite)
   est entierement couvert par la photo panoramique, et celui de la page
   Technologie est un aplat decoratif a 18 %. Aucun des deux ne justifie
   un second telechargement de 75 Ko. Ils reprennent donc la source
   400 px du header, deja en cache : une seule image pour tout le site.
   ---------------------------------------------------------------- */
:root{ --lapp-logo-lg:var(--lapp-logo); }