/*
Theme Name: Mabel Distribution
Theme URI: https://www.mabeldistribution.com
Author: Mabel Distribution
Description: Thème sur mesure de Mabel Distribution, spécialiste des équipements d’hygiène et hôteliers. À l’activation, il crée les pages, les 6 gammes et les 51 fiches produits du catalogue, puis règle les permaliens.
Version: 2.4.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: mabel
*/

/* Figtree hosted with the theme, one file per weight: Safari (iPhone) rendered Google's variable font too thin */
@font-face{font-family:"Figtree";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/figtree-400.ttf) format("truetype")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/figtree-500.ttf) format("truetype")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/figtree-600.ttf) format("truetype")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/figtree-700.ttf) format("truetype")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:800;font-display:swap;src:url(assets/fonts/figtree-800.ttf) format("truetype")}

:root{
  --red:#e3161b; --red-dark:#c10f14; --red-soft:#fdeeee;
  --ink:#0d0f12; --text:#1b1e23; --muted:#5d6470; --line:#e4e6ea; --line-2:#eef0f3;
  --bg:#ffffff; --bg-soft:#f6f7f9; --dark:#2d3035;
  --wrap:1320px; --gut:clamp(16px,4.6vw,68px);
  --font:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.55 var(--font);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{color:var(--ink);margin:0;letter-spacing:-.025em;line-height:1.05}
.wrap{max-width:calc(var(--wrap) + var(--gut)*2);margin:0 auto;padding:0 var(--gut)}
.dot{color:var(--red)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line-2)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:86px;gap:24px}
.brand img{height:58px;width:auto}
.nav{display:flex;align-items:center;gap:42px}
.nav a{font-size:17px;font-weight:500;color:var(--ink)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--red)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:var(--red);color:#fff!important;border:0;border-radius:3px;padding:13px 24px;font-size:17px;font-weight:500;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--red-dark)}
.btn svg{width:20px;height:20px;flex:none}
.btn-lg{padding:17px 30px;font-size:19px}
.btn-block{width:100%;padding:17px;font-size:19px}
.cart-count{background:#fff;color:var(--red);border-radius:99px;font-size:12px;font-weight:700;min-width:20px;height:20px;padding:0 6px;display:none;align-items:center;justify-content:center}
.cart-count.on{display:inline-flex}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}
.link-u{display:inline-flex;align-items:center;gap:10px;font-weight:500;color:var(--ink);padding-bottom:4px;border-bottom:2px solid var(--red)}
.link-u.red{color:var(--red)}
.link-u svg{width:20px;height:20px}

/* Hero */
.hero{position:relative;overflow:hidden;min-height:448px;display:flex;align-items:center}
.hero-img{position:absolute;inset:0 0 0 47.4%;background:url(assets/img/hero.jpg) center/cover no-repeat}
.hero-img::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.75) 8%,rgba(255,255,255,0) 26%)}
.hero .wrap{position:relative;width:100%}
.hero h1{font-size:clamp(44px,5.4vw,72px);font-weight:800;max-width:640px}
.hero p{font-size:clamp(19px,1.7vw,23px);margin:22px 0 36px;color:var(--ink)}
.hero-cta{display:flex;align-items:center;gap:44px;flex-wrap:wrap}

/* Gammes */
.gammes{padding-top:28px;padding-bottom:18px}
.gammes h2{font-size:clamp(34px,3.6vw,48px);font-weight:800;margin-bottom:22px}
.g-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.g-card{display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:center;padding:6px 26px 14px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 12px}
.g-card:nth-child(3n){border-right:0}
.g-card:nth-child(n+4){border-bottom:0}
.g-card img{width:150px;height:150px;object-fit:contain;mix-blend-mode:multiply}
.g-card h3{font-size:23px;font-weight:700;letter-spacing:-.015em;margin-bottom:12px}
.g-card p{margin:0;color:var(--muted);font-size:16.5px;line-height:1.38}
.g-card:hover h3{color:var(--red)}
.band{background:var(--dark);color:#fff;margin-top:6px}
.band .wrap{display:flex;justify-content:space-between;align-items:center;min-height:94px;gap:24px;flex-wrap:wrap;padding-top:18px;padding-bottom:18px}
.band strong{font-size:clamp(23px,2.4vw,32px);font-weight:700;letter-spacing:-.02em}
.band .link-u{color:#fff;font-size:18px}

/* Page head / breadcrumb */
.crumbs{font-size:15.5px;padding:20px 0 0;display:flex;flex-wrap:wrap;gap:10px;color:var(--ink)}
.crumbs span[aria-current]{color:var(--red)}
.crumbs .sep{color:var(--muted)}
.page-head{padding-top:14px;padding-bottom:26px}
.page-head h1{font-size:clamp(38px,4.6vw,62px);font-weight:800}
.page-head .lead{font-size:clamp(19px,1.8vw,25px);color:#2f3a4a;margin:14px 0 0}

/* Contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:42px;padding-bottom:26px}
.info-row{border-bottom:1px solid var(--line);padding:14px 0 12px}
.info-row:first-child{padding-top:0}
.info-row small{display:block;font-size:17px;color:var(--ink)}
.info-row a,.info-row b{font-size:clamp(20px,2vw,27px);font-weight:700;color:var(--ink);letter-spacing:-.015em}
.info-row.last{border:0;padding-bottom:6px}
.contact-grid > div > .link-u{margin-top:2px}
.map{position:relative;margin-top:18px;border-radius:4px;overflow:hidden;border:1px solid var(--line);aspect-ratio:624/408;background:var(--bg-soft)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.form h2{font-size:clamp(28px,2.6vw,36px);font-weight:800;margin:0 0 14px}
.f-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 22px}
.f-grid .full{grid-column:1/-1}
.form label{display:block;font-weight:700;font-size:17px;color:var(--ink);margin-bottom:10px}
.form label i{color:var(--red);font-style:normal}
.form input,.form textarea,.form select{width:100%;border:1px solid #d6d9de;border-radius:3px;padding:14px 14px;background:#fff;min-height:56px}
.form textarea{min-height:156px;resize:vertical}
.form input:focus,.form textarea:focus{outline:2px solid var(--red);outline-offset:-1px;border-color:var(--red)}
.form .note{font-size:14.5px;color:var(--muted);margin:14px 0 18px;line-height:1.7}
.form .note a{color:var(--red);text-decoration:underline}
.form .hp{position:absolute;left:-9999px}
.alt{border-top:1px solid var(--line);margin-top:24px;padding-top:18px;font-size:17px;color:var(--ink)}
.alt .link-u{margin-left:8px}
.alert{border-radius:4px;padding:14px 18px;margin:0 0 18px;font-weight:500}
.alert.ok{background:#eaf7ee;color:#1d6b33}.alert.err{background:var(--red-soft);color:var(--red-dark)}

/* Product */
.p-title{font-size:clamp(32px,3.9vw,52px);font-weight:800;padding-top:14px;padding-bottom:22px}
.p-top{display:grid;grid-template-columns:1.21fr 1fr;gap:38px;align-items:start}
.p-main{border-radius:3px;overflow:hidden;background:#fff;border:1px solid var(--line-2);aspect-ratio:700/548}
.p-main img{width:100%;height:100%;object-fit:contain}
.p-main.photo img{object-fit:cover}
.p-buy h2{font-size:clamp(19px,1.62vw,24px);font-weight:700;letter-spacing:-.015em;line-height:1.25}
.p-buy .lead{color:var(--muted);margin:12px 0 0;font-size:17.5px;line-height:1.45;padding-bottom:22px;border-bottom:1px solid var(--line)}
.p-label{font-weight:700;color:var(--ink);font-size:17px;margin:24px 0 12px}
.opts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.opts.list{grid-template-columns:1fr;gap:10px}
.opt{position:relative;display:flex;align-items:center;gap:16px;border:1px solid #d6d9de;border-radius:3px;padding:12px 18px 12px 14px;cursor:pointer;min-height:100px;background:#fff;transition:border-color .15s,background .15s}
.opts.list .opt{min-height:0;padding:12px 16px}
.opt img{width:72px;height:76px;object-fit:contain}
.opt .t{flex:1;font-weight:700;font-size:18px;color:var(--ink)}
.opts.list .opt .t{font-weight:600;font-size:16px;line-height:1.35}
.opt .t small{display:block;font-weight:600;color:var(--muted);font-size:13.5px;margin-top:2px}
.opt input{appearance:none;-webkit-appearance:none;width:26px;height:26px;border:1.5px solid #c4c8ce;border-radius:50%;margin:0;flex:none;display:grid;place-items:center;background:#fff}
.opt input::after{content:"";width:14px;height:14px;border-radius:50%;background:var(--red);transform:scale(0);transition:transform .12s}
.opt.on{border:2px solid var(--red);background:var(--red-soft)}
.opt input:checked{border-color:var(--red)}
.opt input:checked::after{transform:scale(1)}
.qty{display:inline-flex;border:1px solid #d6d9de;border-radius:3px;height:52px}
.qty input{width:68px;border:0;padding:0 0 0 26px;font-size:18px;font-weight:600;-moz-appearance:textfield;background:none}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.qty div{display:flex;flex-direction:column;border-left:1px solid #d6d9de}
.qty button{flex:1;width:36px;border:0;background:none;cursor:pointer;display:grid;place-items:center;padding:0}
.qty button svg{width:14px;height:14px}
.p-buy .btn-block{margin:20px 0 18px}
.added{display:none;margin:-6px 0 14px;color:#1d6b33;font-weight:600}
.added.on{display:block}
.added a{text-decoration:underline}
.p-bottom{display:grid;grid-template-columns:1.21fr 1fr;gap:38px;margin-top:22px;align-items:start}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px;max-width:472px}
.thumbs button{border:1px solid var(--line);border-radius:3px;background:#fff;padding:10px;cursor:pointer;aspect-ratio:1/1.03}
.thumbs button[aria-pressed="true"]{border-color:var(--red)}
.thumbs img{width:100%;height:100%;object-fit:contain}
.p-table{width:100%;border-collapse:collapse;border:1px solid var(--line);font-size:16.5px}
.p-table th,.p-table td{text-align:left;padding:11px 22px;border-top:1px solid var(--line);vertical-align:top}
.p-table thead th{background:#eef0f3;font-weight:700;color:var(--ink)}
.p-table td{color:var(--muted)}
.p-table td:first-child{color:var(--ink)}
.p-table td.ref{font-weight:700;color:var(--ink);white-space:nowrap}
.p-table.variants td{white-space:nowrap}
.p-top > *,.p-bottom > *,.specs-grid > *,.contact-grid > *{min-width:0}
.p-table + .p-table{margin-top:22px}
.p-note{font-size:14px;color:var(--muted);margin:12px 0 0}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0}
.badge{border:1px solid var(--line);border-radius:99px;padding:5px 12px;font-size:13.5px;font-weight:600;color:var(--ink);background:#fff}
.badge.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.specs{padding-top:44px;padding-bottom:20px}
.specs-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:38px}
.specs h3{font-size:24px;font-weight:800;margin:0 0 14px}
.specs ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.specs li{padding:10px 0 10px 22px;border-bottom:1px solid var(--line);position:relative;font-size:16px}
.specs li::before{content:"";position:absolute;left:2px;top:19px;width:8px;height:8px;background:var(--red);border-radius:1px}
.fiche{margin-top:28px;border:1px solid var(--line);border-radius:3px;padding:16px;display:flex;gap:18px;align-items:center;background:var(--bg-soft)}
.fiche img{width:120px;border:1px solid var(--line);background:#fff}
.fiche b{display:block;color:var(--ink)}

/* Catalogue listing */
.cat-section{padding:10px 0 34px;scroll-margin-top:100px}
.cat-section > header{display:flex;justify-content:space-between;align-items:end;gap:20px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:22px}
.cat-section h2{font-size:clamp(26px,2.6vw,34px);font-weight:800}
.sub-title{font-size:20px;font-weight:700;margin:26px 0 14px;color:var(--ink);scroll-margin-top:100px}
.p-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.p-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:3px;background:#fff;transition:border-color .15s,box-shadow .15s}
.p-card:hover{border-color:#cfd3d9;box-shadow:0 8px 24px rgba(13,15,18,.07)}
.p-card .im{aspect-ratio:1/1;padding:18px;border-bottom:1px solid var(--line-2)}
.p-card .im img{width:100%;height:100%;object-fit:contain}
.p-card .tx{padding:14px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.p-card small{color:var(--red);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.p-card h3{font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.p-card .refs{margin-top:auto;padding-top:8px;color:var(--muted);font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 26px}
.chips a{border:1px solid var(--line);border-radius:99px;padding:8px 16px;font-weight:500;font-size:15.5px}
.chips a:hover,.chips a.on{border-color:var(--red);color:var(--red)}

/* About / generic */
.prose{max-width:820px;padding-bottom:40px;font-size:18px}
.prose h2{font-size:28px;font-weight:800;margin:34px 0 12px}
.prose h3{font-size:21px;font-weight:700;margin:24px 0 8px}
.prose a{color:var(--red);text-decoration:underline}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:6px 0 40px}
.value{border-top:3px solid var(--red);padding-top:16px}
.value h3{font-size:22px;font-weight:700;margin-bottom:8px}
.value p{margin:0;color:var(--muted)}
.quote-list{border:1px solid var(--line);border-radius:3px;margin-bottom:18px}
.quote-list .row{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:14px 18px;border-top:1px solid var(--line)}
.quote-list .row:first-child{border-top:0}
.quote-list .row b{display:block;color:var(--ink)}
.quote-list .row small{color:var(--muted)}
.quote-list input{width:70px;border:1px solid #d6d9de;border-radius:3px;padding:8px}
.quote-list .rm{border:0;background:none;color:var(--red);cursor:pointer;font-size:14px;text-decoration:underline}
.empty{padding:22px 18px;color:var(--muted)}

/* Footer */
.site-footer{background:var(--dark);color:#fff}
.site-footer .wrap{display:flex;align-items:center;justify-content:space-between;min-height:66px;gap:20px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.site-footer strong{font-size:19px;font-weight:600}
.site-footer nav{display:flex;gap:42px;font-size:16px}
.site-footer nav a:hover{text-decoration:underline}

/* Elementor pages: widgets inherit the theme design */
.mabel-el{--display:flex}
.mabel-el .elementor-widget:not(:last-child){margin-bottom:0}
.mabel-el .elementor-widget-shortcode .elementor-shortcode{display:block}
/* Content width: side padding instead of max-width (Elementor forces max-width:100% on widgets) */
.mabel-el .e-con.wrap{width:100%;max-width:calc(var(--wrap) + var(--gut)*2);margin-left:auto;margin-right:auto;padding-left:var(--gut);padding-right:var(--gut)}
.mabel-el .elementor-widget.wrap{width:100%!important;max-width:none!important;margin-left:0;margin-right:0;padding-left:max(var(--gut),calc((100% - var(--wrap))/2))!important;padding-right:max(var(--gut),calc((100% - var(--wrap))/2))!important;box-sizing:border-box}
/* Theme defaults have the lowest possible weight (:where): any setting made in Elementor
   (widget Style tab, or Site Settings > Typography for H1/H2) always wins. */
:where(.mabel-el .elementor-widget-heading) .elementor-heading-title,:where(.mabel-el) .elementor-widget-text-editor{color:inherit;font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;letter-spacing:inherit}
/* Spacing of the theme titles (Elementor > Advanced > Padding/Margin still overrides it) */
.mabel-el .el-h1{padding-top:14px}
.mabel-el .el-h2{padding-top:28px;margin-bottom:22px}
/* Any widget dropped straight into a page lines up with the rest of the content */
.mabel-el.e-parent > .elementor-widget:not(.elementor-widget-shortcode),.mabel-el.e-parent > .e-con-inner > .elementor-widget:not(.elementor-widget-shortcode){width:100%!important;max-width:none!important;margin-left:0;margin-right:0;padding-left:max(var(--gut),calc((100% - var(--wrap))/2))!important;padding-right:max(var(--gut),calc((100% - var(--wrap))/2))!important;box-sizing:border-box}
:where(.el-h1),.page-head h1{font-size:clamp(38px,4.6vw,62px);font-weight:800;color:var(--ink);letter-spacing:-.025em;line-height:1.05;padding-top:14px}
:where(.el-h2){display:block;font-size:clamp(34px,3.6vw,48px);font-weight:800;color:var(--ink);letter-spacing:-.025em;line-height:1.05;padding-top:28px;margin-bottom:22px}
.mabel-el .p-title{font-size:clamp(32px,3.9vw,52px);font-weight:800;color:var(--ink);letter-spacing:-.025em;line-height:1.05;padding-top:14px;padding-bottom:22px}
.mabel-el .elementor-widget.el-lead,.el-lead{font-size:clamp(19px,1.8vw,25px);color:#2f3a4a}
.el-lead p{margin:14px 0 26px}
.mabel-el .gammes{padding-top:0}
.mabel-el .e-con.cols,.specs-grid{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:38px}
.mabel-el .e-con.cols3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding-top:6px;padding-bottom:40px}
.specs h3,.cols h3{font-size:24px;font-weight:800;margin:0 0 14px;color:var(--ink)}
.specs ul,.cols ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.specs li,.cols li{padding:10px 0 10px 22px;border-bottom:1px solid var(--line);position:relative;font-size:16px}
.specs li::before,.cols li::before{content:"";position:absolute;left:2px;top:19px;width:8px;height:8px;background:var(--red);border-radius:1px}
.cols{padding-top:44px;padding-bottom:20px}
.cols h3 + ul{margin-bottom:6px}
.value h3{font-size:22px;font-weight:700;margin:0 0 8px}
.el-btn .elementor-button{background:var(--red);color:#fff;border-radius:3px;padding:17px 30px;font-size:19px;font-weight:500;font-family:inherit}
.el-btn .elementor-button:hover{background:var(--red-dark)}
.el-btn{padding-bottom:40px}
.p-buy .badges{margin-top:22px}
.foot-logo img{height:44px;width:147px}

/* UAE header & footer (Elementor) */
#masthead{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line-2)}
.hf .e-con.hf-row{display:flex!important;flex-direction:row!important;align-items:center;justify-content:space-between;gap:24px;min-height:86px}
.hf .elementor-widget.hf-logo img,.hf .elementor-widget.hf-logo-inv img{height:auto;max-width:none}
.hf-nav{flex:1}
.hf-nav .hfe-nav-menu__layout-horizontal .hfe-nav-menu{justify-content:flex-end}
.hf-nav a.hfe-menu-item{font:500 17px/1.2 var(--font);color:var(--ink);padding:10px 21px}
.hf-nav a.hfe-menu-item:hover,.hf-nav .current-menu-item > a.hfe-menu-item{color:var(--red)}
.hf-footer{background:var(--dark);color:#fff}
.hf-footer .e-con.hf-row{min-height:76px;padding-top:14px;padding-bottom:14px}
.hf-nav-foot a.hfe-menu-item{color:#fff;font-size:16px;font-weight:400}
.hf-nav-foot a.hfe-menu-item:hover{color:#fff;text-decoration:underline}

/* WooCommerce: listing */
.shop-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 18px;color:var(--muted);font-size:15px}
.shop-bar p{margin:0}
.shop-bar select{border:1px solid #d6d9de;border-radius:3px;padding:10px 12px;background:#fff}
ul.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:0 0 40px}
ul.products::before,ul.products::after{display:none}
ul.products li.product{min-width:0;margin:0;width:auto;float:none;border:1px solid var(--line);border-radius:3px;background:#fff;transition:border-color .15s,box-shadow .15s}
ul.products li.product:hover{border-color:#cfd3d9;box-shadow:0 8px 24px rgba(13,15,18,.07)}
ul.products li.product a.woocommerce-LoopProduct-link{display:flex;flex-direction:column;height:100%}
ul.products li.product .im{display:block;aspect-ratio:1/1;padding:18px;border-bottom:1px solid var(--line-2)}
ul.products li.product .im img{width:100%;height:100%;object-fit:contain;margin:0}
ul.products li.product .tx{padding:14px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
ul.products li.product small{color:var(--red);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.04em}
ul.products li.product .woocommerce-loop-product__title{font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.25;margin:0;padding:0;color:var(--ink)}
ul.products li.product .refs{margin-top:auto;padding-top:8px;color:var(--muted);font-size:14px}
.woocommerce-pagination ul{display:flex;gap:6px;list-style:none;padding:0;justify-content:center}
.woocommerce-pagination a,.woocommerce-pagination span{display:grid;place-items:center;min-width:40px;height:40px;border:1px solid var(--line);border-radius:3px}
.woocommerce-pagination .current{background:var(--red);color:#fff;border-color:var(--red)}

/* WooCommerce: product page */
.wc-single .p-title{padding:14px 0 22px}
.wc-single div.product{display:grid;grid-template-columns:1.21fr 1fr;gap:38px;align-items:start}
.wc-single div.product > .mabel-after,.wc-single div.product > .related{grid-column:1/-1}
.woocommerce-product-gallery{position:relative;margin:0;opacity:1!important;min-width:0}
.woocommerce-product-gallery .flex-viewport,.woocommerce-product-gallery > .woocommerce-product-gallery__wrapper{border:1px solid var(--line-2);border-radius:3px;background:#fff}
.woocommerce-product-gallery__wrapper{margin:0}
.woocommerce-product-gallery__image > a{display:block}
.woocommerce-product-gallery__image > a > img{width:100%;aspect-ratio:700/548;object-fit:contain;background:#fff}
.woocommerce-product-gallery .zoomImg{background:#fff}
.flex-control-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:12px;list-style:none;padding:0;margin:14px 0 0}
.flex-control-thumbs li{margin:0}
.flex-control-thumbs img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;padding:6px;border:1px solid var(--line);border-radius:3px;cursor:pointer;opacity:.75;transition:opacity .15s,border-color .15s}
.flex-control-thumbs img:hover{opacity:1}
.flex-control-thumbs img.flex-active{opacity:1;border:2px solid var(--red)}
.woocommerce-product-gallery__trigger{position:absolute;top:14px;right:14px;z-index:9;width:44px;height:44px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0f12' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4M11 8v6M8 11h6'/%3E%3C/svg%3E") center/20px no-repeat;border:1px solid var(--line);font-size:0;box-shadow:0 2px 8px rgba(13,15,18,.08)}
.woocommerce-product-gallery__trigger img,.woocommerce-product-gallery__trigger span{display:none!important}
.wc-single .summary{min-width:0}
.mabel-after{margin-top:22px}
.mabel-after .p-table.variants{max-width:640px}
.mabel-after .specs{padding-top:34px}
.related > h2{font-size:clamp(24px,2.4vw,30px);font-weight:800;margin:20px 0 18px}
.woocommerce-notices-wrapper:empty{display:none}

/* Pinned header (all screen sizes). No white band around the footer: the page background
   below the footer is the footer colour, and nothing pushes the footer away from the content. */
html{background:var(--dark)}
body{background:#fff;padding-top:var(--header-h,86px)}
#contenu{display:block}
.site-header.is-pinned,#masthead.is-pinned{position:fixed;top:var(--wp-admin--admin-bar--height,0px);left:0;right:0;z-index:100;background:#fff;transition:box-shadow .2s}
.is-scrolled .site-header.is-pinned,.is-scrolled #masthead.is-pinned{box-shadow:0 6px 20px rgba(13,15,18,.08)}
#colophon,.site-footer,.hf-footer{margin:0!important}
#colophon .footer-width-fixer{margin:0}
.elementor-editor-active #masthead.is-pinned{position:relative;top:0}
.elementor-editor-active{padding-top:0}
@media (max-width:600px){
  /* WordPress shows its admin bar in the page flow on phones: the header must stay at the very top */
  .site-header.is-pinned,#masthead.is-pinned{top:0}
  /* logged in on a phone: keep the WordPress bar fixed above the header instead of covering it */
  .admin-bar #wpadminbar{position:fixed!important}
  .admin-bar .site-header.is-pinned,.admin-bar #masthead.is-pinned{top:46px}
}

/* Footer contact line */
.foot-contact{margin:0;display:flex;flex-wrap:wrap;gap:8px 12px;font-size:15px;color:rgba(255,255,255,.82)}
.foot-contact a{color:#fff}
.foot-contact a:hover{text-decoration:underline}
.hf-contact{flex:1 1 auto}
.hf-contact .foot-contact{justify-content:center}

/* Anti-robot question */
.captcha{margin:2px 0 18px;padding:14px 16px;border:1px solid var(--line);border-radius:3px;background:var(--bg-soft)}
.captcha label{margin-bottom:8px}
.captcha input{max-width:220px;min-height:48px}

/* Home page built with native Elementor widgets */
.mabel-el .e-con.hero-native{min-height:448px;justify-content:center;background-repeat:no-repeat;background-size:52.6% 100%;background-position:right center}
.el-hero-in{padding-top:34px;padding-bottom:34px}
.el-hero-title{font-size:clamp(44px,5.4vw,72px);font-weight:800;line-height:1.05;letter-spacing:-.025em;color:var(--ink);max-width:640px}
.mabel-el .elementor-widget.el-hero-text{font-size:clamp(19px,1.7vw,23px);color:var(--ink)}
.el-hero-text p{margin:22px 0 36px}
.mabel-el .e-con.el-actions{gap:44px!important;align-items:center}
.el-btn .elementor-button-text::after{content:"\2192";margin-left:14px}
.el-link .elementor-button{background:none;color:var(--ink);padding:0 0 4px;border-radius:0;border-bottom:2px solid var(--red);font:500 17px/1.3 var(--font)}
.el-link .elementor-button:hover{background:none;color:var(--red)}
.el-link-light .elementor-button{color:#fff;font-size:18px}
.el-link-light .elementor-button:hover{color:#fff}
.mabel-el .e-con.el-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:0;padding-bottom:18px}
.mabel-el .e-con.g-card{display:grid!important;grid-template-columns:150px 1fr;gap:22px;align-items:center;color:inherit}
.g-card .g-img img{width:150px;height:150px;object-fit:contain;mix-blend-mode:multiply}
.g-title{font-size:23px;font-weight:700;letter-spacing:-.015em;color:var(--ink);margin-bottom:12px}
.mabel-el .elementor-widget.g-text{color:var(--muted);font-size:16.5px;line-height:1.38}
.g-text p{margin:0}
.g-card:hover .g-title .elementor-heading-title{color:var(--red)}
.mabel-el .e-con.band{color:#fff;margin-top:6px}
.mabel-el .e-con.band-row{justify-content:space-between;min-height:94px;padding-top:18px;padding-bottom:18px;gap:24px}
.band-title{font-size:clamp(23px,2.4vw,32px);font-weight:700;letter-spacing:-.02em;color:#fff}

@media (max-width:1100px){
  .nav{gap:26px}
  .g-card{grid-template-columns:110px 1fr;padding-right:16px}
  .g-card img{width:110px;height:110px}
  .p-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .burger{display:block}
  .nav{position:fixed;top:86px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gut) 20px;border-bottom:1px solid var(--line);display:none}
  .nav.open{display:flex}
  .nav a{padding:14px 0;border-bottom:1px solid var(--line-2)}
  .nav .btn{margin-top:14px;border:0;padding:14px}
  .hero{min-height:0;flex-direction:column;align-items:stretch}
  .hero-img{position:relative;inset:auto;height:280px;order:2}
  .hero-img::before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 30%)}
  .hero .wrap{padding-top:34px;padding-bottom:24px}
  .g-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .g-card,.g-card:nth-child(n){border-right:0;border-bottom:1px solid var(--line)}
  .contact-grid,.p-top,.p-bottom,.specs-grid{grid-template-columns:1fr}
  .p-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .values{grid-template-columns:1fr}
  .mabel-el .e-con.cols,.mabel-el .e-con.cols3,.specs-grid{grid-template-columns:1fr}
  .mabel-el .e-con.el-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .mabel-el .e-con.hero-native{min-height:0;background-size:100% 280px;background-position:center bottom;padding-bottom:280px}
  .wc-single div.product{grid-template-columns:1fr}
  ul.products{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  body{font-size:16px}
  .site-header .wrap{height:72px}
  .nav{top:72px}
  .brand img{height:44px}
  .g-grid{grid-template-columns:1fr}
  .g-card{grid-template-columns:96px 1fr;padding:12px 0}
  .g-card img{width:96px;height:96px}
  .f-grid,.opts{grid-template-columns:1fr}
  .p-grid,ul.products{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
  ul.products li.product .woocommerce-loop-product__title,.p-card h3{font-size:14.5px;line-height:1.3}
  ul.products li.product .tx,.p-card .tx{padding:10px 10px 12px}
  .foot-contact{font-size:14px}
  .mabel-el .e-con.el-grid{grid-template-columns:1fr}
  .mabel-el .e-con.g-card{grid-template-columns:96px 1fr}
  .g-card .g-img img{width:96px;height:96px}
  .mabel-el .e-con.el-actions{gap:24px!important}
  .flex-control-thumbs{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
  .flex-control-thumbs img{padding:3px}
  .p-table th,.p-table td{padding:10px 12px;font-size:15px}
  .p-table.variants td{white-space:normal}
  .p-title{word-break:break-word}
  .hero-cta{gap:24px}
  .site-footer nav{gap:22px}
}

/* Footer: separated from the dark home band, one compact line like on the other pages */
#colophon,.site-footer{border-top:1px solid rgba(255,255,255,.14)}
.hf-footer .e-con.hf-row{min-height:72px;flex-wrap:nowrap!important;row-gap:10px}
@media (max-width:1024px){.hf-footer .e-con.hf-row{flex-wrap:wrap!important}}
.hf-nav-foot .hfe-nav-menu__toggle{display:none!important}
.hf-footer .hf-nav-foot,.hf-footer .hf-logo-inv{flex:0 0 auto!important;width:auto!important;max-width:none!important}
.hf-footer .hf-contact{flex:1 1 auto!important;width:auto!important;min-width:0}
.hf-nav-foot nav.hfe-nav-menu__layout-horizontal{display:block!important}
.hf-nav-foot nav.hfe-nav-menu__layout-horizontal > .hfe-nav-menu{display:flex!important;flex-wrap:nowrap}
.hf-nav-foot a.hfe-menu-item{padding:8px 14px;white-space:nowrap}
.hf-nav-foot .hfe-nav-menu > li{border:0!important}
/* footer menu never collapses (UAE turns it into a hidden dropdown on phones) */
.hf-nav-foot nav,.hf-nav-foot nav > .hfe-nav-menu{visibility:visible!important;opacity:1!important;position:static!important;height:auto!important;max-height:none!important;transform:none!important;background:none!important;box-shadow:none!important;display:flex!important;flex-direction:row!important;flex-wrap:wrap;justify-content:center}
.hf-nav-foot nav li{width:auto!important;background:none!important}
.hf-nav-foot nav a.hfe-menu-item{background:none!important;color:#fff!important}
.hf-footer .elementor-widget.hf-logo-inv img{width:147px!important;height:44px!important}

/* "Demander un devis" stays visible on tablets and phones */
.btn-head{display:none}
.btn .short{display:none}
.hf-cta .btn{white-space:nowrap}
@media (max-width:1024px){
  .hf .e-con.hf-header-row{flex-wrap:nowrap!important;gap:12px}
  .hf-header .hf-logo,.hf-header .hf-nav,.hf-header .hf-cta{flex:0 0 auto!important;width:auto!important;max-width:none!important}
  .hf-header .hf-nav{order:3}
  .hf-header .e-con.hf-header-row{position:relative}
  .hf-header .hf-nav .elementor-widget-container,.hf-header .hf-nav .hfe-nav-menu{position:static!important}
  .hf-header .hf-nav nav.hfe-dropdown{position:absolute!important;left:0;right:0;top:100%;width:auto!important;z-index:110;background:#fff;box-shadow:0 12px 24px rgba(13,15,18,.1)}
  .hf-header .hf-cta{order:2;margin-left:auto!important}
  .hf-cta .btn{padding:11px 16px;font-size:15.5px}
}
@media (max-width:900px){
  .btn-head{display:inline-flex;margin-left:auto;padding:10px 14px;font-size:15px}
  .site-header .wrap{gap:12px}
}
@media (max-width:600px){
  .hf .elementor-widget.hf-logo img{width:150px!important}
  .hf-cta .btn,.btn-head{padding:9px 12px;font-size:14px}
  .btn-head .long,.hf-cta .btn .long{display:none}
  .btn-head .short,.hf-cta .btn .short{display:inline}
  .hf-footer .e-con.hf-row,.site-footer .wrap{justify-content:center;text-align:center}
  .hf-nav-foot a.hfe-menu-item{padding:6px 10px;font-size:15px}
}

/* Catalogue PDF page */
.cat-pdf{padding-bottom:44px}
.cat-pdf-bar{display:flex;justify-content:space-between;align-items:center;gap:16px 28px;flex-wrap:wrap;border-top:1px solid var(--line);padding:18px 0}
.cat-pdf-bar p{margin:0;color:var(--muted)}
.cat-pdf-bar strong{color:var(--ink)}
.cat-pdf-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.cat-pdf-view{display:block;width:100%;height:min(82vh,1000px);border:1px solid var(--line);border-radius:3px;background:var(--bg-soft)}
.cat-pdf-cover{display:none}
@media (max-width:900px){
  /* phones and tablets show only the first page of an embedded PDF: open it in the native viewer instead */
  .cat-pdf-view{display:none}
  .cat-pdf-cover{display:block;position:relative;max-width:420px;margin:0 auto;border:1px solid var(--line);border-radius:3px;overflow:hidden;box-shadow:0 10px 30px rgba(13,15,18,.1)}
  .cat-pdf-cover img{width:100%}
  .cat-pdf-cover .btn{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);white-space:nowrap}
  .cat-pdf-actions{width:100%;justify-content:space-between}
}

/* Safari (iPhone/iPad): a grid item never shrinks below its content, so the 3-image slider
   strip (3x the width) widened the whole page. Clip it and let the columns shrink. */
html,body{overflow-x:clip}
.wc-single div.product{grid-template-columns:minmax(0,1.21fr) minmax(0,1fr)}
.wc-single div.product > *{min-width:0;max-width:100%}
.woocommerce-product-gallery,.woocommerce-product-gallery .flex-viewport{overflow:hidden;max-width:100%}
.woocommerce-product-gallery .woocommerce-product-gallery__image{-webkit-transform:translateZ(0)}
@media (max-width:900px){.wc-single div.product{grid-template-columns:minmax(0,1fr)}}
/* Titles keep the brand weight unless Elementor sets another one */
:where(.p-title,.hero h1,.page-head h1,.gammes h2,.related > h2,.specs h3){font-family:var(--font)}

/* Product card photos (Safari/iPhone): in a flex column Safari sized the square frame from the
   photo instead of the card, so photos spilled out. The frame now takes the card width and the
   photo is placed inside it. */
ul.products li.product,.p-card{overflow:hidden}
ul.products li.product a.woocommerce-LoopProduct-link{width:100%;min-width:0}
ul.products li.product .im,.p-card .im{position:relative;display:block;width:100%;height:0;padding:0 0 100%;aspect-ratio:auto;overflow:hidden;flex:none}
ul.products li.product .im img,.p-card .im img{position:absolute;top:18px;left:18px;width:calc(100% - 36px)!important;height:calc(100% - 36px)!important;max-width:none;object-fit:contain;margin:0}
@media (max-width:600px){
  ul.products li.product .im img,.p-card .im img{top:10px;left:10px;width:calc(100% - 20px)!important;height:calc(100% - 20px)!important}
}

/* Home hero (native Elementor, v1.7). Same picture on every screen: the photo always keeps the
   mock-up ratio 762 x 447 and is never re-cropped; desktop = text left / photo right, phone = text
   then the whole photo. */
.mabel-el .e-con.hero-native2{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center;gap:0}
.hero-native2 > .e-con.el-hero-in{flex:0 0 47.4%!important;width:47.4%!important;padding:34px 24px 34px max(var(--gut),calc((100vw - var(--wrap))/2))!important;position:relative;z-index:2}
.hero-native2 > .el-hero-photo{flex:0 0 52.6%!important;width:52.6%!important;max-width:none!important;padding:0!important;margin:0!important;position:relative}
.el-hero-photo,.el-hero-photo .elementor-widget-container{position:relative;overflow:hidden}
.el-hero-photo img{display:block;width:100%!important;max-width:none!important;height:auto!important;aspect-ratio:762/447;object-fit:cover;object-position:center}
.el-hero-photo::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.75) 8%,rgba(255,255,255,0) 26%)}
:where(.el-hero-title) .elementor-heading-title{white-space:normal}
.hero-native2 .el-hero-title{font-size:clamp(40px,4.75vw,72px);line-height:1.04;letter-spacing:-.03em}
.mabel-el .e-con.hero-native2{align-items:center!important}
.g-title,.band-title,.el-h2{line-height:1.08}
.g-title{line-height:1.15}
.hero-native2 .el-hero-text{line-height:1.4}
@media (min-width:1201px){.hero-native2 .el-hero-text{max-width:none!important}.hero-native2 .el-hero-text p{white-space:nowrap}}
.hero-native2 .el-hero-title,.hero-native2 .el-hero-text,.hero-native2 .el-actions{padding-left:0!important;padding-right:0!important;max-width:640px!important}
.hero-native2 .el-actions .el-btn{padding-bottom:0}
.hero-native2 .el-actions{flex-wrap:wrap!important;flex-direction:row!important;align-items:center!important}
.hero-native2 .el-actions > .elementor-widget{width:auto!important;max-width:none!important;flex:0 0 auto!important}
.el-btn .elementor-button{display:inline-flex;align-items:center}
@media (min-width:768px) and (max-width:1200px){
  .hero-native2 .el-hero-title{font-size:clamp(30px,4.4vw,52px)}
  .hero-native2 > .e-con.el-hero-in{padding-top:24px!important;padding-bottom:24px!important}
  .hero-native2 .el-hero-text{font-size:17px}
  .hero-native2 .el-btn .elementor-button{padding:13px 18px;font-size:16px}
  .hero-native2 .el-link .elementor-button{font-size:16px}
  .hero-native2 .el-hero-text p{margin:16px 0 24px}
  .hero-native2 .el-actions{gap:22px!important}
}
@media (max-width:767px){
  .mabel-el .e-con.hero-native2{flex-direction:column!important;align-items:stretch}
  .hero-native2 > .e-con.el-hero-in{flex:none!important;width:100%!important;padding:30px var(--gut) 26px!important}
  .hero-native2 > .el-hero-photo{flex:none!important;width:100%!important}
  .el-hero-photo::before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 18%)}
}
@media (max-width:600px){
  .hero-native2 .el-hero-title{font-size:clamp(34px,10vw,44px)}
  .hero-native2 .el-actions{gap:18px!important}
}

/* v1.7.1 - hero fits on screen: the photo is never taller than the mock-up proportion at 1448 px
   (30.85vw), 500 px, or the screen height left under the header. On wide screens the text column
   keeps a readable width and the photo fills the rest. */
@media (min-width:768px){
  .hero-native2 > .e-con.el-hero-in{flex:0 0 auto!important;width:calc(max(var(--gut),(100vw - var(--wrap))/2) + min(620px,41vw))!important}
  .hero-native2 > .el-hero-photo{flex:1 1 0!important;width:auto!important;min-width:0}
  /* v1.7.4: the whole photo is always shown (never cropped), whatever picture is chosen in Elementor:
     natural proportions, height capped so the hero fits on screen, aligned to the right edge */
  .hero-native2 > .el-hero-photo{display:flex!important;justify-content:flex-end}
  .el-hero-photo,.el-hero-photo .elementor-widget-container{display:flex;justify-content:flex-end;width:100%}
  .el-hero-photo::before{display:none}
  .el-hero-photo img{aspect-ratio:auto 1089/639!important;width:auto!important;height:auto!important;max-width:100%!important;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,rgba(0,0,0,.25) 8%,#000 26%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,rgba(0,0,0,.25) 8%,#000 26%);max-height:max(320px,min(500px,calc(100svh - var(--header-h,86px) - 150px)))!important;object-fit:contain;margin-left:auto}
  .hero-native2 .el-hero-title{font-size:clamp(36px,min(4.6vw,8.4svh),68px)}
  .hero-native2 .el-hero-text p{margin:18px 0 28px}
}
/* No light line between the dark band and the footer: the footer is one shade darker instead */
#colophon,.site-footer{border-top:0!important}
html,.site-footer,.hf-footer{background:#222529}

/* v1.7.3 - the footer is always at the bottom of the screen and identical on every page: on a page
   shorter than the screen, the free space goes above the footer (white, or under the home band)
   instead of showing an empty dark area below it. */
html{background:#fff}
body{box-sizing:border-box;min-height:calc(100vh - var(--wp-admin--admin-bar--height,0px));min-height:calc(100svh - var(--wp-admin--admin-bar--height,0px));display:flex;flex-direction:column}
body > #contenu{flex:1 0 auto;display:flex;flex-direction:column}
#contenu > .elementor,#contenu > .elementor > .e-con.e-parent:last-child{flex:1 0 auto;display:flex;flex-direction:column}
#contenu .e-con.band{margin-top:auto!important}
body > #colophon,body > .site-footer{flex:none}
.hf-footer .e-con.hf-row{min-height:60px!important;padding-top:8px!important;padding-bottom:8px!important}
#wpadminbar{flex:none}
/* v1.8.3 - footer = logo + links only (owner's choice); also hides the contact line of footers made earlier */
#colophon .hf-contact,.site-footer .foot-contact{display:none!important}
#masthead .hf-logo img{aspect-ratio:auto 270/58;height:auto!important}
.hf-footer .e-con.hf-row{justify-content:space-between!important}
@media (max-width:600px){.hf-footer .e-con.hf-row,.site-footer .wrap{flex-direction:column!important;gap:6px!important}}
/* v1.9 - Formidable forms with the site design */
.form-frm .frm_forms{max-width:none}
.form-frm .frm_form_fields > fieldset{border:0;padding:0;margin:0}
.form-frm .frm_form_field.frm_hidden_container,.form-frm .frm_hidden_container{display:none}
.form-frm .frm_form_field{margin-bottom:16px}
.form-frm .frm_forms .frm_primary_label,.form-frm .frm_primary_label{display:block;font:700 17px/1.3 var(--font)!important;color:var(--ink)!important;margin-bottom:10px!important;padding:0!important}
.form-frm .frm_required{color:var(--red)}
.form-frm input[type=text],.form-frm input[type=email],.form-frm input[type=tel],.form-frm input[type=number],.form-frm select,.form-frm textarea{width:100%!important;max-width:none;border:1px solid #d6d9de!important;border-radius:3px!important;padding:14px!important;background:#fff!important;min-height:56px;font:inherit;color:var(--text);box-shadow:none!important}
.form-frm textarea{min-height:156px;resize:vertical}
.form-frm input:focus,.form-frm textarea:focus{outline:2px solid var(--red)!important;outline-offset:-1px;border-color:var(--red)!important}
.form-frm .frm_error,.form-frm .frm_error_style{color:var(--red-dark);font-size:14.5px;margin-top:6px;background:none;border:0;padding:0}
.form-frm .frm_error_style{background:var(--red-soft);padding:14px 18px;border-radius:4px;margin:0 0 18px}
.form-frm .frm_message{background:#eaf7ee;color:#1d6b33;border-radius:4px;padding:14px 18px;margin:0 0 18px;font-weight:500;border:0}
.form-frm .frm_submit{margin:22px 0 0}
.form-frm .frm_submit{width:100%}
.form-frm .frm_forms .frm_submit button,.form-frm .frm_submit button,.form-frm .frm_submit input[type=submit]{display:flex!important;margin:0!important;align-items:center;justify-content:center;width:100%!important;background:var(--red)!important;color:#fff!important;border:0!important;border-radius:3px!important;padding:17px!important;font:500 19px/1.2 var(--font)!important;cursor:pointer;box-shadow:none!important;height:auto!important}
.form-frm .frm_submit button:hover{background:var(--red-dark)!important}
.form-frm .note{margin-top:16px}
/* v2.0 - product sheet blocks (tables from the Fiche produit Mabel box, Elementor product pages) */
.p-tablewrap{margin:0 0 22px;max-width:100%;overflow-x:auto}
.p-table-title{font-size:20px;font-weight:800;margin:0 0 10px;color:var(--ink)}
.mabel-wc-block{padding-bottom:10px}
.mabel-wc-block > .product{display:grid;grid-template-columns:minmax(0,1.21fr) minmax(0,1fr);gap:38px;align-items:start}
.opt img{width:72px;height:76px;object-fit:contain;flex:none}
@media (max-width:900px){.mabel-wc-block > .product{grid-template-columns:minmax(0,1fr)}}
/* v2.2 - selection buttons sized from their number and text length (mabel_opts_columns):
   always the width of the "add to quote" button; 2-4 per row for short texts, one per row for long ones */
.opts.opts-auto{display:grid;grid-template-columns:repeat(var(--cols,1),minmax(0,1fr));gap:12px;width:100%}
.opts.opts-auto .opt{min-height:64px;padding:12px 14px;gap:12px}
.opts.opts-auto .opt .t{font-weight:700;font-size:16.5px;line-height:1.3;min-width:0;overflow-wrap:break-word;word-break:normal;-webkit-hyphens:auto;hyphens:auto}
.opts.opts-auto .opt .t small{font-size:13px}
.opts.opts-auto.with-img .opt img{width:64px;height:64px}
.opts.opts-c3 .opt,.opts.opts-c4 .opt{flex-direction:column;align-items:center;text-align:center;padding:14px 8px 12px;gap:8px;min-height:0}
.opts.opts-c3 .opt input,.opts.opts-c4 .opt input{position:absolute;top:8px;right:8px;width:20px;height:20px}
.opts.opts-c3 .opt input::after,.opts.opts-c4 .opt input::after{width:10px;height:10px}
.opts.opts-c3.with-img .opt img,.opts.opts-c4.with-img .opt img{width:100%;height:70px;object-fit:contain}
.opts.opts-c4 .opt .t{font-size:15px}
@media (max-width:420px){.opts.opts-c4{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 2.4.1 — buttons follow the width really available (phones, tablets, split screen, any zoom) */
.opts.opts-auto{container-type:inline-size;container-name:opts}
.opts.opts-auto .opt{min-width:0}
.opts.opts-auto .opt .t small{overflow-wrap:break-word}
@container opts (max-width:620px){
  .opts.opts-c2 .opt{flex-direction:column;align-items:center;text-align:center;padding:14px 10px 12px;gap:8px;min-height:0}
  .opts.opts-c2 .opt input{position:absolute;top:8px;right:8px;width:20px;height:20px}
  .opts.opts-c2 .opt input::after{width:10px;height:10px}
  .opts.opts-c2.with-img .opt img{width:100%;height:80px;object-fit:contain}
  .opts.opts-c2 .opt .t{font-size:15.5px;padding:0 4px}
}
@container opts (max-width:440px){
  .opts.opts-c4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .opts.opts-c3 .opt .t,.opts.opts-c4 .opt .t{font-size:14.5px}
}
@container opts (max-width:300px){
  .opts.opts-c2,.opts.opts-c3{grid-template-columns:minmax(0,1fr)}
  .opts.opts-c1 .opt{gap:10px;padding:10px 12px}
  .opts.opts-c1.with-img .opt img{width:52px;height:52px}
}
/* v2.3 - catalogue cover drawn from the first page of the linked PDF */
.cat-pdf-canvas{display:block;width:100%;height:auto;aspect-ratio:600/848;background:var(--bg-soft)}
.cat-pdf-canvas.is-ready{aspect-ratio:auto}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}