/* ==========================================================================
   Julie Deh – thème N7 · styles communs
   Polices hébergées localement (aucune requête vers un serveur tiers).
   ========================================================================== */

/* ---------- Polices ---------- */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/cormorant-garamond-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/cormorant-garamond-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:700;font-display:swap;src:url(../fonts/cormorant-garamond-latin-700-italic.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/instrument-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/instrument-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/instrument-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/newsreader-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/newsreader-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/newsreader-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:200;font-display:swap;src:url(../fonts/inter-latin-200-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/inter-latin-300-normal.woff2) format('woff2')}

/* ---------- Base ---------- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;background:#FFFFFF;color:#2B2831;font-family:'Instrument Sans',system-ui,'Segoe UI',Arial,sans-serif}
body.is-brume{background:#D4E2E4}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.q{font-family:'Newsreader','Cormorant Garamond',Georgia,serif;font-weight:500}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;margin:0;left:12px;top:12px;z-index:100000;background:#111;color:#fff;padding:10px 16px;border-radius:8px}

/* ---------- Fonds ---------- */
.site{min-height:100vh;box-sizing:border-box;color:#2B2831;font-family:'Instrument Sans','Anthropic Sans',system-ui,'Segoe UI',Arial,sans-serif;display:flex;flex-direction:column}
.site>main{flex:1 0 auto}
.bg{position:relative;isolation:isolate;background-color:#D4E2E4;background-image:radial-gradient(ellipse 55% 42% at 30% 20%,rgba(255,255,255,.85),rgba(255,255,255,0) 72%),radial-gradient(ellipse 70% 40% at 50% 112%,rgba(60,96,112,.16),rgba(60,96,112,0) 70%),linear-gradient(180deg,rgba(143,177,190,.42) 0%,rgba(143,177,190,.12) 42%,rgba(143,177,190,0) 70%)}
.bg::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .07  0 0 0 0 .07  0 0 0 0 .07  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E");background-size:220px 220px}
.wp{position:relative;isolation:isolate;background-color:#FFFFFF;background-image:radial-gradient(ellipse 55% 42% at 30% 20%,rgba(143,177,190,.2),rgba(143,177,190,0) 72%),radial-gradient(ellipse 70% 40% at 50% 112%,rgba(60,96,112,.06),rgba(60,96,112,0) 70%)}

/* ---------- Boutons, liens, menu ---------- */
.cta{transition:transform .15s,box-shadow .15s,filter .15s}
.cta:hover{transform:translateY(-1px);box-shadow:0 3px 8px rgba(17,17,17,.18);filter:brightness(.97)}
.cta:active{transform:translateY(0) scale(.98);box-shadow:0 0 0 1px #E6007E}
.cta:focus-visible,.lk:focus-visible{outline:2px solid #2B2831;outline-offset:3px}
.wp .cta{color:#FFFFFF!important}
.mn{padding-bottom:3px;border-bottom:2px solid transparent;transition:border-color .15s,opacity .15s}
.mn:hover,.mn:focus-visible{border-bottom-color:#FFFFFF}
.wp .mn:hover,.wp .mn:focus-visible{border-bottom-color:#8FB1BE}
.mn:active{border-bottom-color:#E6007E}
.mn:focus-visible{outline:2px solid #2B2831;outline-offset:3px}
.mn[aria-current="page"],.wp .mn[aria-current="page"]:hover{border-bottom-color:#E6007E}
.lk{transition:border-color .15s,opacity .15s}
.lk:hover,.lk:focus-visible{border-bottom-color:#FFFFFF!important}
.lk:active{border-bottom-color:#E6007E!important}
.lg{transition:opacity .15s}.lg:hover{opacity:.8}.lg:focus-visible{outline:2px solid #2B2831;outline-offset:3px}
.lkp{color:inherit;text-decoration:none;border-bottom:3px solid #8FB1BE;transition:border-color .15s}
.lkp:hover,.lkp:focus-visible,.lkp:active{border-bottom-color:#E6007E}
.lkp:focus-visible{outline:2px solid #2B2831;outline-offset:3px}
.tx{border-bottom:2px solid #8FB1BE;padding-bottom:1px}
.tx:hover,.tx:focus-visible,.tx:active{border-bottom-color:#E6007E}
.nx{font-weight:600;border-bottom:2px solid #8FB1BE;padding-bottom:1px}
.nx:hover,.nx:focus-visible,.nx:active{border-bottom-color:#E6007E}
.bc a{color:#2B2831;border-bottom:1px solid #E6007E;font-weight:600}
.bc a:hover{border-bottom-color:#8FB1BE}
.st strong,.og strong{font-weight:600}

/* ---------- Surlignage des citations ---------- */
.hl2{position:relative;z-index:-1;background:linear-gradient(179.4deg,rgba(255,255,255,0) 24%,rgba(255,255,255,.92) 25%,rgba(255,255,255,.92) 79%,rgba(255,255,255,0) 80%);padding:0 .3em;margin:0 -.3em;border-radius:.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.wp .hl2{background:linear-gradient(179.4deg,rgba(212,226,228,0) 24%,rgba(212,226,228,.95) 25%,rgba(212,226,228,.95) 79%,rgba(212,226,228,0) 80%)}

/* ---------- Formulaire ---------- */
.fld{width:100%;box-sizing:border-box;border:1px solid #6F97A3;border-radius:8px;padding:12px 14px;font-size:16px;font-family:inherit;color:#2B2831;background:#F1F6F7}
.fld:focus,.fld:focus-visible{border-color:#E6007E;background:#FFFFFF;outline:none}
.ct{color:#2B2831;font-weight:600;border-bottom:2px solid #FFFFFF}
.ctp{color:#2B2831;font-weight:500;border-bottom:1px solid #E6007E}
.ctp.lk:hover,.ctp.lk:focus-visible{border-bottom-color:#8FB1BE!important}
.ctp.lk:active{border-bottom-color:#E6007E!important}
.ct.lk:hover,.ct.lk:focus-visible,.ct.lk:active{border-bottom-color:#E6007E!important}
.jd-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.jd-err{margin:0;padding:10px 14px;border-radius:8px;background:#FDE7F2;color:#7A0043;font-size:14.5px;line-height:1.45}

/* ---------- Galeries, accordéons, zoom ---------- */
details.cg>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;border-radius:4px}
details.cg>summary::-webkit-details-marker{display:none}
details.cg>summary:focus-visible{outline:2px solid #2B2831;outline-offset:6px}
.cv{transition:transform .2s}
details.cg[open]>summary .cv{transform:rotate(90deg)}
details.cg>summary:hover .cv{transform:translateX(2px)}
details.cg[open]>summary:hover .cv{transform:rotate(90deg) translateX(2px)}
.zm{cursor:zoom-in;transition:transform .2s ease}
.zm:hover,.zm:focus-visible{transform:translateY(-3px)}
.zm img{transition:box-shadow .15s}
.gal figure .zm img,.strip figure .zm img{max-width:none}
.zm:hover img,.zm:focus-visible img{box-shadow:0 8px 18px rgba(43,40,49,.22)!important}
.zm:focus-visible{outline:2px solid #2B2831;outline-offset:4px;border-radius:8px}
.zm:active{transform:translateY(0) scale(.99)}
.zm:active img{box-shadow:0 0 0 1px #E6007E,0 4px 10px rgba(43,40,49,.18)!important}
.strip{scrollbar-color:#8FB1BE transparent}
.tg{font:inherit;font-size:14px;color:#2B2831;background:none;border:0;border-bottom:2px solid #8FB1BE;padding:0 0 1px;cursor:pointer}
.tg:hover,.tg:active{border-bottom-color:#E6007E}
.tg:focus-visible{outline:2px solid #2B2831;outline-offset:4px}
.sw{position:relative}
.sw .fd{display:none}
@media print{.tg{display:none}}

/* Visionneuse (agrandissement des visuels) */
.lbx{position:fixed;inset:0;z-index:1000;background:rgba(23,21,27,.92);display:flex;align-items:center;justify-content:center;padding:56px 64px;box-sizing:border-box}
.lbx[hidden]{display:none}
.lbx img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:6px;box-shadow:0 10px 40px rgba(0,0,0,.5);background:#fff}
.lbx button{position:absolute;width:46px;height:46px;border:0;border-radius:10px;background:#111111;color:#D4E2E4;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.lbx button[hidden]{display:none}
.lbx button:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
.lbx img{cursor:zoom-in}
.lbx .lbx-z{top:12px;right:66px}
.lbx.z2{display:block;overflow:hidden;padding:0;touch-action:none;cursor:grab}
.lbx.z2 img{max-width:none;max-height:none;height:auto;margin:0 auto;display:block;border-radius:0;cursor:grab;-webkit-user-drag:none;user-select:none}
.lbx.z2.drag,.lbx.z2.drag img{cursor:grabbing}
.lbx.z2 .lbx-x,.lbx.z2 .lbx-z{position:fixed}
.lbx.z2 .lbx-p,.lbx.z2 .lbx-n,.lbx.z2 .lbx-c{display:none}
.lbx .lbx-x{top:12px;right:12px}
.lbx .lbx-p{left:10px;top:50%;transform:translateY(-50%)}
.lbx .lbx-n{right:10px;top:50%;transform:translateY(-50%)}
.lbx .lbx-c{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:#D4E2E4;font-size:14px;padding:0 70px}
body.no-scroll{overflow:hidden}

/* ---------- En-tête ---------- */
.hd-d{max-width:1160px;margin:0 auto;padding:28px 40px;display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;box-sizing:border-box;width:100%}
.hd-d .lgt{font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;font-size:38px;line-height:1.1;color:#2B2831;letter-spacing:0.005em}
.hd-d .lgs{font-weight:500;font-size:28px;color:#E6007E}
.amp{font-family:'Inter',system-ui,sans-serif;font-weight:200}
.hd-nav{font-family:'Cormorant Garamond',Georgia,serif;display:flex;gap:28px;font-size:19px;font-weight:700;flex-wrap:wrap;align-items:baseline;color:#2B2831;letter-spacing:0.005em}
.hd-nav .cta{background:#111111;color:#D4E2E4;padding:11px 24px;border-radius:10px;line-height:1.2}
.hd-m{display:none}
.hd-m-bar{padding:18px 16px 6px 20px;display:flex;justify-content:space-between;align-items:center;gap:10px;box-sizing:border-box}
.hd-m .lg{min-width:0}
.hd-m .lgt{font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;font-size:25px;line-height:1.15;color:#2B2831;letter-spacing:0.005em;white-space:nowrap}
.hd-m .lgs{font-weight:500;font-size:16px;color:#E6007E}
.burger{flex:none;width:46px;height:46px;border:0;border-radius:10px;background:#111111;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}

/* Menu mobile ouvert */
.mnav{position:fixed;inset:0;z-index:900;overflow-y:auto;color:#2B2831}
.mnav[hidden]{display:none}
.mnav nav{font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;letter-spacing:0.005em;padding:22px 20px 0}
.mnav nav a{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid rgba(43,40,49,.18);font-size:30px;line-height:1.1}
.mnav nav a[aria-current="page"]{color:#E6007E}
.mnav .mnav-cta{padding:30px 20px 40px}
.mnav .mnav-cta a{display:block;text-align:center;background:#111111;color:#D4E2E4;padding:16px 24px;border-radius:10px;line-height:1.2;font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;font-size:20px;letter-spacing:0.005em}

/* ---------- Pied de page ---------- */
.ft{max-width:1160px;margin:0 auto;padding:0 40px 40px;box-sizing:border-box;width:100%}
.ft-in{border-top:1px solid #E6007E;padding-top:18px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:'Instrument Sans','Anthropic Sans',system-ui,'Segoe UI',Arial,sans-serif;font-size:14px;color:#2B2831}

/* ---------- Barre Contact mobile ---------- */
.cbar{display:none}

/* ---------- Citations : tailles tablette et mobile ---------- */
@media (max-width:1000px){
  figure blockquote{font-size:17px!important}
  figure figcaption{font-size:15px!important}
}
@media (min-width:701px){figure figcaption.nw{white-space:nowrap}}

/* ---------- Tablette (601–1000 px) ---------- */
@media (min-width:601px) and (max-width:1000px){
  .wr,.ft{padding-left:32px!important;padding-right:32px!important}
  .hd-d{padding:24px 32px 8px}
  .pg:not(.pg-accueil) h1{font-size:34px!important}
}

/* ---------- Mobile (≤ 600 px) ---------- */
@media (max-width:600px){
  .hd-d{display:none}
  .hd-m{display:block}
  .wr,.ft{padding-left:20px!important;padding-right:20px!important}
  .pg:not(.pg-accueil) h1{font-size:27px!important;line-height:1.14!important}
  .pg blockquote,.pg figcaption{text-align:left!important}
  .pg .qr,.pg .pf-q{justify-content:center!important}
  .pg figure:has(blockquote){flex:1 1 100%!important;width:100%!important;min-width:0!important;padding:18px 18px 18px 22px!important}
  .pg aside{padding:20px!important}
  .ft-in{flex-direction:column}
  .ft{padding-bottom:68px}
  .cbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:6px 16px 8px;background:rgba(212,226,228,.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-sizing:border-box;transform:translateY(110%);transition:transform .25s}
  .cbar.on{transform:none}
  .cbar a{display:block;width:fit-content;max-width:100%;box-sizing:border-box;margin:0 auto;text-align:center;background:#111111;color:#D4E2E4!important;padding:8px 24px;border-radius:10px;line-height:1.2;font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;font-size:19px;letter-spacing:0.005em}
  .sw .fd{display:flex;position:absolute;right:0;top:6px;bottom:14px;width:48px;align-items:center;justify-content:flex-end;padding-right:2px;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),#FFFFFF 75%);border-radius:0 8px 8px 0;transition:opacity .2s}
  .sw.end .fd{opacity:0}
  .lbx{padding:56px 10px}
  .lbx .lbx-p,.lbx .lbx-n{top:auto;bottom:8px;transform:none}
}
@media (max-width:359px){
  .hd-m .lgt{font-size:21px}
  .hd-m .lgs{font-size:13px}
}
@media (max-width:334px){
  .hd-m .lgt{font-size:19px}
  .hd-m .lgs{font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .cbar,.cta,.zm,.cv,.mn,.lk{transition:none!important}
}
