/* ==========================================================================
   Welhom & MIRA — v2
   Système unique : moutarde franc, crème, noir d'encre.
   Un seul niveau de déclaration : pas de couches d'overrides successives.
   ========================================================================== */

:root{
  /* Couleurs */
  --moutarde:#e0a615;
  /* Assombri pour rester lisible en petit texte sur crème et blanc (≥4.5:1). */
  --moutarde-fonce:#8a6305;
  --moutarde-pale:#f6e3b0;
  --creme:#fbf6ec;
  --creme-profond:#f4ecdc;
  --encre:#1c1917;
  --encre-doux:#4a443d;
  --muted:#7a7268;
  --ligne:#e4dbc9;
  --blanc:#fff;

  /* Rayons */
  --r-xl:28px;
  --r-l:18px;
  --r-m:12px;
  --r-s:8px;

  /* Rythme */
  --section:clamp(72px,9vw,128px);
  --gutter:clamp(20px,5vw,48px);
}

*{box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:104px}

body{
  margin:0;
  background:var(--creme);
  color:var(--encre);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font:inherit;color:inherit}
[hidden]{display:none!important}

:is(a,button,summary,[tabindex]):focus-visible{
  outline:2.5px solid var(--encre);
  outline-offset:3px;
  border-radius:3px;
}

.wrap{width:min(1280px,100% - var(--gutter)*2);margin-inline:auto}
.section{padding-block:var(--section)}

.skip{
  position:fixed;top:10px;left:10px;z-index:200;
  background:var(--encre);color:var(--blanc);
  padding:12px 20px;border-radius:var(--r-s);
  transform:translateY(-200%);
}
.skip:focus{transform:none}

/* --- Typographie ------------------------------------------------------- */

h1,h2,h3,h4{margin:0;font-weight:500;letter-spacing:-.03em;line-height:1.1}

.display{
  font-family:'Fraunces','Georgia',serif;
  font-weight:400;
  font-variation-settings:'SOFT' 40,'WONK' 1;
  letter-spacing:-.025em;
  line-height:1.03;
}

.t-hero{font-size:clamp(42px,5.6vw,78px)}
.t-section{font-size:clamp(32px,4vw,56px)}
.t-card{font-size:clamp(23px,2.2vw,30px)}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--moutarde-fonce);
}
.eyebrow::before{
  content:'';width:22px;height:1.5px;background:currentColor;flex-shrink:0;
}
.eyebrow.plain::before{display:none}

.copy{font-size:16px;line-height:1.75;color:var(--encre-doux);max-width:62ch}
.copy.lead{font-size:clamp(17px,1.6vw,20px);line-height:1.65}
.copy.small{font-size:14px}

.ital{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400}

/* --- Boutons ----------------------------------------------------------- */

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:54px;padding:15px 30px;
  font-size:14px;font-weight:500;letter-spacing:.01em;
  border:1.5px solid transparent;border-radius:100px;
  transition:background .2s,color .2s,border-color .2s,transform .2s;
}
.btn:hover{transform:translateY(-2px)}
.btn svg{width:17px;height:17px;flex-shrink:0}

.btn-dark{background:var(--encre);color:var(--creme)}
.btn-dark:hover{background:#37312b}

.btn-mustard{background:var(--moutarde);color:var(--encre)}
.btn-mustard:hover{background:#efb92f}

.btn-outline{border-color:var(--encre);color:var(--encre)}
.btn-outline:hover{background:var(--encre);color:var(--creme)}

.btn-ghost-light{border-color:#1c191733;color:var(--encre)}
.btn-ghost-light:hover{border-color:var(--encre)}

.link-ar{
  display:inline-flex;align-items:center;gap:10px;
  font-size:14px;font-weight:500;
  padding-bottom:5px;
  border-bottom:1.5px solid var(--moutarde);
  transition:gap .2s;
}
.link-ar:hover{gap:17px}
.link-ar svg{width:15px;height:15px}

/* --- En-tête ----------------------------------------------------------- */

.site-header{
  position:sticky;top:0;z-index:90;
  background:#fbf6ecf2;
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--ligne);
}
.header-inner{
  height:88px;
  display:flex;align-items:center;justify-content:space-between;gap:28px;
}
.brand{display:flex;align-items:center;gap:13px;flex-shrink:0}
.brand-mark{
  width:52px;height:52px;border-radius:50%;
  background:var(--encre);
  overflow:hidden;flex-shrink:0;
  display:grid;place-items:center;
}
.brand-mark img{width:100%;height:100%;object-fit:cover}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-name{
  font-family:'Fraunces',Georgia,serif;
  font-size:21px;letter-spacing:.14em;font-weight:500;
}
.brand-tag{font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--muted)}

.header-nav{display:flex;align-items:center;gap:30px}
.header-nav>a{
  font-size:14px;color:var(--encre-doux);
  padding-block:6px;position:relative;
  transition:color .2s;
}
.header-nav>a::after{
  content:'';position:absolute;left:0;right:100%;bottom:0;
  height:1.5px;background:var(--moutarde);
  transition:right .25s;
}
.header-nav>a:hover,.header-nav>a[aria-current]{color:var(--encre)}
.header-nav>a:hover::after,.header-nav>a[aria-current]::after{right:0}

/* Sélecteur aligné sur .header-nav>a, sinon la couleur du lien l'emporte. */
.header-nav>a.header-cta{
  padding:12px 22px;min-height:46px;font-size:13.5px;
  background:var(--encre);color:var(--creme);
  border-radius:100px;display:inline-flex;align-items:center;
  transition:background .2s;
}
.header-nav>a.header-cta:hover{background:#37312b;color:var(--creme)}
.header-nav>a.header-cta::after{display:none}

.menu-toggle{
  display:none;
  width:46px;height:46px;
  background:none;border:1.5px solid var(--ligne);border-radius:50%;
}
.menu-toggle span{
  display:block;width:17px;height:1.5px;background:var(--encre);
  margin:4.5px auto;transition:transform .2s;
}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}

.menu-backdrop{position:fixed;inset:0;background:#1c191799;z-index:80}
.mobile-nav{
  position:fixed;top:96px;left:16px;right:16px;z-index:95;
  background:var(--creme);
  border:1px solid var(--ligne);border-radius:var(--r-l);
  box-shadow:0 24px 60px #1c191726;
  padding:10px 24px;
  max-height:calc(100dvh - 120px);overflow:auto;
}
.mobile-nav a{
  display:block;padding:17px 0;font-size:16px;
  border-bottom:1px solid var(--ligne);
}
.mobile-nav a:last-child{border-bottom:0}
.scroll-locked{overflow:hidden}

/* --- Hero accueil ------------------------------------------------------ */

.hero{
  background:var(--moutarde);
  position:relative;overflow:hidden;
  padding-block:clamp(56px,7vw,92px) 0;
}
.hero-grid{
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(32px,4vw,64px);align-items:end;
}
.hero-copy{padding-bottom:clamp(48px,6vw,86px)}
.hero .eyebrow{color:#553d03}
.hero h1{margin-block:22px 26px;color:var(--encre)}
.hero .copy{color:#44381c;max-width:46ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:38px}

.hero-photo{
  position:relative;
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  overflow:hidden;
  aspect-ratio:1/1.12;
}
.hero-photo img{width:100%;height:100%;object-fit:cover}

.hero-strip{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px;
  border-top:1.5px solid #1c191726;
  padding-block:22px;
  font-size:13px;color:#4e4120;
}
.hero-strip b{font-weight:500}
.hero-strip .dot{width:5px;height:5px;border-radius:50%;background:#1c191759}

/* --- Univers ----------------------------------------------------------- */

.universe-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.4vw,34px);
  margin-top:56px;
}
.universe-card{
  display:flex;flex-direction:column;
  background:var(--blanc);
  border:1px solid var(--ligne);border-radius:var(--r-l);
  overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.universe-card:hover{
  transform:translateY(-5px);
  border-color:var(--moutarde);
  box-shadow:0 18px 44px #1c19170f;
}
.universe-photo{position:relative;aspect-ratio:4/3.4;overflow:hidden;background:var(--creme-profond)}
.universe-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.universe-card:hover .universe-photo img{transform:scale(1.04)}
.universe-num{
  position:absolute;top:14px;left:14px;
  width:34px;height:34px;border-radius:50%;
  background:#fbf6ecee;color:var(--encre);
  display:grid;place-items:center;
  font-size:12px;font-weight:600;
}
.universe-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
.universe-body .eyebrow{font-size:10px}
.universe-body h3{margin-block:13px 11px}
.universe-body .copy{font-size:14.5px;flex:1;margin-bottom:22px}

/* --- Galerie de tables ------------------------------------------------- */

.tables{background:var(--creme-profond)}
.tables-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:40px;flex-wrap:wrap;margin-bottom:48px;
}
.table-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,26px);
}
.table-item{position:relative}
.table-item:nth-child(2){margin-top:46px}
.table-item button{
  display:block;width:100%;padding:0;
  background:none;border:0;text-align:left;
  border-radius:var(--r-l);overflow:hidden;
  position:relative;
}
.table-item img{
  width:100%;aspect-ratio:3/3.7;object-fit:cover;
  transition:transform .6s,filter .3s;
}
.table-item button:hover img{transform:scale(1.035)}
.table-zoom{
  position:absolute;right:14px;bottom:14px;
  width:42px;height:42px;border-radius:50%;
  background:#fbf6ecf2;color:var(--encre);
  display:grid;place-items:center;
  opacity:0;transform:translateY(6px);
  transition:opacity .25s,transform .25s;
}
.table-item button:hover .table-zoom{opacity:1;transform:none}
.table-zoom svg{width:18px;height:18px}
.table-legend{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:14px;padding-top:15px;
}
.table-legend h3{font-size:19px;letter-spacing:-.02em}
.table-legend span{font-size:12px;color:var(--muted)}

/* --- Bandeau événementiel --------------------------------------------- */

.editorial{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,84px);align-items:center}
.editorial-photo{
  width:100%;aspect-ratio:4/3.6;object-fit:cover;
  border-radius:var(--r-l);
}
.editorial h2{margin-block:20px 22px}
.tags{display:flex;flex-wrap:wrap;gap:9px;margin-block:28px}
.tags span{
  padding:9px 18px;border:1px solid var(--ligne);border-radius:100px;
  font-size:13px;color:var(--encre-doux);background:var(--blanc);
}

/* --- Bandeau MIRA sur l'accueil ---------------------------------------- */

.mira-band{background:var(--encre);color:var(--creme);overflow:hidden}
.mira-band-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.mira-band .eyebrow{color:var(--moutarde)}
.mira-band h2{margin-block:22px 20px;color:var(--creme)}
.mira-band .copy{color:#cfc6b6}
.mira-lockup{display:flex;align-items:center;gap:17px;margin-bottom:26px}
.mira-logo{
  width:74px;height:74px;border-radius:50%;
  background:var(--blanc);overflow:hidden;flex-shrink:0;
  display:grid;place-items:center;padding:7px;
}
.mira-logo img{width:100%;height:100%;object-fit:contain}
.mira-wordmark{
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(40px,4.4vw,58px);letter-spacing:.2em;font-weight:400;
  line-height:1;
}
.mira-sub{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--moutarde);margin-top:8px}
.mira-band-photos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mira-band-photos img{
  width:100%;aspect-ratio:3/3.9;object-fit:cover;border-radius:var(--r-l);
}
.mira-band-photos img:last-child{margin-top:34px}

/* --- Carte cadeaux ----------------------------------------------------- */

.gift{background:var(--moutarde-pale)}
.gift-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.gift-visual{display:grid;place-items:center;padding:20px}
.gift-card{
  width:100%;max-width:400px;aspect-ratio:1.62;
  background:var(--encre);color:var(--creme);
  border-radius:var(--r-l);
  padding:32px;
  display:flex;flex-direction:column;justify-content:space-between;
  transform:rotate(-3.5deg);
  box-shadow:0 26px 56px #1c191733;
  position:relative;overflow:hidden;
}
.gift-card::after{
  content:'';position:absolute;
  right:-58px;bottom:-78px;width:190px;height:190px;
  border-radius:50%;background:#e0a6151f;
}
.gift-card-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.gift-brand{font-family:'Fraunces',Georgia,serif;font-size:25px;letter-spacing:.2em}
.gift-chip{width:38px;height:28px;border-radius:5px;background:linear-gradient(135deg,var(--moutarde),#f0cd6a)}
.gift-value{font-family:'Fraunces',Georgia,serif;font-size:31px;font-style:italic;position:relative;z-index:1}
.gift-foot{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#a79c8a}

/* --- FAQ --------------------------------------------------------------- */

.faq-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,5vw,80px)}
.faq-list{border-top:1px solid var(--ligne)}
.faq-list details{border-bottom:1px solid var(--ligne)}
.faq-list summary{
  display:flex;align-items:center;justify-content:space-between;gap:28px;
  padding:25px 0;font-size:16.5px;font-weight:500;
  list-style:none;
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-plus{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  border:1px solid var(--ligne);
  display:grid;place-items:center;
  font-size:19px;font-weight:300;color:var(--moutarde-fonce);
  transition:transform .25s,background .2s;
}
.faq-list details[open] .faq-plus{transform:rotate(45deg);background:var(--moutarde-pale)}
.faq-list details .copy{padding:0 50px 26px 0}

/* --- Contact ----------------------------------------------------------- */

.contact{background:var(--moutarde);text-align:center}
.contact .eyebrow{color:#553d03}
.contact h2{margin-block:22px 20px}
.contact .copy{color:#44381c;margin-inline:auto;text-align:center}
.contact-actions{display:flex;flex-wrap:wrap;gap:13px;justify-content:center;margin-top:38px}

/* --- Pied de page ------------------------------------------------------ */

.site-footer{background:var(--encre);color:#cfc6b6;padding-top:68px}
.footer-grid{
  display:grid;grid-template-columns:1.5fr 1fr 1fr;
  gap:clamp(30px,4vw,60px);padding-bottom:52px;
}
.footer-brand{display:flex;align-items:center;gap:13px;margin-bottom:20px}
.footer-brand .brand-mark{background:var(--creme)}
.footer-brand .brand-name{color:var(--creme)}
.footer-brand .brand-tag{color:var(--moutarde)}
.footer-title{
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--moutarde);margin-bottom:18px;
}
.footer-link{display:block;padding:6px 0;font-size:14.5px;color:#cfc6b6;transition:color .2s;overflow-wrap:anywhere}
.footer-link:hover{color:var(--blanc)}
.footer-bottom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px;padding-block:26px;
  border-top:1px solid #ffffff1c;
  font-size:12.5px;color:#8d8475;
}

/* ==========================================================================
   Page MIRA
   ========================================================================== */

.mira-hero{background:var(--moutarde);padding-block:30px clamp(56px,6vw,84px)}
.breadcrumb{
  display:flex;align-items:center;gap:9px;
  font-size:12.5px;color:#523f10;margin-bottom:38px;
}
.breadcrumb a:hover{color:var(--encre)}
.mira-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,4.5vw,70px);align-items:center}
.mira-hero .eyebrow{color:#553d03}
.mira-hero h1{margin-block:20px 24px}
.mira-hero .copy{color:#44381c;max-width:46ch}
.mira-hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}
.mira-hero-photo{
  width:100%;aspect-ratio:4/3.5;object-fit:cover;
  border-radius:var(--r-xl);
}
.mira-promises{
  display:flex;flex-wrap:wrap;gap:12px 32px;
  margin-top:40px;padding-top:24px;
  border-top:1.5px solid #1c191726;
  font-size:13px;color:#4e4120;
}
.mira-promises span{display:flex;align-items:center;gap:9px}
.mira-promises span::before{
  content:'';width:6px;height:6px;border-radius:50%;background:var(--encre);
}

.catalogue{background:var(--creme)}
.catalogue-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:36px;flex-wrap:wrap;
  padding-bottom:30px;border-bottom:1px solid var(--ligne);
}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.filter{
  padding:11px 20px;
  font-size:13.5px;
  background:var(--blanc);
  border:1px solid var(--ligne);border-radius:100px;
  color:var(--encre-doux);
  transition:background .2s,color .2s,border-color .2s;
}
.filter:hover{border-color:var(--moutarde)}
.filter[aria-pressed=true]{background:var(--encre);border-color:var(--encre);color:var(--creme)}
.filter small{
  margin-left:7px;padding:2px 7px;border-radius:100px;
  background:var(--moutarde-pale);color:var(--moutarde-fonce);
  font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;
}
.filter[aria-pressed=true] small{background:#ffffff26;color:var(--moutarde)}
.result-count{font-size:13px;color:var(--muted);margin-top:24px}

.product-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.4vw,32px);
  margin-top:30px;
}
.product-card{
  display:flex;flex-direction:column;
  background:var(--blanc);
  border:1px solid var(--ligne);border-radius:var(--r-l);
  overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.product-card:hover{
  transform:translateY(-5px);
  border-color:var(--moutarde);
  box-shadow:0 18px 44px #1c19170f;
}
.product-photo{
  position:relative;display:block;width:100%;
  aspect-ratio:3/3.6;
  padding:0;border:0;background:var(--creme-profond);
  overflow:hidden;
}
.product-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.product-card:hover .product-photo img{transform:scale(1.04)}
.product-cat{
  position:absolute;top:13px;left:13px;
  padding:6px 13px;border-radius:100px;
  background:#fbf6ecee;
  font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--encre);
}
.product-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.product-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.product-body h3{font-size:24px;letter-spacing:-.02em}
.product-weight{font-size:12px;color:var(--muted);white-space:nowrap}
.product-desc{font-size:14px;line-height:1.65;color:var(--encre-doux);margin-top:10px;flex:1}
.product-open{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;margin-top:18px;padding:13px 0 0;
  background:none;border:0;border-top:1px solid var(--ligne);
  font-size:13.5px;font-weight:500;color:var(--moutarde-fonce);
  transition:color .2s;
}
.product-card:hover .product-open{color:var(--encre)}
.product-open svg{width:16px;height:16px}

.category-soon{
  padding:clamp(44px,6vw,76px) 30px;
  border:1px dashed var(--moutarde);border-radius:var(--r-l);
  background:var(--moutarde-pale);
  text-align:center;margin-top:30px;
}
.category-soon h2{margin-block:14px 14px;font-size:clamp(28px,3.4vw,42px)}
.category-soon .copy{margin-inline:auto;text-align:center;max-width:48ch}
.category-soon .link-ar{margin-top:24px}

.soon-band{
  display:flex;align-items:center;gap:30px;flex-wrap:wrap;
  margin-top:40px;padding:30px 34px;
  background:var(--moutarde-pale);
  border-radius:var(--r-l);
}
.soon-icon{
  width:58px;height:58px;border-radius:50%;flex-shrink:0;
  background:var(--moutarde);color:var(--encre);
  display:grid;place-items:center;
}
.soon-icon svg{width:27px;height:27px}
.soon-band .copy{flex:1;min-width:260px;color:#5c4e28}

.commit{background:var(--creme-profond)}
.commit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px);margin-top:52px}
.commit-grid article{padding-top:26px;border-top:2px solid var(--moutarde)}
.commit-grid .eyebrow{font-size:10px}
.commit-grid h3{margin-block:14px 12px;font-size:clamp(22px,2.2vw,29px)}

.flavours{background:var(--encre);color:var(--creme)}
.flavours-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.flavours .eyebrow{color:var(--moutarde)}
.flavours h2{margin-block:22px 22px;color:var(--creme)}
.flavours .copy{color:#cfc6b6}
.flavours img{width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:var(--r-l)}

/* --- Page histoire ----------------------------------------------------- */

.story-hero{background:var(--moutarde);padding-block:clamp(52px,6vw,88px)}
.story-hero .eyebrow{color:#553d03}
.story-hero h1{margin-block:22px 26px;max-width:16ch}
.story-hero .copy{color:#44381c}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,84px);align-items:center}
.story-grid img{width:100%;aspect-ratio:4/3.6;object-fit:cover;border-radius:var(--r-l)}
.story-quote{
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(25px,3.1vw,42px);
  font-style:italic;line-height:1.3;letter-spacing:-.02em;
  max-width:20ch;
}

/* --- Dialogues --------------------------------------------------------- */

dialog{
  padding:0;border:0;
  background:var(--creme);color:var(--encre);
  border-radius:var(--r-l);
  width:min(960px,100% - 32px);
  max-height:90dvh;overflow:auto;
}
dialog::backdrop{background:#1c1917c4;backdrop-filter:blur(5px)}
.dialog-close{
  position:absolute;top:16px;right:16px;z-index:3;
  width:44px;height:44px;border-radius:50%;
  background:#fbf6ecf2;border:1px solid var(--ligne);
  display:grid;place-items:center;
}
.dialog-close svg{width:18px;height:18px}

.pd-grid{display:grid;grid-template-columns:.85fr 1.15fr}
.pd-photo{width:100%;height:100%;max-height:660px;object-fit:cover;background:var(--creme-profond)}
.pd-body{padding:46px 40px 40px}
.pd-cat{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--moutarde-fonce)}
.pd-body h2{margin-block:13px 14px;font-size:clamp(30px,3.4vw,42px)}
.pd-detail{margin-top:22px;padding-top:20px;border-top:1px solid var(--ligne)}
.pd-detail h3{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.pd-detail p{margin:0;font-size:14.5px;line-height:1.75;color:var(--encre-doux)}

.recipe{
  margin-top:26px;padding:26px;
  background:var(--moutarde-pale);
  border-radius:var(--r-m);
}
.recipe .eyebrow{color:#7a5c0c;font-size:10px}
.recipe h3{margin-block:13px 6px;font-size:clamp(22px,2.4vw,28px)}
.recipe-portions{font-size:12.5px;color:#7a5c0c;margin-bottom:18px}
.recipe h4{
  font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:#7a5c0c;margin:20px 0 10px;
}
.recipe ul,.recipe ol{margin:0;padding-left:20px;font-size:14px;line-height:1.75;color:#4f4423}
.recipe ul{list-style:disc}
.recipe ol{list-style:decimal}
.recipe li+li{margin-top:7px}
.recipe-note{
  margin-top:18px;padding-top:14px;
  border-top:1px solid #c9a94a66;
  font-size:11.5px;line-height:1.6;color:#7a5c0c;
}

.pd-foot{margin-top:28px;padding-top:22px;border-top:1px solid var(--ligne)}
.pd-foot .copy{font-size:13px;margin-bottom:16px}

.gallery-dialog{background:var(--encre);width:min(860px,100% - 32px)}
.gallery-dialog img{width:100%;max-height:74dvh;object-fit:contain;background:#000}
.gallery-dialog figure{margin:0}
.gallery-dialog figcaption{padding:18px 26px;color:var(--creme);font-size:14px}

/* ==========================================================================
   Adaptatif
   ========================================================================== */

@media(min-width:1024px){
  .mobile-nav,.menu-backdrop{display:none!important}
}

@media(max-width:1023px){
  .header-nav{display:none}
  .menu-toggle{display:block}
  .hero-grid,.mira-hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-copy{padding-bottom:0}
  .hero-photo{aspect-ratio:4/2.9;border-radius:var(--r-xl)}
  .hero{padding-bottom:40px}
  .hero-strip{border-top:0;padding-top:0}
  .universe-grid,.commit-grid{grid-template-columns:1fr 1fr}
  .universe-grid>*:last-child{grid-column:1/-1}
  .commit-grid>*:last-child{grid-column:1/-1}
  .editorial,.mira-band-grid,.gift-grid,.faq-grid,.flavours-grid,.story-grid{
    grid-template-columns:1fr;gap:38px;
  }
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-grid>*:first-child{grid-column:1/-1}
  .pd-grid{grid-template-columns:1fr}
  .pd-photo{max-height:320px}
}

@media(max-width:767px){
  html{scroll-padding-top:92px}
  .header-inner{height:78px}
  .brand-mark{width:46px;height:46px}
  .brand-name{font-size:19px}
  .mobile-nav{top:86px}
  .hero{padding-top:38px}
  .hero-photo{aspect-ratio:4/3.6}
  .hero-actions .btn,.contact-actions .btn,.mira-hero-actions .btn{width:100%}
  .table-grid{grid-template-columns:1fr;gap:28px}
  .table-item:nth-child(2){margin-top:0}
  .table-item img{aspect-ratio:4/3.9}
  .universe-grid,.commit-grid,.product-grid{grid-template-columns:1fr}
  .universe-grid>*:last-child,.commit-grid>*:last-child{grid-column:auto}
  .mira-band-photos img:last-child{margin-top:0}
  .gift-card{transform:none;padding:26px}
  .faq-list summary{font-size:15px;gap:18px}
  .faq-list details .copy{padding-right:0}
  .soon-band{padding:24px;gap:20px}
  .pd-body{padding:36px 24px 28px}
  .recipe{padding:22px 18px}
  .footer-grid{grid-template-columns:1fr}
  .footer-grid>*:first-child{grid-column:auto}
  .product-photo{aspect-ratio:4/3.4}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .btn:hover,.universe-card:hover,.product-card:hover{transform:none}
}