/* Cave Saint Etienne · Page La cave & l'équipe (compositions patterns/cave-*.php).
   Complète cse-degustations.css (fil d'Ariane .crumbs, en-tête .p-head, barre .barre-mob) et
   cse-accueil.css (.plus, .sec-head). Variables --cse-… uniquement : aucune valeur de token modifiée.
   Reprise de maquettes/la-cave-equipe.html ; les dl de la maquette sont des Groupes et des Paragraphes. */

.visually-hidden{position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}
.cse-link-arrow{display:inline-flex; align-items:center; min-height:var(--cse-tap-min); justify-self:start; align-self:start}
.cse-link-arrow::after{white-space:pre}
.cse-link-arrow[rel~="external"]::after{content:" \2197"; content:" \2197" / ""}
.cse-btn[rel~="external"]::after{content:"\2197"; content:"\2197" / ""; margin-left:.35em}
a[href^="tel:"]{white-space:nowrap}

/* Aucune marge automatique de WordPress hors .cse-section / .plus : les marges viennent d'ici. */
:is(.boutique, .barre-mob) :where(.is-layout-flow, .wp-block-group) > *,
:is(.boutique, .barre-mob) > *{margin-block:0}
.boutique figure, .boutique p{margin:0}
.cse-section :is(h2, h3, p){margin-block:0}

/* ---- Têtes de section ---- */
.sec-head{display:grid; gap:10px; margin-bottom:clamp(28px, 3.5vw, 48px)}
.sec-head h2{margin:0}
.sec-head__intro{max-width:56ch}

/* ---- La cave en bref (carte de l'en-tête) ---- */
.bref{position:relative; display:grid; gap:16px; padding:26px 28px 24px; border-radius:var(--cse-radius-m); background:var(--cse-blanc); border:1px solid rgba(42,27,23,.1); box-shadow:var(--cse-shadow-card); overflow:hidden}
.bref .bref__band{position:absolute; inset:0 0 auto; height:6px!important; background:linear-gradient(90deg, var(--cse-robe-pourpre) 0 20%, var(--cse-robe-grenat) 20% 40%, var(--cse-robe-tuile) 40% 60%, var(--cse-robe-ambre) 60% 80%, var(--cse-robe-or) 80% 100%)}
.bref .ident__t{padding-top:6px}
.bref__list{display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--cse-line)}
.bref__row{display:grid; gap:2px; padding:12px 0; border-bottom:1px solid var(--cse-line); min-width:0}
.bref__row:nth-child(odd){padding-right:12px; border-right:1px solid var(--cse-line)}
.bref__row:nth-child(even){padding-left:16px}
.bref .bref__row.bref__large{grid-column:1 / -1; padding-inline:0; border-right:0}
.bref__dt{font:500 var(--cse-fs-label)/1.4 var(--cse-font-etiq); letter-spacing:.1em; text-transform:uppercase; color:var(--cse-text-muted)}
.bref__dd{font:400 1.125rem/1.25 var(--cse-font-titre); font-variant-numeric:lining-nums}
@media (max-width: 420px){ .bref{padding:22px 18px 20px} .bref__row:nth-child(even){padding-left:12px} .bref__dd{font-size:1rem} }

/* ---- La boutique en images ---- */
.boutique{padding-bottom:clamp(8px, 2vw, 16px)}
.mosaic{display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); grid-template-rows:repeat(2, clamp(150px, 15vw, 220px)); gap:12px}
.mosaic figure{position:relative; margin:0; overflow:hidden; border-radius:var(--cse-radius-m); background:var(--cse-lin); min-width:0}
.mosaic img{width:100%; height:100%; object-fit:cover; display:block}
.mosaic figcaption{position:absolute; left:10px; bottom:10px; max-width:calc(100% - 20px); margin:0; padding:5px 9px; border-radius:var(--cse-radius-s); background:color-mix(in srgb, var(--cse-brun) 82%, transparent); color:var(--cse-creme); font:500 var(--cse-fs-label)/1.3 var(--cse-font-etiq); letter-spacing:.1em; text-transform:uppercase}
.mosaic .mosaic__a{grid-column:1 / span 5; grid-row:1 / span 2}
.mosaic .mosaic__b{grid-column:6 / span 4; grid-row:1}
.mosaic .mosaic__c{grid-column:10 / span 3; grid-row:1}
.mosaic .mosaic__d{grid-column:6 / span 3; grid-row:2}
.mosaic .mosaic__e{grid-column:9 / span 4; grid-row:2}
@media (max-width: 760px){
  .mosaic{grid-template-columns:repeat(2, minmax(0,1fr)); grid-template-rows:none; grid-auto-rows:clamp(130px, 38vw, 200px); gap:8px}
  .mosaic figure{grid-column:auto!important; grid-row:auto!important}
  .mosaic .mosaic__a{grid-column:1 / -1!important; grid-row:span 2!important}
  .mosaic figcaption{left:8px; bottom:8px; max-width:calc(100% - 16px)}
}

/* ---- L'équipe ---- */
.equipe{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:clamp(20px, 3vw, 36px)}
.pers{display:grid; grid-template-rows:auto 1fr; background:var(--cse-blanc); border:1px solid rgba(42,27,23,.1); border-radius:var(--cse-radius-m); overflow:hidden; min-width:0}
.pers__photo{position:relative; aspect-ratio:3 / 2; display:grid; place-items:center; background:repeating-linear-gradient(135deg, var(--cse-lin) 0 12px, var(--cse-papier) 12px 24px)}
.pers__init{font:300 clamp(4rem, 3rem + 4vw, 6.5rem)/1 var(--cse-font-titre); font-style:italic; color:color-mix(in srgb, var(--cse-bordeaux) 30%, transparent); letter-spacing:-.02em}
.pers__txt{display:grid; gap:14px; align-content:start; padding:clamp(22px, 3vw, 32px)}
.pers h3{font:300 var(--cse-fs-h2)/1.05 var(--cse-font-titre); letter-spacing:var(--cse-ls-titre)}
.pers__txt > p:not(.pers__role){color:var(--cse-text-muted); max-width:var(--cse-measure)}
.pers__fut{display:grid; gap:10px; justify-items:start; padding-top:14px; border-top:1px solid var(--cse-line)}
.pers__fut p{font:400 1.125rem/1.3 var(--cse-font-titre)}
.pers__fut em{color:var(--cse-accent)}
.pers .pers__avis{display:grid; gap:8px; margin:6px 0 0; padding:0 0 0 18px; border:0; border-left:2px solid var(--cse-bordeaux)}
.pers__avis p{font:italic 300 1.3125rem/1.35 var(--cse-font-titre)}
.pers__avis cite, .presse__quote cite{font:500 var(--cse-fs-label)/1.4 var(--cse-font-etiq); font-style:normal; letter-spacing:.1em; text-transform:uppercase; color:var(--cse-text-muted)}
@media (max-width: 860px){ .equipe{grid-template-columns:minmax(0,1fr)} .pers__photo{aspect-ratio:16 / 10} }

/* Le samedi, la cave s'agrandit */
.renforts{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:20px clamp(32px, 5vw, 72px); margin-top:clamp(40px, 5vw, 64px); padding-top:clamp(28px, 3vw, 40px); border-top:1px solid var(--cse-line)}
.renforts__txt{display:grid; gap:14px; align-content:start; justify-items:start}
.renforts__txt h3{font:300 var(--cse-fs-h3)/1.15 var(--cse-font-titre)}
.renforts__txt h3 em{color:var(--cse-accent)}
.renforts__txt p{color:var(--cse-text-muted)}
.invites{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; align-content:start}
.invites > li{display:grid; gap:6px; align-content:start; padding:18px; border-radius:var(--cse-radius-m); background:var(--cse-lin); min-width:0}
.invites__nom{font:400 1.1875rem/1.2 var(--cse-font-titre)}
.invites__sub{font-size:.875rem; color:var(--cse-text-muted)}
.renforts__pro{grid-column:2; font-size:.9375rem; color:var(--cse-text-muted)}
.renforts__pro a{color:var(--cse-accent)}
@media (max-width: 960px){ .renforts{grid-template-columns:minmax(0,1fr)} .renforts__pro{grid-column:auto} }
@media (max-width: 600px){ .invites{grid-template-columns:minmax(0,1fr)} }

/* ---- Le parcours de Gilles (frise, repliée dans le bloc Détails) ---- */
.pers__parcours{border-top:1px solid var(--cse-line)}
.pers__parcours summary{position:relative; display:flex; align-items:center; min-height:var(--cse-tap-min); padding:14px 44px 14px 0; cursor:pointer; list-style:none; font:400 1.125rem/1.3 var(--cse-font-titre)}
.pers__parcours summary::-webkit-details-marker{display:none}
.pers__parcours summary em{color:var(--cse-accent)}
.pers__parcours summary::after{content:"+"; position:absolute; right:0; top:50%; translate:0 -50%; width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--cse-btn-outline); border-radius:50%; font:300 1.25rem/1 var(--cse-font-texte); color:var(--cse-bordeaux)}
.pers__parcours[open] summary::after{content:"\2013"}
.pers__parcours-in{display:grid; gap:16px; padding:6px 0 18px}
.frise{position:relative; display:grid; gap:0}
.frise > li{position:relative; display:grid; grid-template-columns:minmax(0,1fr); row-gap:4px; padding:0 0 20px 28px}
.frise > li:last-child{padding-bottom:0}
.frise > li::before{content:""; position:absolute; left:0; top:8px; width:11px; height:11px; border-radius:50%; background:var(--cse-papier); border:1.5px solid var(--cse-bordeaux)}
.frise > li::after{content:""; position:absolute; left:5px; top:22px; bottom:0; width:1px; background:var(--cse-line)}
.frise > li:last-child::after{display:none}
.frise > li.frise__now::before{background:var(--cse-bordeaux)}
.frise__y{font:300 1.375rem/1.1 var(--cse-font-titre); color:var(--cse-bordeaux); font-variant-numeric:lining-nums; letter-spacing:-.01em}
.frise__t{font:400 1.25rem/1.25 var(--cse-font-titre)}
.frise__d{font-size:.9375rem; color:var(--cse-text-muted)}
.pers__source{font-size:.875rem; color:var(--cse-text-muted)}

/* ---- En rayon ---- */
.rayon{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(32px, 5vw, 72px); align-items:center}
.rayon .rayon__photo img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:var(--cse-radius-m); display:block}
.rayon__txt h2{margin:12px 0 22px}
.rayons{border-top:1px solid var(--cse-line)}
.rayons > li{display:grid; grid-template-columns:14px minmax(0,1fr); gap:16px; align-items:start; padding:15px 0; border-bottom:1px solid var(--cse-line)}
.rayons .rayons__sq{width:14px; height:14px!important; margin-top:6px; background:var(--cse-robe-grenat)}
.rayons .rayons__sq--or{background:var(--cse-robe-or)}
.rayons .rayons__sq--ambre{background:var(--cse-robe-ambre)}
.rayons .rayons__sq--tuile{background:var(--cse-robe-tuile)}
.rayons .rayons__sq--vide{background:none; border:1.5px solid var(--cse-bois)}
.rayons__txt{display:grid; gap:3px; min-width:0}
.rayons__nom{font:400 1.25rem/1.2 var(--cse-font-titre)}
.rayons__desc{font-size:.9375rem; color:var(--cse-text-muted)}
.rayons__desc a{color:var(--cse-accent); white-space:nowrap}
@media (max-width: 860px){ .rayon{grid-template-columns:minmax(0,1fr)} .rayon .rayon__photo{max-width:420px} .rayon .rayon__photo img{aspect-ratio:16 / 10} }

/* ---- Ils parlent de la cave ---- */
.presse{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)) minmax(0,.8fr); gap:16px}
.presse__item{display:grid; gap:12px; align-content:start; justify-items:start; padding:24px; border-radius:var(--cse-radius-m); background:var(--cse-blanc); border:1px solid rgba(42,27,23,.1); min-width:0}
.presse__item .presse__quote{margin:0; padding:0; border:0; display:grid; gap:12px}
.presse__quote p{font:italic 300 1.375rem/1.3 var(--cse-font-titre)}
.presse__quote cite{text-transform:none; letter-spacing:0; font:400 .875rem/1.5 var(--cse-font-texte); color:var(--cse-text-muted)}
.presse__item .cse-label{color:var(--cse-bordeaux)}
.presse__note{display:grid; gap:6px; align-content:start; justify-items:start; padding:24px}
.presse__score{display:flex; align-items:baseline; gap:2px; font:300 4rem/.9 var(--cse-font-titre); color:var(--cse-bordeaux); font-variant-numeric:lining-nums}
.presse__score small{font-size:1.5rem; color:var(--cse-text-muted)}
@media (max-width: 1060px){ .presse{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width: 600px){ .presse{grid-template-columns:minmax(0,1fr)} .presse__item{padding:20px} .presse__note{padding:8px 0 0} }

/* ---- Venir à la cave (section sombre) ---- */
.cvenir{color-scheme:dark}
.cvenir__grid{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(32px, 5vw, 72px); align-items:start}
.cvenir__txt{display:grid; gap:20px; justify-items:start}
.cvenir__txt h2{margin:0}
.cvenir__txt .cse-eyebrow{margin-bottom:-8px}
.cvenir .cse-lead{color:var(--cse-text-muted); max-width:52ch}
.cvenir__adr{display:grid; gap:4px; padding-left:18px; border-left:2px solid var(--cse-ambre)}
.cvenir__rue{font:300 1.75rem/1.15 var(--cse-font-titre)}
.cvenir__rue b{font-weight:inherit}
.cvenir__ville{font-size:.9375rem; color:var(--cse-text-muted)}
.cvenir__ctas{display:flex; flex-wrap:wrap; gap:12px}
.cvenir .horaires{display:grid; gap:12px; padding:clamp(20px, 3vw, 28px); border-radius:var(--cse-radius-m); background:var(--cse-brun-2); min-width:0}
.cvenir .horaires__list{border-top:1px solid var(--cse-line)}
.cvenir .horaires__row{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:12px 0; border-bottom:1px solid var(--cse-line)}
.cvenir .horaires__dt{font-size:.9375rem}
.cvenir .horaires__dd{text-align:right; font-variant-numeric:tabular-nums lining-nums; font-size:.9375rem}
.cvenir .horaires__dd span{display:block; margin-top:4px; font:500 var(--cse-fs-label)/1.3 var(--cse-font-etiq); letter-spacing:.1em; text-transform:uppercase; color:var(--cse-ambre)}
.cvenir .horaires .is-sam .horaires__dt{font-weight:600}
.cvenir .horaires__note{font-size:.8125rem; color:var(--cse-text-muted)}
@media (max-width: 860px){ .cvenir__grid{grid-template-columns:minmax(0,1fr)} }
@media (max-width: 420px){ .cvenir__ctas .cse-btn{flex:1 1 auto} }

/* ---- Bandeau de réassurance à trois cases ---- */
.plus--3 .plus__list{grid-template-columns:repeat(3, minmax(0,1fr))}
.plus__item--fut{--plus-icone:url(../icons/fut.svg)}
@media (max-width: 760px){ .plus--3 .plus__list{grid-template-columns:minmax(0,1fr)} }

/* ---- Barre d'action mobile (position et animation : .barre-mob de cse-degustations.css) ---- */
.barre-mob .barre-mob__txt{flex:1; min-width:0; margin:0; font:500 var(--cse-fs-label)/1.35 var(--cse-font-etiq); letter-spacing:.08em; text-transform:uppercase; color:var(--cse-text-muted)}
.barre-mob .barre-mob__txt b{display:block; font:400 1rem/1.2 var(--cse-font-titre); letter-spacing:0; text-transform:none; color:var(--cse-text)}
.barre-mob .barre-mob__btn{flex:none; margin:0}