/* ============================================================
   SAMEY — pages-b.css  (généré par conversion/b/convertir.py — NE PAS ÉDITER)
   Galerie (9), À propos (10), Contact (11) converties en widgets Elementor natifs.
   Les styles en ligne de la maquette sont sortis du markup et posés en classes.

   Règle de cascade tenue par tout ce fichier : AUCUN `!important` dans les styles
   générés. Les points de rupture de la maquette (`responsive.css`, §7/§8/§10 de
   `maquette.css`) gagnent avec `!important` ; une règle ordinaire ne peut pas les
   battre, quel que soit l'ordre ou la spécificité. Le responsive commande donc encore.
   ============================================================ */

/* --- 1. Remise à zéro des défauts d'Elementor sur les conteneurs convertis ---
   `flex-direction:column` est LE piège : `.e-flex{flex-direction:var(--flex-direction)}`
   et Elementor met `column` par défaut. La maquette, elle, compte sur le `row` du
   navigateur : sans cette remise à zéro, la barre de navigation empile ses cinq liens
   les uns sous les autres et fait 600 px de haut (vu à l'écran le 19/08). */
.e-con.smy-conv.smy-conv.smy-conv{display:block;gap:0;--gap:0px;--row-gap:0px;--column-gap:0px;
  padding:0;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;
  --content-width:100%;max-width:none;width:auto;min-width:0;
  flex-direction:row;flex-wrap:nowrap;align-items:normal;align-content:normal;
  justify-content:normal;text-align:initial}

/* --- 2. Les enveloppes de widget ne rajoutent rien ---
   Astra injecte dans la page une feuille EN LIGNE qui habille les widgets Elementor :
   `.elementor-widget-heading h1.elementor-heading-title{line-height:1.4em}` (0,2,2) et
   `body .elementor-button.elementor-size-sm{font-size:16px}` (0,2,1). Une classe suivie
   d'un descendant (0,2,0) ne suffit donc pas : toutes les règles générées doublent leur
   classe (`.smy-x.smy-x …`, soit 0,3,0). Rien de tout ça n'existait tant que les sections
   étaient des widgets HTML — Astra ne visait aucune de leurs balises. */
.smy-w{--kit-widget-spacing:0px;--widgets-spacing:0px 0px;
  --widgets-spacing-row:0px;--widgets-spacing-column:0px}
/* §5 de `maquette.css` (`.samey-maquette-bloc .elementor-widget-html{width:100%}`) a été
   écrite pour un bloc = un seul widget HTML. Dès qu'un conteneur en aligne plusieurs, elle
   force chaque enveloppe à la pleine largeur : les quatre filtres de la Galerie
   s'empilaient au lieu de tenir sur une ligne. */
.smy-w.smy-w.smy-w.smy-w{width:auto}
.smy-w.smy-w.smy-w.smy-w > .elementor-widget-container{width:auto;margin:0}
/* Elementor 4 rend le widget SANS `.elementor-widget-container` (markup optimisé) : le
   contenu est enfant direct de `.elementor-widget`. Les deux formes sont visées, pour que
   la feuille survive au réglage inverse. */
.smy-w > p, .smy-w > div, .smy-w > .elementor-widget-container > p{margin:0}
.smy-w > p > a, .smy-w > div > a, .smy-w > .elementor-widget-container > p > a{display:block}
.smy-w.smy-w.smy-w.smy-w .elementor-heading-title{line-height:inherit;margin:0}
/* Un titre de rang `span` sort `display:inline` : la hauteur du widget devient alors celle
   de l'interligne du corps (28 px) au lieu de celle du texte (18 à 24 px). Dans la
   maquette ces `<span>` étaient des enfants de flex, donc blocs. */
.smy-w.smy-w.smy-w.smy-w span.elementor-heading-title{display:block}
.smy-w .elementor-button-wrapper{line-height:0}
/* La maquette n'avait pas de bouton : un `<a>` habillé, qui héritait de `body`
   (`line-height:1.65`). Sans ça le bouton perd 4 px de haut. */
.smy-w.smy-w.smy-w.smy-w .elementor-button{display:inline-block;text-decoration:none;line-height:1.65;
  padding:0;border:0;background:none;color:inherit;font-family:inherit;font-size:inherit;
  font-weight:inherit;letter-spacing:inherit;text-align:inherit;fill:currentColor}
.smy-w.elementor-widget-image > .elementor-widget-container{line-height:0}

/* --- 3. Ce que la maquette réglait par un attribut qu'Elementor ne pose pas --- */
/* Le bouton du menu reste un widget HTML : son enveloppe doit suivre le même sort que
   lui, sinon elle laisse une gouttière de 44 px dans la barre sur grand écran. */
.smy-burger{display:none}
@media (max-width:1024.5px){
  .smy-burger{display:block}
  /* `[data-nav-bar] a[href="/contact/"]{display:none}` cachait le lien ; converti, c'est
     l'enveloppe du bouton qu'il faut sortir du flux, sinon la gouttière reste. */
  .smy-nav-cta{display:none!important}
}


/* --- 4. Les styles en ligne de la maquette, en classes --- */
.smy-a45a502.smy-a45a502.smy-a45a502.smy-a45a502.smy-a45a502{margin-right:auto}
.smy-bc23976.smy-bc23976.smy-bc23976.smy-bc23976.smy-bc23976 a{display:flex; align-items:center; gap:9px; font-family:'Poppins','Helvetica Neue',sans-serif; font-weight:800; font-size:17px; letter-spacing:.04em; color:#FFF8EE}
.smy-0a1c4c2.smy-0a1c4c2.smy-0a1c4c2.smy-0a1c4c2.smy-0a1c4c2 a{color:#FFF8EE; padding:6px 2px; border-bottom:1px solid transparent}
.smy-3c20611.smy-3c20611.smy-3c20611.smy-3c20611.smy-3c20611 a{color:#FFF8EE; padding:6px 2px; border-bottom:1px solid #FFFFFF}
.e-con.smy-e63c0ab.smy-e63c0ab.smy-e63c0ab.smy-e63c0ab.smy-e63c0ab{display:flex; align-items:center; gap:clamp(16px,2vw,30px); font-size:15px; font-weight:500}
.smy-b439446.smy-b439446.smy-b439446.smy-b439446.smy-b439446{flex:0 0 auto}
.smy-0f2755d.smy-0f2755d.smy-0f2755d.smy-0f2755d.smy-0f2755d .elementor-button{white-space:nowrap; background:#FFFFFF; color:#16130F; padding:11px 22px; border-radius:10px; font-weight:600; font-size:15px}
.smy-ec2df9c.smy-ec2df9c.smy-ec2df9c.smy-ec2df9c.smy-ec2df9c{width:44px; height:44px}
.e-con.smy-ec2beca.smy-ec2beca.smy-ec2beca.smy-ec2beca.smy-ec2beca{pointer-events:auto; display:flex; align-items:center; gap:clamp(20px,3vw,44px); width:100%; max-width:1180px; padding:9px 10px 9px 22px; border-radius:14px; background:rgba(22,19,15,.66); backdrop-filter:blur(26px) saturate(180%); -webkit-backdrop-filter:blur(26px) saturate(180%); border:1px solid rgba(255,248,238,.22); box-shadow:inset 0 1px 0 rgba(255,248,238,.18),0 10px 34px rgba(22,19,15,.22)}
.e-con.smy-ac6ea3b.smy-ac6ea3b.smy-ac6ea3b.smy-ac6ea3b.smy-ac6ea3b{position:fixed; top:0; left:0; right:0; z-index:60; display:flex; justify-content:center; padding:14px 24px; pointer-events:none}
.smy-25dd4b7.smy-25dd4b7.smy-25dd4b7.smy-25dd4b7.smy-25dd4b7 a{color:#FFF8EE; font-family:'Poppins','Helvetica Neue',sans-serif; font-weight:700; font-size:clamp(26px,7vw,40px); padding:11px 0}
.smy-508b412.smy-508b412.smy-508b412.smy-508b412.smy-508b412{margin-top:22px; align-self:flex-start}
.e-con.smy-745e099.smy-745e099.smy-745e099.smy-745e099.smy-745e099{position:fixed; inset:0; z-index:59; background:#16130F; flex-direction:column; justify-content:center; gap:4px; padding:96px 36px 48px}
.smy-942e759.smy-942e759.smy-942e759.smy-942e759.smy-942e759 .elementor-heading-title{display:flex; align-items:center; gap:16px; font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,248,238,.72)}
.smy-e7ff50a.smy-e7ff50a.smy-e7ff50a.smy-e7ff50a.smy-e7ff50a .elementor-heading-title{color:#FFF8EE; font-size:clamp(38px,6.4vw,104px); line-height:1; max-width:20ch}
.smy-5d9ea59.smy-5d9ea59.smy-5d9ea59.smy-5d9ea59.smy-5d9ea59{margin:0}
.smy-f3ce952.smy-f3ce952.smy-f3ce952.smy-f3ce952.smy-f3ce952, .smy-f3ce952.smy-f3ce952.smy-f3ce952.smy-f3ce952.smy-f3ce952 > .elementor-widget-container{font-size:17px; line-height:1.6; color:rgba(255,248,238,.82); max-width:48ch}
.smy-765feda.smy-765feda.smy-765feda.smy-765feda.smy-765feda .elementor-button{white-space:nowrap; background:#FFFFFF; color:#16130F; font-weight:600; font-size:16px; padding:16px 30px; border-radius:7px}
.e-con.smy-7930557.smy-7930557.smy-7930557.smy-7930557.smy-7930557{display:flex; align-items:flex-end; justify-content:space-between; gap:44px; flex-wrap:wrap; border-top:1px solid rgba(255,248,238,.24); padding-top:26px}
.e-con.smy-b07f64a.smy-b07f64a.smy-b07f64a.smy-b07f64a.smy-b07f64a{background:#16130F; display:flex; flex-direction:column; justify-content:flex-end; gap:26px; min-height:62vh; padding:clamp(140px,20vh,210px) 48px clamp(48px,7vh,80px)}
.e-con.smy-63a6f62.smy-63a6f62.smy-63a6f62.smy-63a6f62.smy-63a6f62{display:flex; gap:10px; flex-wrap:wrap}
.smy-7dc0c26.smy-7dc0c26.smy-7dc0c26.smy-7dc0c26.smy-7dc0c26 .elementor-heading-title{font-size:14px; color:#6B655C}
.e-con.smy-f44e967.smy-f44e967.smy-f44e967.smy-f44e967.smy-f44e967{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap}
.e-con.smy-725852b.smy-725852b.smy-725852b.smy-725852b.smy-725852b{background:#FFF8EE; display:flex; flex-direction:column; gap:28px; padding:clamp(48px,7vh,80px) 48px clamp(72px,10vh,112px)}
.smy-1b9797c.smy-1b9797c.smy-1b9797c.smy-1b9797c.smy-1b9797c .elementor-heading-title{font-size:12px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,248,238,.82)}
.smy-df78960.smy-df78960.smy-df78960.smy-df78960.smy-df78960 .elementor-heading-title{color:#FFF8EE; font-size:clamp(30px,5.4vw,88px); line-height:1.02; max-width:20ch}
.smy-5676bc0.smy-5676bc0.smy-5676bc0.smy-5676bc0.smy-5676bc0, .smy-5676bc0.smy-5676bc0.smy-5676bc0.smy-5676bc0.smy-5676bc0 > .elementor-widget-container{color:rgba(255,248,238,.9); font-size:17px; line-height:1.55; max-width:44ch}
.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62 .elementor-button{white-space:nowrap; background:#16130F; color:#FFF8EE; font-weight:600; font-size:17px; padding:20px 38px; border-radius:7px}
.e-con.smy-9ab4a70.smy-9ab4a70.smy-9ab4a70.smy-9ab4a70.smy-9ab4a70{display:flex; align-items:flex-end; justify-content:space-between; gap:44px; flex-wrap:wrap; border-top:1px solid rgba(255,248,238,.35); padding-top:26px}
.e-con.smy-20c5f62.smy-20c5f62.smy-20c5f62.smy-20c5f62.smy-20c5f62{background: #FFFFFF; display:flex; flex-direction:column; gap:clamp(18px,3vh,34px); padding:clamp(64px,9vh,112px) 48px}
.smy-35f46d7.smy-35f46d7.smy-35f46d7.smy-35f46d7.smy-35f46d7 .elementor-heading-title{font-family:'Poppins','Helvetica Neue',sans-serif; font-weight:700; font-size:20px; letter-spacing:.02em}
.smy-3e479c6.smy-3e479c6.smy-3e479c6.smy-3e479c6.smy-3e479c6 .elementor-heading-title{font-size:14px; color:rgba(255,248,238,.6); max-width:26ch}
.e-con.smy-68b9ff3.smy-68b9ff3.smy-68b9ff3.smy-68b9ff3.smy-68b9ff3{display:flex; flex-direction:column; gap:10px}
.smy-9c49ef0.smy-9c49ef0.smy-9c49ef0.smy-9c49ef0.smy-9c49ef0 .elementor-heading-title{color:var(--text-sur-encre-3,rgba(255,248,238,.62)); text-transform:uppercase; letter-spacing:.18em; font-size:11px; font-weight:600}
.smy-9fb9309.smy-9fb9309.smy-9fb9309.smy-9fb9309.smy-9fb9309 a{color:rgba(255,248,238,.82)}
.e-con.smy-5deac34.smy-5deac34.smy-5deac34.smy-5deac34.smy-5deac34{display:flex; flex-direction:column; gap:9px; font-size:14px}
.smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1, .smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1.smy-c4ea8c1 > .elementor-widget-container{color:rgba(255,248,238,.72)}
.smy-3f56c07.smy-3f56c07.smy-3f56c07.smy-3f56c07.smy-3f56c07 a{color:#FFF8EE; border-bottom:1px solid rgba(255,248,238,.35); padding-bottom:2px}
.e-con.smy-2499cac.smy-2499cac.smy-2499cac.smy-2499cac.smy-2499cac{display:flex; flex-wrap:wrap; gap:14px; padding-top:6px}
.smy-920e64f.smy-920e64f.smy-920e64f.smy-920e64f.smy-920e64f .elementor-heading-title{color:var(--text-sur-encre-3,rgba(255,248,238,.62)); font-size:12px}
.e-con.smy-94c6576.smy-94c6576.smy-94c6576.smy-94c6576.smy-94c6576{display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:clamp(24px,3vw,48px); align-items:start}
.e-con.smy-176f52d.smy-176f52d.smy-176f52d.smy-176f52d.smy-176f52d{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; font-size:13px; color:var(--text-sur-encre-3,rgba(255,248,238,.62)); border-top:1px solid rgba(255,248,238,.12); padding-top:20px}
.e-con.smy-eab21fb.smy-eab21fb.smy-eab21fb.smy-eab21fb.smy-eab21fb{background:#16130F; color:#FFF8EE; padding:clamp(56px,8vh,96px) 48px clamp(28px,4vh,40px); display:flex; flex-direction:column; gap:clamp(36px,6vh,68px)}
.smy-078a4cc.smy-078a4cc.smy-078a4cc.smy-078a4cc.smy-078a4cc{width:100%; height:100%; aspect-ratio:4/5}
.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87 img{object-fit:cover; display:block; object-fit:cover}
.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87.smy-6e4cd87 > .elementor-widget-container{width:100%}
.e-con.smy-e910da3.smy-e910da3.smy-e910da3.smy-e910da3.smy-e910da3{grid-column:span 5; aspect-ratio:4/5; border-radius:4px; overflow:hidden; background:#EFE6D8}
.smy-06b5d95.smy-06b5d95.smy-06b5d95.smy-06b5d95.smy-06b5d95 .elementor-heading-title{font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:#6B655C}
.smy-f52f0f8.smy-f52f0f8.smy-f52f0f8.smy-f52f0f8.smy-f52f0f8 .elementor-heading-title{font-size:clamp(26px,3.2vw,48px); line-height:1.04; max-width:22ch}
.smy-25d07c6.smy-25d07c6.smy-25d07c6.smy-25d07c6.smy-25d07c6, .smy-25d07c6.smy-25d07c6.smy-25d07c6.smy-25d07c6.smy-25d07c6 > .elementor-widget-container{font-size:17px; line-height:1.6; color:#6B655C; max-width:48ch}
.smy-8692f62.smy-8692f62.smy-8692f62.smy-8692f62.smy-8692f62{align-self:flex-start}
.smy-d8fbd2a.smy-d8fbd2a.smy-d8fbd2a.smy-d8fbd2a.smy-d8fbd2a a{font-weight:600; font-size:16px; color:#16130F; border-bottom:1px solid rgba(22,19,15,.3); padding-bottom:3px}
.e-con.smy-3625d3e.smy-3625d3e.smy-3625d3e.smy-3625d3e.smy-3625d3e{grid-column:7 / span 6; display:flex; flex-direction:column; gap:22px}
.e-con.smy-019d7ba.smy-019d7ba.smy-019d7ba.smy-019d7ba.smy-019d7ba{background:#FFFFFF; display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(24px,3vw,56px); align-items:start; padding:clamp(72px,10vh,120px) 48px}
.smy-970ab70.smy-970ab70.smy-970ab70.smy-970ab70.smy-970ab70 .elementor-heading-title{font-size:clamp(26px,3vw,48px); line-height:1; max-width:24ch}
.smy-261012e.smy-261012e.smy-261012e.smy-261012e.smy-261012e .elementor-heading-title{font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:#6B655C}
.smy-f5c63d1.smy-f5c63d1.smy-f5c63d1.smy-f5c63d1.smy-f5c63d1 .elementor-heading-title{font-size:16px; line-height:1.5}
.e-con.smy-8f6ee8f.smy-8f6ee8f.smy-8f6ee8f.smy-8f6ee8f.smy-8f6ee8f{display:flex; flex-direction:column; gap:8px; background:#FFFFFF; border-radius:7px; padding:24px}
.e-con.smy-ec96ee9.smy-ec96ee9.smy-ec96ee9.smy-ec96ee9.smy-ec96ee9{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.e-con.smy-70c4017.smy-70c4017.smy-70c4017.smy-70c4017.smy-70c4017{background:#FFF8EE; display:flex; flex-direction:column; gap:28px; padding:clamp(64px,9vh,104px) 48px}
.smy-b709d6f.smy-b709d6f.smy-b709d6f.smy-b709d6f.smy-b709d6f{width:100%; height:100%; aspect-ratio:3/2}
.e-con.smy-64aebd0.smy-64aebd0.smy-64aebd0.smy-64aebd0.smy-64aebd0{grid-column:span 7; aspect-ratio:3/2; border-radius:4px; overflow:hidden; background:#E9DFD0}
.smy-2ad9f7d.smy-2ad9f7d.smy-2ad9f7d.smy-2ad9f7d.smy-2ad9f7d{width:100%; height:100%; aspect-ratio:3/4}
.e-con.smy-be19960.smy-be19960.smy-be19960.smy-be19960.smy-be19960{grid-column:span 5; aspect-ratio:3/4; border-radius:4px; overflow:hidden; background:#E9DFD0}
.e-con.smy-674c10f.smy-674c10f.smy-674c10f.smy-674c10f.smy-674c10f{background:#FFFFFF; display:grid; grid-template-columns:repeat(12,1fr); gap:18px; padding:clamp(56px,8vh,96px) 48px}
.smy-61a0a8c.smy-61a0a8c.smy-61a0a8c.smy-61a0a8c.smy-61a0a8c{grid-column:span 7}
.smy-a1f2be4.smy-a1f2be4.smy-a1f2be4.smy-a1f2be4.smy-a1f2be4 .elementor-heading-title{font-size:16px}
.e-con.smy-8fdea0a.smy-8fdea0a.smy-8fdea0a.smy-8fdea0a.smy-8fdea0a{display:flex; flex-direction:column; gap:8px}
.e-con.smy-a580cc6.smy-a580cc6.smy-a580cc6.smy-a580cc6.smy-a580cc6{display:flex; flex-direction:column; gap:8px; border-top:1px solid rgba(22,19,15,.14); padding-top:20px}
.e-con.smy-1fcddb5.smy-1fcddb5.smy-1fcddb5.smy-1fcddb5.smy-1fcddb5{grid-column:9 / span 4; display:flex; flex-direction:column; gap:22px; background:#FFF8EE; border-radius:7px; padding:28px}
.e-con.smy-9600fb2.smy-9600fb2.smy-9600fb2.smy-9600fb2.smy-9600fb2{background:#FFFFFF; display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(28px,4vw,64px); align-items:start; padding:clamp(72px,10vh,112px) 48px}
.smy-511e9e3.smy-511e9e3.smy-511e9e3.smy-511e9e3.smy-511e9e3{width:100%; height:100%; aspect-ratio:21/9}
.e-con.smy-6daf748.smy-6daf748.smy-6daf748.smy-6daf748.smy-6daf748{background:#E9DFD0; aspect-ratio:21/9; overflow:hidden}

/* --- 5. Les feuilles de la maquette, sélecteurs `data-*` traduits en classes.
       Elles gardent leur `!important` et viennent EN DERNIER : ce sont elles
       qui doivent gagner sur les classes générées plus haut. --- */

/* ---- responsive.css traduite ---- */
/* Points de rupture partagés par les six pages du lot 2.
   Seule exception aux styles en ligne : les trois formats 1440 / 1024 / 390. */

@media (max-width:1024.5px){
  .d-pad{padding-left:36px!important;padding-right:36px!important}
  .d-nav-links{display:none!important}
  /* le lien de la maquette pointait vers `Contact.dc.html` ; sur le site c'est le permalien */
  .d-nav-bar a[href="/contact/"],.d-nav-bar a[href="Contact.dc.html"]{display:none!important}
  .d-nav-bar{padding:9px 9px 9px 16px!important;gap:14px!important}
  .d-burger{display:flex!important}
  .d-two{grid-template-columns:1fr!important}
  .d-two > *:nth-child(n){grid-column:1/-1!important;grid-row:auto!important}
  .d-cards{grid-template-columns:1fr 1fr!important}
  .d-cards > *:nth-child(n){grid-column:auto!important}
  .d-mosaic{grid-template-columns:repeat(6,1fr)!important}
  .d-mosaic > *:nth-child(n){grid-column:span 3!important;grid-row:span 2!important}
  .d-mosaic > *:nth-child(1){grid-column:span 6!important;grid-row:span 3!important}
  .d-footer-cols{grid-template-columns:1fr 1fr!important}
  .d-hero{min-height:0!important;padding-top:120px!important;padding-bottom:clamp(40px,6vh,64px)!important;gap:20px!important}
  .d-side{flex-direction:column!important}
  .d-side > *{width:100%!important;flex:0 0 auto!important}
}

@media (max-width:767.5px){
  .d-pad{padding-left:20px!important;padding-right:20px!important}
  h1{font-size:28px!important;line-height:1.06!important}
  h2{font-size:24px!important;line-height:1.12!important}
  h3{font-size:17px!important;line-height:1.2!important}
  p{font-size:15px!important;line-height:1.55!important}
  h1,h2{max-width:100%!important;width:100%!important;min-width:0!important;overflow-wrap:break-word}
  .m-line{max-width:100%}
  .d-hero{padding-top:104px!important;padding-bottom:44px!important;min-height:0!important}
  .d-cards{grid-template-columns:1fr!important}
  .d-mosaic{grid-template-columns:1fr!important;grid-auto-rows:clamp(180px,52vw,300px)!important}
  .d-mosaic > *:nth-child(n){grid-column:span 1!important;grid-row:span 1!important}
  .d-footer-cols{grid-template-columns:1fr!important}
  .d-row{flex-direction:column!important;align-items:flex-start!important}
  section,footer,article,.m-reveal,.m-cascade{min-width:0!important}
}

/* ---- galerie.css traduite : PURGÉE le 31/08 (verdict débat, lot 1 / S-12, S-13) ----
   `.d-gal-tile`, `.d-gal-grid`, `.d-gal-cap`, `.d-gal-cursor`, `.d-gal-view` : 0 porteur
   dans le DOM des 8 pages (deux sondes indépendantes, FA + re-mesure Designer) et 0
   référence dans les JS. Le « dim .42 » au survol était du code mort ; la vraie galerie
   vit dans galerie.css (`.gal-pret`, `#samey-vue`), sans effet au survol (décision
   client du 31/08). */

/* ---- maquette.css traduite ---- */
/* ============================================================
   SAMEY — maquette.css
   Les styles de la maquette Claude Design du 19/08/2026, extraits tels quels des
   sept pages (bloc de base commun + les trois formats de l'Accueil), plus le peu
   qu'il a fallu écrire pour remplacer les composants React de Claude Design :
   menu mobile, filtres et visionneuse de la Galerie.
   Chargé UNIQUEMENT sur les pages portées (voir samey_enfant_maquette dans
   functions.php), à la place de style.css qui porte l'ancien design du 15/08.
   ============================================================ */

/* ---- 1. Base commune aux sept pages ---- */
html,body{margin:0;padding:0;background:#FFF8EE}
body{font-family:'Poppins','Helvetica Neue',sans-serif;color:#16130F;-webkit-font-smoothing:antialiased;font-size:17px;line-height:1.65;letter-spacing:-.005em}
*{box-sizing:border-box}
h1,h2,h3{font-family:'Poppins','Helvetica Neue',sans-serif;font-weight:700;margin:0;letter-spacing:-.03em;text-wrap:pretty}
a{color:#16130F;text-decoration:none}
a:hover{color:#16130F}

/* ---- 2. Les trois formats (bloc de l'Accueil, s'applique à toutes les pages) ---- */
/* Seule exception aux styles en ligne : les trois formats 1440 / 1024 / 390. */
@media (max-width:1024.5px){
  .d-svc-row{grid-template-columns:1fr!important;gap:22px!important}
  .d-svc-row .d-svc-photo,.d-svc-row .d-svc-text{grid-column:1/-1!important;grid-row:auto!important}
  .d-pad{padding-left:36px!important;padding-right:36px!important}
  .d-steps-wrap{flex-direction:column!important;gap:32px!important}
  .d-steps-wrap > *{flex:0 0 auto!important;width:100%!important}
  .d-steps-wrap > *:nth-child(2){display:none!important}
  .d-footer-cols{grid-template-columns:1fr 1fr!important}
  .d-photog{grid-template-columns:repeat(6,1fr)!important;align-items:start!important}
  .d-photog > *:nth-child(1){grid-column:span 3!important}
  .d-photog > *:nth-child(2){grid-column:span 6!important;order:3}
  .d-photog > *:nth-child(3){grid-column:span 3!important}
  .d-mosaic{grid-template-columns:repeat(6,1fr)!important}
  .d-mosaic > *{grid-column:span 3!important;grid-row:span 2!important}
  .d-mosaic > *:nth-child(1){grid-column:span 6!important;grid-row:span 3!important}
  .d-nav-links{display:none!important}
  /* le lien de la maquette pointait vers `Contact.dc.html` ; sur le site c'est le permalien */
  .d-nav-bar a[href="/contact/"],.d-nav-bar a[href="Contact.dc.html"]{display:none!important}
  .d-nav-bar{padding:9px 9px 9px 16px!important;gap:14px!important}
  .d-burger{display:flex!important}
  /* 31/08 (verdict, lot 1) : d-panel/d-panel-inner/d-curtain purgés, 0 porteur DOM sur les 8 pages */
}
@media (max-width:767.5px){
  .d-pad{padding-left:20px!important;padding-right:20px!important}
  h1,h2{max-width:100%!important;width:100%!important;min-width:0!important;overflow-wrap:break-word}
  .m-line{max-width:100%}
  .d-hero-copy{padding:96px 20px 24px!important}
  .d-hero-copy h1{font-size:28px!important;line-height:1.06!important}
  h2{font-size:24px!important;line-height:1.12!important}
  h3{font-size:17px!important;line-height:1.2!important}
  p{font-size:15px!important;line-height:1.55!important}
  .d-hero-copy p,.d-hero-copy span{max-width:100%!important}
  .d-scene-hero .m-stage{overflow:hidden!important}
  .d-arc-band{overflow:hidden!important}
  .m-reveal,.m-cascade,section,footer,article{min-width:0!important}
  .d-footer-cols{grid-template-columns:1fr!important}
  .d-photog{grid-template-columns:1fr!important}
  .d-photog > *:nth-child(n){grid-column:span 1!important;grid-row:auto!important;order:0}
  .d-photog > *:nth-child(3){display:none!important}
  .d-mosaic{grid-template-columns:1fr!important;grid-auto-rows:clamp(180px,52vw,300px)!important}
  .d-mosaic > *:nth-child(n){grid-column:span 1!important;grid-row:span 1!important}
  .d-scene-columns .m-stage{flex-wrap:wrap!important;align-items:flex-start!important;gap:16px!important;padding:0 20px 56px!important}
  .d-scene-columns .m-stage > div:first-child{position:static!important;flex:1 1 100%!important;padding:56px 0 20px!important;background:none!important;align-items:flex-start!important;text-align:left!important}
  .d-scene-columns .m-stage > div:first-child h2,.m-reveal h2,.d-words,.d-footer h2{font-size:26px!important}
  .d-scene-columns .m-stage{flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch!important;gap:14px!important;padding:0 20px 56px!important}
  .d-scene-columns .d-col{width:100%!important;flex:0 0 auto!important;gap:14px!important}
  .d-scene-columns .m-stage > .d-col:nth-child(3),.d-scene-columns .m-stage > .d-col:nth-child(5){display:none!important}
  .d-stack-mobile{padding-top:64px!important;padding-bottom:64px!important}
  .d-strip-rows{overflow-x:hidden!important}
  .d-scene-strip:not(.is-scrubbed) .d-strip-copy ~ .d-strip-copy{display:none!important}
  .d-strip-rows > *{width:max-content!important}
}

/* ---- 3. Menu mobile (remplace le composant React `sc-if navOpen`) ----
   Le `display` du panneau vit ICI et pas en ligne : posé en ligne, il battait l'attribut
   `hidden` et le menu s'ouvrait par-dessus la page partout où cette feuille n'est pas
   chargée — dans l'éditeur Elementor, on ne voyait plus que lui (19/08). */
/* Fermé par défaut, ouvert par la classe : après conversion en conteneur Elementor,
   l'attribut `hidden` du panneau n'existe plus (Elementor ne rend que id et classes). */
#samey-menu-mobile{display:none}
#samey-menu-mobile.is-ouvert{display:flex}
#samey-menu-mobile[hidden]{display:none}
#samey-menu-mobile a{color:#FFF8EE}
/* 31/08 : le bouton du menu garde son encre sur fond blanc (la règle #id ci-dessus le rendait blanc sur blanc) */
#samey-menu-mobile a.elementor-button{color:#16130F}
body.samey-menu-ouvert{overflow:hidden}

/* ---- 4. Galerie : filtres, tuiles, visionneuse (remplacent les gabarits React) ----
   31/08 (verdict, lot 1 / S-12) : le survol -2px des 56 .samey-gal-tuile violait la
   décision client « aucun effet sur les photos » — supprimé avec sa transition. */
.samey-gal-tuile[hidden]{display:none!important}
.d-filtre{cursor:pointer;transition:background 180ms,color 180ms}
.d-filtre[aria-pressed="true"]{background:#16130F!important;color:#FFF8EE!important;
  border-color:#16130F!important}
/* 31/08 (verdict, lot 1) : doublon #samey-visionneuse purgé — 0 porteur DOM, 0 référence JS
   (la visionneuse réelle est #samey-vue, galerie.css) ; son button:hover était sans porteur. */

/* ---- 5. Elementor : le conteneur ne doit rien ajouter au markup de la maquette ---- */
.samey-maquette-bloc,.samey-maquette-bloc > .e-con-inner{padding:0!important;margin:0!important;
  max-width:none!important;width:100%!important}
.samey-maquette-bloc .elementor-widget-html,
.samey-maquette-bloc .elementor-widget-container{width:100%}

/* ---- 6. Ce qu'Astra ajoute et que la maquette n'a pas demandé ----
   Le bouton « retour en haut » d'Astra sort en bleu par-dessus la maquette (vu à
   l'écran le 19/08 sur la Galerie). La maquette n'a pas de bouton de ce genre. */
.ast-scroll-top,#ast-scroll-top{display:none!important}

/* ---- 7. Mobile : deux colonnes plutôt qu'un mur (décision 13 du 19/08) ----
   La grille de la Galerie tombait à une colonne sous 768 : 15 tuiles de 438 px, soit
   6 500 px de défilement pour voir quinze photos. Deux colonnes coupent le mur en deux
   et gardent la légende lisible. Même geste sur la mosaïque « Un aperçu, sans ordre ». */
@media (max-width:767.5px){
  .d-gal-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .d-gal-grid .d-gal-cap{padding:10px!important;font-size:11px!important}
  .d-mosaic{grid-template-columns:1fr 1fr!important;
    grid-auto-rows:clamp(120px,34vw,200px)!important;gap:10px!important}
}

/* ---- 8. Les sections NON ANIMÉES se bornent sur grand écran (Ronaldo, 19/08) ----
   « if a section isnt animated reduce its width ». La maquette est dessinée pour 1440,
   soit 1344 px de contenu utile entre ses marges de 48. À 1920, ces mêmes sections
   étalaient leur texte sur 1824 px : des lignes trop longues et des grilles distendues.

   Ce qui se borne : le CONTENU (`.d-pad`, le conteneur de contenu de la maquette),
   pas la section. Les aplats encre, crème et corail vont toujours bord à bord : c'est
   ce qui donne au site sa suite de blocs pleine largeur.

   Ce qui ne se borne PAS : les blocs `.m-bloc-anime`, c'est-à-dire les cinq scènes
   scrubbées. Elles ont besoin du plein cadre — la bande traverse l'écran, les colonnes
   montent sur toute la largeur, l'arc du héros s'écarte vers les bords.

   `max()` : en dessous de 1440 px de fenêtre, la marge reste celle de la maquette (48),
   la règle ne fait donc rien sur les formats déjà dessinés. */
@media (min-width:1025px){
  .m-bloc-statique .d-pad{
    padding-left:max(48px,calc((100% - 1344px) / 2))!important;
    padding-right:max(48px,calc((100% - 1344px) / 2))!important;
  }
}

/* ---- 9. Les titres des scènes se bornent aussi (Ronaldo, 19/08) ----
   Les scènes gardent le plein cadre pour leurs photographies, mais leur TITRE, lui, n'a
   pas à traverser 1 900 px : à 1920, le h1 du héros faisait 1 809 px de long et « lieu »
   restait seul sur sa troisième ligne. Mesuré avant : héros 1 809, colonnes 1 809 ; les
   trois autres titres de scène (bande 1 330, mots 1 240, déroulé 456) étaient déjà bornés
   par la maquette, on n'y touche pas.

   Ciblage par scène plutôt que sur `.m-bloc-anime h1,h2` : ces deux titres-là sont les
   seuls centrés, et `margin-inline:auto` aurait recentré les trois autres, qui sont
   alignés à gauche par le dessin. */
@media (min-width:1025px){
  .d-scene-hero h1,
  .d-scene-columns h2{
    max-width:min(100%,1344px)!important;
    margin-inline:auto!important;
  }
  /* Le corps suit la largeur, sinon le titre déborde de son propre cadre : en Poppins 800,
     « Photographier » mesure 10,92 fois la taille de police, soit 1 441 px à 132 — plus
     large que les 1 344 du cadre. Ronaldo a demandé plus petit encore (« reduit la
     taille ») : 96 px au héros, 88 aux colonnes, contre 132 et 110 dans la maquette.
     Le mot le plus long tombe à 1 048 px, le titre respire et tient en trois lignes. */
  .d-scene-hero h1{font-size:clamp(38px,5.6vw,96px)!important}
  .d-scene-columns h2{font-size:clamp(32px,5.1vw,88px)!important}
}

/* ---- 10. Responsive complété (Ronaldo, 19/08 : « toutes les pages sont pas responsive ») ----
   La maquette n'a écrit un vrai jeu de règles que pour l'Accueil ; les six autres pages
   s'appuient sur `responsive.css`, dont les paliers sont rigides et laissent des
   ORPHELINES : à 768, les trois cartes des pages métier passaient en deux colonnes (la
   troisième seule sur sa ligne), et le pied à quatre entrées faisait de même.

   Une grille se règle bien quand son nombre de colonnes DIVISE son nombre d'éléments.
   `auto-fit` seul ne le sait pas ; `:has(> :nth-child(4))` le sait, et distingue les
   deux cas réels du site : trois cartes (pages métier) et quatre (À propos, pied). */
@media (max-width:1024.5px){
  /* trois cartes : trois colonnes tant qu'elles tiennent (200 px + gouttière de 24), puis
     l'auto-fit passe à deux vers 640 et à une vers 460, sans palier à écrire. */
  .d-cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))!important}
  .d-cards > *{grid-column:auto!important}
  /* quatre cartes : deux colonnes, jamais trois — sinon la quatrième reste seule. */
  .d-cards:has(> :nth-child(4)){grid-template-columns:repeat(2,1fr)!important}
  .d-footer-cols{grid-template-columns:repeat(2,1fr)!important;gap:28px 24px!important}
}
@media (max-width:519.5px){
  .d-cards,.d-cards:has(> :nth-child(4)),
  .d-footer-cols{grid-template-columns:1fr!important}
}

/* ---- 11. Rendu dans l'éditeur Elementor ----
   L'éditeur ne charge ni `motion.css` ni `scenes.css` (blocs à `opacity:0` et sections
   épinglées de 280vh n'y ont pas de sens). Or c'est là que vivait `display:flex` sur les
   scènes : sans lui, leurs colonnes s'empilaient sur toute la largeur et une scène tenait
   dix écrans. Cette seule déclaration, sans position ni hauteur, suffit à les remettre
   côte à côte ; sur le front elle ne change rien, `motion.css` décide après. */
.m-stage{display:flex}


/* --- Aplat d'accent passe du corail au blanc (20/08) ------------------------------
   Ce conteneur portait un aplat corail et du texte creme #FFF8EE. L'aplat devenu
   blanc, le texte tombait a 1,05:1 (mesure au navigateur). Sur un aplat clair il
   repasse a l'encre. Place ici et non dans style.css : sur les pages Canvas, la
   feuille du theme enfant n'est pas servie. */
.e-con.smy-20c5f62.smy-20c5f62.smy-20c5f62.smy-20c5f62.smy-20c5f62.smy-20c5f62 * { color: #16130F; }


/* --- Deux boutons rattrapes apres le passage du corail au blanc (20/08) -----------
   .smy-f63dd62 seulement : le bouton du menu plein ecran allait bien (son panneau
   est display:none au repos, fond encre a l'ouverture ; c'etait un faux positif de
   mon audit, qui ne filtrait pas les ancetres caches).
   .smy-f63dd62 : aplat encre, texte encre -> 1:1, bouton invisible. Passe au creme.
   Les deux mesures viennent du navigateur, pas de la lecture du CSS. */
.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62 .elementor-button,
.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62.smy-f63dd62 .elementor-button * { color: #FFF8EE; }
/* Voir pages-a.css : le lien Enfants partage le widget de Galerie, on les remet en ligne. */
.d-nav-links .smy-3c20611 > div {
	display: flex;
	align-items: center;
	gap: 30px;
	white-space: nowrap;
}