/* ==========================================================================
   Cabrio Informatique, front-end stylesheet.

   The register comes from the reference design: night background and a single
   lemon accent, a light grotesque with an italic serif for highlighted words,
   everything centred. Every custom class carries the cab- prefix.

   The first part is the HTML mock-up's stylesheet; the second part, from
   "Block editor adaptations" on, adapts it to the markup of core blocks.
   ========================================================================== */


:root{
  --cab-nuit:#080C04;
  --cab-citron:#C2F43C;
  --cab-citron-fonce:#9CCB1C;
  --cab-brume:#F8FCF0;
  --cab-blanc:#FFFFFF;
  --cab-gris:#9A9E94;
  --cab-sans:'Inter Tight', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --cab-serif:'Instrument Serif', 'Times New Roman', serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cab-nuit);color:var(--cab-blanc);font-family:var(--cab-sans);
  font-size:15px;line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{margin:0;font-weight:400;letter-spacing:-.022em;text-wrap:balance;hyphens:none}
p{margin:0}
a{color:inherit}
figure{margin:0}
em{font-family:var(--cab-serif);font-style:italic;font-weight:400;letter-spacing:-.01em}

.cab-wrap{max-width:1160px;margin-inline:auto;padding-inline:24px}

/* ---------- Headings ---------- */
.cab-titre-l{font-size:clamp(46px,5.6vw,82px);line-height:.98;text-align:center}
.cab-titre-l em{font-size:1.06em}
.cab-titre-m{font-size:clamp(32px,3.4vw,50px);line-height:1.04;text-align:center}
.cab-titre-m em{font-size:1.08em}
.cab-surtitre{font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-align:center;
  color:rgba(255,255,255,.7);margin-bottom:22px}

/* ---------- Buttons ---------- */
/* The default button, glowing pill on night, and its outline style are
   written in theme.json (styles.elements.button, core/button outline
   variation, 1.22.0): every Button block, and every plugin button that
   carries .wp-element-button, takes them on the site and in the editor.
   theme.json has no transition: the glow's stays here, at zero specificity,
   on the two properties that change on hover, as on .cab-b-lueur. The cab-b-*
   buttons below draw their own look, border and shadow included. */
:where(.wp-element-button,.wp-block-button__link){transition:border-color .25s,box-shadow .25s}
/* The outline style fills in on hover (night, lemon text and the glow, 1.22.1):
   its background and text fade with the rest. */
:where(.wp-block-button.is-style-outline>.wp-block-button__link){transition:background-color .25s,border-color .25s,box-shadow .25s,color .25s}
.cab-b-lueur>.wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 30px;border-radius:999px;border:1.5px solid rgba(194,244,60,.55);
  background:rgba(8,12,4,.85);color:var(--cab-blanc);font-size:13.5px;font-weight:500;
  text-decoration:none;letter-spacing:-.005em;
  box-shadow:0 0 22px rgba(194,244,60,.28), inset 0 0 12px rgba(194,244,60,.08);
  transition:box-shadow .25s, border-color .25s}
.cab-b-lueur>.wp-block-button__link:hover{border-color:var(--cab-citron);box-shadow:0 0 34px rgba(194,244,60,.5), inset 0 0 14px rgba(194,244,60,.14)}
.cab-b-trait>.wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 30px;border-radius:999px;border:1.5px solid var(--cab-nuit);background:transparent;
  color:var(--cab-nuit);font:500 13.5px/1 var(--cab-sans);text-decoration:none;cursor:pointer;box-shadow:none}
.cab-b-trait>.wp-block-button__link:hover{background:var(--cab-nuit);color:var(--cab-citron)}

/* ---------- Header ---------- */
.cab-entete{position:absolute;inset:0 0 auto 0;z-index:30;padding:26px 56px}
.cab-entete-rangee{display:flex;align-items:center;gap:40px;max-width:1328px;margin-inline:auto}
.cab-marque{display:inline-block;padding:5px 10px 4px;border:1.5px solid var(--cab-blanc);border-radius:3px;
  font:600 15px/1 var(--cab-sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--cab-blanc)}
.cab-menu{display:flex;gap:42px;margin-inline:auto}
/* White header button. On the home page the lemon form takes its place. */
.cab-entete-cta{flex:none;padding:10px 18px;border-radius:999px;background:var(--cab-blanc);color:var(--cab-nuit);
  font:600 12px/1 var(--cab-sans);text-decoration:none;letter-spacing:.01em}
.cab-entete-cta:hover{background:var(--cab-citron)}
.cab-menu a{font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:rgba(255,255,255,.82)}
.cab-menu a:hover{color:var(--cab-citron)}

/* ---------- Home hero ---------- */
.cab-hero{position:relative;min-height:940px;padding:220px 24px 0;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(1.4px 1.4px at 11% 15%, rgba(255,255,255,.55) 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 11% 56%, rgba(255,255,255,.45) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 86% 56%, rgba(255,255,255,.45) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 70% 22%, rgba(255,255,255,.35) 50%, transparent 51%),
    radial-gradient(1px 1px at 28% 34%, rgba(255,255,255,.3) 50%, transparent 51%),
    var(--cab-nuit)}
/* The horizon: a dark planet rimmed with a lemon glow. It hangs below the
   button, so it follows the title at every width. */
.cab-hero-centre::before{content:"";position:absolute;z-index:-2;left:50%;top:calc(100% - 166px);width:1700px;height:560px;
  transform:translateX(-50%);
  background:
    radial-gradient(28% 34% at 50% 58%, rgba(226,252,140,.78) 0%, rgba(194,244,60,.5) 38%, transparent 100%),
    radial-gradient(50% 50% at 50% 62%, rgba(150,200,60,.42) 0%, rgba(80,140,90,.22) 50%, transparent 80%)}
.cab-hero-centre::after{content:"";position:absolute;z-index:-1;left:50%;top:calc(100% + 104px);width:3800px;height:1600px;
  transform:translateX(-50%);border-radius:50%;background:var(--cab-nuit);
  box-shadow:0 -1px 0 rgba(226,252,150,.7), 0 -10px 40px rgba(194,244,60,.25)}
.cab-hero-centre{text-align:center;position:relative}
.cab-hero-centre .wp-block-buttons{margin-top:44px}
.cab-titre-hero{font-size:clamp(58px,8vw,116px);line-height:.93;letter-spacing:-.03em;font-weight:400}
.cab-titre-hero em{position:relative;display:inline-block;font-size:1.02em;padding:0 .08em;letter-spacing:-.02em}
/* The orbit drawn around the italic word. */
.cab-titre-hero em::before{content:"";position:absolute;left:-34%;right:-34%;top:12%;bottom:-6%;
  border:1.5px solid rgba(255,255,255,.7);border-radius:50%;transform:rotate(-7deg);pointer-events:none}
.cab-titre-hero em::after{content:"";position:absolute;right:-48%;top:2%;width:.32em;height:.32em;
  background:var(--cab-blanc);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0c.6 6.4 5.6 11.4 12 12-6.4.6-11.4 5.6-12 12-.6-6.4-5.6-11.4-12-12C6.4 11.4 11.4 6.4 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0c.6 6.4 5.6 11.4 12 12-6.4.6-11.4 5.6-12 12-.6-6.4-5.6-11.4-12-12C6.4 11.4 11.4 6.4 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat;
  box-shadow:none}

/* The lemon form floating at the top right. */
.cab-demande{position:absolute;z-index:40;top:20px;right:max(40px, calc(50% - 680px));width:300px;
  padding:26px 22px 22px;border-radius:8px;background:var(--cab-citron);color:var(--cab-nuit);
  box-shadow:0 30px 80px rgba(0,0,0,.35)}
.cab-demande-titre{font-size:38px;line-height:.94;letter-spacing:-.04em;font-weight:500}
.cab-demande-sous{font-size:11.5px;margin:10px 0 18px;opacity:.75}
.cab-demande-form{display:grid;gap:12px}
.cab-demande-form label{display:grid;gap:5px;font-size:10.5px;font-weight:500;letter-spacing:.02em}
.cab-demande-form input{width:100%;height:32px;border:0;border-radius:4px;background:#B2E434;
  font:400 13px var(--cab-sans);color:var(--cab-nuit);padding:0 10px}
.cab-demande-form input:focus{outline:1.5px solid var(--cab-nuit);outline-offset:0}
/* The list of choices (Cabrio Contact 1.1.0) dressed like the other fields, its arrow drawn
   in night ink since the browser's own one ignores the colours (1.30.0). */
.cab-demande-form select{width:100%;height:32px;border:0;border-radius:4px;background:#B2E434 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 10px center/14px no-repeat;
  font:400 13px var(--cab-sans);color:var(--cab-nuit);padding:0 32px 0 10px;-webkit-appearance:none;appearance:none;cursor:pointer}
.cab-demande-form select:focus{outline:1.5px solid var(--cab-nuit);outline-offset:0}
.cab-lien-fleche::after{content:"→";font-family:var(--cab-sans)}

/* ---------- Manifesto ---------- */
.cab-manifeste{padding:30px 24px 150px;text-align:center}
.cab-manifeste-texte{max-width:880px;margin-inline:auto;font-size:clamp(21px,2.3vw,31px);line-height:1.22;
  text-transform:uppercase;letter-spacing:-.02em;color:rgba(255,255,255,.92);text-wrap:balance}
.cab-manifeste-texte em{text-transform:none;font-size:1.14em;color:var(--cab-blanc)}

/* ---------- Full width photo ---------- */
.cab-pleine img{width:100%;height:clamp(320px,46vw,660px);object-fit:cover}

/* ---------- The five pillars ---------- */
.cab-piliers{padding:130px 0 120px;text-align:center;overflow:hidden}
.cab-piliers-chapeau{max-width:470px;margin:22px auto 0;font-size:13.5px;color:rgba(255,255,255,.62);position:relative;z-index:2}
.cab-anneau{position:relative;width:min(640px,88vw);aspect-ratio:1;margin:-34px auto 0;border-radius:50%;
  background:radial-gradient(circle at 50% 50%, var(--cab-nuit) 66%, #0B1205 70.5%);
  box-shadow:0 0 0 1px rgba(194,244,60,.18), 0 0 70px 18px rgba(110,170,40,.42), 0 0 160px 40px rgba(60,84,18,.55)}
.cab-anneau-centre{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:15px;line-height:1.3;color:var(--cab-citron);white-space:nowrap}
.cab-pilier{position:absolute;transform:translate(-50%,-50%);font-size:12px;color:rgba(214,250,140,.9);white-space:nowrap}
.cab-pilier::before{content:"";position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);
  width:16px;height:16px;border-radius:50%;border:1.5px solid rgba(194,244,60,.75);background:var(--cab-nuit)}
.cab-pilier::after{content:"";position:absolute;left:-10px;top:-4px;width:4px;height:4px;border-radius:50%;background:var(--cab-citron);opacity:.8}
.cab-p1{left:50%;top:9%}
.cab-p2{left:84.2%;top:34%}
.cab-p3{left:71.2%;top:74%}
.cab-p4{left:28.8%;top:74%}
.cab-p5{left:15.8%;top:34%}
.cab-anneau-bulle{position:absolute;left:94%;top:30%;width:200px;padding:10px 12px;border:1px solid rgba(194,244,60,.45);
  border-radius:3px;background:rgba(8,12,4,.9);font-size:11px;line-height:1.4;text-align:left;color:rgba(255,255,255,.75)}

/* ---------- Nearby ---------- */
.cab-proximite{position:relative;padding:190px 24px 70px;text-align:center;overflow:hidden}
.cab-proximite-centre{position:relative;z-index:2}
.cab-proximite .cab-titre-l{margin-bottom:34px}
.cab-incline{position:absolute;z-index:1;width:340px;aspect-ratio:9/11;border-radius:18px;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.5)}
.cab-incline img{width:100%;height:100%;object-fit:cover}
.cab-incline-g{left:-40px;top:80px;transform:rotate(-14deg)}
.cab-incline-d{right:-50px;top:70px;transform:rotate(13deg)}
.cab-communes{list-style:none;margin:110px auto 0;padding:0;max-width:1100px;display:flex;flex-wrap:wrap;
  justify-content:space-between;gap:14px 30px;position:relative;z-index:2}
.cab-communes li{font-size:15px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:500}

/* ---------- Three trades ---------- */
.cab-metiers{position:relative;padding:140px 0 150px;overflow:hidden;
  background:
    radial-gradient(380px 520px at 0% 72%, rgba(110,150,40,.55), transparent 70%),
    radial-gradient(380px 520px at 100% 72%, rgba(110,150,40,.5), transparent 70%),
    var(--cab-nuit)}
.cab-metiers-tete{text-align:center}
.cab-metiers-sous{margin:22px auto 34px;font-size:clamp(18px,1.7vw,23px);line-height:1.3;letter-spacing:-.02em}
.cab-metiers-sous em{font-size:1.1em}
.cab-carrousel{position:relative;max-width:1240px;margin:80px auto 0;padding-inline:24px}
.cab-piste{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 28px)/3);gap:14px;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.cab-piste::-webkit-scrollbar{display:none}
.cab-piste > *{scroll-snap-align:start;aspect-ratio:22/30;border-radius:16px;overflow:hidden}
.cab-carte-chiffres{display:flex;flex-direction:column;padding:24px 22px;border:1px solid rgba(194,244,60,.45);background:rgba(8,12,4,.72)}
/* Icons: each cab-ico-* class only sets --cab-ico; the component applies the mask. */
.cab-ico-outil{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 0 0 5.4-5.4l-2.6 2.6-2.4-.6-.6-2.4 2.6-2.6Z'/%3E%3C/svg%3E")}
.cab-ico-ecran{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Crect x='2.5' y='4' width='19' height='13' rx='1.5'/%3E%3Cpath d='M8 21h8M12 17v4M2.5 8h19'/%3E%3C/svg%3E")}
.cab-ico-coiffe{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M12 4 1.5 9 12 14l10.5-5L12 4Z'/%3E%3Cpath d='M6 11.2V16c0 1.6 2.7 3 6 3s6-1.4 6-3v-4.8M21 9.5v5'/%3E%3C/svg%3E")}
.cab-ico-jauge{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 16.5a8.5 8.5 0 1 1 17 0'/%3E%3Cpath d='M12 16.5l4.5-5.5'/%3E%3Ccircle cx='12' cy='16.5' r='1.4'/%3E%3C/svg%3E")}
.cab-ico-bouclier{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5 4 5.5v6c0 5 3.4 8.6 8 10 4.6-1.4 8-5 8-10v-6l-8-3Z'/%3E%3Cpath d='m8.5 12 2.5 2.5 4.5-5'/%3E%3C/svg%3E")}
.cab-ico-fenetres{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='13' height='12' rx='1.5'/%3E%3Cpath d='M3 11.5h13'/%3E%3Cpath d='M8 8V4.5A1.5 1.5 0 0 1 9.5 3h10A1.5 1.5 0 0 1 21 4.5v9a1.5 1.5 0 0 1-1.5 1.5H16'/%3E%3C/svg%3E")}
.cab-ico-disque{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2.5'/%3E%3Ccircle cx='12' cy='11' r='5'/%3E%3Ccircle cx='12' cy='11' r='1'/%3E%3Cpath d='M7 18.2h2.5'/%3E%3C/svg%3E")}
.cab-ico-maj{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12a8 8 0 1 1-2.4-5.7'/%3E%3Cpath d='M20.5 3.5v4.5H16'/%3E%3C/svg%3E")}
.cab-ico-sauvegarde{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 18a4.5 4.5 0 0 1-.4-9 6 6 0 0 1 11.6 1.6A3.8 3.8 0 0 1 17.5 18'/%3E%3Cpath d='M12 12.5v8M9 15.5l3-3 3 3'/%3E%3C/svg%3E")}
.cab-ico-etincelle{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 3c.4 4.6 2.4 6.6 7 7-4.6.4-6.6 2.4-7 7-.4-4.6-2.4-6.6-7-7 4.6-.4 6.6-2.4 7-7Z'/%3E%3Cpath d='M19 15c.2 1.6.9 2.3 2.5 2.5-1.6.2-2.3.9-2.5 2.5-.2-1.6-.9-2.3-2.5-2.5 1.6-.2 2.3-.9 2.5-2.5Z'/%3E%3C/svg%3E")}
.cab-ico-panier{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4h2.6l2.3 11h10.8l2.3-8H6.2'/%3E%3Ccircle cx='9' cy='19.5' r='1.3'/%3E%3Ccircle cx='17' cy='19.5' r='1.3'/%3E%3C/svg%3E")}
.cab-ico-loupe{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 21 21'/%3E%3C/svg%3E")}
.cab-ico-crayon{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20l1-4.5L16 4.5a2.1 2.1 0 0 1 3 3L8 18.5 4 20Z'/%3E%3Cpath d='m14 6.5 3 3'/%3E%3C/svg%3E")}
.cab-ico-photo{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='14' rx='2'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3Cpath d='M8.5 6 10 3.5h4L15.5 6'/%3E%3C/svg%3E")}
.cab-ico-texte{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M8.5 8h7M8.5 12h7M8.5 16h4'/%3E%3C/svg%3E")}
.cab-ico-souris{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='6'/%3E%3Cpath d='M12 6.5V10'/%3E%3C/svg%3E")}
.cab-ico-globe{--cab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cellipse cx='12' cy='12' rx='4.3' ry='9.5'/%3E%3Cpath d='M2.5 12h19M4 7h16M4 17h16'/%3E%3C/svg%3E")}
.cab-carte-chiffres h3{font-size:19px;letter-spacing:-.02em;margin:22px 0 8px}
.cab-carte-texte{font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.66)}
.cab-chiffres{display:grid;grid-template-columns:1fr 1fr;gap:22px 12px;margin:auto 0 0;padding-top:24px}
.cab-lien-fleche{margin-top:30px;display:inline-flex;gap:10px;font-size:12px;text-decoration:none;color:rgba(255,255,255,.85)}
.cab-lien-fleche:hover{color:var(--cab-citron)}
.cab-carte-photo{position:relative}
.cab-carte-photo img{width:100%;height:100%;object-fit:cover}
.cab-carte-photo figcaption{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:9px;
  font-size:15px;letter-spacing:-.02em;color:var(--cab-blanc);text-shadow:0 1px 12px rgba(0,0,0,.4)}
.cab-carte-photo figcaption::before{content:"";width:20px;height:20px;border-radius:50%;border:1.5px solid var(--cab-blanc);
  background:radial-gradient(circle, var(--cab-blanc) 0 2.5px, transparent 3px)}
.cab-fleche{position:absolute;top:50%;z-index:3;width:42px;height:42px;margin-top:-21px;border-radius:50%;
  border:0;background:#141B0C;cursor:pointer;color:var(--cab-blanc)}
.cab-fleche::after{content:"←";font:400 17px/42px var(--cab-sans)}
.cab-fleche-d::after{content:"→"}
.cab-fleche-g{left:-36px}
.cab-fleche-d{right:-36px}
.cab-fleche:hover{background:var(--cab-citron);color:var(--cab-nuit)}

/* ---------- Tips ---------- */
.cab-conseils{padding:40px 0 150px;text-align:center}
.cab-conseils-grille{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1120px;margin:60px auto 56px}
.cab-article-cat{display:block;margin-top:24px;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.cab-article-titre{display:block;max-width:300px;margin:8px auto 0;font-size:15px;line-height:1.3;letter-spacing:-.015em}

/* ---------- Frame: "what we do best" ---------- */
.cab-cadre{padding:clamp(16px,3vw,40px);
  background:linear-gradient(135deg,#8FC492 0%,#B2DB82 30%,#E0F8AB 62%,#D6EE8E 78%,#A8C45E 100%)}
.cab-cadre-carte{max-width:1400px;margin-inline:auto;padding:110px clamp(20px,6vw,96px) 130px;border-radius:16px;
  background:var(--cab-brume);color:var(--cab-nuit);box-shadow:0 20px 60px rgba(40,70,10,.12)}
.cab-cadre .cab-titre-m{margin-bottom:96px}
.cab-rangees{max-width:1170px;margin-inline:auto}
.cab-rangee{display:grid;grid-template-columns:64px 1fr 240px 280px;gap:24px;align-items:start;
  min-height:228px;padding:24px 0;border-top:1px solid #D9DDCF;cursor:default}
.cab-rangee-num{font-size:13px;padding-top:6px}
.cab-rangee-titre{font-size:clamp(19px,1.8vw,24px);letter-spacing:-.025em;transition:color .25s}
.cab-rangee-photo{opacity:0;transform:translateY(8px);transition:opacity .3s, transform .3s;border-radius:4px;overflow:hidden}
.cab-rangee-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cab-rangee-texte{font-size:12.5px;line-height:1.5;color:#3C4236}
.cab-rangee.cab-est-actif .cab-rangee-titre,.cab-rangee.cab-est-actif .cab-rangee-num{color:var(--cab-citron-fonce)}
.cab-rangee.cab-est-actif .cab-rangee-photo{opacity:1;transform:none}

/* ---------- Reviews ---------- */
.cab-avis{position:relative;padding:150px 0 190px;text-align:center;overflow:hidden}
.cab-avis::before{content:"";position:absolute;left:50%;top:150px;width:560px;height:240px;transform:translateX(-50%) rotate(-28deg);
  border:1px solid rgba(255,255,255,.1);border-radius:50%}
.cab-avis::after{content:"";position:absolute;left:50%;top:150px;width:240px;height:560px;transform:translateX(-50%) rotate(-28deg);
  border:1px solid rgba(255,255,255,.08);border-radius:50%}
.cab-avis .cab-wrap{position:relative;z-index:1}
.cab-avis .cab-titre-m{margin-bottom:64px}
.cab-avis-qui{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.cab-avis-citation{max-width:780px;margin:20px auto 30px;font-family:var(--cab-serif);font-style:italic;
  font-size:clamp(19px,1.9vw,25px);line-height:1.3;color:rgba(255,255,255,.9)}
.cab-avis-avatar{width:46px;height:46px;margin:0 auto 12px;border-radius:50%;background:var(--cab-brume);color:var(--cab-nuit);
  display:grid;place-items:center;font-size:13px;font-weight:600;letter-spacing:.04em}
.cab-avis-nom{font-size:12.5px;font-weight:500}
.cab-avis-role{font-size:11px;color:var(--cab-gris)}
/* Reviews carousel (home, 1.25.0, 1.26.0): the theme carousel's arrows around
   a Reviews block in the Carousel style (see the reviews rules below). Under
   960px the arrows leave the sides, where they would cover the quote, for a
   row of their own under it. */
.cab-carrousel-avis{max-width:940px;margin:0 auto}
/* Two classes: in the editor, the global styles' ":root :where(.is-layout-flow)
   > *" (same weight) is printed after this sheet and set the gap to 0. */
.wp-block-buttons.cab-avis-tous{margin-top:44px}
@media (max-width:960px){
  .cab-carrousel.cab-carrousel-avis{display:grid;grid-template-columns:1fr 42px 42px 1fr;column-gap:12px;padding-inline:0}
  .cab-carrousel-avis>:not(.cab-fleche){grid-area:1/1/2/-1}
  .cab-carrousel.cab-carrousel-avis>p.cab-fleche{position:static;display:block;margin:26px 0 0;grid-row:2}
  .cab-carrousel-avis .cab-fleche-g{grid-column:2}
  .cab-carrousel-avis .cab-fleche-d{grid-column:3}
}

/* ---------- Call to action band ---------- */
.cab-cta{position:relative;padding:150px 24px 128px;text-align:center;background:var(--cab-citron);color:var(--cab-nuit)}
.cab-cta .cab-surtitre{color:rgba(8,12,4,.7)}
.cab-titre-cta{font-size:clamp(32px,3.4vw,50px);line-height:1.04;margin-bottom:34px}
.cab-titre-cta em{font-size:1.08em}
@keyframes cab-tourne{to{transform:rotate(360deg)}}

/* ---------- Footer ---------- */
.cab-pied{position:relative;padding:70px 24px 0;overflow:hidden;
  background:
    radial-gradient(60% 260px at 40% 100%, rgba(170,200,60,.95), rgba(120,160,60,.5) 45%, transparent 80%),
    radial-gradient(40% 220px at 85% 100%, rgba(90,160,110,.75), transparent 80%),
    var(--cab-nuit)}
.cab-pied-grille{display:grid;grid-template-columns:170px 1fr 170px 200px;gap:40px;max-width:1120px;margin-inline:auto}
.cab-pied-grille .cab-marque{justify-self:start;align-self:start}
.cab-pied-accroche{font-size:clamp(22px,2vw,27px);line-height:1.15;letter-spacing:-.03em}
.cab-pied-accroche em{font-size:1.08em}
.cab-pied-lettre .wp-block-buttons{margin-top:22px}
.cab-pied-col{display:flex;flex-direction:column;gap:9px;font-size:12px;color:rgba(255,255,255,.78)}
.cab-pied-col a{text-decoration:none}
.cab-pied-col a:hover{color:var(--cab-citron)}
.cab-pied-col-titre{font-weight:600;color:var(--cab-blanc);margin-bottom:6px}
.cab-pied-bas{display:flex;flex-direction:column;align-items:center;gap:16px;padding:190px 0 26px;text-align:center}
.cab-pied-bas p{font-size:10.5px;letter-spacing:.06em;color:rgba(255,255,255,.72)}
.cab-pied-bas a{color:inherit}

:where(a,button,input,[tabindex]):focus-visible{outline:2px solid var(--cab-citron);outline-offset:3px}

/* ==========================================================================
   Inner pages: components taken from the "About Us" reference
   ========================================================================== */
.cab-wrap-l{max-width:1180px;margin-inline:auto;padding-inline:24px}

/* ---------- More buttons ---------- */
.cab-b-noir>.wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 28px;border-radius:999px;
  border:0;background:#0A0A0A;color:var(--cab-blanc);font:500 13px/1 var(--cab-sans);text-decoration:none;box-shadow:none;transition:background .2s,color .2s}
.cab-b-noir>.wp-block-button__link:hover{background:var(--cab-citron);color:var(--cab-nuit)}
.cab-b-fleche>.wp-block-button__link::after{content:"→"}
.cab-b-citron>.wp-block-button__link{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 20px;border-radius:8px;
  border:0;background:var(--cab-citron);color:var(--cab-nuit);font:600 13px/1 var(--cab-sans);text-decoration:none;box-shadow:none}
.cab-b-citron>.wp-block-button__link::after{content:"→"}
.cab-b-citron>.wp-block-button__link:hover{background:var(--cab-blanc)}

/* ---------- Mosaic hero ---------- */
.cab-hero-page{position:relative;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:56px;
  height:880px;padding:0 max(24px, calc(50% - 600px));overflow:hidden;isolation:isolate;
  background:
    radial-gradient(520px 560px at 74% 50%, rgba(150,205,40,.62), rgba(70,110,20,.32) 48%, transparent 74%),
    var(--cab-nuit)}
.cab-hero-page::after{content:"";position:absolute;inset:0 0 auto 0;z-index:1;height:150px;pointer-events:none;
  background:linear-gradient(var(--cab-nuit) 18%, rgba(8,12,4,0))}
.cab-hero-page::before{content:"";position:absolute;inset:auto 0 0 0;z-index:1;height:90px;pointer-events:none;
  background:linear-gradient(rgba(8,12,4,0), rgba(8,12,4,.85))}
.cab-hero-page-texte{position:relative;z-index:2;max-width:470px;padding-top:70px}
.cab-pastille-trait{display:inline-block;padding:6px 14px;border:1px solid rgba(194,244,60,.6);border-radius:999px;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--cab-citron)}
.cab-pastille-trait a{color:inherit;text-decoration:none}
.cab-titre-page{margin-top:26px;font-size:clamp(44px,5.1vw,74px);line-height:.98;letter-spacing:-.03em}
.cab-titre-page em{font-size:1.06em}
.cab-hero-page-chapeau{max-width:410px;margin:26px 0 36px;font-size:14px;line-height:1.6;color:rgba(255,255,255,.7)}
.cab-mosaique{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-self:start}
.cab-mosaique-col{display:flex;flex-direction:column;gap:16px}
.cab-mosaique-col:nth-child(1){margin-top:-60px}
.cab-mosaique-col:nth-child(2){margin-top:70px}
.cab-mosaique-col:nth-child(3){margin-top:-10px}
.cab-tuile{position:relative;flex:none;aspect-ratio:1;margin:0;padding:18px;border-radius:22px;overflow:hidden}
.cab-tuile-photo{padding:0;background:#1E1E1E}
.cab-tuile-photo img{width:100%;height:100%;object-fit:cover}
.cab-tuile-photo figcaption{position:absolute;top:12px;right:12px;display:flex;align-items:center;gap:6px;padding:5px 10px 5px 7px;
  border-radius:999px;background:var(--cab-citron);color:var(--cab-nuit);font-size:10px;font-weight:600;letter-spacing:.01em}
.cab-tuile-photo figcaption::before{content:"";width:12px;height:12px;background:var(--cab-nuit);
  -webkit-mask:var(--cab-ico-coche) center/contain no-repeat;mask:var(--cab-ico-coche) center/contain no-repeat}
.cab-tuile-claire{background:linear-gradient(155deg,#FFFFFF 0%,#E4E7DE 100%);color:var(--cab-nuit)}
.cab-tuile-sombre{background:#1A1F14;color:var(--cab-blanc)}
.cab-tuile-label{font-size:12px;font-weight:500}
.cab-tuile-valeur{display:flex;align-items:center;gap:10px;margin-top:4px;font-size:clamp(22px,2vw,30px);letter-spacing:-.03em;white-space:nowrap}
.cab-tuile-claire .cab-tuile-valeur::after{content:"";flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(8,12,4,.4)}
.cab-tuile-sombre .cab-tuile-valeur::after{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:var(--cab-citron)}
.cab-tuile-note{position:absolute;left:18px;right:18px;bottom:16px;font-size:11px;line-height:1.35;opacity:.62}
.cab-tuile-courbe::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23C2F43C' stop-opacity='.45'/%3E%3Cstop offset='1' stop-color='%23C2F43C' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 42 L8 38 L14 40 L22 31 L30 34 L38 25 L46 28 L54 19 L62 22 L70 14 L78 17 L86 8 L93 11 L100 3 L100 50 L0 50Z' fill='url(%23g)'/%3E%3Cpath d='M0 42 L8 38 L14 40 L22 31 L30 34 L38 25 L46 28 L54 19 L62 22 L70 14 L78 17 L86 8 L93 11 L100 3' fill='none' stroke='%23C2F43C' stroke-width='.9'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.cab-tuile-citron{background:var(--cab-citron)}
.cab-tuile-citron::after{content:"";position:absolute;inset:30%;background:var(--cab-nuit);
  -webkit-mask:var(--cab-ico) center/contain no-repeat;mask:var(--cab-ico) center/contain no-repeat}
.cab-tuile-badge{display:grid;place-items:center;padding:0;background:#050803}
:root{--cab-ico-coche:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E")}

/* ---------- Towns band ---------- */
.cab-bande-communes{background:#1E1E1E;padding:24px 0}
.cab-bande-communes ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 34px;
  max-width:1240px;margin:0 auto;padding:0 24px}
.cab-bande-communes li{font-size:14px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* ---------- White block: priced cards ---------- */
/* It closes with the same space as it opens (1.16.2), pale strip included. */
.cab-bloc-blanc{position:relative;z-index:1;padding:110px 0;background:var(--cab-blanc);color:var(--cab-nuit)}
/* Small print under a grid of prices (1.14.0): parts, travel, VAT. */
.cab-tarifs-mention{margin:22px 0 0;font-size:13.5px;line-height:1.55;color:rgba(8,12,4,.68)}
.cab-services .cab-tarifs-mention{margin-top:30px;color:rgba(255,255,255,.6)}
.cab-cartes-cas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cab-carte-cas{display:flex;flex-direction:column;padding:0 26px 30px;border-radius:14px;overflow:hidden;background:#1E1E1E;color:var(--cab-blanc)}
.cab-carte-cas-tete{margin:0 -26px 26px;padding:26px;background:#141414;text-align:center;font-size:34px;letter-spacing:-.035em}
.cab-carte-cas-tete em{font-size:1.1em}
.cab-carte-cas h3{font-size:21px;letter-spacing:-.02em;margin-bottom:10px}
.cab-carte-cas-texte{font-size:12.5px;line-height:1.55;color:rgba(255,255,255,.66)}
.cab-coches{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:20px 14px;margin:28px 0 0;padding:0}
.cab-coches li{position:relative;padding-left:30px;font-size:10.5px;line-height:1.35;color:rgba(255,255,255,.55)}
.cab-coches li::before{content:"";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--cab-citron)}
.cab-coches li::after{content:"";position:absolute;left:5px;top:5px;width:10px;height:10px;background:var(--cab-nuit);
  -webkit-mask:var(--cab-ico-coche) center/contain no-repeat;mask:var(--cab-ico-coche) center/contain no-repeat}
.cab-coches strong{display:block;margin-bottom:2px;font-size:14px;font-weight:500;letter-spacing:-.01em;color:var(--cab-blanc)}
.cab-carte-cas-photo{position:relative;min-height:420px;margin:0;border-radius:14px;overflow:hidden}
.cab-carte-cas-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cab-carte-cas-photo .wp-block-buttons{position:absolute;left:24px;right:24px;bottom:24px}
/* The pale strip stays inside its section (1.16.2): it no longer straddles
   the next one, as the mock-up had it. */
.cab-bandeau-pale{position:relative;z-index:2;margin:22px 0 0;padding:16px 24px;border-radius:10px;background:#ECFCBC;
  text-align:center;font-size:12.5px;color:#30362A}
.cab-bandeau-pale a{margin-left:12px;font-weight:600;color:var(--cab-nuit);text-decoration:underline;text-underline-offset:3px}

/* ---------- Grey block: large photo and statement ---------- */
.cab-bloc-gris{padding:120px 0;background:#F6F6F6;color:var(--cab-nuit);text-align:center}
/* Questions and answers (1.16.0): core Details blocks in a .cab-faq group,
   a rule between them and a plus that turns into a cross when open. */
.cab-faq{max-width:820px;margin-inline:auto;text-align:left;border-bottom:1px solid rgba(8,12,4,.14)}
.cab-faq .wp-block-details{margin:0;border-top:1px solid rgba(8,12,4,.14)}
.cab-faq summary{position:relative;display:block;padding:22px 48px 22px 0;list-style:none;cursor:pointer;
  font-size:19px;line-height:1.3;letter-spacing:-.02em;font-weight:500}
.cab-faq summary::-webkit-details-marker{display:none}
.cab-faq summary::after{content:"";position:absolute;right:6px;top:50%;width:14px;height:14px;margin-top:-7px;
  background:linear-gradient(currentColor,currentColor) center/14px 1.6px no-repeat,
             linear-gradient(currentColor,currentColor) center/1.6px 14px no-repeat;transition:transform .2s}
.cab-faq details[open] > summary::after{transform:rotate(45deg)}
.cab-faq summary:focus-visible{outline:2px solid var(--cab-citron-fonce);outline-offset:4px}
.cab-faq .wp-block-details > :not(summary){margin:0 0 22px;font-size:14.5px;line-height:1.65;color:rgba(8,12,4,.72)}
.cab-faq .wp-block-details a{color:var(--cab-nuit);text-decoration:underline;text-decoration-color:var(--cab-citron-fonce);text-underline-offset:3px}
.cab-bloc-gris .cab-faq + .wp-block-buttons{margin-top:44px;justify-content:center}
.cab-photo-large{margin:0}
.cab-photo-large img{width:100%;aspect-ratio:21/10;object-fit:cover;border-radius:16px}
.cab-enonce{max-width:860px;margin:60px auto 34px;font-size:clamp(22px,2.3vw,31px);line-height:1.22;letter-spacing:-.025em;font-weight:500;color:#141414;text-wrap:balance}
.cab-enonce em{font-size:1.1em;color:#8C8F88}

/* ---------- Services grid ---------- */
.cab-services{padding:120px 0 130px;background:var(--cab-nuit)}
.cab-services .cab-titre-m{margin-bottom:64px}
.cab-grille-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.cab-service{min-height:228px;padding:24px 22px 26px;border:1px solid rgba(255,255,255,.13);border-radius:12px;transition:background .25s,border-color .25s}
.cab-service::before{content:"";display:block;width:30px;height:30px;margin-bottom:24px;background:var(--cab-blanc);
  -webkit-mask:var(--cab-ico) center/contain no-repeat;mask:var(--cab-ico) center/contain no-repeat}
.cab-service h3{margin-bottom:12px;font-size:18px;line-height:1.15;letter-spacing:-.02em}
.cab-service p{font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.6)}
.cab-service.cab-est-vedette{background:#2C2F28;border-color:#2C2F28}
.cab-service.cab-est-vedette::before{background:var(--cab-citron)}
.cab-service.cab-est-vedette h3{font-family:var(--cab-serif);font-style:italic;font-size:24px;line-height:1.02;letter-spacing:-.01em;color:var(--cab-citron)}
/* A price in a service card (1.15.0, the price page): the card becomes a
   column and the price sits at its foot, whatever the length of the text. */
.cab-service:has(.cab-service-prix){display:flex;flex-direction:column}
.cab-service p.cab-service-prix{margin-top:auto;padding-top:20px;font-size:26px;line-height:1;letter-spacing:-.03em;color:var(--cab-blanc)}
.cab-service.cab-est-vedette p.cab-service-prix{color:var(--cab-citron)}
/* A service card that leads to its page (1.16.0): the link of its title
   covers the whole card, and an arrow says it goes somewhere. */
.cab-service:has(h3 a){position:relative}
.cab-service:has(h3 a)::after{content:"→";position:absolute;top:22px;right:22px;font-size:18px;line-height:1;opacity:.45;transition:opacity .25s,transform .25s}
.cab-service h3 a{color:inherit;text-decoration:none}
.cab-service h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.cab-service:has(h3 a):hover{border-color:rgba(194,244,60,.55)}
.cab-service:has(h3 a):hover::after{opacity:1;transform:translateX(3px)}
.cab-service h3 a:focus-visible{outline:none}
.cab-service:has(h3 a:focus-visible){outline:2px solid var(--cab-citron);outline-offset:3px}

/* ---------- Zigzag cases ---------- */
.cab-cas{padding:130px 0 140px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-cas-rangee{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,7vw,100px);align-items:center}
.cab-cas-rangee + .cab-cas-rangee{margin-top:120px}
.cab-cas-rangee.cab-inverse .cab-cas-visuel{order:2}
.cab-cas-visuel{position:relative;aspect-ratio:1;border-radius:18px;overflow:hidden;
  background:radial-gradient(90% 90% at 80% 15%, #F1FDD0 0%, #DBF98C 38%, #C2F43C 78%);
  box-shadow:0 30px 70px rgba(120,170,20,.18)}
.cab-cas-texte{max-width:450px}
.cab-pastille-tag{display:inline-block;padding:5px 12px;border:1px solid #C3C7BC;border-radius:999px;
  font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#4A5044}
.cab-titre-cas{margin:16px 0 26px;font-size:clamp(30px,3vw,42px);line-height:1.04;letter-spacing:-.03em;color:#8A8D86}
.cab-titre-cas em{font-size:1.08em;color:var(--cab-nuit)}
.cab-etapes{list-style:none;counter-reset:cab-etape;display:grid;gap:14px;margin:0 0 34px;padding:0}
.cab-etapes li{counter-increment:cab-etape;position:relative;padding-left:30px;font-size:13px;line-height:1.55;color:#30352B}
.cab-etapes li::before{content:counter(cab-etape);position:absolute;left:0;top:1px;font-size:11px;color:#9A9E94}
/* Floating composition inside the lemon square. */
.cab-flottant{position:absolute;margin:0;box-shadow:0 18px 40px rgba(40,70,0,.2)}
.cab-fl-photo{left:12%;top:16%;width:38%;padding:0;border-radius:12px;overflow:hidden;background:var(--cab-blanc)}
.cab-fl-photo img{width:100%;aspect-ratio:1;object-fit:cover}
.cab-fl-photo figcaption{padding:9px 12px 11px;font-size:11.5px;font-weight:600;line-height:1.2}
.cab-fl-sombre{right:13%;top:30%;width:40%;aspect-ratio:1/1.05;padding:18px;border-radius:14px;overflow:hidden;background:#151A10;color:var(--cab-blanc)}
.cab-fl-label{font-size:10.5px;opacity:.7}
.cab-fl-valeur{margin-top:4px;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.03em}
.cab-fl-pilule{right:10%;bottom:20%;padding:10px 16px;border-radius:999px;background:var(--cab-blanc);font-size:11px;font-weight:500}
.cab-fl-haut{left:16%;right:auto;top:12%;bottom:auto;display:flex;align-items:center;gap:10px;padding:10px 18px 10px 10px}
.cab-fl-barres{left:24%;right:8%;top:32%;display:flex;align-items:flex-end;gap:12px;height:34%;padding:16px 16px 14px;border-radius:14px;background:var(--cab-blanc)}
.cab-fl-barres .cab-fl-label{position:absolute;top:14px;left:16px;padding:3px 8px;border-radius:6px;background:#EEF3E4;opacity:1;font-size:9.5px}
.cab-fl-bas{left:10%;top:auto;bottom:9%;width:28%}
.cab-fl-coin{right:auto;left:44%;top:auto;bottom:12%;width:28%;aspect-ratio:1;padding:14px}
.cab-fl-coin .cab-fl-valeur{font-size:22px;margin-top:8px}

/* ---------- Testimonial with stacked photos ---------- */
.cab-temoignage{position:relative;padding:130px 0;overflow:hidden;
  background:radial-gradient(620px 520px at 100% 45%, rgba(120,175,40,.6), rgba(60,84,18,.3) 50%, transparent 75%), var(--cab-nuit)}
.cab-temoignage-grille{display:grid;grid-template-columns:40px minmax(0,400px) minmax(0,1fr);gap:clamp(40px,6vw,90px);align-items:center;
  max-width:1180px;margin-inline:auto;padding-inline:24px}
.cab-compteur{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:10px;color:rgba(255,255,255,.6)}
.cab-compteur::after{content:"";order:1;width:1px;height:64px;background:rgba(255,255,255,.7)}
.cab-pile{position:relative;aspect-ratio:4/5}
.cab-pile figure{position:absolute;inset:0;margin:0;border-radius:16px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.55)}
.cab-pile img{width:100%;height:100%;object-fit:cover}
.cab-pile figure:nth-child(1){transform:rotate(-9deg) translate(-7%,3%);filter:grayscale(1) brightness(.65)}
.cab-pile figure:nth-child(2){transform:rotate(7deg) translate(6%,1%);filter:grayscale(1) brightness(.55)}
.cab-pile figure:nth-child(3){transform:rotate(-1.5deg)}
.cab-temoignage-citation{margin:0 0 40px;font-family:var(--cab-serif);font-style:italic;font-size:clamp(20px,2.1vw,29px);line-height:1.25;color:var(--cab-blanc)}
.cab-temoignage .cab-surtitre-gauche{margin-bottom:18px;text-align:left}
.cab-temoignage-nom{font-size:14px;font-weight:600}
.cab-temoignage-role{margin-top:4px;font-size:12px;color:var(--cab-gris)}

/* ---------- Compact page heads ---------- */
.cab-tete-page{position:relative;isolation:isolate;overflow:hidden;padding:210px 24px 190px;text-align:center;background:var(--cab-nuit)}
.cab-tete-page .cab-surtitre{margin-bottom:26px}
.cab-tete-page-courte{padding-bottom:150px}
.cab-tete-page-chapeau{max-width:560px;margin:26px auto 0;font-size:15px;line-height:1.6;color:rgba(255,255,255,.7)}
.cab-tete-page::before{content:"";position:absolute;z-index:-2;left:50%;bottom:-150px;width:1500px;height:460px;transform:translateX(-50%);
  background:
    radial-gradient(26% 34% at 50% 58%, rgba(226,252,140,.6) 0%, rgba(194,244,60,.36) 40%, transparent 100%),
    radial-gradient(50% 50% at 50% 62%, rgba(150,200,60,.32) 0%, rgba(80,140,90,.16) 50%, transparent 80%)}
.cab-tete-page::after{content:"";position:absolute;z-index:-1;left:50%;top:calc(100% - 70px);width:3800px;height:1600px;transform:translateX(-50%);
  border-radius:50%;background:var(--cab-nuit);box-shadow:0 -1px 0 rgba(226,252,150,.6), 0 -10px 40px rgba(194,244,60,.22)}

/* ---------- Post grid ---------- */
.cab-liste-articles{padding:110px 0 130px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-grille-articles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cab-tag-pale{display:inline-block;margin-top:18px;padding:5px 10px;border-radius:6px;background:#ECFCBC;color:var(--cab-nuit);font-size:10px;font-weight:500}
.cab-carte-article-titre{display:block;margin-top:12px;font-size:17px;line-height:1.28;letter-spacing:-.015em}
.cab-carte-article-extrait{display:block;margin-top:8px;font-size:12.5px;line-height:1.55;color:#5A5F55}

/* ---------- Single post ---------- */
.cab-tete-article{position:relative;overflow:hidden;padding:200px 24px 270px;text-align:center;
  background:radial-gradient(700px 300px at 50% 100%, rgba(150,200,40,.35), transparent 70%), var(--cab-nuit)}
.cab-tete-article .cab-tag-pale{margin:0 0 24px}
.cab-tete-article h1{max-width:900px;margin-inline:auto;font-size:clamp(34px,4.3vw,62px);line-height:1.02;letter-spacing:-.03em}
.cab-article-meta{margin-top:24px;font-size:12px;color:rgba(255,255,255,.6)}
.cab-article-corps{padding:0 24px 110px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-article-image{position:relative;z-index:2;max-width:1100px;margin:-200px auto 0}
.cab-article-image img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.25)}
.cab-texte-long{max-width:700px;margin:80px auto 0;font-size:17px;line-height:1.7;color:#22261E}
.cab-texte-long > * + *{margin-top:18px}
.cab-texte-long h2{margin-top:54px;font-size:clamp(24px,2.3vw,31px);line-height:1.1;letter-spacing:-.025em;color:var(--cab-nuit)}
.cab-texte-long h3{margin-top:34px;font-size:19px;letter-spacing:-.015em;color:var(--cab-nuit)}
.cab-texte-long ul,.cab-texte-long ol{padding-left:22px}
.cab-texte-long li + li{margin-top:8px}
.cab-texte-long a{color:var(--cab-nuit);text-decoration-color:var(--cab-citron-fonce);text-decoration-thickness:2px;text-underline-offset:3px}
.cab-encadre{margin-block:40px !important;padding:24px 28px;border-radius:12px;background:#ECFCBC;font-size:15.5px;line-height:1.6}
.cab-encadre strong{display:block;margin-bottom:6px}
.cab-lire-aussi{padding:100px 0 120px;background:#F6F6F6;color:var(--cab-nuit)}
.cab-lire-aussi .cab-titre-m{margin-bottom:50px}
.cab-lire-aussi .cab-grille-articles{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin-inline:auto}

/* ---------- Contact ---------- */
.cab-contact{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:80px;align-items:start;
  padding:180px max(24px, calc(50% - 590px)) 150px;
  background:radial-gradient(700px 520px at 78% 75%, rgba(150,205,40,.38), transparent 70%), var(--cab-nuit)}
.cab-contact .cab-titre-page{margin-top:26px}
.cab-contact-chapeau{max-width:440px;margin-top:26px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.72)}
.cab-coordonnees{display:grid;gap:0;max-width:520px;margin:46px 0 0}
.cab-coordonnees div{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:16px 0;border-top:1px solid rgba(255,255,255,.12)}
.cab-coordonnees a{text-decoration:none}
.cab-coordonnees a:hover{color:var(--cab-citron)}
.cab-demande-grande{position:relative;top:auto;right:auto;width:auto;padding:30px 26px 26px}
.cab-demande-grande .cab-demande-titre{font-size:44px}
.cab-demande-form textarea{width:100%;height:120px;padding:10px;border:0;border-radius:4px;background:#B2E434;
  font:400 13px/1.5 var(--cab-sans);color:var(--cab-nuit);resize:vertical}
.cab-demande-form textarea:focus{outline:1.5px solid var(--cab-nuit);outline-offset:0}

/* ---------- Legal notice ---------- */
.cab-texte-legal{padding:100px 24px 120px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-texte-legal .cab-texte-long{margin-top:0;font-size:15.5px}
/* A legal text right after a white block (1.19.0): the block already closes
   with 110px, the text does not add its own 100px on top. Without that
   padding, its first heading's margin would escape it and show the page's
   night between the two (1.19.1): flow-root keeps it inside. */
.cab-bloc-blanc + .cab-texte-legal{display:flow-root;padding-top:0}
/* "Updated on <date>" under the title of a legal page (1.19.0): a sentence
   made of a paragraph and a core Date block, kept on one line with a word
   space between them. */
.cab-tete-page .cab-mise-a-jour{gap:0 .3em}
.cab-tete-page .cab-mise-a-jour > *{margin:0}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1180px){
  .cab-menu{gap:26px}
  .cab-fleche-g{left:0}.cab-fleche-d{right:0}
  .cab-anneau-bulle{left:auto;right:2%;top:-60px}
}

@media (max-width:960px){
  .cab-entete{padding:20px 20px}
  .cab-entete-cta{display:none}

  .cab-hero{min-height:0;padding:150px 20px 0}
  .cab-hero{padding-bottom:110px}

  .cab-incline{width:200px}
  .cab-incline-g{left:-60px;top:40px}
  .cab-incline-d{right:-60px;top:40px}
  .cab-proximite{padding-top:290px}
  .cab-communes{justify-content:center;margin-top:90px}

  .cab-piste{grid-auto-columns:calc((100% - 14px)/2)}
  .cab-anneau-bulle{display:none}

  .cab-rangee{grid-template-columns:40px 1fr;gap:6px 14px;min-height:0;padding-bottom:26px}
  .cab-rangee-photo{display:none}
  .cab-rangee-texte{grid-column:2}

  .cab-pied-grille{grid-template-columns:1fr 1fr}
  .cab-pied-lettre{grid-column:1 / -1;grid-row:2}
}

@media (max-width:560px){
  .cab-titre-m{font-size:30px}
  .cab-piliers .cab-titre-m br,.cab-metiers-sous br{display:none}
  .cab-anneau{margin-top:40px}
  .cab-titre-hero em::before{left:-22%;right:-22%}
  .cab-titre-hero em::after{right:-30%}
  .cab-manifeste{padding-bottom:100px}
  .cab-piliers{padding:100px 0 90px}
  .cab-pilier{font-size:10.5px}
  .cab-anneau-centre{font-size:12.5px}
  .cab-proximite{padding-top:250px}
  .cab-incline{width:170px}
  .cab-communes li{font-size:12px}
  .cab-metiers{padding:110px 0 120px}
  .cab-carrousel{padding-inline:20px}
  .cab-piste{grid-auto-columns:82%}
  .cab-fleche{display:none}
  .cab-conseils-grille{grid-template-columns:1fr;gap:40px}
  .cab-cadre-carte{padding-top:64px;padding-bottom:70px}
  .cab-cadre .cab-titre-m{margin-bottom:50px}
  .cab-pied-grille{grid-template-columns:1fr;gap:34px}
  .cab-pied-lettre{grid-row:auto}
  .cab-pied-bas{padding-top:120px}
}

/* ---------- Inner pages: responsive ---------- */
@media (max-width:960px){
  .cab-hero-page{grid-template-columns:1fr;height:auto;gap:64px;padding:150px 20px 0}
  .cab-hero-page-texte{padding-top:0}
  .cab-mosaique{height:560px;overflow:hidden;margin-inline:-20px;padding-inline:20px}
  .cab-cartes-cas{grid-template-columns:1fr 1fr}
  .cab-carte-cas-photo{grid-column:1 / -1;min-height:360px}
  .cab-grille-services{grid-template-columns:1fr 1fr}
  .cab-cas-rangee{grid-template-columns:1fr}
  .cab-cas-rangee.cab-inverse .cab-cas-visuel{order:0}
  .cab-cas-texte{max-width:none}
  .cab-temoignage-grille{grid-template-columns:1fr;gap:70px}
  .cab-compteur{display:none}
  .cab-pile{width:78%;max-width:380px;margin-inline:auto}
  .cab-grille-articles{grid-template-columns:1fr 1fr}
  .cab-contact{grid-template-columns:1fr;gap:60px;padding-top:150px}
  /* A grid item with auto margins shrinks to its content: the card took its
     width from the message field. It takes the column, up to 420px. */
  .cab-contact .cab-demande-grande{width:100%}
}
@media (max-width:560px){
  .cab-mosaique{height:430px;gap:10px}
  .cab-mosaique-col{gap:10px}
  .cab-tuile{padding:12px;border-radius:16px}
  .cab-tuile-label{font-size:10px}
  .cab-tuile-valeur{font-size:17px;gap:6px}
  .cab-tuile-valeur::after{display:none}
  .cab-tuile-note{left:12px;right:12px;bottom:10px;font-size:9px}
  .cab-tuile-photo figcaption{top:8px;right:8px;font-size:8.5px;padding:4px 8px 4px 6px}
  .cab-bloc-blanc{padding-block:80px}
  .cab-cartes-cas{grid-template-columns:1fr}
  .cab-grille-services{grid-template-columns:1fr}
  .cab-service{min-height:0}
  .cab-grille-articles,.cab-lire-aussi .cab-grille-articles{grid-template-columns:1fr;gap:40px}
  .cab-bande-communes ul{justify-content:center;gap:10px 22px}
  .cab-bande-communes li{font-size:12px}
  .cab-coordonnees div{grid-template-columns:1fr;gap:4px}
  .cab-bloc-gris,.cab-services,.cab-cas,.cab-liste-articles{padding-block:90px}
  .cab-tete-page{padding:160px 20px 150px}
  .cab-tete-article{padding:160px 20px 200px}
  .cab-article-image{margin-top:-150px}
  .cab-texte-long{margin-top:56px;font-size:16px}
  .cab-demande-grande .cab-demande-titre{font-size:38px}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ==========================================================================
   Block editor adaptations

   Le DOM des blocs diffère de la maquette (figure.wp-block-image,
   div.wp-block-button, ul.wp-block-list, nav.wp-block-navigation...).
   Le CSS des blocs étant imprimé après cette feuille, chaque surcharge
   est plus spécifique que lui, jamais simplement plus tardive.
   Les remises à zéro génériques restent à spécificité nulle (:where) :
   à (0,1,0) en fin de feuille, elles mettaient à zéro les marges que les
   composants déclarent, et la page perdait son rythme vertical.
   ========================================================================== */

/* ---------- Resets, at zero specificity ---------- */
:where(.wp-block-group)>:where(*),:where(.wp-block-buttons){margin-block:0}
:where(figure.wp-block-image),:where(figure.wp-block-post-featured-image){margin:0}
:where(.wp-block-quote){margin:0;padding:0;border:0}
:where(.wp-block-quote) p{margin:0}
:where(.wp-block-list){margin:0}
:where(.wp-block-post-template){list-style:none;margin:0;padding:0}

/* ---------- Header ---------- */
.admin-bar .cab-entete{top:32px}
@media (max-width:782px){.admin-bar .cab-entete{top:46px}}
/* The header that stays (1.13.0). The script makes it fixed; fixed and
   absolute both leave the flow, so at the top of the page nothing moves.
   No backdrop-filter or transform here: either would make the header the
   box of the mobile menu panel, which is fixed too, and shut it in the bar. */
.cab-entete.cab-entete--collant{position:fixed;z-index:100;
  transition:background-color .25s ease,padding .25s ease,box-shadow .25s ease}
/* As soon as the page moves: the night background and a lower row. */
.cab-entete.is-scrolled{padding-block:12px;background:rgba(8,12,4,.96);
  box-shadow:0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.35)}
/* Anchors land under it, and Cabrio Connexion's "My space" menu sticks under
   it rather than behind it. --cab-entete-h is the scrolled height, measured
   by the script. The scroll padding counts the header and the admin bar, so
   Cabrio Connexion's own margin, which counts the admin bar too, goes: with
   both, its sections landed 72 px under the header. Under 600 px the admin
   bar has scrolled away by then. */
html:has(.cab-entete--collant){scroll-padding-top:calc(var(--cab-entete-h,0px) + var(--wp-admin--admin-bar--height,0px) + 20px)}
html:has(.cab-entete--collant) :is(.cab-connexion__section-titre,.cab-connexion-historique,.cab-connexion-onglets){scroll-margin-top:0}
@media (max-width:600px){html:has(.cab-entete--collant){scroll-padding-top:calc(var(--cab-entete-h,0px) + 20px)}}
html:has(.cab-entete--collant) .cab-connexion-espace .cab-connexion-menu{
  top:calc(var(--cab-entete-h,0px) + var(--wp-admin--admin-bar--height,0px) + 1.5rem)}
@media print{.cab-entete.cab-entete--collant{position:absolute}}
.cab-marque a{color:inherit;text-decoration:none}
.cab-entete-rangee>.cab-marque{flex:none}
/* The logo chosen in Site Editor > Identity (1.10.0). Its width is the
   block's (200 px in the header, 170 in the footer); the row never squeezes
   it. Without a logo, the site name stands in, in .cab-marque. */
.cab-entete-rangee>.cab-logo{flex:none}
.cab-pied-grille .cab-logo{justify-self:start;align-self:start}
.wp-block-navigation.cab-menu{margin-inline:auto}
.wp-block-navigation.cab-menu .wp-block-navigation__container{gap:42px}
.wp-block-navigation.cab-menu .wp-block-navigation-item__content{font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;color:rgba(255,255,255,.82)}
.wp-block-navigation.cab-menu .current-menu-item>.wp-block-navigation-item__content,
.wp-block-navigation.cab-menu .wp-block-navigation-item__content:hover{color:var(--cab-citron)}
/* White button: the class sits on the core/buttons wrapper, the style on the link. */
.wp-block-buttons.cab-entete-cta{padding:0;border-radius:0;background:none}
.cab-entete-cta .wp-block-button__link{padding:10px 18px;border:0;border-radius:999px;background:var(--cab-blanc);color:var(--cab-nuit);
  font:600 12px/1 var(--cab-sans);letter-spacing:.01em;text-decoration:none;box-shadow:none}
.cab-entete-cta .wp-block-button__link:hover{background:var(--cab-citron)}
/* The handset of the round phone button (1.10.0), drawn as a mask so that it
   takes the button's text colour. */
/* Cabrio Connexion's account link: the member's picture is as large as the
   phone and menu buttons (1.12.0, asked by Cyrille), and the link offers the
   same 44 px target, the pictogram centred in it when there is no picture. */
.cab-entete .cab-connexion-lien{width:44px;height:44px}
.cab-entete .cab-connexion-lien__photo{width:44px;height:44px}
.cab-entete-cta{--cab-icone-tel:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E")}
/* On the home page the phone button is always the round handset (1.11.0,
   asked by Cyrille on 7 October 2026): the number is in the request card
   beside, and the header has no room for it next to the card. It used to be
   hidden there, and left an empty place on a phone. */
.home .cab-entete-cta .wp-block-button__link{display:grid;place-items:center;width:44px;height:44px;padding:0;
  font-size:0;letter-spacing:0}
.home .cab-entete-cta .wp-block-button__link::before{content:"";width:18px;height:18px;background:currentColor;
  -webkit-mask:var(--cab-icone-tel) center/contain no-repeat;mask:var(--cab-icone-tel) center/contain no-repeat}
/* Burger and mobile panel of core/navigation: white on white without this. */
.wp-block-navigation.cab-menu .wp-block-navigation__responsive-container-open{width:44px;height:44px;justify-content:center;align-items:center;
  border:1.5px solid rgba(255,255,255,.6);border-radius:50%;color:var(--cab-blanc)}
.wp-block-navigation.cab-menu .wp-block-navigation__responsive-container.is-menu-open{
  background-color:var(--cab-nuit)!important;color:var(--cab-blanc)!important;padding:96px 24px 40px}
.wp-block-navigation.cab-menu .is-menu-open .wp-block-navigation__container{gap:26px}
.wp-block-navigation.cab-menu .is-menu-open .wp-block-navigation-item__content{font-size:15px}
.wp-block-navigation.cab-menu .wp-block-navigation__responsive-container-close{color:var(--cab-blanc)}

/* ---------- Sub-menus of the main menu (1.17.0) ---------- */
/* Core's sheet comes after the theme's, and its open state weighs (0,5,0):
   these rules start from .cab-entete and end on the ul to weigh more. Core
   keeps the opening and closing (opacity, visibility, size); the theme only
   dresses the panel, white on white without it. */
/* The chevron takes the link's colour, in a 20 px target for a finger; the
   negative margins keep the 6 px it shows beside the link. */
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-icon{display:grid;place-items:center;width:20px;height:20px;
  margin:-6px -6px -6px 0;color:rgba(255,255,255,.82)}
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-icon svg{flex:0 0 auto;width:8px;height:8px;margin:0}
.cab-entete .wp-block-navigation.cab-menu .has-child:hover>.wp-block-navigation__submenu-icon,
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-icon[aria-expanded=true],
.cab-entete .wp-block-navigation.cab-menu .current-menu-ancestor>.wp-block-navigation__submenu-icon,
.cab-entete .wp-block-navigation.cab-menu .current-menu-ancestor>.wp-block-navigation-item__content{color:var(--cab-citron)}
/* The panel: the night of the scrolled header, its text aligned on the
   parent's (1 px border, 8 px padding, 14 px inside the link). */
.cab-entete .wp-block-navigation.cab-menu .has-child>ul.wp-block-navigation__submenu-container{top:calc(100% + 18px);left:-23px;
  min-width:250px;padding:8px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(8,12,4,.97);
  color:var(--cab-blanc);box-shadow:0 20px 44px rgba(0,0,0,.35)}
/* A bridge over the 18 px gap, so that the pointer keeps the panel open on
   its way down from the link. */
.cab-entete .wp-block-navigation.cab-menu .has-child>ul.wp-block-navigation__submenu-container::before{content:"";position:absolute;
  left:0;right:0;bottom:100%;height:20px}
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-container>li>a.wp-block-navigation-item__content{padding:10px 14px;
  border-radius:8px;font-size:14px;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.82)}
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-container>li>a.wp-block-navigation-item__content:hover,
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-container>li>a.wp-block-navigation-item__content:focus-visible{
  background:rgba(255,255,255,.07);color:var(--cab-citron)}
.cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-container .current-menu-item>a.wp-block-navigation-item__content{color:var(--cab-citron)}
/* In the mobile panel core shows the sub-pages under their parent, without
   chevron: no box there, smaller and paler links. */
.cab-entete .wp-block-navigation.cab-menu .is-menu-open .wp-block-navigation__submenu-icon{display:none}
.cab-entete .wp-block-navigation.cab-menu .is-menu-open .has-child>ul.wp-block-navigation__submenu-container{min-width:0;
  padding:14px 0 0;gap:12px;border:0;border-radius:0;background:none;box-shadow:none}
.cab-entete .wp-block-navigation.cab-menu .is-menu-open .has-child>ul.wp-block-navigation__submenu-container::before{content:none}
.cab-entete .wp-block-navigation.cab-menu .is-menu-open .wp-block-navigation__submenu-container>li>a.wp-block-navigation-item__content{
  padding:0;font-size:14px;color:rgba(255,255,255,.6)}

/* ---------- Centred buttons in centred sections ---------- */
.cab-hero-centre .wp-block-buttons,.cab-proximite-centre .wp-block-buttons,.cab-metiers-tete .wp-block-buttons,
.cab-conseils .wp-block-buttons,.cab-cta .wp-block-buttons,.cab-bloc-gris .wp-block-buttons,.cab-tete-page .wp-block-buttons{justify-content:center}
.cab-tete-page .wp-block-buttons{margin-top:34px}
.cab-carte-cas-photo .wp-block-buttons{position:absolute;z-index:2;left:24px;right:24px;bottom:24px}
.cab-carte-cas-photo .wp-block-button,.cab-carte-cas-photo .cab-b-citron>.wp-block-button__link{width:100%}

/* ---------- Images: heights and crops from the mock-up ---------- */
.wp-block-image.cab-pleine img{width:100%;height:clamp(320px,46vw,660px);object-fit:cover}
.wp-block-image.cab-incline img,.wp-block-image.cab-carte-photo img,.wp-block-image.cab-tuile-photo img,
.cab-pile .wp-block-image img{width:100%;height:100%;object-fit:cover}
.wp-block-image.cab-rangee-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.wp-block-image.cab-fl-photo img{width:100%;aspect-ratio:1;object-fit:cover}
.wp-block-image.cab-photo-large img{width:100%;aspect-ratio:21/10;object-fit:cover;border-radius:16px}
.cab-carte-cas-photo .wp-block-image{position:absolute;inset:0}
.cab-carte-cas-photo .wp-block-image img{width:100%;height:100%;object-fit:cover}
.cab-fl-photo figcaption strong{display:block;font-size:11.5px;font-weight:600}
.cab-fl-photo figcaption{font-weight:400;font-size:10px}

/* ---------- Rotating badges (text ring as an image, globe as a mask) ---------- */
.wp-block-image.cab-tuile-badge{display:grid;place-items:center;padding:0;background:#050803}
.wp-block-image.cab-tuile-badge img{width:78%;height:auto;animation:cab-tourne 26s linear infinite}
.wp-block-image.cab-tuile-badge::after{content:"";position:absolute;inset:35%;background:var(--cab-citron);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10.3'/%3E%3Cellipse cx='12' cy='12' rx='4.6' ry='10.3'/%3E%3Cpath d='M1.7 12h20.6M3.4 6.6h17.2M3.4 17.4h17.2M12 1.7v20.6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10.3'/%3E%3Cellipse cx='12' cy='12' rx='4.6' ry='10.3'/%3E%3Cpath d='M1.7 12h20.6M3.4 6.6h17.2M3.4 17.4h17.2M12 1.7v20.6'/%3E%3C/svg%3E") center/contain no-repeat}
.cab-cta::before{content:"";position:absolute;left:50%;top:0;box-sizing:border-box;width:168px;height:168px;margin:-84px 0 0 -84px;
  border:3px solid var(--cab-citron);border-radius:50%;background:var(--cab-nuit) url(../img/anneau.png) center/100% no-repeat;
  animation:cab-tourne 26s linear infinite}
.cab-cta::after{content:"";position:absolute;left:50%;top:0;width:80px;height:80px;margin:-40px 0 0 -40px;background:var(--cab-citron);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10.3'/%3E%3Cellipse cx='12' cy='12' rx='4.6' ry='10.3'/%3E%3Cpath d='M1.7 12h20.6M3.4 6.6h17.2M3.4 17.4h17.2M12 1.7v20.6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10.3'/%3E%3Cellipse cx='12' cy='12' rx='4.6' ry='10.3'/%3E%3Cpath d='M1.7 12h20.6M3.4 6.6h17.2M3.4 17.4h17.2M12 1.7v20.6'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- Ring of the five pillars: the drawing is decorative ---------- */
.cab-anneau::before{content:"";position:absolute;inset:0;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='rgba(194,244,60,.16)' stroke-width='.25'%3E%3Cpolygon points='50,14 84.2,38.9 71.2,79.1 28.8,79.1 15.8,38.9'/%3E%3Cpath d='M50 50 50 14M50 50 84.2 38.9M50 50 71.2 79.1M50 50 28.8 79.1M50 50 15.8 38.9'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* ---------- Carousel: arrows are paragraphs (the script adds role="button") ---------- */
p.cab-fleche{display:block;font-size:0;line-height:0;text-align:center}

/* ---------- Cards with figures ---------- */
.cab-carte-chiffres{position:relative}
.cab-carte-chiffres::before{content:"";flex:none;box-sizing:border-box;width:52px;height:52px;border:1.5px solid rgba(255,255,255,.85);border-radius:50%}
.cab-carte-chiffres::after{content:"";position:absolute;left:35px;top:37px;width:26px;height:26px;background:var(--cab-blanc);
  -webkit-mask:var(--cab-ico) center/contain no-repeat;mask:var(--cab-ico) center/contain no-repeat}
.cab-chiffre-valeur{font-size:19px;letter-spacing:-.02em}
.cab-chiffre-label{margin-top:2px;font-size:10.5px;line-height:1.3;color:rgba(255,255,255,.55)}
.cab-lien-fleche a{color:inherit;text-decoration:none}

/* ---------- Lemon tile: the paragraph's text serves as its label ---------- */
p.cab-tuile-citron{font-size:0;color:transparent}

/* ---------- First children: WordPress resets their top margin with
   ".is-layout-flow > :first-child" (specificity 0,2,0) ---------- */
.cab-carrousel>p.cab-fleche{margin-top:-21px}
.cab-carte-chiffres>h3.wp-block-heading{margin-top:22px}

/* ---------- Post queries ---------- */
/* The mock-up's grid targets the list of posts, not the query wrapper. */
.wp-block-query.cab-conseils-grille,.wp-block-query.cab-grille-articles{display:block;max-width:none;margin:0}
.cab-conseils-grille .wp-block-post-template{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1120px;margin:60px auto 56px}
.cab-conseils-grille .wp-block-post-featured-image a{display:block}
.cab-conseils-grille .wp-block-post-featured-image img{width:100%;aspect-ratio:43/33;object-fit:cover;border-radius:14px}
.wp-block-post-terms.cab-article-cat a,.wp-block-post-terms.cab-tag-pale a,.wp-block-post-title a{color:inherit;text-decoration:none}
.wp-block-post-title.cab-article-titre{max-width:300px;margin:8px auto 0;font-size:15px;line-height:1.3;letter-spacing:-.015em}
.cab-grille-articles .wp-block-post-template{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cab-grille-articles .wp-block-post-featured-image a{display:block}
.cab-grille-articles .wp-block-post-featured-image img{width:100%;aspect-ratio:43/30;object-fit:cover;border-radius:12px}
.wp-block-post-terms.cab-tag-pale{display:inline-block;margin-top:18px;padding:5px 10px;border-radius:6px;background:#ECFCBC;
  color:var(--cab-nuit);font-size:10px;font-weight:500}
.wp-block-post-title.cab-carte-article-titre{margin-top:12px;font-size:17px;line-height:1.28;letter-spacing:-.015em}
.wp-block-post-excerpt.cab-carte-article-extrait{margin-top:8px}
.cab-carte-article-extrait .wp-block-post-excerpt__excerpt{margin:0;font-size:12.5px;line-height:1.55;color:#5A5F55}
.cab-carte-article-extrait .wp-block-post-excerpt__more-text{display:none}
.cab-lire-aussi .cab-grille-articles .wp-block-post-template{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin-inline:auto}
.wp-block-query-pagination{margin-top:56px;gap:14px;font-size:13px}
.wp-block-query-pagination a{color:var(--cab-nuit)}

/* ---------- Single post ---------- */
.cab-tete-article .wp-block-post-terms.cab-tag-pale{margin:0 0 24px}
.cab-tete-article .wp-block-post-title{max-width:900px;margin-inline:auto;font-size:clamp(34px,4.3vw,62px);line-height:1.02;letter-spacing:-.03em}
.wp-block-post-featured-image.cab-article-image{position:relative;z-index:2;max-width:1100px;margin:-200px auto 0}
.cab-texte-long.cab-texte-long>*+*{margin-top:18px}
.cab-texte-long.cab-texte-long>h2{margin-top:54px}
.cab-texte-long.cab-texte-long>.cab-encadre{margin-block:40px}

/* ---------- Testimonial ---------- */
.cab-temoignage .cab-compteur{display:block;justify-self:center;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;
  font-size:10px;letter-spacing:.3em;color:rgba(255,255,255,.6)}
.cab-temoignage .cab-compteur::after{content:none}

/* ---------- Contact forms (Cabrio Contact, since 1.4.0) ---------- */
/* Each label wraps its field, as Contact Form 7's did: the label, input and
   textarea rules of the lemon form above apply unchanged. The submit button
   also carries .wp-element-button; this rule outweighs the global one. */
.cab-demande-form .cab-contact-form__submit{width:100%;height:auto;margin-top:8px;padding:12px 30px;border:1.5px solid var(--cab-nuit);border-radius:999px;
  background:transparent;color:var(--cab-nuit);font:500 13.5px/1 var(--cab-sans);cursor:pointer;box-shadow:none}
.cab-demande-form .cab-contact-form__submit:hover{background:var(--cab-nuit);color:var(--cab-citron)}
.cab-demande .cab-contact-form__error{font-size:11px;font-weight:600;color:var(--cab-nuit)}
.cab-demande .cab-contact-form__notice{padding:10px 12px;border:1.5px solid var(--cab-nuit);border-radius:4px;font-size:12px;color:var(--cab-nuit)}

/* ---------- Contact: details ---------- */
.cab-coordonnees{display:grid;max-width:520px;margin:46px 0 0}
.cab-coord{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:16px 0;border-top:1px solid rgba(255,255,255,.12)}
.cab-coord-label{padding-top:3px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
/* Since 1.18.0 the labels may be h3 headings: they keep the paragraph's
   line height and wrapping, not the headings'. */
h3.cab-coord-label{line-height:inherit;text-wrap:wrap}
/* A heading for screen readers and the page outline only (1.18.0), such as
   the "Contact details" heading above the contact labels. */
.cab-sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.cab-coord-valeur{font-size:15px;line-height:1.5}
.cab-coord-valeur a{text-decoration:none}
.cab-coord-valeur a:hover{color:var(--cab-citron)}

/* ---------- Decorative mock-up elements turned into pseudo-elements ---------- */
.cab-demande::before{content:"";position:absolute;top:16px;right:16px;width:14px;height:14px;
  background:linear-gradient(var(--cab-nuit),var(--cab-nuit)) center/14px 1.6px no-repeat,
             linear-gradient(var(--cab-nuit),var(--cab-nuit)) center/1.6px 14px no-repeat}
.cab-pied::before{content:"";display:block;width:54px;height:54px;margin:0 auto 110px;border-radius:50%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='6'/%3E%3Cpath d='M12 6.5V10'/%3E%3C/svg%3E") center/26px no-repeat,var(--cab-citron)}
.cab-pied-bas::after{content:"";width:46px;height:24px;border:1.5px solid var(--cab-blanc);border-radius:50%;
  background:linear-gradient(var(--cab-blanc),var(--cab-blanc)) center/100% 1.5px no-repeat,
             linear-gradient(90deg,transparent 30%,var(--cab-blanc) 30% calc(30% + 1.5px),transparent 0 calc(70% - 1.5px),var(--cab-blanc) 0 70%,transparent 0)}

.cab-pied-col a{color:inherit}
.cab-avec-courbe::after{content:"";position:absolute;left:0;right:0;bottom:0;height:52%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' preserveAspectRatio='none'%3E%3Cpath d='M0 44 L10 40 L18 42 L28 33 L36 36 L46 26 L54 29 L64 20 L72 23 L82 12 L90 15 L100 5 L100 50 L0 50Z' fill='%233C5412'/%3E%3Cpath d='M0 44 L10 40 L18 42 L28 33 L36 36 L46 26 L54 29 L64 20 L72 23 L82 12 L90 15 L100 5' fill='none' stroke='%23C2F43C' stroke-width='1'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.cab-fl-haut{display:block;padding:10px 18px 10px 48px;line-height:1.35}
.cab-fl-haut::before{content:"";position:absolute;left:10px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--cab-nuit)}
.cab-fl-haut strong{font-weight:600}
.cab-fl-coin::before{content:"";display:block;width:22px;height:22px;border-radius:50%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat,var(--cab-citron)}
.cab-fl-barres{display:block}
.cab-fl-barres::before{content:"";position:absolute;left:16px;bottom:14px;width:calc(75% - 26px);height:72%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 100' preserveAspectRatio='none' fill='none' stroke='%23CDD2C6' stroke-width='1.5'%3E%3Crect x='1' y='58' width='90' height='41' rx='10' vector-effect='non-scaling-stroke'/%3E%3Crect x='105' y='40' width='90' height='59' rx='10' vector-effect='non-scaling-stroke'/%3E%3Crect x='209' y='22' width='90' height='77' rx='10' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") left bottom/100% 100% no-repeat}
.cab-fl-barres::after{content:"↑";position:absolute;right:16px;bottom:14px;display:grid;place-items:center;width:calc(25% - 14px);height:84%;
  border-radius:10px;background:var(--cab-citron);color:var(--cab-nuit);font-size:26px}
.cab-cas-visuel::after{content:"";position:absolute;left:20%;bottom:11%;width:120px;height:44px;border-radius:999px;
  box-shadow:0 18px 40px rgba(40,70,0,.2)}
.cab-cas-visuel.cab-icones-depannage::after{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 0 0 5.4-5.4l-2.6 2.6-2.4-.6-.6-2.4 2.6-2.6Z'/%3E%3C/svg%3E") 17px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='13' rx='1.5'/%3E%3Cpath d='M8 21h8M12 17v4M2.5 8h19'/%3E%3C/svg%3E") 53px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5 4 5.5v6c0 5 3.4 8.6 8 10 4.6-1.4 8-5 8-10v-6l-8-3Z'/%3E%3Cpath d='m8.5 12 2.5 2.5 4.5-5'/%3E%3C/svg%3E") 89px 50%/14px no-repeat,
  radial-gradient(circle at 24px 50%,#EEF3E4 13.5px,transparent 14px),radial-gradient(circle at 60px 50%,#EEF3E4 13.5px,transparent 14px),
  radial-gradient(circle at 96px 50%,#EEF3E4 13.5px,transparent 14px),var(--cab-blanc)}
.cab-cas-visuel.cab-icones-sites::after{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='13' rx='1.5'/%3E%3Cpath d='M8 21h8M12 17v4M2.5 8h19'/%3E%3C/svg%3E") 17px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4h2.6l2.3 11h10.8l2.3-8H6.2'/%3E%3Ccircle cx='9' cy='19.5' r='1.3'/%3E%3Ccircle cx='17' cy='19.5' r='1.3'/%3E%3C/svg%3E") 53px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 21 21'/%3E%3C/svg%3E") 89px 50%/14px no-repeat,
  radial-gradient(circle at 24px 50%,#EEF3E4 13.5px,transparent 14px),radial-gradient(circle at 60px 50%,#EEF3E4 13.5px,transparent 14px),
  radial-gradient(circle at 96px 50%,#EEF3E4 13.5px,transparent 14px),var(--cab-blanc)}
.cab-cas-visuel.cab-icones-formation::after{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='6'/%3E%3Cpath d='M12 6.5V10'/%3E%3C/svg%3E") 17px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='14' rx='2'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3Cpath d='M8.5 6 10 3.5h4L15.5 6'/%3E%3C/svg%3E") 53px 50%/14px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C04' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M8.5 8h7M8.5 12h7M8.5 16h4'/%3E%3C/svg%3E") 89px 50%/14px no-repeat,
  radial-gradient(circle at 24px 50%,#EEF3E4 13.5px,transparent 14px),radial-gradient(circle at 60px 50%,#EEF3E4 13.5px,transparent 14px),
  radial-gradient(circle at 96px 50%,#EEF3E4 13.5px,transparent 14px),var(--cab-blanc)}
.cab-cas-visuel:not([class*=cab-icones-])::after{content:none}

/* ---------- Archives and search (1.2.0) ---------- */
/* The archive title is a core/query-title, the term description a div whose
   paragraphs carry the lead. */
.cab-tete-page .wp-block-term-description p+p{margin-top:12px}
.cab-tete-page .wp-block-search.cab-recherche{max-width:520px;margin:34px auto 0}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__inside-wrapper{padding:5px;border:1.5px solid rgba(194,244,60,.55);
  border-radius:999px;background:rgba(8,12,4,.85);box-shadow:0 0 22px rgba(194,244,60,.2);transition:border-color .25s,box-shadow .25s}
/* The whole pill shows the focus: an outline around the field alone would sit inside it. */
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__inside-wrapper:focus-within{border-color:var(--cab-citron);
  box-shadow:0 0 34px rgba(194,244,60,.5)}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__input{min-width:0;padding:0 18px;border:0;border-radius:999px;
  background:transparent;color:var(--cab-blanc);font:400 15px var(--cab-sans)}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__input:focus-visible{outline:none}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__input::placeholder{color:rgba(255,255,255,.55);opacity:1}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__button{margin:0;padding:12px 24px;border:0;border-radius:999px;
  background:var(--cab-citron);color:var(--cab-nuit);font:600 13px/1 var(--cab-sans);cursor:pointer;box-shadow:none}
.cab-tete-page .wp-block-search.cab-recherche .wp-block-search__button:hover{background:var(--cab-blanc)}
.cab-liste-articles .wp-block-query-no-results p{max-width:560px;margin-inline:auto;text-align:center;font-size:17px;line-height:1.6}

/* ---------- Comments (1.2.0) ---------- */
/* On the white of the article, at the width of its text. The article keeps
   less air below it when the comments follow, the rule between them marks
   the change. Core block styles are printed after this sheet: the form rules
   repeat the block class to outweigh them. */
.cab-article-corps:has(+ .cab-commentaires){padding-bottom:70px}
.cab-commentaires{padding:0 24px 110px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-commentaires-fil{max-width:700px;margin-inline:auto;padding-top:56px;border-top:1px solid #D9DDCF}
.cab-commentaires .wp-block-comments-title{margin:0 0 26px;font-size:clamp(24px,2.3vw,31px);line-height:1.1;letter-spacing:-.025em}
.cab-commentaires .wp-block-comment-template{margin:0 0 48px;padding:0;list-style:none}
.cab-commentaires .wp-block-comment-template ol{margin:0;padding-left:28px;list-style:none}
.cab-commentaire{padding:22px 0;border-top:1px solid #E6E9E0}
.cab-commentaire-tete{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin-bottom:10px}
.cab-commentaires .wp-block-comment-author-name{font-size:14px;font-weight:600}
.cab-commentaires .wp-block-comment-date{font-size:12px;color:#5A5F55}
.cab-commentaires .wp-block-comment-author-name a,.cab-commentaires .wp-block-comment-date a{color:inherit;text-decoration:none}
.cab-commentaires .wp-block-comment-content{font-size:15.5px;line-height:1.65;color:#22261E}
.cab-commentaires .wp-block-comment-content>*+*{margin-top:12px}
.cab-commentaires .comment-awaiting-moderation{font-family:var(--cab-sans);font-style:normal;font-size:12.5px;color:#5A5F55}
.cab-commentaires .wp-block-comment-reply-link{margin-top:10px}
.cab-commentaires .wp-block-comment-reply-link a,.cab-commentaires .wp-block-comment-edit-link a,
.cab-commentaires .wp-block-post-comments-form .comment-notes a,.cab-commentaires .wp-block-post-comments-form .logged-in-as a,
.cab-commentaires .wp-block-post-comments-form .comment-reply-title small a{font-size:12px;color:var(--cab-nuit);
  text-decoration-color:var(--cab-citron-fonce);text-decoration-thickness:2px;text-underline-offset:3px}
.cab-commentaires .wp-block-comments-pagination{margin:0 0 48px;gap:14px;font-size:13px}
.cab-commentaires .wp-block-comments-pagination a{color:var(--cab-nuit)}
.cab-commentaires .wp-block-post-comments-form .comment-reply-title{margin:0 0 10px;font-size:clamp(22px,2vw,27px);line-height:1.15;letter-spacing:-.025em}
.cab-commentaires .wp-block-post-comments-form .comment-reply-title small{margin-left:12px}
.cab-commentaires .wp-block-post-comments-form .comment-form{display:grid;gap:16px}
.cab-commentaires .wp-block-post-comments-form .comment-notes,
.cab-commentaires .wp-block-post-comments-form .logged-in-as{font-size:12.5px;line-height:1.55;color:#5A5F55}
.cab-commentaires .wp-block-post-comments-form label{display:block;margin-bottom:6px;font-size:12px;font-weight:500;letter-spacing:.01em}
.cab-commentaires .wp-block-post-comments-form input:not([type=submit]):not([type=checkbox]),
.cab-commentaires .wp-block-post-comments-form textarea{display:block;width:100%;padding:11px 14px;border:1px solid #CDD2C6;border-radius:8px;
  background:var(--cab-brume);color:var(--cab-nuit);font:400 15px/1.5 var(--cab-sans)}
.cab-commentaires .wp-block-post-comments-form textarea{height:160px;resize:vertical}
/* Lemon disappears on white: the fields take the dark green for their focus. */
.cab-commentaires .wp-block-post-comments-form input:focus-visible,
.cab-commentaires .wp-block-post-comments-form textarea:focus-visible{outline:2px solid var(--cab-citron-fonce);outline-offset:1px}
.cab-commentaires .wp-block-post-comments-form .comment-form-cookies-consent{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;line-height:1.5;color:#3C4236}
.cab-commentaires .wp-block-post-comments-form .comment-form-cookies-consent label{margin:0;font-size:inherit;font-weight:400;letter-spacing:0}
.cab-commentaires .wp-block-post-comments-form .comment-form-cookies-consent input{flex:none;width:16px;height:16px;margin:2px 0 0;accent-color:var(--cab-nuit)}
.cab-commentaires .wp-block-post-comments-form input[type=submit]{display:inline-flex;width:auto;padding:13px 28px;border:0;border-radius:999px;
  background:#0A0A0A;color:var(--cab-blanc);font:500 13px/1 var(--cab-sans);cursor:pointer;box-shadow:none;transition:background .2s,color .2s}
.cab-commentaires .wp-block-post-comments-form input[type=submit]:hover{background:var(--cab-citron);color:var(--cab-nuit)}

/* ---------- Reviews (Site Reviews, 1.23.0) ---------- */
/* The reviews sit on the night, like the testimonial of the website page:
   lemon stars read there, not on white. Their colour is the blocks' own
   setting (style_rating_color: lemon, moss for the form), not this sheet.
   The form follows on white, dressed like the comment form. Site Reviews
   exposes custom properties for its type, fields and gaps; they are set
   here rather than its rules overridden. Without the plugin, nothing here
   matches. */
/* .cab-avis-page: the reviews page's section, which shares the cab-avis
   class (and its look) with the home page's testimonials. 1.23.0 wrote
   these rules for every cab-avis and shrank the home section; since
   1.26.0 the home page shows the same Reviews block, so the page's card
   look must not reach it either. */
.cab-avis-page{padding:100px 24px 110px;color:var(--cab-blanc)}
.cab-avis-page .cab-titre-m{margin:0 0 34px}
.cab-avis-page .glsr{--glsr-text-base:15.5px;--glsr-text-sm:13px;--glsr-text-md:17px;--glsr-leading:1.6;--glsr-review-row-gap:12px;--glsr-gap-md:14px}
.cab-avis-page .wp-block-site-reviews-summary{margin-bottom:56px}
.cab-avis-page .glsr-summary{color:var(--cab-blanc)}
.cab-avis-page .glsr-summary-rating .glsr-tag-value{font-size:clamp(40px,4vw,56px);font-weight:500;letter-spacing:-.03em;line-height:1}
.cab-avis-page .glsr-summary-text,.cab-avis-page .glsr-bar-label,.cab-avis-page .glsr-bar-percent{color:rgba(255,255,255,.75)}
.cab-avis-page .glsr-bar-background{background:rgba(255,255,255,.13)}
.cab-avis-page .glsr-reviews{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:22px}
/* align-content: the plugin lays a review out in wrapping flex rows. When a
   card is taller than its content (a grid row stretches it to the tallest
   card), the rows shared the extra height, and the name dropped below its
   avatar. Packed at the top, the avatar and the name stay on one line. */
.cab-avis-page .glsr-review{margin:0;padding:26px 24px 24px;border:1px solid rgba(255,255,255,.13);border-radius:12px;color:var(--cab-blanc);align-content:flex-start}
.cab-avis-page .glsr-review-title :is(h3,h4){margin:0;font-size:19px;font-weight:600;line-height:1.25;letter-spacing:-.015em;color:var(--cab-blanc)}
.cab-avis-page .glsr-review-date{font-size:12.5px;color:rgba(255,255,255,.65)}
.cab-avis-page .glsr-review-content{color:rgba(255,255,255,.88)}
.cab-avis-page .glsr-review-author{font-size:13.5px;font-weight:600;color:var(--cab-citron)}
/* The plugin draws its reply as a speech bubble (two pseudo-elements, a tint
   and a tail); here a lemon rule marks it, as the quotes of the site do. */
.cab-avis-page .glsr-review-response{margin-top:8px;padding:0 0 0 14px;border-left:2px solid var(--cab-citron);font-size:13.5px;color:rgba(255,255,255,.8);background:none}
.cab-avis-page .glsr-review-response::before,.cab-avis-page .glsr-review-response::after{content:none}
.cab-avis-page .glsr-review-response-inner p{margin:0}
.cab-avis-page .glsr-review-response-inner p+p{margin-top:4px}
.cab-avis-page .glsr-review-response strong{color:var(--cab-blanc);font-weight:600}
.cab-avis-page .glsr-pagination a,.cab-avis-page .glsr-pagination span{color:var(--cab-blanc)}

/* The summary box follows its block's own Alignment setting (style_align:
   Start, Center, End). Site Reviews aligns the text inside a 48ch box and
   writes items-justified-* on the block, but the box itself stays at the
   start: core's items-justified-* rules only act on a flex container, which
   this block is not. */
.wp-block-site-reviews-summary.items-justified-center .glsr-summary{margin-inline:auto}
.wp-block-site-reviews-summary.items-justified-right .glsr-summary{margin-inline-start:auto}

/* "Masonry" style of the Reviews block (inc/reviews.php): CSS columns, so
   each card keeps its own height. The price is the order: columns fill
   downwards, the second review sits under the first. Real CSS masonry
   (display: grid-lanes, grid-template-rows: masonry) is still refused by
   Chrome 152, checked on 19 October 2026. Column width and gap match the
   grid above. */
.is-style-cab-masonry .glsr-reviews{display:block;columns:340px;column-gap:22px}
.is-style-cab-masonry .glsr-review{break-inside:avoid;margin:0 0 22px}

/* "Carousel" style of the Reviews block (inc/reviews.php, 1.26.0): one review
   per view, in the home page's testimonial layout: the title as a small
   capital label, the review as a large italic quote, the avatar, the name,
   then the category, which the theme asks the plugin to print, with the
   whole review instead of an excerpt. The block draws the track; arrows
   come from a theme carousel around it (.cab-carrousel, cab-front.js).
   Reviews differ in length: the track takes the tallest one and centres
   the others in it, so the section never jumps. The text alignment is the
   block's own setting (Center on the home page): the plugin applies it with
   a stronger rule than any a style could add. The paragraphs of a review
   run on as one quote, the guillemets inside the first and the last: after
   the last paragraph, the markup's line break would show as a space. The
   avatar keeps the size set in the plugin (50px), written in a style
   attribute.
   .is-style-cab-carousel .glsr, not .wp-block-site-reviews: in the editor
   the block's wrapper does not carry wp-block-site-reviews, and the rules
   must reach the preview too.
   flex:none on the avatar: the plugin's flex:0 0 gives it a zero height in
   a column. */
.is-style-cab-carousel .glsr .glsr-reviews{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:14px;align-items:center;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.is-style-cab-carousel .glsr .glsr-reviews::-webkit-scrollbar{display:none}
.is-style-cab-carousel .glsr .glsr-review{display:flex;flex-direction:column;align-items:center;gap:0;scroll-snap-align:start}
.is-style-cab-carousel .glsr .glsr-review-title :is(h3,h4){margin:0;font-size:13px;font-weight:600;line-height:1.6;letter-spacing:.04em;text-transform:uppercase}
.is-style-cab-carousel .glsr .glsr-review-content{max-width:780px;margin:20px auto 30px;font-family:var(--cab-serif);font-style:italic;
  font-size:clamp(19px,1.9vw,25px);line-height:1.3;opacity:.9}
.is-style-cab-carousel .glsr .glsr-review-content p{display:inline;margin:0}
.is-style-cab-carousel .glsr .glsr-review-content p:first-of-type::before{content:"«\00a0"}
.is-style-cab-carousel .glsr .glsr-review-content p:last-of-type::after{content:"\00a0»"}
.is-style-cab-carousel .glsr .glsr-review-avatar{flex:none;margin:0 0 12px}
/* Corners only, not a circle: an avatar can be a logo or the plugin's
   fallback picture, already drawn with its own shape, which a circle cut. */
.is-style-cab-carousel .glsr .glsr-review-avatar img{border-radius:8px;object-fit:cover}
.is-style-cab-carousel .glsr .glsr-review-author{font-size:12.5px;font-weight:500}
.is-style-cab-carousel .glsr .glsr-review-assigned_terms{font-size:11px;color:var(--cab-gris)}
.is-style-cab-carousel .glsr .glsr-pagination{display:none}

/* ---------- Client sites (Sites internet page, 1.27.0) ---------- */
/* The "Sites clients" synced pattern (wp_block 205): a core Columns block,
   the title on the left, on the right a core Gallery in Cabrio Useful
   Options' Scrolling style (one line, two arrows), one logo per picture,
   the client's name as its caption, linked to the client's site. White,
   like the case studies above it: several logos are black. The theme only
   dresses it: logo height, the caption under the logo rather than over it,
   the arrows on both sides, drawn like the site's carousel arrows. The
   gallery leaves them room (margin-inline) so they never cover a logo. */
.cab-clients{padding:110px 0;background:var(--cab-blanc);color:var(--cab-nuit)}
@media (min-width:782px){.cab-clients .cab-titre-m{text-align:start}}
.cab-clients .wp-block-column:has(.is-style-cab-uo-scroll){position:relative}
.cab-clients .wp-block-gallery.is-style-cab-uo-scroll{margin-inline:56px;padding-block:6px}
.cab-clients .is-style-cab-uo-scroll figure.wp-block-image:not(#individual-image){flex-direction:column;align-items:center;justify-content:flex-start}
.cab-clients .is-style-cab-uo-scroll figure.wp-block-image:not(#individual-image)::before{content:none}
/* max-height, not height: the editor writes height:auto on each image in a
   style attribute, which would beat it there. */
.cab-clients .is-style-cab-uo-scroll figure.wp-block-image:not(#individual-image) img{width:auto;max-width:100%;height:auto;max-height:110px;object-fit:contain;margin-inline:auto}
.cab-clients .is-style-cab-uo-scroll figure.wp-block-image:not(#individual-image) figcaption{position:static;max-height:none;margin:0;padding:14px 0 0;
  background:none;color:#5A5F55;font-size:15px;line-height:1.4;text-align:center;text-shadow:none;overflow:visible;-webkit-backdrop-filter:none;backdrop-filter:none}
.cab-clients div.cab-uo-scroll-nav{position:absolute;left:0;right:0;top:40px;margin:0;justify-content:space-between;pointer-events:none}
.cab-clients .cab-uo-scroll__button{pointer-events:auto;width:42px;height:42px;padding:0;border:0;border-radius:50%;background:#141B0C;
  color:var(--cab-blanc);font:400 17px/42px var(--cab-sans);box-shadow:none}
.cab-clients .cab-uo-scroll__button:hover,.cab-clients .cab-uo-scroll__button:focus-visible{background:var(--cab-citron);color:var(--cab-nuit)}

.cab-avis-depot{padding:100px 24px 130px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-avis-depot .cab-wrap-l>*{max-width:700px;margin-inline:auto}
.cab-avis-depot .cab-titre-m{margin-bottom:12px}
.cab-avis-note{margin-bottom:34px;font-size:14px;line-height:1.6;color:#5A5F55}
.cab-avis-depot .glsr{--glsr-text-base:15px;--glsr-label-text:12px;--glsr-label-weight:500;--glsr-label-color:var(--cab-nuit);
  --glsr-input-bg:var(--cab-brume);--glsr-input-color:var(--cab-nuit);--glsr-input-border-color:#CDD2C6;--glsr-input-border-width:1px;
  --glsr-input-radius:8px;--glsr-input-pt:11px;--glsr-input-pb:11px;--glsr-input-pl:14px;--glsr-input-pr:14px;
  --glsr-form-row-gap:18px;--glsr-description-text:12.5px}
.cab-avis-depot .glsr-input:focus-visible,.cab-avis-depot .glsr-textarea:focus-visible{outline:2px solid var(--cab-citron-fonce);outline-offset:1px}
.cab-avis-depot .glsr-field-checkbox label,.cab-avis-depot .glsr-field-toggle label{font-size:12.5px;font-weight:400;color:#3C4236}
/* The submit button is the theme's own button (wp-element-button). */

/* ---------- Member pages (Cabrio Connexion, 1.6.0) ---------- */
/* The sign-in, sign-up and account pages carry a page head and this white
   section, as the legal notice does. The plugin draws its forms from the
   colour of the text around them; the theme hands it the field of the comment
   form through the plugin's own custom properties, and the black button of
   the comment form rather than the global glowing one. */
.cab-page-compte{padding:90px 24px 120px;background:var(--cab-blanc);color:var(--cab-nuit)}
.cab-page-compte .cab-connexion{--cab-cnx-accent:var(--cab-nuit);--cab-cnx-muted:#5A5F55;--cab-cnx-line:#CDD2C6;--cab-cnx-surface:var(--cab-brume);
  --cab-cnx-radius:8px;--cab-cnx-pad:11px 14px;font-size:15px;line-height:1.55}
/* Field labels only: the radio answers and "stay signed in" read as text. */
.cab-page-compte .cab-connexion__field:not(.cab-connexion__field--check)>label,.cab-page-compte .cab-connexion__field--avatar legend{font-size:12px;font-weight:500;letter-spacing:.01em}
.cab-page-compte .cab-connexion__field--check label,.cab-page-compte .cab-connexion__choix-ligne label{font-size:13px}
.cab-page-compte .cab-connexion__section-titre{font-size:clamp(22px,2vw,27px);line-height:1.15;letter-spacing:-.025em}
.cab-page-compte .cab-connexion__name{font-size:22px;letter-spacing:-.02em}
.cab-page-compte .cab-connexion__submit{padding:13px 28px;border:0;background:#0A0A0A;color:var(--cab-blanc);font:500 13px/1 var(--cab-sans);box-shadow:none;transition:background .2s,color .2s}
.cab-page-compte .cab-connexion__submit:hover{background:var(--cab-citron);color:var(--cab-nuit)}
.cab-page-compte .cab-connexion a{color:var(--cab-nuit);text-decoration-color:var(--cab-citron-fonce);text-decoration-thickness:2px;text-underline-offset:3px}
/* Lemon disappears on white: the dark green takes the focus, as in the comment form. */
.cab-page-compte .cab-connexion :is(input,textarea,button,a):focus-visible{outline:2px solid var(--cab-citron-fonce);outline-offset:1px}
/* The member's menu. Cabrio Connexion (1.15.0) lays out the account page
   itself, menu beside the form, and keeps the menu in view; the theme only
   widens the space and dresses the menu as a mist panel. */
.cab-page-compte .cab-connexion-espace{max-width:1040px;margin-inline:auto}
.cab-page-compte .cab-connexion-espace__grille{column-gap:64px}
.cab-page-compte .cab-connexion-menu{padding:24px 26px;border:1px solid #D9DDCF;border-radius:12px;background:var(--cab-brume)}
.cab-page-compte .cab-connexion-menu__titre{margin:0 0 10px;font-size:10.5px;font-weight:500;letter-spacing:.16em;color:#5A5F55}
.cab-page-compte .cab-connexion-menu__liste li+li{border-top-color:#E3E7DA}
.cab-page-compte .cab-connexion-menu__liste+.cab-connexion-menu__liste{margin-top:12px;padding-top:12px;border-top-color:#CDD2C6}
.cab-page-compte .cab-connexion-menu a{padding:9px 0;font-size:14.5px;color:var(--cab-nuit);text-decoration:none}
.cab-page-compte .cab-connexion-menu a:hover{text-decoration:underline;text-decoration-color:var(--cab-citron-fonce);text-decoration-thickness:2px;text-underline-offset:3px}
.cab-page-compte .cab-connexion-menu a:focus-visible{outline:2px solid var(--cab-citron-fonce);outline-offset:2px}

/* ---------- Home header beside the request card ---------- */
/* On the home page the lemon request card sits under the right end of the
   header. The row keeps its content out of that zone: the phone button,
   already invisible there, leaves the row, and Cabrio Connexion's account
   link, set after the menu by itself, stays left of the card instead of on
   it. Before this the link covered "Besoin d'aide ?". From 1.12.0 the card is
   beside the header from 1280 px only. */
@media (min-width:1280px){
  .home .cab-entete:not(.is-scrolled) .cab-entete-rangee{padding-right:320px}
}
/* The logo (200 px since 1.11.0) is much wider than the old word mark
   (89 px): up to 1399 px the row and the menu tighten, so that the menu stays
   on one line beside the logo. */
@media (min-width:961px) and (max-width:1399px){
  .cab-entete-rangee{gap:28px}
  .wp-block-navigation.cab-menu .wp-block-navigation__container{gap:24px}
}
/* The home page also holds the round handset beside the card: its row and
   menu tighten further, and up to 1399 px the menu takes the tablet size. */
@media (min-width:1280px){
  .home .cab-entete:not(.is-scrolled) .cab-entete-rangee{gap:32px}
  .home .cab-entete:not(.is-scrolled) .wp-block-navigation.cab-menu .wp-block-navigation__container{gap:30px}
}
@media (min-width:1280px) and (max-width:1399px){
  .home .cab-entete:not(.is-scrolled) .cab-entete-rangee{gap:24px}
  .home .cab-entete:not(.is-scrolled) .wp-block-navigation.cab-menu .wp-block-navigation__container{gap:20px}
  .home .cab-entete:not(.is-scrolled) .wp-block-navigation.cab-menu .wp-block-navigation__container>li>.wp-block-navigation-item__content{font-size:10px;letter-spacing:.1em}
}

/* ---------- Responsive ---------- */
/* Up to 1279 px the request card left the title no room beside it: at
   1024 px it covered "L'informatique" by 68 px, at 961 px by 85 (seen by
   Cyrille on 7 October 2026, 1.12.0). It sits under the hero there, as on a
   tablet. The bound is 1279.98, not 1279: a zoomed page can measure 1279.5 px,
   where neither 1279 nor 1280 applies, and the card covered the menu. */
@media (max-width:1279.98px){
  .cab-hero{min-height:0;padding-bottom:110px}
  .cab-hero-centre::after{top:calc(100% + 70px);width:1700px}
  .cab-hero-centre::before{width:1000px;height:420px;top:calc(100% - 140px)}
  .cab-demande{position:relative;top:auto;right:auto;width:auto;max-width:420px;margin:130px auto 0}
}
/* From 1280 px the card is beside the title again; up to about 1370 px the
   title shrinks just enough to keep 30 px clear of it (at 1280 px only 2 px
   were left). Beyond, 8vw is the smaller of the two. */
@media (min-width:1280px){
  .cab-titre-hero{font-size:clamp(58px,min(8vw,17.6vw - 132px),116px)}
}

/* With the logo, the number no longer fits beside the menu: the phone button
   is the round handset, as large as the menu button, and the menu takes the
   tablet size (it was so under 560 px only in 1.10.0, and at 600 px the menu
   then stacked on six lines). Up to 1199 px since 1.17.0, 960 before: with
   Windows' scrollbar a 1024 px window leaves the page 1005 px, and Conseils
   and Contact went to a second line, before the sub-menus' chevrons took
   28 px more. The number stays in the link, for screen readers. */
@media (max-width:1199.98px){
  .cab-entete-cta .wp-block-button__link{display:grid;place-items:center;width:44px;height:44px;padding:0;
    font-size:0;letter-spacing:0}
  .cab-entete-cta .wp-block-button__link::before{content:"";width:18px;height:18px;background:currentColor;
    -webkit-mask:var(--cab-icone-tel) center/contain no-repeat;mask:var(--cab-icone-tel) center/contain no-repeat}
  .wp-block-navigation.cab-menu .wp-block-navigation__container{gap:20px}
  .wp-block-navigation.cab-menu .wp-block-navigation-item__content{font-size:10px;letter-spacing:.1em}
}
@media (min-width:961px) and (max-width:1199.98px){
  .cab-entete{padding-inline:32px}
  .cab-entete-rangee{gap:20px}
}
@media (max-width:960px){
  .cab-entete .cab-logo img{max-width:150px}
  /* The menu already takes two lines here, and the chevrons made it three at
     620 px: under 961 px the sub-menus open on hover only, and a finger
     reaches the sub-pages from their parent page. */
  .cab-entete .wp-block-navigation.cab-menu .wp-block-navigation__submenu-icon{display:none}
  .cab-grille-articles .wp-block-post-template{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  /* The nav only: core copies its classes onto the list of the mobile panel,
     which this rule pushed to the right there (1.17.0). */
  nav.wp-block-navigation.cab-menu{margin-right:0}
}
@media (max-width:560px){
  /* Logo, menu, account link (Cabrio Connexion) and phone button on one row:
     at 40 px apart the phone button left the screen at 390 px. */
  .cab-entete-rangee{gap:16px}
  /* The site name standing in for a missing logo may wrap. */
  .cab-entete .cab-logo img{max-width:130px}
}
@media (max-width:400px){
  /* Logo, menu, picture and handset, three of them 44 px: closer together,
     or the row scrolls at 320 px. */
  .cab-entete-rangee{gap:12px}
}
@media (max-width:560px){
  .cab-entete-rangee>.cab-marque{flex:0 1 auto;font-size:12px;line-height:1.25}
  .cab-conseils-grille .wp-block-post-template,.cab-grille-articles .wp-block-post-template{grid-template-columns:1fr;gap:40px}
  .cab-coord{grid-template-columns:1fr;gap:4px}
  .cab-commentaires{padding:0 20px 90px}
  .cab-page-compte{padding:64px 20px 90px}
  .cab-commentaires-fil{padding-top:44px}
  .cab-commentaires .wp-block-comment-template ol{padding-left:16px}
  .cab-tete-page .wp-block-search.cab-recherche .wp-block-search__input{padding:0 12px}
  .cab-tete-page .wp-block-search.cab-recherche .wp-block-search__button{padding-inline:18px}
}

/* ── Back to the top (1.29.0) ─────────────────────────────────────────────
   Round, in the corner the thumb reaches, and absent until the first screen
   is behind the reader: assets/js/cab-front.js decides that moment, this
   only says what appearing looks like. Lemon ringed with night, so it shows
   on the night sections, the white ones and the lemon call-to-action band
   alike; turned round under the pointer and the keyboard.
   Hidden with visibility, not opacity alone: a button faded to nothing is
   still on the keyboard's path. Under the sticky header (z-index 100). */
.cab-haut{position:fixed;z-index:90;right:clamp(14px,3vw,28px);bottom:clamp(14px,3vw,28px);
  display:flex;align-items:center;justify-content:center;width:46px;height:46px;padding:0;border:0;border-radius:50%;
  background:var(--cab-citron);color:var(--cab-nuit);cursor:pointer;
  box-shadow:0 0 0 2px var(--cab-nuit),0 10px 24px rgba(8,12,4,.35);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s,background-color .2s ease,color .2s ease}
.cab-haut[hidden]{display:none}
.cab-haut.cab-haut--vu{opacity:1;visibility:visible;transform:none}
.cab-haut:hover,.cab-haut:focus-visible{background:var(--cab-nuit);color:var(--cab-citron);box-shadow:0 0 0 2px var(--cab-citron),0 10px 24px rgba(8,12,4,.35)}
.cab-haut:focus-visible{outline:2px solid var(--cab-citron);outline-offset:4px}
@media print{.cab-haut{display:none}}