.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-kadence1:#703e31;--e-global-color-kadence2:#4e3f31;--e-global-color-kadence3:#4e3f31;--e-global-color-kadence4:#2D3748;--e-global-color-kadence5:#4A5568;--e-global-color-kadence6:#718096;--e-global-color-kadence7:#faf9f6;--e-global-color-kadence8:#F7FAFC;--e-global-color-kadence9:#ffffff;--e-global-color-9629131:#F3F2EE;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7.el-is-editing{--global-palette1:#703e31;--global-palette2:#4e3f31;--global-palette3:#4e3f31;--global-palette4:#2D3748;--global-palette5:#4A5568;--global-palette6:#718096;--global-palette7:#faf9f6;--global-palette8:#F7FAFC;--global-palette9:#ffffff;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ========================================================================== LES LORGNETTES — Caractéristiques des verres À coller une seule fois : Elementor → Réglages du site → CSS personnalisé. Remplace intégralement la version précédente. Aucun changement de HTML, de SVG, de classe ni de condition d'affichage. Tout est préfixé .ll-spec, à une exception documentée ci-dessous. Desktop / tablette large → deux colonnes de 50 %, filet vertical Mobile (≤ 767 px) → deux lignes pleine largeur, filet horizontal ========================================================================== */ /* -------------------------------------------------------------------------- Espacement du conteneur Seule règle non préfixée : elle ne peut atteindre qu'un conteneur Elementor contenant directement une de nos cellules. On y annule l'espacement du conteneur pour que le composant maîtrise lui-même toutes ses distances — c'est indispensable au passage desktop / mobile, où l'écart horizontal devient un écart vertical. -------------------------------------------------------------------------- */ .e-con:has(> .ll-spec-cell) { --gap: 0px; --row-gap: 0px; --column-gap: 0px; } /* -------------------------------------------------------------------------- Les deux cellules flex: 1 1 0 donne exactement 50 % à chacune, quel que soit le contenu. align-items: stretch égalise leur hauteur : c'est ce qui permet, plus bas, d'aligner les micro-textes sans réserver la moindre hauteur vide. -------------------------------------------------------------------------- */ .ll-spec-cell { flex: 1 1 0; min-width: 0; display: flex; align-items: stretch; } .ll-spec-cell > .elementor-widget-container { display: flex; flex: 1 1 auto; min-width: 0; } .ll-spec-cell .ll-spec { padding-right: 22px; } /* Exactement deux cellules s'affichent toujours : la seconde porte le filet. */ .ll-spec-cell + .ll-spec-cell .ll-spec { padding-right: 0; padding-left: 22px; border-left: 1px solid rgba(78, 63, 49, .08); } /* -------------------------------------------------------------------------- En-tête -------------------------------------------------------------------------- */ .ll-spec-head { margin: 0; padding-top: 14px; border-top: 1px solid rgba(78, 63, 49, .10); background: #FFFFFF; } .ll-spec-label { display: block; font-family: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif; font-size: 10px; font-weight: 400; line-height: 1; letter-spacing: .20em; text-transform: uppercase; color: rgba(112, 62, 49, .60); } /* -------------------------------------------------------------------------- Une caractéristique -------------------------------------------------------------------------- */ .ll-spec { flex: 1 1 auto; display: flex; align-items: stretch; gap: 12px; min-width: 0; margin: 0; background: #FFFFFF; font-family: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif; -webkit-font-smoothing: antialiased; } .ll-spec, .ll-spec * { box-sizing: border-box; } .ll-spec-icon { flex: 0 0 auto; align-self: flex-start; width: 22px; height: 22px; line-height: 0; color: #703E31; } .ll-spec-icon svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; } /* Titre en haut, micro-texte en bas, sur toute la hauteur de la cellule. Les deux cellules ayant la même hauteur, les micro-textes tombent au même endroit — y compris quand « Verres photochromiques » passe sur deux lignes, et sans ajouter un seul pixel quand il tient sur une. */ .ll-spec-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 5px; } .ll-spec-title { font-size: 12.5px; font-weight: 400; line-height: 1.35; letter-spacing: .08em; text-transform: uppercase; color: #4E3F31; } .ll-spec-note { font-size: 13.5px; font-weight: 300; line-height: 1.4; color: rgba(78, 63, 49, .68); } /* -------------------------------------------------------------------------- Mobile — deux lignes pleine largeur Le passage se fait dès que la colonne produit devient étroite, pas à 360 px. Le filet vertical devient horizontal, l'icône se centre sur le bloc de texte, et chaque ligne occupe toute la largeur. -------------------------------------------------------------------------- */ @media (max-width: 767px) { .ll-spec-cell { flex: 1 1 100%; display: block; } .ll-spec-cell > .elementor-widget-container { display: block; } .ll-spec { display: flex; align-items: flex-start; gap: 12px; } .ll-spec-cell .ll-spec { padding: 0 0 12px 0; } .ll-spec-cell + .ll-spec-cell .ll-spec { padding: 12px 0 0 0; border-left: 0; border-top: 1px solid rgba(78, 63, 49, .08); } .ll-spec-icon { align-self: flex-start; width: 21px; height: 21px; margin-top: 1px; } .ll-spec-icon svg { width: 21px; height: 21px; } /* Le bloc texte reste une colonne flex : le titre et le micro-texte sont des , donc inline par nature. En display:block ils se suivaient sur la même ligne — c'était la cause de la composition cassée. En colonne flex, ils sont toujours sur deux lignes distinctes. */ .ll-spec-body { display: flex; flex-direction: column; justify-content: flex-start; gap: 4px; } .ll-spec-title { font-size: 12.5px; letter-spacing: .07em; line-height: 1.35; } .ll-spec-note { font-size: 13.5px; line-height: 1.5; } } /* ==== LL-GRID-CENTER — Grilles produits : titre et prix centrés (03/10/2026) ==== */ .bdt-wc-products .bdt-wc-product-desc{text-align:center;align-items:center} .bdt-wc-products .bdt-wc-product-title, .bdt-wc-products .bdt-wc-product-price, .bdt-wc-products .bdt-wc-product-price .price{text-align:center;justify-content:center;width:100%} .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product .price{text-align:center;justify-content:center;display:block;width:100%} /* ==== LL-HARMONIE — Accueil : rythme, collection, mobile (03/10/2026) ==== */ /* Rythme vertical commun */ .elementor-21 .elementor-element-b18c6a4, .elementor-21 .elementor-element-ab28417{padding-top:104px!important;padding-bottom:104px!important;padding-left:40px!important;padding-right:40px!important} .elementor-21 .elementor-element-81def4e{padding-left:40px!important;padding-right:40px!important} .elementor-21 .elementor-element-81def4e > .e-con-inner{padding-top:72px!important;padding-bottom:72px!important} /* Newsletter : sur-titre aligné sur les autres */ .elementor-21 .elementor-element-c1c6b01, .elementor-21 .elementor-element-c1c6b01 p{font-size:14px!important;font-weight:500!important;letter-spacing:2.5px!important;text-transform:uppercase} @media (max-width:767px){ .elementor-21 .elementor-element-b18c6a4, .elementor-21 .elementor-element-ab28417{padding-top:64px!important;padding-bottom:64px!important;padding-left:20px!important;padding-right:20px!important} .elementor-21 .elementor-element-81def4e{padding-left:20px!important;padding-right:20px!important} .elementor-21 .elementor-element-81def4e > .e-con-inner{padding-top:64px!important;padding-bottom:64px!important;display:grid!important;grid-template-columns:1fr 1fr;gap:40px 16px} .elementor-21 .elementor-element-81def4e > .e-con-inner > .e-con{width:auto!important;padding:0!important} .elementor-21 .elementor-element-81def4e p, .elementor-21 .elementor-element-81def4e .elementor-text-editor{font-size:14px!important;line-height:1.55!important} .elementor-21 .elementor-element-81def4e > .e-con-inner{align-items:start!important} .elementor-21 .elementor-element-81def4e p:last-child{margin-bottom:0!important} } /* ==== LL-SURTITRES — sur-titres rapprochés des titres ==== */ .elementor-21 .elementor-element-c1c6b01 p{margin-bottom:0!important} .elementor-21 .elementor-element-c1c6b01{margin-bottom:-6px!important} .elementor-21 .ll-sig__eyebrow{margin-bottom:14px!important}/* End custom CSS */