/* Yayroom — documents à imprimer (A4). À l'écran : des feuilles sur fond gris ; à l'impression : les feuilles seules. */
* { box-sizing: border-box; }
html, body { margin: 0; background: #2a2a33; color: #15151c; font-family: 'Inter', system-ui, sans-serif; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
h1, h2, b { font-family: 'Inter Tight', 'Inter', sans-serif; letter-spacing: -.02em; }
p { margin: 0; }
.bar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 16px; padding: 12px 20px; background: #07070b; color: #f5f5f7; font-size: 15px; }
.bar a { color: #c7c7d1; text-decoration: none; } .bar a:hover { color: #fff; }
.bar span { margin-left: auto; color: #c7c7d1; } .bar span b { color: #fff; }
.bar button { font: 600 15px 'Inter', sans-serif; color: #fff; background: linear-gradient(100deg, #ff5470, #c04bf2 50%, #6d6bff); border: 0; border-radius: 999px; padding: 10px 20px; cursor: pointer; }
@media (max-width: 560px) { .bar span { display: none; } .bar button { margin-left: auto; } }

.sheet { width: 210mm; height: 297mm; margin: 24px auto; background: #fff; padding: 12mm; display: grid; grid-template-rows: 1fr 1fr; gap: 10mm; box-shadow: 0 20px 60px rgba(0,0,0,.5); overflow: hidden; }
.sheet.grid { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4, 1fr); gap: 6mm; }
/* sur tablette et téléphone : la feuille est réduite pour tenir dans la largeur */
@media screen and (max-width: 840px) { .sheet { zoom: .72; } }
@media screen and (max-width: 600px) { .sheet { zoom: .46; margin: 12px auto; } }

.k { font-size: 11pt; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--acc); }
.by { display: inline-flex; align-items: center; gap: 6px; font-size: 9pt; font-weight: 600; color: #6b6b78; }

.invite { position: relative; border: 2px solid var(--acc); border-radius: 6mm; padding: 10mm 12mm; display: grid; align-content: center; gap: 6mm; overflow: hidden; }
.invite::before { content: ''; position: absolute; right: -30mm; top: -30mm; width: 80mm; height: 80mm; border-radius: 50%; background: var(--acc); opacity: .1; }
.invite h1 { font-size: 34pt; line-height: 1.05; margin: 0; }
.invite .line { font-size: 14pt; line-height: 1.45; max-width: 140mm; }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm 10mm; margin-top: 2mm; }
.fields div, .badge .name { display: flex; align-items: flex-end; gap: 3mm; }
.fields small, .badge small { font-size: 9pt; font-weight: 600; color: #6b6b78; text-transform: uppercase; letter-spacing: .08em; }
.fields i, .badge i { flex: 1; border-bottom: 1px solid #b9b9c4; height: 8mm; }
.invite .bring { font-size: 11pt; color: #3c3c46; }
.invite .by { position: absolute; right: 12mm; bottom: 8mm; }

.badge { border: 1.5px dashed #b9b9c4; border-radius: 4mm; padding: 6mm 7mm; display: grid; align-content: space-between; border-top: 3mm solid var(--acc); }
.badge b { font-size: 20pt; line-height: 1; }
.badge .k { font-size: 8pt; }

.label { border: 1.5px dashed #b9b9c4; border-radius: 4mm; display: grid; place-content: center; text-align: center; gap: 3mm; padding: 6mm; }
.label b { font-size: 19pt; line-height: 1.1; padding: 3mm 6mm; border: 2.5px solid var(--acc); border-radius: 2mm; color: #15151c; text-transform: uppercase; letter-spacing: .02em; }
.label span { font-size: 8pt; color: #6b6b78; text-transform: uppercase; letter-spacing: .12em; }

.tent { border: 1.5px dashed #b9b9c4; border-radius: 4mm; padding: 10mm 14mm; display: grid; align-content: center; gap: 4mm; position: relative; }
.tent h2 { font-size: 26pt; margin: 0; }
.tent ol { margin: 0; padding-left: 7mm; font-size: 14pt; line-height: 1.6; }
.tent ol li::marker { color: var(--acc); font-weight: 800; }
.tent p { font-size: 10pt; color: #55555f; }
.tent .by { position: absolute; right: 10mm; bottom: 7mm; }
.tent:first-child { transform: rotate(180deg); }  /* chevalet plié en deux : lisible des deux côtés */

@page { size: A4; margin: 0; }
@media print {
  html, body { background: #fff; }
  .bar { display: none; }
  .sheet { margin: 0; box-shadow: none; zoom: 1; break-after: page; }
}
