/* Page « Notre histoire » — s'appuie sur accueil.css pour l'en-tête, le pied de page et les boutons */
.story-link{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-family:var(--font-display);font-size:19px;font-weight:600;color:var(--burgundy);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;min-height:var(--tap)}
.story-link:hover{border-bottom-color:var(--burgundy)}
@media (min-width:1024px){.story-link{margin-top:1cqw;font-size:1.25cqw;min-height:0}}
@media (max-width:767px){.story-link{margin-top:6px}}
.story{max-width:none}
.story .print{background:#F6EFE3;padding:12px 12px 14px;border:1px solid rgba(178,138,74,.35);box-shadow:0 14px 28px -18px rgba(38,33,30,.5),0 1px 2px rgba(38,33,30,.15)}
.story .print img{width:100%;height:auto;filter:sepia(.08) contrast(1.02)}
.story figcaption{font-family:var(--font-display);font-style:italic;font-size:17px;color:#5F554E;margin-top:10px;line-height:1.4}
.story-hero{position:relative;padding:clamp(20px,3vw,44px) clamp(16px,4vw,64px) 0}
.story-hero .print{max-width:1280px;margin:0 auto}
.story-hero .print img{aspect-ratio:1712/1145;object-fit:cover;object-position:center 70%;max-height:62vh}
.story-head{max-width:1280px;margin:30px auto 0}
.story-head .overline{white-space:nowrap;letter-spacing:.22em;font-size:13px}
.story-head .overline::after{margin-top:12px}
.story-head h1{font-family:var(--font-display);font-weight:700;color:var(--burgundy);font-size:clamp(44px,5.4vw,84px);line-height:.95;letter-spacing:-.02em;margin:16px 0 0}
.story-intro{font-family:var(--font-display);font-size:clamp(21px,1.7vw,27px);line-height:1.45;color:var(--charcoal);margin:22px 0 0;max-width:62ch}
.story-intro::first-letter{font-family:var(--font-display);font-weight:700;font-size:3.2em;line-height:.8;float:left;padding:8px 8px 0 0;color:var(--burgundy)}
.story-body{max-width:1280px;margin:0 auto;padding:40px clamp(16px,4vw,64px) 0;display:grid;grid-template-columns:minmax(0,66ch) minmax(300px,380px);gap:clamp(24px,5vw,80px);align-items:start}
.story-text p{font-size:18px;line-height:30px;margin:0 0 22px;max-width:66ch}
.story-aside{display:grid;gap:44px;align-content:start;padding-top:6px}
.story-portrait{max-width:300px;transform:rotate(1.5deg)}
.story-ship{transform:rotate(-1deg)}
.timeline{list-style:none;margin:8px 0 34px;padding:26px 0 0;position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.timeline::before{content:"";position:absolute;left:8px;right:8px;top:8px;border-top:3px dashed var(--burgundy);opacity:.9}
.timeline li{position:relative;padding-top:6px}
.timeline li::before{content:"";position:absolute;left:0;top:-24px;width:16px;height:16px;border-radius:50%;background:var(--burgundy);border:3px solid #F6EFE3;box-shadow:0 0 0 1px var(--burgundy)}
.timeline .year{display:block;font-family:var(--font-display);font-weight:700;font-size:23px;color:var(--burgundy);line-height:1.1}
.timeline .label{display:block;font-size:13px;line-height:18px;color:#5F554E;margin-top:4px;max-width:18ch}
.timeline-title{font-family:var(--font-ui);font-weight:600;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--olive);margin:14px 0 0}
.gallery{max-width:1280px;margin:20px auto 0;padding:0 clamp(16px,4vw,64px)}
.gallery h2{font-family:var(--font-ui);font-weight:600;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--olive);margin:0 0 18px}
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);align-items:start}
.gallery figure:first-child{transform:rotate(-1.5deg)} .gallery figure:last-child{transform:rotate(1.2deg);margin-top:30px}
.gallery button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;font:inherit;color:inherit;text-align:left}
.gallery button:hover .print{box-shadow:0 18px 34px -18px rgba(38,33,30,.6)}
.closing{max-width:1280px;margin:56px auto 0;padding:0 clamp(16px,4vw,64px) 64px;text-align:center}
.closing blockquote{margin:0 auto;max-width:34ch;font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(24px,2.4vw,36px);line-height:1.3;color:var(--charcoal)}
.closing blockquote::before,.closing blockquote::after{content:"";display:block;width:64px;height:1px;background:var(--gold);margin:0 auto 22px}
.closing blockquote::after{margin:22px auto 0}
.closing .actions{justify-content:center;margin-top:34px}
.lightbox{border:0;padding:0;background:transparent;max-width:min(96vw,1500px);max-height:96vh}
.lightbox::backdrop{background:rgba(38,33,30,.82)}
.lightbox .frame{position:relative;background:#F6EFE3;padding:14px 14px 16px;border:1px solid rgba(178,138,74,.35)}
.lightbox img{display:block;max-width:calc(96vw - 30px);max-height:calc(96vh - 90px);width:auto;height:auto}
.lightbox figcaption{text-align:center}
.lightbox .close-btn{position:absolute;top:-18px;right:-18px;width:44px;height:44px;border-radius:50%;border:1px solid var(--gold);background:var(--ivory);color:var(--burgundy);cursor:pointer;display:grid;place-items:center}
.lightbox .close-btn svg{width:22px;height:22px}
@media (max-width:1023px){.story-body{grid-template-columns:1fr}.story-aside{grid-template-columns:minmax(0,300px) 1fr;align-items:start;gap:28px}.story-portrait{max-width:300px;transform:rotate(1deg)}.story-ship{max-width:420px}}
@media (max-width:767px){
  .story-hero .print img{aspect-ratio:4/3;max-height:none}
  .story-head .overline{white-space:normal}
  .story-aside{grid-template-columns:1fr}
  .story-ship{max-width:none}
  .story-head h1{font-size:clamp(40px,12vw,56px)}
  .timeline{grid-template-columns:1fr;gap:20px;padding:0 0 0 30px}
  .timeline::before{left:7px;top:8px;bottom:8px;right:auto;border-top:0;border-left:3px dashed var(--burgundy)}
  .timeline li::before{left:-30px;top:6px}
  .gallery-grid{grid-template-columns:1fr}
  .gallery figure:first-child,.gallery figure:last-child{transform:none;margin-top:0}
  .closing .actions .btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){.story *{transition:none!important}}