/* TYPOGRAPHIES LOCALES */
@font-face { font-family: Editorial; src: url('assets/serif.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: Editorial; src: url('assets/serif-italic.woff2') format('woff2'); font-style: italic; font-display: swap; }
@font-face { font-family: NeueMontrealBook; src: url('assets/PPNeueMontreal-Book.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: swap; }

@font-face { font-family: Balete; src: url('assets/Balete-Extralight.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: Balete; src: url('assets/Balete-Semibold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: Balete; src: url('assets/Balete-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: Balete; src: url('assets/Balete-ExtralightItalic.woff') format('woff'); font-weight: 200; font-style: italic; font-display: swap; }
@font-face { font-family: Balete; src: url('assets/Balete-MediumItalic.woff') format('woff'); font-weight: 500; font-style: italic; font-display: swap; }

/* BASE */
:root { --blue: #99BDF7; --yellow: #FFF49E; --red: #570D0A; --paper: #f5f4ed; --ink: #20201c; --gutter: clamp(24px, 4vw, 72px); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: NeueMontrealBook, Arial, sans-serif; font-size: 16px; line-height: 1.65; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; object-fit: cover; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-weight: 400; }
h2 { font-family: Editorial, Georgia, serif; font-size: clamp(46px, 5.9vw, 100px); line-height: .99; letter-spacing: -.025em; }
h3 { font-family: Editorial, Georgia, serif; font-size: clamp(30px, 3vw, 48px); line-height: 1.08; }
p + p { margin-top: 20px; }
em { font-family: Editorial, Georgia, serif; font-weight: 400; }
.section { padding: clamp(60px, 7vw, 120px) var(--gutter); }
.body-copy { max-width: 550px; font-size: clamp(16px, 1.35vw, 21px); }
.eyebrow { text-transform: uppercase; letter-spacing: .1em; font-size: 12px; margin-bottom: 20px; }
.button { display: inline-flex; align-items: center; justify-content: center; padding: 16px 25px; border: 0; border-radius: 100px; background: var(--yellow); color: var(--ink); font-size: 12px; text-transform: uppercase; line-height: 1.3; min-height: 48px; transition: background .2s, transform .2s; }
.button:hover { background: #F7EB83; transform: translateY(-2px); }
.button.blue { background: var(--blue); color: white; }
.button.blue:hover { background: #7EA9EB; }
p + .button, .body-copy .button { margin-top: 30px; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.skip-link { position: fixed; left: 15px; top: -100px; z-index: 20; background: var(--yellow); padding: 12px; }
.skip-link:focus { top: 15px; }

/* PHOTO PLEIN ÉCRAN ET TITRE À GRAISSE VARIABLE */
.hero { height: min(940px, 91svh); min-height: 660px; position: relative; overflow: hidden; }
.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-position: 50% 52%; }
.hero-title { position: absolute; top: 0; left: 0; width: 100%; height: 20vw; font-family: Editorial, Georgia, serif; color: var(--yellow); font-size: 20.2vw; line-height: .96; letter-spacing: -.045em; white-space: nowrap; }
#animated-name { font-family: Balete, Georgia, serif; font-weight: 200; font-style: normal; font-synthesis: none; display: inline-block; position: absolute; left: 50%; transform-origin: center; white-space: nowrap; }
.hero-badge { position: absolute; left: 12%; top: 17%; width: 12%; transform: rotate(-12deg); object-fit: contain; }
.hero-heading { position: absolute; right: 4%; top: 31%; width: 34%; text-align: right; font-size: clamp(34px, 4vw, 65px); line-height: 1.03; color: white; }
.hero-copy { position: absolute; bottom: 4%; left: var(--gutter); width: 21%; color: white; font-size: clamp(18px, 1.65vw, 26px); line-height: 1.48; }
.animation-toggle { position: absolute; bottom: 15px; right: 16px; border: 0; border-radius: 20px; padding: 7px 12px; background: #20201c80; color: white; font-size: 10px; }

/* NAVIGATION BLEUE */
.site-header { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 30px; background: var(--blue); color: white; padding: 16px var(--gutter); }
.brand { font-size: clamp(20px, 2.6vw, 42px); line-height: 1; white-space: nowrap; letter-spacing: -.04em; }
.site-header nav { display: flex; justify-content: center; gap: 16px; flex: 1; }
.site-header nav a { text-transform: uppercase; font-size: 11px; white-space: nowrap; }
.site-header nav a:hover { text-decoration: underline; text-underline-offset: 4px; }
.header-cta { white-space: nowrap; padding-inline: 20px; }
.menu-toggle { display: none; }

/* PRÉSENTATION ASYMÉTRIQUE */
.intro { display: grid; grid-template-columns: .9fr 1.1fr; gap: 8%; align-items: center; }
.intro-visual { position: relative; padding: 40px 0 55px; }
.intro-photo { width: 82%; height: 540px; }
.creation { position: absolute; right: -12%; bottom: 30px; width: 48%; object-fit: contain; transform: rotate(-12deg); }
.image-caption { display: block; max-width: 240px; margin-top: 16px; font-size: 11px; }
.intro-content h2 { margin-bottom: 35px; }
.intro-content .body-copy { max-width: 460px; margin-left: 15%; }

/* ACCOMPAGNEMENTS */
.services { background: var(--ink); color: var(--paper); padding-top: 30px; overflow: hidden; }
.ticker { font-size: clamp(65px, 8vw, 145px); white-space: nowrap; color: var(--yellow); }
.ticker span { display: inline-block; animation: marquee 30s linear infinite; }
@keyframes marquee { to { transform: translateX(-50%); } }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; padding-top: 55px; }
.service-card img { width: 100%; aspect-ratio: .85; margin-bottom: 28px; }
.service-card h3 { text-transform: uppercase; }
.service-card p { margin-top: 20px; font-size: 14px; max-width: 340px; }
.service-card .button { margin-top: 25px; }

/* DERNIÈRES CRÉATIONS */
.creations-heading { display: flex; justify-content: space-between; align-items: center; margin: 0 0 25px; padding-bottom: 18px; border-bottom: 1px solid var(--ink); }
.creations-heading h3 { font-size: 32px; }
.creations-heading > span { font-size: 36px; }
.creations-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.creation-card { position: relative; }
.creation-card img { width: 100%; aspect-ratio: 0.85; margin-bottom: 18px; }
.creation-card > span:not(.project-arrow) { display: block; max-width: 85%; font-size: 14px; text-transform: uppercase; }
.project-arrow { position: absolute; right: 18px; top: 18px; display: grid; place-items: center; width: 43px; height: 43px; border-radius: 50%; background: var(--yellow); font-size: 20px; }
.creation-card:hover .project-arrow { background: var(--blue); color: white; }

/* PORTRAIT ET RESSOURCE */
.coach { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; background: var(--blue); color: var(--yellow); }
.coach-image { position: relative; }
.coach-image > img { width: 100%; aspect-ratio: .8; }
.portrait-heading { display: flex; flex-direction: column; gap: .12em; line-height: 1; }
.portrait-heading > span, .portrait-heading > em { display: block; }
.portrait-heading > em { transform: translateY(-.04em); }
.coach .body-copy { margin-top: 35px; }
.coach .button.blue { background: var(--yellow); color: var(--ink); }
.coach .button.blue:hover { background: #F7EB83; }
.oval-sticker { color: var(--ink); position: absolute; right: -8%; bottom: 9%; background: var(--yellow); border: 1px solid var(--ink); border-radius: 50%; padding: 23px 32px; font-family: Editorial, serif; font-size: 35px; line-height: .9; text-align: center; transform: rotate(12deg); }
.guide { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; background: var(--blue); color: var(--yellow); }
.guide > img { width: 100%; aspect-ratio: 1.2; }
.guide p:not(.eyebrow) { color: white; max-width: 420px; margin-top: 25px; }

/* JOURNAL */
.journal-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 60px; }
.journal-heading p { max-width: 300px; }
.journal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }
.article-number { font-family: Editorial, serif; font-size: 45px; }
.journal-grid img { width: 100%; height: 320px; margin: 16px 0 25px; }
.journal-grid h3 { font-size: 34px; }
.journal-grid p { font-size: 14px; margin: 16px 0; }
.journal-grid a { border-bottom: 1px solid var(--ink); font-size: 12px; text-transform: uppercase; padding-bottom: 6px; }

/* DERNIÈRE SECTION ET PIED DE PAGE */
.closing { display: grid; grid-template-columns: 1.15fr .85fr; gap: 8%; align-items: center; background: var(--blue); color: var(--yellow); }
.closing p { color: white; margin-top: 28px; }
.closing > img { width: 100%; aspect-ratio: .92; }
.footer { background: var(--ink); color: var(--paper); }
.footer > h2 { font-size: 14.4vw; white-space: nowrap; color: var(--yellow); letter-spacing: -.05em; margin-bottom: 70px; }
.footer-grid { display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 8%; }
.footer h3 { font-size: 25px; margin-bottom: 23px; }
.footer p, .footer a, .text-button { font-size: 13px; }
.footer-grid a { display: block; margin-bottom: 7px; }
.text-button { background: none; border: 0; border-bottom: 1px solid var(--yellow); padding: 8px 0; color: var(--yellow); margin-top: 15px; }
#contact-status { margin-top: 15px; color: var(--yellow); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 65px; padding-top: 20px; border-top: 1px solid #ffffff40; font-size: 10px; }

/* TABLETTES */
@media (max-width: 1100px) {
  .site-header { gap: 20px; flex-wrap: wrap; }
  .site-header nav { order: 3; flex-basis: 100%; }
  .header-cta { margin-left: auto; }
  .intro-photo { height: 420px; }
  .hero-copy { width: 25%; }
}

/* MOBILE */
@media (max-width: 700px) {
  html { scroll-padding-top: 80px; }
  .hero { height: 88svh; min-height: 660px; }
  .hero-photo { object-position: 51% 50%; }
  .hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 50%, #0008); pointer-events: none; }
  .hero-title { z-index: 1; top: 22px; font-size: 19.5vw; }
  .hero-badge { z-index: 1; top: 14%; width: 25%; left: 8%; }
  .hero-heading { z-index: 1; top: 24%; right: 6%; width: 54%; font-size: 32px; }
  .hero-copy { z-index: 1; bottom: 7%; width: 65%; font-size: 17px; }
  .animation-toggle { z-index: 2; bottom: 12px; }
  .site-header { padding: 20px 24px; }
  .brand { font-size: 23px; }
  .header-cta { display: none; }
  .menu-toggle { display: flex; gap: 20px; align-items: center; border: 0; background: none; color: white; margin-left: auto; font-size: 13px; }
  .menu-toggle span { font-size: 25px; line-height: 1; }
  .site-header nav { display: none; flex-direction: column; gap: 0; }
  .site-header nav.is-open { display: flex; }
  .site-header nav a { padding: 13px 0; border-top: 1px solid #ffffff40; }
  .intro, .coach, .guide, .closing { grid-template-columns: 1fr; gap: 40px; }
  .intro-visual { padding-top: 0; }
  .intro-photo { width: 85%; height: 440px; }
  .creation { right: -3%; bottom: 25px; width: 47%; }
  .intro-content .body-copy { margin-left: 0; }
  .service-grid, .creations-grid, .journal-grid { grid-template-columns: 1fr; gap: 45px; }
  .service-card img { aspect-ratio: 1; }
  .creation-card img { aspect-ratio: 0.9; }
  .oval-sticker { right: 0; }
  .journal-heading { display: block; }
  .journal-heading p { margin-top: 25px; }
  .journal-grid img { height: 340px; }
  .closing > img { aspect-ratio: 1.2; }
  .footer > h2 { margin-bottom: 40px; }
  .footer-grid { grid-template-columns: 1fr; gap: 35px; }
  .footer-bottom { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ticker span { animation: none; }
  .button { transition: none; }
}

/* Balete Extra Light Italic : uniquement les éléments sélectionnés */
.balete-italic {
  font-family: Balete, Georgia, serif;
  font-weight: 200;
  font-style: italic;
  font-synthesis: none;
}
/* Le titre défilant entier */
.ticker.balete-italic { font-family: Balete, Georgia, serif; font-weight: 200; font-style: italic; }
/* Dans « des idées », seule la lettre d est en Balete */
.journal-d em.balete-italic { font-family: Balete, Georgia, serif; font-weight: 200; font-style: italic; }
/* Signature monumentale en pied de page */
.footer { overflow: hidden; }
.footer > h2.footer-signature {
  font-family: Balete, Georgia, serif;
  font-weight: 600;
  font-style: italic;
  font-synthesis: none;
  font-size: clamp(72px, 21vw, 500px);
  line-height: .88;
  letter-spacing: 0.005em;
  white-space: nowrap;
  width: 100%;
  margin-bottom: 70px;
}
@media (max-width: 700px) {
  .footer > h2.footer-signature { font-size: 18vw; margin-bottom: 40px; }
}

/* PAGE À PROPOS — reprend la grille des dernières créations */
.about-page .coach {
  background-color: var(--red);
}
.about-page .site-header { position: relative; }
.about-page .coach { min-height: 620px; }
.about-page .coach .body-copy { max-width: 580px; }
.about-page .parcours .creations-heading h2 { font-size: 32px; line-height: 1.08; }
.parcours-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 30px; align-items: start; }
.parcours-card { min-width: 0; }
.parcours-card > img { display: block; width: 100%; height: auto; aspect-ratio: .85; object-fit: cover; margin-bottom: 18px; }
.parcours-card-content { padding-top: 0; }
.parcours-number { display: block; font-size: 13px; line-height: 1.5; text-transform: uppercase; letter-spacing: .02em; }
.parcours-card h3 { font-family: NeueMontrealBook, Arial, sans-serif; font-size: 18px; line-height: 1.35; text-transform: uppercase; margin-top: 6px; }
.parcours-card p { font-size: 14px; line-height: 1.6; margin-top: 10px; max-width: 42ch; }
.footer-mail { display: inline-block; border-bottom: 1px solid var(--yellow); color: var(--yellow); padding: 8px 0; margin-top: 15px; }
@media (max-width: 1000px) and (min-width: 701px) {
  .parcours-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-page .coach { min-height: 0; }
}
@media (max-width: 700px) {
  .about-page .coach { min-height: 0; }
  .about-page .coach-image > img { aspect-ratio: .9; }
  .parcours-grid { grid-template-columns: 1fr; gap: 45px; }
  .parcours-card > img { aspect-ratio: .9; }
  .about-page .parcours .creations-heading h2 { font-size: 32px; }
}

/* =====================================
   PAGE CRÉATION — STAINORA
   ===================================== */
.creation-page { overflow-x: clip; }
.creation-page .site-header { position: relative; }
.creation-cover { padding: 20px var(--gutter) 0; background: var(--paper); }
.creation-cover h1 { font-family: Editorial, Georgia, serif; font-weight: 400; font-style: normal; color: var(--ink); font-size: clamp(76px, 16.5vw, 290px); letter-spacing: -.055em; line-height: 1; white-space: nowrap; }

.cover-meta { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--ink); padding: 15px 0 25px; font-size: 11px; letter-spacing: .09em; }
.cover-picture { position: relative; height: clamp(380px, 57vw, 710px); overflow: hidden; background: var(--blue); }
.cover-picture > img { width: 100%; height: 100%; object-fit: cover; }
.cover-stamp { position: absolute; right: 3%; bottom: 6%; display: grid; place-items: center; width: clamp(100px, 12vw, 170px); aspect-ratio: 1; border-radius: 50%; transform: rotate(10deg); background: var(--yellow); color: var(--ink); text-align: center; font-size: clamp(11px, 1vw, 16px); line-height: 1.25; }
.creation-intro { text-align: center; padding-top: clamp(80px, 9vw, 160px); }
.intro-kicker { margin-bottom: 30px; }
.creation-intro h2 { font-size: clamp(48px, 7vw, 115px); line-height: 1; }
.creation-intro h2 em { font-weight: 200; }
.intro-collage { position: relative; height: clamp(310px, 40vw, 560px); max-width: 850px; margin: -4px auto 50px; }
.intro-collage img { position: absolute; object-fit: cover; box-shadow: 0 14px 35px #20201c1a; }
.collage-one { left: 11%; top: 22%; width: 27%; aspect-ratio: .8; transform: rotate(-6deg); }
.collage-two { left: 36%; top: 5%; width: 31%; aspect-ratio: .77; }
.collage-three { right: 8%; bottom: 6%; width: 25%; aspect-ratio: 1; transform: rotate(8deg); }
/* ===== COULEURS — PAGE CRÉATION (4 ÉTAPES) =====
   Modifie ici la couleur du fond et du texte principal.
   --red = bordeaux | --ink = noir | --yellow = jaune | --blue = bleu
*/
.creation-feature { background: var(--blue); color: var(--yellow); overflow: hidden; }
.feature-marquee { white-space: nowrap; overflow: hidden; font-family: Editorial, Georgia, serif; font-size: clamp(70px, 13vw, 210px); line-height: 1.2; letter-spacing: -.05em; opacity: .95; }
.feature-marquee > span { display: inline-block; width: max-content; animation: marquee 26s linear infinite; }
.feature-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(40px, 8vw, 130px); align-items: center; padding-top: 35px; }
.feature-visual { position: relative; padding: 3% 10% 9% 8%; min-width: 0; }
.feature-big { width: 100%; aspect-ratio: .78; object-fit: cover; transform: rotate(-3deg); }
.feature-small { position: absolute; width: 34%; aspect-ratio: .85; object-fit: cover; border: 7px solid var(--paper); box-shadow: 0 12px 28px #0004; }
.small-top { top: 9%; right: 0; transform: rotate(6deg); }
.small-bottom { bottom: 3%; left: 0; transform: rotate(-8deg); }
.feature-number { position: absolute; bottom: 5%; right: 3%; font-family: Editorial, Georgia, serif; font-size: clamp(35px, 5vw, 70px); }
.feature-content h2 { margin-bottom: 50px; font-size: clamp(52px, 5.3vw, 85px); }
.feature-text-item { display: grid; grid-template-columns: 62px 1fr; gap: 12px; border-top: 1px solid #fff6; padding: 20px 0; }
.feature-text-item > span { font-family: Editorial, Georgia, serif; font-size: 29px; }
.feature-text-item h3 { font-family: NeueMontrealBook, Arial, sans-serif; font-size: 15px; margin-bottom: 8px; }
/* COULEUR — descriptions des 4 étapes de la page Création */
.feature-text-item p { color: var(--ink); font-size: 14px; line-height: 1.65; max-width: 470px; }
.feature-content .button { margin-top: 26px; }
.creation-gallery { background: var(--paper); }
.gallery-head { display: flex; justify-content: space-between; align-items: start; gap: 30px; }
.gallery-head h2 { font-family: Editorial, Georgia, serif; font-weight: 400; font-style: normal; color: var(--ink); letter-spacing: -.045em; line-height: 1; font-size: clamp(65px, 12vw, 200px); }
.gallery-symbol { font-family: NeueMontrealBook, Arial, sans-serif; font-weight: 400; font-size: .45em; vertical-align: top; position: relative; top: .12em; letter-spacing: 0; }
.gallery-controls { display: flex; gap: 8px; padding-top: 24px; }
.gallery-controls button { width: 47px; height: 47px; background: transparent; border: 1px solid var(--ink); border-radius: 50%; font-size: 24px; }
.gallery-controls button:hover { background: var(--yellow); }
.gallery-note { margin: 20px 0 25px 33%; font-size: 11px; letter-spacing: .08em; }
/* Galerie : largeur constante des cartes, zoom intérieur sans déplacer les voisines. */
.gallery-track {
  display: flex;
  align-items: center;
  gap: clamp(16px, 2vw, 28px);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 8%;
  padding: 45px 6% 45px;
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
}
.gallery-track figure {
  position: relative;
  margin: 0;
  flex: 0 0 clamp(225px, 25vw, 350px);
  min-width: 0;
  scroll-snap-align: center;
  cursor: pointer;
  z-index: 1;
}
.gallery-track figure.gallery-highlight { z-index: 2; }
.gallery-track img {
  display: block;
  width: 100%;
  height: clamp(290px, 28vw, 400px);
  object-fit: cover;
  transform: scale(.88);
  transition: transform .5s ease, filter .5s ease;
  filter: saturate(.83);
  transform-origin: center center;
}
.gallery-track figure.gallery-highlight img {
  transform: scale(1.07);
  filter: saturate(1);
}
.gallery-track figcaption { margin-top: 17px; font-size: 11px; letter-spacing: .05em; }
.gallery-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 55px; padding-top: 20px; border-top: 1px solid var(--ink); font-size: 12px; }
.gallery-bottom a { border-bottom: 1px solid var(--ink); }
.creation-contact-link { display: inline-block; border-bottom: 1px solid var(--yellow); color: var(--yellow); padding: 8px 0; margin-top: 15px; font-size: 13px; }
@media (max-width: 900px) { .feature-layout { grid-template-columns: 1fr; gap: 10px; } .feature-visual { max-width: 650px; width: 100%; margin: auto; } .feature-content { max-width: 650px; } }
@media (max-width: 700px) {
  .creation-cover { padding-top: 25px; }
  .creation-cover h1 { font-size: clamp(55px, 17.2vw, 125px); letter-spacing: -.075em; }
  .cover-meta { font-size: 9px; padding: 13px 0 17px; }
  .cover-picture { height: 440px; }
  .cover-stamp { width: 100px; font-size: 10px; }
  .creation-intro { padding-top: 75px; }
  .creation-intro h2 { font-size: clamp(42px, 10vw, 65px); }
  .intro-collage { height: 340px; margin-top: 16px; }
  .collage-one { left: 1%; top: 29%; width: 39%; }
  .collage-two { left: 34%; top: 5%; width: 41%; }
  .collage-three { right: 0; bottom: 6%; width: 33%; }
  .feature-marquee { font-size: 75px; }
  .feature-content h2 { font-size: 53px; margin-bottom: 32px; }
  .feature-text-item { grid-template-columns: 50px 1fr; }
  .gallery-head h2 { font-size: clamp(48px, 11.5vw, 90px); }
  .gallery-controls { padding-top: 16px; }
  .gallery-controls button { width: 39px; height: 39px; }
  .gallery-note { margin-left: 0; }
  .gallery-track { padding: 40px 7% 40px; gap: 16px; }
  .gallery-track figure { flex-basis: 70vw; }
  .gallery-track img { height: 320px; }
}

/* Préférences d’accessibilité : aucune animation automatique si mouvement réduit. */
@media (prefers-reduced-motion: reduce) {
  .feature-marquee > span { animation: none; }
  .gallery-track img { transition: none; }
}

/* Galerie Création : transition plus courte et déplacement libre près des bords */
.creation-page .gallery-track { scroll-snap-type: none; scroll-behavior: auto; }
.creation-page .gallery-track.gallery-edge-scrolling { scroll-snap-type: none; }
.creation-page .gallery-track img { transition: transform .28s ease-out, filter .28s ease-out; }
@media (prefers-reduced-motion: reduce) {
  .creation-page .gallery-track img { transition: none; }
}

/* TITRE CRÉATION PERSONNALISÉE — même famille que les titres éditoriaux */
.creation-page .creation-cover h1 {
  white-space: normal;
  font-size: clamp(58px, 10vw, 170px);
  line-height: .99;
  letter-spacing: -.045em;
}
.creation-page .creation-cover h1 em {
  display: block;
  font-family: Balete, Georgia, serif;
  font-weight: 200;
  font-style: italic;
  font-synthesis: none;
  font-size: .82em;
  letter-spacing: -.035em;
  text-transform: none;
}
/* Courtes descriptions sous chaque légende de galerie */
.creation-page .gallery-track .gallery-description {
  margin-top: 8px;
  max-width: 33ch;
  font-size: 13px;
  line-height: 1.55;
  letter-spacing: 0;
  color: var(--ink);
}
@media (max-width: 700px) {
  .creation-page .creation-cover h1 { font-size: clamp(47px, 12.7vw, 92px); }
  .creation-page .creation-cover h1 em { font-size: .76em; }

}

.creation-cover h1 {
  display: flex;
  align-items: baseline;
  gap: 20px;
  white-space: nowrap;
  margin-bottom: 30px;
}

.creation-cover h1 em {
  font-size: 0.45em;
  font-weight: 200;
  font-style: italic;
}

@media (max-width: 700px) {
  .creation-cover h1 {
    gap: 8px;
    font-size: 9vw;
  }

  .creation-cover h1 em {
    font-size: 0.45em;
  }
}

/* ======================================================
   PROJET CŒUR — photos superposées et galerie de 6 images
   ====================================================== */

.creation-page .gallery-project-link {
  display: block;
  color: inherit;
}

.creation-page .gallery-project-link figcaption {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.creation-page .gallery-project-link figcaption span {
  font-size: 18px;
  line-height: .8;
  transition: transform .2s ease;
}

.creation-page .gallery-project-link:hover figcaption span {
  transform: translate(3px, -3px);
}

/* PAGE PROJET */

.project-page {
  overflow-x: clip;
}

.project-page .site-header {
  position: relative;
}

/* INTRODUCTION */

.heart-intro {
  padding-top: clamp(32px, 4vw, 65px);
  padding-bottom: clamp(85px, 10vw, 155px);
}

.heart-intro-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: clamp(35px, 5vw, 75px);
}

.project-return,
.heart-text-link {
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-bottom: 1px solid currentColor;
  padding-bottom: 5px;
}

.heart-label {
  font-size: 11px;
  letter-spacing: .08em;
}

/* PHOTOS À GAUCHE + TEXTE À DROITE */

.heart-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(50px, 8vw, 135px);
  align-items: center;
}

.heart-photo-stack {
  position: relative;
  width: 100%;
  max-width: 590px;
  min-height: clamp(410px, 45vw, 625px);
}

.heart-photo-stack figure {
  margin: 0;
}

.heart-stack-main {
  width: 69%;
  position: absolute;
  left: 3%;
  top: 0;
  transform: rotate(-2deg);
}

.heart-stack-main img {
  width: 100%;
  aspect-ratio: .8;
  object-fit: cover;
}

.heart-stack-overlap {
  width: 55%;
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 10px;
  background: white;
  box-shadow: 0 15px 45px #20201c20;
  transform: rotate(5deg);
}

.heart-stack-overlap img {
  width: 100%;
  aspect-ratio: .84;
  object-fit: cover;
}

/* TEXTE DE PRÉSENTATION */

.heart-intro-text {
  max-width: 620px;
}

/* TITRE CŒUR EN VERRE — TYPOGRAPHIE CORRIGÉE */

.heart-intro-text h1 {
  font-family: Editorial, Georgia, serif;
  font-weight: 400;
  font-size: clamp(62px, 8vw, 135px);
  line-height: 1.08;
  letter-spacing: -.05em;
  margin-bottom: clamp(25px, 3vw, 45px);
}

.heart-intro-text h1 em {
  font-family: Balete, Georgia, serif;
  font-size: .85em;
  font-weight: 200;
  font-style: italic;
  font-synthesis: none;
  line-height: 1;
  letter-spacing: -.035em;
  white-space: nowrap;
}

/* SÉPARATION ET DESCRIPTION */

.heart-rule {
  width: 100%;
  border-top: 1px solid var(--ink);
  margin-bottom: clamp(25px, 3vw, 45px);
}

.heart-intro-text h2 {
  font-size: clamp(37px, 4.1vw, 70px);
  margin-bottom: 24px;
}

.heart-intro-text h2 em {
  font-weight: 200;
}

.heart-intro-text > p:not(.eyebrow) {
  font-size: clamp(15px, 1.25vw, 19px);
  max-width: 52ch;
  line-height: 1.7;
}

.heart-intro-text .heart-text-link {
  margin-top: 35px;
}

/* ===== COULEURS — PAGE HEARTKEEPER / CŒUR : GALERIE 6 PHOTOS =====
   C'est ici que tu modifies le bleu du fond et la couleur générale du texte.
*/

.heart-gallery {
  background: var(--blue); /* FOND de la galerie */
  color: var(--ink); /* TEXTE général de la galerie */
}

.heart-gallery-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 35px;
  margin-bottom: clamp(45px, 6vw, 85px);
}

.heart-gallery-header h2 {
  color: var(--yellow); /* GRAND TITRE de la galerie */
  font-size: clamp(60px, 8vw, 130px);
}

.heart-gallery-header h2 em {
  font-weight: 200;
  font-synthesis: none;
}

.heart-gallery-header > p {
  max-width: 300px;
  font-size: 15px;
}

/* GRILLE DE 6 PHOTOS */

.heart-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(35px, 5vw, 75px) clamp(16px, 2.7vw, 42px);
}

.heart-gallery-card {
  margin: 0;
  min-width: 0;
}

.heart-gallery-card img {
  width: 100%;
  aspect-ratio: .86;
  object-fit: cover;
}

.heart-gallery-card:nth-child(2) img,
.heart-gallery-card:nth-child(5) img {
  aspect-ratio: 1;
}

.heart-gallery-card figcaption {
  border-top: 1px solid #20201c75;
  margin-top: 15px;
  padding-top: 12px;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .06em;
}

.heart-gallery-card p {
  max-width: 34ch;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink); /* DESCRIPTION sous chaque photo */
  margin-top: 10px;
}

/* BAS DE GALERIE */

.heart-gallery-end {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  border-top: 1px solid #20201c75;
  padding-top: 23px;
  margin-top: clamp(55px, 7vw, 100px);
}

/* TABLETTES */

@media (max-width: 900px) {
  .heart-hero-grid {
    gap: 40px;
  }

  .heart-photo-stack {
    min-height: 420px;
  }

  .heart-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* MOBILES */

@media (max-width: 700px) {
  .heart-intro-top {
    padding-bottom: 25px;
  }

  .heart-hero-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .heart-photo-stack {
    min-height: clamp(360px, 100vw, 530px);
    max-width: 500px;
    margin: 0 auto;
  }

  .heart-intro-text h1 {
    font-size: clamp(60px, 14vw, 95px);
    line-height: 1.1;
  }

  .heart-intro-text h1 em {
    font-size: .85em;
  }

  .heart-intro-text h2 {
    font-size: clamp(40px, 9vw, 62px);
  }

  .heart-gallery-header {
    display: block;
  }

  .heart-gallery-header > p {
    margin-top: 24px;
  }

  .heart-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 15px;
  }

  .heart-gallery-card img,
  .heart-gallery-card:nth-child(2) img,
  .heart-gallery-card:nth-child(5) img {
    aspect-ratio: .85;
  }

  .heart-gallery-card p {
    font-size: 12px;
  }
}

/* PETITS ÉCRANS */

@media (max-width: 420px) {
  .heart-gallery-grid {
    grid-template-columns: 1fr;
  }

  .heart-gallery-card img {
    aspect-ratio: 1;
  }
}


/* ======================================================
   PROJET ÉTOILE : TEXTE À GAUCHE / 2 PHOTOS À DROITE
   ====================================================== */
@media (min-width: 701px) {
  .star-page .heart-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
  .star-page .heart-intro-text { grid-column: 1; grid-row: 1; }
  .star-page .heart-photo-stack { grid-column: 2; grid-row: 1; justify-self: end; }
}
@media (max-width: 700px) {
  .star-page .heart-intro-text { grid-column: 1; grid-row: 1; }
  .star-page .heart-photo-stack { grid-column: 1; grid-row: 2; justify-self: center; }
}

/* PHOTOS DES SIX PROJETS : mêmes proportions verticales */
.heart-gallery-card img,
.heart-gallery-card:nth-child(2) img,
.heart-gallery-card:nth-child(5) img {
 width:100%; height:auto; aspect-ratio:.7; object-fit:cover;
}

/* ===== TITRE CRÉATION — BORD À BORD DE L’IMAGE =====
   « Création » : même bord gauche et droit que la photo en dessous.
   « personnalisée » : juste en dessous, aligné à droite.
   Modifie margin-top pour rapprocher/éloigner le second mot.
*/
.creation-page .creation-cover h1 {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  margin: 0 0 18px;
  gap: 0;
  white-space: normal;
  line-height: 1;
}
.creation-page .creation-cover h1 .creation-title-main {
  display: block;
  width: max-content;
  max-width: none;
  text-transform: none; /* C majuscule uniquement */
  white-space: nowrap;
  font-family: Editorial, Georgia, serif;
  font-weight: 400;
  font-size: 18vw; /* recalculé à la largeur exacte par le script */
  letter-spacing: -.055em;
  line-height: .86;
}
.creation-page .creation-cover h1 em {
  display: block;
  align-self: flex-end;
  width: auto;
  margin-top: -0.015em; /* rapprocher les deux lignes */
  margin-right: 0;
  font-family: Balete, Georgia, serif;
  font-weight: 200;
  font-style: italic;
  font-synthesis: none;
  font-size: clamp(35px, 8vw, 140px);
  letter-spacing: -.035em;
  line-height: 1;
  white-space: nowrap;
}
@media (max-width: 700px) {
  .creation-page .creation-cover h1 { margin-bottom: 14px; }
  .creation-page .creation-cover h1 em { font-size: clamp(25px, 8vw, 70px); }
}

/* =======================================================
   PAGE RESTAURATION — personnalisation indépendante
   ======================================================= */
.restauration-page .creation-cover h1 .creation-title-main { font-size: 12vw; }
.restauration-page .creation-intro { padding-top: clamp(35px, 4vw, 65px); }
/* Collage en miroir de la page Création, en gardant la photo centrale */
.restauration-page .collage-one { left: auto; right: 11%; transform: rotate(6deg); }
.restauration-page .collage-two { left: 36%; transform: rotate(0); }
.restauration-page .collage-three { right: auto; left: 8%; transform: rotate(-8deg); }
/* Section 4 étapes, en bordeaux plutôt qu'en bleu */
.restauration-page .creation-feature { background: var(--red); color: var(--yellow); }
.restauration-page .feature-text-item p { color: var(--paper); }
.restauration-page .feature-text-item { border-color: #fff6; }
@media(max-width:700px) {
 .restauration-page .collage-one { right:1%; left:auto; }
 .restauration-page .collage-two { left:34%; }
 .restauration-page .collage-three { left:0; right:auto; }
}


/* RESTAURATIONS — galeries des pages Entrée, Rosace, Moine et Église */
.restauration-detail-page .heart-gallery {
  background: var(--red);
  color: var(--paper);
}
.restauration-detail-page .heart-gallery-end,
.restauration-detail-page .heart-gallery-card figcaption {
  border-color: #ffffff75;
}
.restauration-detail-page .heart-gallery-card p {
  color: var(--paper);
}


/* ============= OBJETS DÉCORATIFS — page éditoriale ============= */
.objets-page {overflow-x:clip}
.objets-page .site-header {position:relative}
.objets-page .creation-cover {padding-bottom:16px}
.objets-page .creation-cover h1 .creation-title-main {font-size:11vw}
.objets-page .creation-cover h1 em {font-size:clamp(36px,6.8vw,106px)}
.objets-page .cover-meta {margin-top:12px}
.objets-story {display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(25px,7vw,115px);padding-top:clamp(55px,8vw,125px);padding-bottom:clamp(80px,10vw,150px);align-items:center}
.objets-story h2 {font-size:clamp(55px,7vw,112px);line-height:.95}
.objets-story h2 em {font-weight:200}
.objets-story-copy {max-width:480px;margin:34px 0 0 auto;font-size:clamp(15px,1.3vw,19px);line-height:1.75}
.objets-story-visual {position:relative;min-height:clamp(430px,48vw,680px)}
.objets-story-visual .objet-portrait {position:absolute;right:1%;top:3%;width:78%;height:77%;object-fit:cover;transform:rotate(4deg)}
.objets-story-visual .objet-small {position:absolute;left:0;bottom:3%;width:48%;height:41%;object-fit:cover;transform:rotate(-7deg);border:9px solid var(--paper);box-shadow:0 14px 38px #20201c23}
.objets-story-visual .objet-tag {position:absolute;left:3%;top:5%;font-family:Editorial,serif;font-size:clamp(55px,8vw,125px);line-height:1;color:var(--red);transform:rotate(-10deg)}
.objets-note {background:var(--red);color:var(--paper);overflow:hidden;position:relative}
.objets-note-inner {display:grid;grid-template-columns:1fr .8fr;gap:clamp(40px,8vw,130px);align-items:center;min-height:620px;padding-top:clamp(75px,9vw,150px);padding-bottom:clamp(75px,9vw,150px)}
.objets-note .eyebrow {color:var(--yellow)}
.objets-note h2 {color:var(--yellow);font-size:clamp(54px,7.8vw,126px);line-height:.92}
.objets-note h2 em {font-weight:200}
.objets-note p:not(.eyebrow) {max-width:470px;margin-top:35px;font-size:clamp(16px,1.4vw,20px);line-height:1.65}
.objets-note .button {margin-top:36px}
.objets-note-visual {position:relative;min-height:450px}
.objets-note-visual img {width:85%;height:460px;object-fit:cover;transform:rotate(-5deg);margin-left:auto}
.objets-note-visual span {position:absolute;bottom:-35px;left:-5%;font-family:Balete,Georgia,serif;font-size:clamp(50px,7vw,110px);font-style:italic;font-weight:200;color:var(--yellow);transform:rotate(-10deg)}
.objets-gallery {padding-top:clamp(75px,9vw,145px);padding-bottom:clamp(90px,11vw,165px)}
.objets-gallery-head {display:flex;align-items:end;justify-content:space-between;gap:30px;border-bottom:1px solid var(--ink);padding-bottom:25px;margin-bottom:clamp(45px,6vw,85px)}
.objets-gallery h2 {font-size:clamp(58px,10vw,160px)}
.objets-gallery-head p {font-size:12px;letter-spacing:.07em;text-align:right;max-width:260px}
.objets-gallery-grid {display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(25px,7vw,115px);row-gap:clamp(65px,10vw,155px);align-items:start}
.objets-gallery-item {margin:0;min-width:0}
.objets-gallery-item:nth-child(even) {transform:translateY(85px)}
.objets-gallery-item img {width:100%;aspect-ratio:.8;object-fit:cover}
.objets-gallery-item:nth-child(2) img {aspect-ratio:.95}
.objets-gallery-item:nth-child(3) img {aspect-ratio:.95}
.objets-gallery-item:nth-child(4) img {aspect-ratio:.8}
.objets-gallery-item figcaption {display:flex;justify-content:space-between;border-top:1px solid var(--ink);margin-top:18px;padding-top:12px;letter-spacing:.06em;font-size:12px;text-transform:uppercase}
.objets-gallery-end {margin-top:170px;border-top:1px solid var(--ink);padding-top:25px;display:flex;align-items:center;justify-content:space-between;gap:25px;flex-wrap:wrap}
@media(max-width:800px) {
 .objets-story,.objets-note-inner {grid-template-columns:1fr}
 .objets-story-visual {min-height:540px}
 .objets-note-inner {gap:60px}
 .objets-note-visual {min-height:380px}
 .objets-note-visual img {height:360px;width:70%}
}
@media(max-width:700px) {
 .objets-page .creation-cover h1 em {font-size:clamp(28px,8vw,56px)}
 .objets-story {padding-top:55px}
 .objets-story h2 {font-size:clamp(55px,12vw,82px)}
 .objets-story-visual {min-height:440px}
 .objets-note-inner {padding-top:80px;padding-bottom:90px}
 .objets-note-visual {min-height:330px}
 .objets-gallery-head {align-items:start;flex-direction:column}
 .objets-gallery-head p {text-align:left}
 .objets-gallery-grid {column-gap:14px;row-gap:60px}
 .objets-gallery-item:nth-child(even) {transform:translateY(40px)}
 .objets-gallery-item figcaption {font-size:10px}
 .objets-gallery-end {margin-top:105px}
}


/* ================== CONTACT — STAINORA ================== */
.contact-page { overflow-x:clip; }
.contact-page .site-header {position:relative}
.contact-cover {padding:clamp(34px,4vw,64px) var(--gutter) 22px;}
.contact-cover .contact-kicker {display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.contact-cover .contact-kicker::before {content:"";width:30px;height:1px;background:var(--ink)}
.contact-display {font-family:Editorial,Georgia,serif;font-weight:400;font-size:clamp(94px,19vw,380px);letter-spacing:-.064em;line-height:.78;white-space:nowrap;display:block;width:max-content;max-width:none;margin:0}
.contact-cover-bottom {display:flex;align-items:end;justify-content:space-between;gap:25px;margin-top:13px}
.contact-cover-bottom .contact-note {font-size:11px;letter-spacing:.11em;text-transform:uppercase;padding-bottom:13px}
.contact-handwritten {font-family:Balete,Georgia,serif;font-style:italic;font-weight:200;line-height:1;font-size:clamp(45px,7vw,115px);transform:rotate(-3deg);margin-right:1vw;white-space:nowrap}
.contact-horizontal-rule {height:1px;background:var(--ink);margin:20px var(--gutter) 0}
.contact-layout {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:0;margin-top:clamp(35px,5vw,75px);min-height:610px}
.contact-panel {background:var(--red);color:var(--paper);padding:clamp(45px,6vw,105px) clamp(26px,5vw,90px);position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.contact-panel::after {content:"✳";font-family:Editorial,Georgia,serif;font-size:clamp(180px,28vw,450px);position:absolute;right:-.17em;bottom:-.45em;opacity:.12;line-height:1;pointer-events:none}
.contact-panel .eyebrow {color:var(--yellow);position:relative;z-index:1}
.contact-panel h2 {font-size:clamp(52px,6.7vw,108px);color:var(--yellow);line-height:.96;position:relative;z-index:1}
.contact-panel h2 em {font-family:Balete,Georgia,serif;font-weight:200;font-style:italic;letter-spacing:-.02em}
.contact-panel-bottom {position:relative;z-index:1;margin-top:60px}
.contact-panel-bottom p {max-width:37ch;font-size:clamp(16px,1.35vw,19px);line-height:1.65;margin-bottom:30px}
.contact-mail-button {display:inline-flex;align-items:center;justify-content:space-between;gap:38px;background:var(--yellow);color:var(--ink);padding:19px 22px 19px 26px;border-radius:40px;text-transform:uppercase;letter-spacing:.055em;font-size:12px;transition:transform .2s,background .2s}
.contact-mail-button:hover {background:#fff9c9;transform:translateY(-3px)}
.contact-mail-button .arrow {font-size:23px;line-height:.7}
.contact-information {padding:clamp(38px,5vw,85px) var(--gutter) clamp(50px,7vw,120px);display:flex;flex-direction:column;justify-content:space-between}
.contact-info-heading {display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--ink);padding-bottom:18px;font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.contact-info-heading span:last-child {font-family:Editorial,Georgia,serif;font-size:30px;line-height:1}
.contact-info-list {margin-top:35px}
.contact-info-item {display:grid;grid-template-columns:130px minmax(0,1fr);gap:18px;align-items:start;padding:25px 0;border-bottom:1px solid #20201c47}
.contact-info-item dt {font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding-top:6px}
.contact-info-item dd {margin:0;font-family:Editorial,Georgia,serif;font-size:clamp(22px,2.3vw,37px);line-height:1.22;overflow-wrap:anywhere}
.contact-info-item dd a {text-decoration-thickness:1px;text-underline-offset:5px}
.contact-info-item dd a:hover {text-decoration:underline}
.contact-info-item .small-description {font:13px/1.6 NeueMontrealBook,Arial,sans-serif;margin-top:8px;display:block}
.contact-phone-placeholder {font:16px/1.6 NeueMontrealBook,Arial,sans-serif;color:#777}
.contact-last-line {display:flex;justify-content:space-between;align-items:end;gap:25px;margin-top:55px}
.contact-last-line p {font-family:Balete,Georgia,serif;font-weight:200;font-style:italic;font-size:clamp(34px,4.8vw,75px);line-height:1;max-width:460px}
.contact-last-line .asterisk {font-family:Editorial,Georgia,serif;font-size:clamp(70px,10vw,150px);color:var(--red);line-height:.6}
.contact-bottom-ribbon {background:var(--blue);padding:clamp(45px,7vw,105px) var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:30px}
.contact-bottom-ribbon h2 {font-size:clamp(40px,6vw,90px);color:var(--yellow);line-height:1}
.contact-bottom-ribbon h2 em {font-family:Balete,Georgia,serif;font-weight:200;font-style:italic}
.contact-bottom-ribbon a {flex-shrink:0}
@media(max-width:900px) { .contact-layout {grid-template-columns:1fr} .contact-panel {min-height:540px} .contact-information {padding-left:var(--gutter);padding-right:var(--gutter)} }
@media(max-width:700px) { .contact-cover {padding-top:38px} .contact-cover-bottom {align-items:end} .contact-cover-bottom .contact-note {font-size:9px;max-width:100px} .contact-handwritten {font-size:clamp(37px,9vw,72px)} .contact-layout {margin-top:34px} .contact-panel {min-height:480px;padding:60px var(--gutter)} .contact-panel h2 {font-size:clamp(52px,11vw,78px)} .contact-info-item {grid-template-columns:1fr;gap:6px;padding:20px 0} .contact-info-item dd {font-size:clamp(24px,6vw,36px)} .contact-bottom-ribbon {flex-direction:column;align-items:flex-start} .contact-bottom-ribbon h2 {font-size:clamp(43px,10vw,70px)} }
@media(prefers-reduced-motion:reduce) { .contact-mail-button {transition:none} }

/* FINALISATION — navigation fixe sur toutes les pages */
.about-page .site-header, .creation-page .site-header, .objets-page .site-header, .contact-page .site-header, .project-page .site-header { position: sticky; top: 0; z-index: 1000; }
/* Espacement plus lisible de la typographie Balete */
.balete-italic, .portrait-heading > em, .creation-page .creation-cover h1 em, .objets-note-visual span, .contact-last-line p { letter-spacing: .035em; }
/* Rapprocher les sous-titres des titres, sans altérer leur structure */
.creation-page .creation-cover h1 { gap: 0; }
.creation-page .creation-cover h1 em { margin-top: -.14em; letter-spacing: .025em; }
.objets-page .creation-cover h1 em { margin-top: -.18em; }
.portrait-heading > em { letter-spacing: .045em; }
/* Même traitement visuel pour le numéro de téléphone et les coordonnées */
.contact-info-item dd > a, .contact-info-item dd > span > a { font: inherit; color: inherit; }
/* Lien d'action harmonisé avec le pied de page */
.footer-grid > div:first-child > p { margin-top: 5px; }
.footer-grid > div:first-child > p a:hover { text-decoration: underline; }
@media (max-width:700px) { .creation-page .creation-cover h1 em { margin-top: -.08em; } .objets-page .creation-cover h1 em { margin-top: -.12em; } }