/* Plaquette mariage (PDF généré au clic) — généré par plaquette-mariage/sources/build.rb : ne pas modifier à la main. */
@font-face { font-family: 'Fraunces'; font-weight: 300 900; src: url('../fonts/fraunces-latin.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 400 800; src: url('../fonts/manrope-latin.woff2') format('woff2'); }
@page { size: A4; margin: 0; }
:root { --gold: #C9A24B; --gold-dark: #7E6226; --night: #1C1916; --night-2: #26211C; --ivory: #F7F2EA; --cream: #F5EFE4; --sand: #EFE7DA; --ink: #1D1A17; --muted: #6B6258; --line: #E4D9C6; --serif: 'Fraunces', Georgia, serif; --sans: 'Manrope', system-ui, sans-serif; }
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
html, body { width: 210mm; height: 297mm; background: #fff; }
body { font-family: var(--sans); -webkit-print-color-adjust: exact; print-color-adjust: exact; line-height: 1.4; }
ul { list-style: none; }
.sheet { position: relative; width: 210mm; height: 297mm; overflow: hidden; display: flex; flex-direction: column; }
.ico { width: 1em; height: 1em; flex: none; display: block; }
.eyebrow { display: flex; align-items: center; gap: 2.6mm; font-size: 7.2pt; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); }
.eyebrow::before { content: ''; width: 8mm; height: .3mm; background: currentColor; flex: none; }
.contacts li, .socials li { display: flex; align-items: center; gap: 2.4mm; }
.contacts .ico, .socials .ico { font-size: 10pt; color: var(--gold); }
.stat { text-align: center; border-left: .25mm solid rgba(138,108,46,.35); }
.stat:first-child { border-left: 0; }
.stat__num { font-family: var(--serif); font-weight: 600; font-size: 25pt; line-height: 1; color: var(--gold-dark); }
.stat__num sup { font-size: 14pt; vertical-align: top; position: relative; top: .5mm; margin-left: .3mm; }
.stat__label { margin-top: 1.6mm; font-size: 7pt; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.moment { display: grid; grid-template-columns: 9mm 1fr; gap: 3.2mm; padding: 2.4mm 0; border-bottom: .2mm solid var(--line); }
.moment__icon { width: 9mm; height: 9mm; border: .3mm solid var(--gold); border-radius: 50%; display: grid; place-items: center; color: var(--gold-dark); font-size: 11pt; }
.moment__name { font-family: var(--serif); font-weight: 500; font-size: 11.5pt; line-height: 1.15; }
.moment__tag { margin-top: .6mm; font-size: 6.8pt; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-dark); }
.moment__text { margin-top: .8mm; font-size: 8pt; color: var(--muted); }
.equip__title { margin: 3mm 0 1.6mm; font-size: 6.8pt; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-dark); }
.opt { display: grid; grid-template-columns: 8mm 1fr; gap: 2mm; padding: 2.2mm 0; border-bottom: .2mm solid var(--line); }
.opt__num { font-family: var(--serif); font-size: 11pt; color: var(--gold-dark); line-height: 1.1; }
.opt__title { font-size: 9pt; font-weight: 700; line-height: 1.2; }
.opt__text { margin-top: .6mm; font-size: 7.6pt; color: var(--muted); line-height: 1.35; }
.quote { font-family: var(--serif); font-style: italic; font-size: 9.6pt; line-height: 1.45; }
.quote__who { margin-top: 1.8mm; font-family: var(--sans); font-style: normal; font-size: 6.8pt; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.A { background: var(--ivory); color: var(--ink); }
.A-head { flex: none; height: 56mm; background: radial-gradient(70mm 45mm at 88% 0%, rgba(201,162,75,.2), transparent 70%), var(--night); color: var(--cream); padding: 0 14mm; display: flex; align-items: center; gap: 10mm; border-bottom: .6mm solid var(--gold); }
.A-head img { width: 38mm; height: auto; flex: none; }
.A-head h1 { text-wrap: balance; margin-top: 3mm; font-family: var(--serif); font-weight: 500; font-size: 25pt; line-height: 1.1; letter-spacing: -.01em; }
.A-head h1 em { color: var(--gold); font-style: italic; }
.A-head .sub { margin-top: 3.4mm; font-size: 8.8pt; color: #C9BFAE; }
.A-stats { flex: none; display: grid; grid-template-columns: repeat(3, 1fr); padding: 8mm 14mm 6.5mm; }
.A-main { flex: 1 1 auto; display: grid; grid-template-columns: 1fr 76mm; gap: 8mm; padding: 1mm 14mm 0; min-height: 0; }
.A-main .eyebrow { color: var(--gold-dark); }
.A-main h2 { text-wrap: balance; margin: 1.8mm 0 3mm; font-family: var(--serif); font-weight: 500; font-size: 14pt; line-height: 1.2; }
.card { position: relative; background: #fff; border: .25mm solid var(--line); padding: 3.2mm 5.5mm 4mm; }
.card::before, .card::after { content: ''; position: absolute; width: 4mm; height: 4mm; border: 0 solid var(--gold); }
.card::before { top: -.5mm; left: -.5mm; border-top-width: .5mm; border-left-width: .5mm; }
.card::after { bottom: -.5mm; right: -.5mm; border-bottom-width: .5mm; border-right-width: .5mm; }
.equip li { display: flex; gap: 2.2mm; align-items: center; font-size: 8.8pt; padding: .8mm 0; }
.A-main .moment { padding: 2.7mm 0; }
.A-main .moment__name { font-size: 12.5pt; }
.A-main .moment__text { font-size: 8.5pt; }
.A-main .opt { padding: 2.6mm 0; }
.A-main .opt:first-child { padding-top: 0; }
.A-main .opt__title { font-size: 9.6pt; }
.A-main .opt__text { font-size: 8.1pt; }
.equip .ico { font-size: 8.5pt; color: var(--gold-dark); }
.price { margin-top: 3mm; border: .3mm solid var(--gold); padding: 1.8mm 3mm; text-align: center; font-size: 8pt; font-weight: 700; color: var(--gold-dark); background: rgba(201,162,75,.08); }
.opt:first-child { padding-top: 0; }
.A-commit { flex: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 5mm; margin: 5mm 14mm 6mm; padding-top: 4.2mm; border-top: .25mm solid rgba(138,108,46,.35); }
.A-commit li { display: flex; gap: 2mm; align-items: flex-start; font-size: 7.6pt; font-weight: 600; line-height: 1.3; color: var(--ink); }
.A-commit .ico { font-size: 9pt; color: var(--gold-dark); margin-top: .2mm; }
.A-bottom { flex: none; background: var(--night); color: var(--cream); border-top: .6mm solid var(--gold); padding: 6mm 14mm 6.5mm; display: grid; grid-template-columns: 74mm 1fr; gap: 9mm; align-items: center; }
.A-contact { font-size: 8.8pt; }
.A-contact ul { display: grid; gap: 1.8mm; }
.A-contact .socials-line { margin-top: 2.6mm; padding-top: 2.6mm; border-top: .25mm solid rgba(201,162,75,.4); display: flex; align-items: center; gap: 3.2mm; }
.A-contact .soc { display: block; color: var(--gold); font-size: 11pt; }
.A-contact .handle { margin-left: 1.2mm; font-size: 8.8pt; }
.A-review { border-left: .25mm solid rgba(201,162,75,.4); padding-left: 9mm; display: grid; grid-template-columns: 24mm 1fr; gap: 6mm; align-items: center; }
.score { text-align: center; }
.score__num { font-family: var(--serif); font-weight: 600; font-size: 24pt; line-height: 1; color: var(--gold); }
.score__num small { font-size: 10pt; color: #C9BFAE; }
.score__stars { margin-top: 1mm; color: var(--gold); font-size: 8.4pt; letter-spacing: .08em; }
.score__count { margin-top: .8mm; font-size: 7pt; color: #C9BFAE; }
.A-review .quote { font-size: 8.4pt; line-height: 1.45; }
.A-review .quote__who { margin-top: 1.6mm; font-size: 6.2pt; }

/* Page « Plaquette mariage » du site : aperçu à l'écran, A4 à l'impression (PDF). */
a { color: inherit; text-decoration: none; }
/* iPhone / iPad : sans cette ligne, iOS grossit certains textes de la feuille A4 (large pour un écran) et ils se chevauchent. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media screen {
  html, body { width: auto; height: auto; background: #2B2622; }
  .pq-bar { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 20px; padding: 12px 16px; background: #1C1916; border-bottom: 1px solid rgba(201,162,75,.55); color: #F5EFE4; font: 600 14px/1.45 'Manrope', system-ui, sans-serif; text-align: center; }
  .pq-btn { font: inherit; font-weight: 800; background: #C9A24B; color: #1C1916; border: 0; padding: 11px 20px; cursor: pointer; }
  .pq-btn:hover { background: #D6B35F; }
  .pq-hint { color: #C9BFAE; font-weight: 500; }
  .pq-link { color: #C9A24B; border-bottom: 1px solid #C9A24B; }
  /* La feuille A4 (794 px) est plus large qu'un téléphone : on la rogne dans son cadre pour que le navigateur n'élargisse pas la page
     (sinon la largeur mesurée par le script est fausse et la feuille déborde). Le script la réduit ensuite à la largeur de l'écran. */
  .pq-stage { padding: 20px 0 90px; overflow: hidden; }
  /* Sur téléphone, le script réduit la feuille avec transform: scale() (pas avec « zoom », que le navigateur d'iOS n'applique pas aux textes)
     et donne au cadre .pq-fit la taille réduite pour que la page garde la bonne hauteur. */
  .pq-fit { margin: 0 auto; }
  .sheet { margin: 0 auto; transform-origin: 0 0; box-shadow: 0 18px 60px rgba(0,0,0,.55); }
}
/* iPhone / iPad : feuille un peu moins haute (280 mm au lieu de 297 mm) pour tenir sur une page à l'impression d'iOS. */
html.pq-ios .sheet { height: 280mm; }
@media print {
  .pq-bar { display: none; }
  .pq-stage { padding: 0; display: block; }
  .pq-fit { width: auto !important; height: auto !important; }
  .sheet { transform: none !important; }
  /* Safari / WebKit : la feuille fait exactement 297 mm ; avec l'arrondi, 1 pixel de son bas passait sur une 2e page (une fine ligne noire).
     La page, le corps et la feuille font donc 0,4 mm de moins, et ce reste est peint de la couleur du bandeau du bas (fond nuit). */
  html, body { height: 296.6mm; }
  html:not(.pq-ios) { background: var(--night); }
  .sheet { height: 296.6mm; }
  /* iPhone / iPad : iOS imprime avec ses propres marges (environ 6 mm sur les côtés, 14 mm en haut et en bas), réduit la page de 6 % pour
     tenir en largeur et ignore @page { margin: 0 } : la feuille de 297 mm débordait de 10 mm sur une 2e page. Le script ajoute la classe
     pq-ios ; la feuille fait alors 280 mm de haut (règle ci-dessus, aussi à l'écran) et le fond de page reste blanc. */
  html.pq-ios, html.pq-ios body { height: 280mm; }
}