* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #FAF8F5; color: #092B57; font: 300 15px/1.7 Inter, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #DFBB89; outline-offset: 4px; }
h1, h2, h3, p, figure, blockquote { margin: 0; }
h1, h2, h3 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 300; line-height: 1.14; }
h1 { font-size: clamp(2.7rem, 3.8vw, 4.3rem); letter-spacing: -.025em; }
h2 { font-size: clamp(2rem, 2.8vw, 3rem); letter-spacing: -.015em; }
h3 { font-size: clamp(1.45rem, 1.8vw, 2rem); }
p + p { margin-top: 1rem; }
.shell { width: min(100% - 72px, 1160px); margin-inline: auto; }
.narrow { max-width: 810px; }
.section-pad { padding-block: clamp(64px, 7vw, 94px); }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 50; padding: 10px; background: #092B57; color: #fff; }
.skip-link:focus { top: 16px; }
.site-header { padding: 17px 24px 12px; text-align: center; background: #FAF8F5; }
.logo { width: clamp(190px, 19vw, 250px); margin: auto; }

/* Les valeurs du voile proviennent de la home page Say I Do. */
.current, .signature, .faq {
  background-color: #FAF8F5;
  background-image: radial-gradient(circle at 12% 10%, rgba(223, 187, 137, 0.14), rgba(0, 0, 0, 0) 30%),
    radial-gradient(circle at 88% 16%, rgba(9, 43, 87, 0.08), rgba(0, 0, 0, 0) 28%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(245, 240, 232, 0.54));
}
.social, .future, .about, .legal-footer { background: #FAF8F5; }
.social, .current, .future, .signature, .about, .faq { border-top: 1px solid rgba(9, 43, 87, .055); }

.hero { display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto; width: 100vw; max-width: none; margin-left: calc(100% - 100vw); margin-right: 0; padding-inline: 0; overflow: hidden; }
.hero-image { position: relative; grid-area: 1 / 1; width: 100vw; max-width: none; height: max(720px, 78svh); margin: 0; padding: 0; overflow: hidden; }
.hero-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.hero-image::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(to right, rgba(6,28,56,.80) 0%, rgba(9,43,87,.34) 50%, transparent 100%), linear-gradient(to top, rgba(6,28,56,.18) 0%, transparent 50%), linear-gradient(rgba(9,43,87,.06), rgba(9,43,87,.06)); }
.hero-copy { position: relative; z-index: 2; grid-area: 1 / 1; align-self: center; width: min(47vw, 575px); margin-left: max(36px, calc((100vw - 1160px)/2)); padding: 40px 0; color: #FFFDF9; }
.hero h1 { max-width: 565px; font-size: clamp(2.65rem, 3.6vw, 4rem); line-height: 1.05; }
.hero h2 { max-width: 510px; font-size: clamp(1.5rem, 2vw, 2rem); margin-top: 21px; }
.hero-copy .button { margin-top: 25px; background: #FAF8F5; color: #092B57; border-color: #FAF8F5; }
.hero-copy .button:hover { background: transparent; color: #FFFDF9; border-color: #FAF8F5; }
.hero-transition { grid-area: 2 / 1; width: 100%; padding: clamp(39px, 4.5vw, 58px) max(22px, calc((100vw - 850px)/2)) clamp(28px, 3vw, 42px); background: #FAF8F5; color: #092B57; text-align: center; font-size: clamp(1.4rem, 1.95vw, 1.85rem); line-height: 1.28; }
.hero-transition em { font-weight: 400; }
.photo { position: relative; }
.photo figcaption { position: absolute; right: 12px; bottom: 10px; z-index: 3; margin: 0; color: #fff; font-size: 10px; font-weight: 400; line-height: 1.2; text-align: right; text-shadow: 0 1px 2px rgba(0,0,0,.3); }
.photo figcaption a { text-underline-offset: 2px; }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; width: fit-content; max-width: 100%; min-height: 39px; padding: 9px 17px; border: 1px solid #092B57; border-radius: 4px; background: #092B57; color: #FAF8F5; text-decoration: none; font: 400 12px/1.35 Inter, Arial, sans-serif; letter-spacing: .01em; transition: background .2s, border-color .2s, color .2s; }
.button:hover { background: #17416d; border-color: #17416d; color: #FAF8F5; }
.button span { font-size: 15px; line-height: 1; }
.button--text { border: 0; border-bottom: 1px solid #DFBB89; border-radius: 0; background: transparent; color: #092B57; padding: 4px 0 5px; }
.button--text:hover { color: #9b7549; background: transparent; border-color: #DFBB89; }
.button--outline-gold { border-color: #DFBB89; background: transparent; color: #092B57; }
.button--outline-gold:hover { border-color: #DFBB89; background: #DFBB89; color: #092B57; }
.cta-row { margin-top: 25px; text-align: center; }
.social .cta-row { margin-top: 42px; }
.current-cta { margin-top: 0; }

.social { padding-top: clamp(22px, 3vw, 42px); }
.stat-line { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; gap: 16px; max-width: 760px; margin: 0 auto; text-align: center; }
.stat { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.stat-number { color: #DFBB89; font: 300 clamp(2.4rem, 3.4vw, 3.3rem)/1 'Cormorant Garamond', Georgia, serif; }
.stat-stars { color: #DFBB89; font: 400 18px/1.9 'Cormorant Garamond', Georgia, serif; letter-spacing: 2px; }
.stat-label { color: #092B57; font: 300 12px/1.35 Inter, Arial, sans-serif; }
.google-mark { display: flex; justify-content: center; margin: 32px auto 18px; }
.google-mark img { width: 112px; }
.review-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; isolation: isolate; }
.review-item { position: relative; z-index: 1; display: flex; justify-content: center; align-items: center; width: 100%; height: 150px; padding: 5px; border: 1px solid #e9e6e1; background: #fff; cursor: zoom-in; }
.review-item > img { width: 100%; height: 100%; object-fit: contain; }
.review-popover { display: none; }
@media (hover: hover) and (min-width: 901px) {
  .review-item:hover, .review-item:focus-visible { z-index: 20; }
  .review-popover { display: block; position: absolute; top: 0; left: 50%; width: min(76vw, 900px); max-height: min(65vh, 560px); overflow: auto; padding: 8px; border: 1px solid #DFBB89; background: #fff; opacity: 0; visibility: hidden; pointer-events: none; transform: translateX(-50%) scale(.82); transform-origin: center top; transition: opacity .25s ease, transform .25s ease, visibility .25s; }
  .review-popover img { display: block; width: 100%; height: auto; max-width: none; }
  .review-item:hover .review-popover, .review-item:focus-visible .review-popover { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) scale(1); }
  .review-item:nth-child(4n + 1) .review-popover { left: 0; transform: scale(.82); transform-origin: left top; }
  .review-item:nth-child(4n + 1):hover .review-popover, .review-item:nth-child(4n + 1):focus-visible .review-popover { transform: scale(1); }
  .review-item:nth-child(4n) .review-popover { left: auto; right: 0; transform: scale(.82); transform-origin: right top; }
  .review-item:nth-child(4n):hover .review-popover, .review-item:nth-child(4n):focus-visible .review-popover { transform: scale(1); }
  .review-item:nth-child(n + 5) .review-popover { top: auto; bottom: 0; transform-origin: center bottom; }
  .review-item:nth-child(n + 5):nth-child(4n + 1) .review-popover { transform-origin: left bottom; }
  .review-item:nth-child(n + 5):nth-child(4n) .review-popover { transform-origin: right bottom; }
}
.review-dialog { width: min(96vw, 980px); max-width: 96vw; max-height: 92dvh; overflow: hidden; padding: 42px 10px 10px; border: 1px solid #DFBB89; background: #fff; color: #092B57; }
.review-dialog::backdrop { background: rgba(9, 43, 87, .57); }
.review-close { position: absolute; right: 10px; top: 5px; border: 0; background: transparent; color: #092B57; font: 300 29px/1 Inter, Arial, sans-serif; cursor: pointer; padding: 3px 9px; }
.review-dialog-content { overflow: auto; max-height: calc(92dvh - 58px); }
.review-dialog-content img { width: max(100%, 780px); max-width: none; height: auto; }

.current h2 { max-width: 880px; margin-inline: auto; text-align: center; font-size: clamp(2rem, 2.7vw, 2.85rem); }
.chapter-hinge { color: #DFBB89; text-align: center; font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(2rem, 2.8vw, 2.7rem); font-weight: 300; }
.current .chapter-hinge { margin: 29px auto 39px; }
.question-list { list-style: none; padding: 0; margin: 0 0 20px; }
.question-list li { border-top: 1px solid rgba(9,43,87,.18); padding: 10px 0 10px 24px; position: relative; }
.question-list li::before { content: '—'; position: absolute; left: 0; color: #b48b55; }
.question-list strong, .signature strong, .about strong { font-weight: 600; }
.section-heading { max-width: 860px; margin: 0 auto 30px; }
.future .section-heading { margin-bottom: 46px; }
.wide-photo { width: min(100%, 1050px); margin: 0 auto 55px; }
.wide-photo img { width: 100%; height: auto; }
.story-list { max-width: 940px; margin: auto; }
.story { display: grid; grid-template-columns: minmax(300px, .95fr) 1fr; gap: 0 42px; padding: 34px 0; border-top: 1px solid rgba(223,187,137,.55); }
.story h3 { position: relative; grid-row: 1 / span 5; padding: 0 6px 0 30px; font-size: clamp(1.95rem, 2.2vw, 2.42rem); line-height: 1.1; }
.story h3::before, .signature-copy > p::before { content: '✦'; position: absolute; left: 0; top: .12em; color: #DFBB89; font: 300 17px/1 'Cormorant Garamond', Georgia, serif; }
.story blockquote { font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(1.08rem, 1.2vw, 1.24rem); font-style: italic; line-height: 1.42; margin-bottom: 18px; }
.story blockquote strong { font-weight: 600; }
.story cite { display: block; margin-top: 6px; color: #DFBB89; font-family: Inter, Arial, sans-serif; font-size: 11px; font-style: normal; font-weight: 400; white-space: nowrap; letter-spacing: .03em; }
.story blockquote:last-child { margin: 0; }

.signature .split { display: block; }
.signature-copy { max-width: 810px; margin: 0 auto; }
.signature-copy h2 { max-width: 790px; margin: 0 auto 33px; text-align: center; }
.signature-copy > p { position: relative; padding-left: 31px; margin-top: 1.25rem; }
.signature-copy > p::before { top: .25em; }
.about .button { margin-top: 22px; }
.signature-cta { margin-top: 30px; }
.signature figure { width: min(100%, 1090px); margin: 54px auto 0; }
.signature figure img { width: 100%; height: auto; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(42px, 6vw, 82px); align-items: center; }
.about-split { grid-template-columns: .9fr 1fr; }
.portrait { width: 100%; max-width: 525px; margin: auto; }
.portrait img { width: 100%; height: auto; }
.about h2 { margin-bottom: 17px; }

.faq-title { margin-bottom: 33px; text-align: center; }
.faq details { border-top: 1px solid rgba(9,43,87,.2); }
.faq details:last-child { border-bottom: 1px solid rgba(9,43,87,.2); }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 0; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; flex: none; color: #b48b55; font: 300 23px/1 Inter, Arial, sans-serif; }
.faq details[open] summary::after { content: '−'; }
.faq summary h3 { font-size: clamp(1.5rem, 1.9vw, 2rem); }
.answer { max-width: 740px; padding: 0 22px 20px 0; animation: answer-in .2s ease-out; }
.answer ol { padding-left: 22px; margin: 0 0 18px; }
.answer li { padding-left: 5px; margin: 6px 0; }
.answer p + p { margin-top: 15px; }
@keyframes answer-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.faq-cta { margin-top: 39px; }
.legal-footer { display: flex; flex-direction: column; align-items: center; gap: 15px; padding: 63px 20px 34px; color: #092B57; background: #FAF8F5; font: 300 11px/1.4 Inter, Arial, sans-serif; text-align: center; border-top: 1px solid rgba(9,43,87,.06); }
.legal-footer img { width: 157px; }
.legal-links { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 9px; }
.legal-footer a { text-underline-offset: 3px; }

@media (max-width: 900px) {
  .hero-image img { object-position: 52% 36%; }
  .hero-copy { width: min(60%, 520px); }
  .hero h1 { font-size: clamp(2.5rem, 4vw, 3.3rem); }
  .hero h2 { font-size: 1.7rem; }
  .hero-transition { font-size: 1.55rem; }
  .review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-item { height: 175px; }
  .split { grid-template-columns: 1fr; gap: 34px; }
  .story { grid-template-columns: 1fr; gap: 12px; }
  .story h3 { grid-row: auto; margin-bottom: 7px; }
  .about-split .portrait { margin: 0; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .hero-image img { object-position: 55% 36%; }
}
@media (min-width: 901px) and (min-aspect-ratio: 16/9) {
  .hero-image img { object-position: center 28%; }
}
@media (max-width: 600px) {
  body { font-size: 14px; line-height: 1.65; }
  .shell { width: min(100% - 38px, 1160px); }
  .site-header { padding: 13px 16px 9px; }
  .logo { width: 190px; }
  .section-pad { padding-block: 57px; }
  .hero-image { height: max(610px, 79svh); }
  .hero-image img { object-position: 56% 34%; }
  .hero-image::before { background: linear-gradient(to top, rgba(6,28,56,.87) 0%, rgba(9,43,87,.58) 44%, transparent 78%), linear-gradient(rgba(9,43,87,.06), rgba(9,43,87,.06)); }
  .hero-copy { align-self: end; width: min(100% - 38px, 500px); margin: 0 auto; padding: 0 0 47px; }
  .hero h1 { font-size: clamp(2.25rem, 8.6vw, 2.85rem); }
  .hero h2 { font-size: 1.42rem; margin-top: 16px; }
  .hero-copy .button { margin-top: 21px; }
  .hero-transition { padding: 36px 22px 30px; font-size: 1.38rem; }
  .photo figcaption { right: 8px; bottom: 7px; font-size: 9px; }
  .social { padding-top: 21px; }
  .stat-line { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .stat-number { font-size: 2rem; }
  .stat-stars { font-size: 12px; letter-spacing: 0; line-height: 2.5; }
  .stat-label { font-size: 9px; }
  .google-mark { margin: 29px auto 13px; }
  .google-mark img { width: 86px; }
  .social .cta-row { margin-top: 35px; }
  .review-grid { gap: 7px; }
  .review-item { height: 127px; padding: 3px; }
  .review-dialog { max-width: 96vw; padding: 40px 7px 7px; }
  .review-dialog-content img { width: max(100%, 780px); }
  .current h2 { font-size: 2rem; }
  .current .chapter-hinge { margin: 23px 0 32px; font-size: 1.9rem; }
  .future .section-heading { margin-bottom: 40px; }
  .wide-photo { margin-bottom: 31px; }
  .story { padding: 18px 0; gap: 10px; }
  .story h3 { padding-left: 25px; font-size: 1.72rem; }
  .story h3::before { font-size: 14px; }
  .story blockquote { font-size: 1.08rem; }
  .signature figure { margin-top: 30px; }
  .signature-copy h2 { margin-bottom: 26px; }
  .signature-copy > p { padding-left: 25px; }
  .about-split .portrait { max-width: 100%; }
  .faq-title { margin-bottom: 25px; font-size: 2.08rem; }
  .faq summary { padding: 15px 0; }
  .faq summary h3 { font-size: 1.57rem; }
  .answer { padding-right: 0; }
  .faq-cta { margin-top: 31px; }
  .legal-footer { padding-top: 51px; }
}
@media (max-width: 430px) {
  .hero-image img { object-position: 57% 32%; }
}
@media (max-width: 390px) {
  .hero-image img { object-position: 58% 31%; }
  .hero h1 { font-size: 2.12rem; }
  .hero h2 { font-size: 1.34rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button, .review-popover { transition: none; }
  .answer { animation: none; }
}