/* páginas da revista (A4 em mm); montadas pelo revista.html a partir do cadastro de perfumes */
.pagina, .pagina * { box-sizing: border-box; margin: 0; padding: 0; }
.pagina { font-family: Jost, sans-serif; color: #2b2622; text-align: left; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pagina { width: 210mm; height: 297mm; position: relative; overflow: hidden; page-break-after: always; break-after: page; padding: 18mm 16mm 20mm; }
.pagina:last-child { page-break-after: auto; break-after: auto; }
.creme { background: #f6efe3; }
.rod { position: absolute; left: 16mm; right: 16mm; bottom: 9mm; display: flex; justify-content: space-between; align-items: center;
  border-top: 1px solid #d9c6a3; padding-top: 3mm; font-size: 9pt; letter-spacing: 2px; text-transform: uppercase; color: #8a7a64; }
.rod b { font-family: Cinzel, serif; font-size: 11pt; color: #6b4e17; }
.olho { font-size: 9pt; letter-spacing: 5px; text-transform: uppercase; color: #a8853d; margin-bottom: 3mm; }
.tit { font-family: 'Cormorant Garamond', serif; font-weight: 500; font-size: 34pt; line-height: 1.05; color: #17120e; margin-bottom: 8mm; }
.tit em { color: #a8853d; }
.sub-tit { font-family: Cinzel, serif; font-size: 13pt; letter-spacing: 2px; color: #0d2a4d; margin: 8mm 0 4mm; }

/* capa e contracapa */
.capa { background: radial-gradient(80% 60% at 50% 30%, #1d3157 0%, #0d1a2d 60%, #08101d 100%); color: #eee7d9; text-align: center; padding-top: 22mm; }
.capa-brilho { position: absolute; inset: 0; background: radial-gradient(40% 25% at 50% 62%, rgba(201,164,92,.25), transparent 70%); }
.capa-castelo { height: 30mm; display: block; margin: 0 auto 4mm; position: relative; }
.capa h1 { font-family: Cinzel, serif; font-weight: 700; font-size: 60pt; letter-spacing: 4px; color: #e6cd94; line-height: 1; position: relative; }
.capa h2 { font-family: Cinzel, serif; font-weight: 600; font-size: 22pt; letter-spacing: 14px; color: #e6cd94; margin-top: 2mm; position: relative; }
.capa-tag { font-size: 10pt; letter-spacing: 7px; color: #c9a45c; margin-top: 6mm; position: relative; }
.capa-frascos { display: flex; justify-content: center; gap: 8mm; margin: 12mm 0 10mm; position: relative; }
.capa-frascos img { width: 62mm; height: 86mm; object-fit: cover; object-position: center 35%; border-radius: 30mm 30mm 3mm 3mm; border: 1.5px solid #c9a45c; box-shadow: 0 0 0 4px rgba(201,164,92,.15), 0 10mm 16mm rgba(0,0,0,.45); }
.capa-tit { font-family: Cinzel, serif; font-weight: 600; font-size: 24pt; letter-spacing: 3px; color: #f2e8d6; position: relative; }
.capa-sub { font-size: 11pt; letter-spacing: 5px; text-transform: uppercase; color: #c9a45c; margin-top: 3mm; position: relative; }
.capa-script { font-family: 'Great Vibes', cursive; font-size: 26pt; color: #e6cd94; margin-top: 8mm; position: relative; }
.contracapa { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 16mm; }
.cc-logo { width: 90mm; position: relative; }
.cc-contatos { margin-top: 12mm; position: relative; display: grid; gap: 3mm; font-size: 11pt; letter-spacing: 1px; color: #d8d0c2; }
.cc-contatos b { color: #e6cd94; font-weight: 500; }
.cc-obs { position: absolute; left: 20mm; right: 20mm; bottom: 12mm; font-size: 7.5pt; color: #8f96a3; line-height: 1.5; }

/* sobre */
.sobre-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 9mm; align-items: start; }
.sobre p { font-size: 11pt; line-height: 1.7; color: #3d3630; margin-bottom: 4mm; }
.capitular::first-letter { font-family: Cinzel, serif; font-size: 34pt; float: left; line-height: .9; margin: 1mm 2mm 0 0; color: #a8853d; }
.selos-lista { list-style: none; display: grid; gap: 2.5mm; margin-top: 5mm; }
.selos-lista li { font-size: 10.5pt; padding-left: 6mm; position: relative; }
.selos-lista li::before { content: "✦"; position: absolute; left: 0; color: #a8853d; font-size: 8pt; top: .8mm; }
.sobre-foto img { width: 100%; height: 130mm; object-fit: cover; border-radius: 4mm; border: 1px solid #d9c6a3; }
.sobre-foto figcaption { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 11pt; color: #6b6158; margin-top: 2mm; text-align: center; }
.frase-grande { position: absolute; left: 16mm; right: 16mm; bottom: 26mm; text-align: center; font-family: 'Great Vibes', cursive; font-size: 30pt; color: #6b4e17; }

/* como escolher */
.piramide { display: grid; gap: 3mm; }
.pi { border: 1px solid #d9c6a3; border-radius: 3mm; padding: 4mm 6mm; background: #fffaf2; display: grid; grid-template-columns: 34mm 1fr; column-gap: 6mm; align-items: center; }
.pi b { font-family: Cinzel, serif; font-size: 16pt; color: #0d2a4d; }
.pi span { grid-column: 1; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 11pt; color: #a8853d; }
.pi p { grid-column: 2; grid-row: 1 / 3; font-size: 10.5pt; line-height: 1.55; color: #3d3630; }
.pi1 { margin: 0 22mm; } .pi2 { margin: 0 11mm; } .pi3 { background: #f1e5cd; }
.familias { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; }
.familias div { border-left: 3px solid #c9a45c; padding: 2mm 0 2mm 5mm; }
.familias b { font-family: Cinzel, serif; font-size: 13pt; color: #17120e; }
.familias p { font-size: 10pt; line-height: 1.5; color: #4a423b; margin-top: 1mm; }
.dica { margin-top: 8mm; background: #0d1a2d; color: #eee7d9; border-radius: 3mm; padding: 5mm 6mm; font-size: 10.5pt; line-height: 1.6; }
.dica b { color: #e6cd94; }

/* sumário */
.suma { list-style: none; display: grid; gap: 5mm; margin-top: 6mm; }
.suma li { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 3mm; font-family: 'Cormorant Garamond', serif; font-size: 19pt; color: #17120e; }
.suma li small { display: block; font-family: Jost, sans-serif; font-size: 9pt; letter-spacing: 1px; color: #8a7a64; }
.suma li i { border-bottom: 1.5px dotted #b8995c; margin-bottom: 2.4mm; }
.suma li b { font-family: Cinzel, serif; font-size: 16pt; color: #a8853d; }
.suma-feminina span { color: #9b2752; } .suma-masculina span { color: #0d2a4d; } .suma-unissex span { color: #6b4e17; }
.suma-castelo { position: absolute; left: 0; right: 0; bottom: 34mm; text-align: center; }
.suma-castelo img { height: 26mm; opacity: .85; }
.suma-castelo p { font-family: 'Great Vibes', cursive; font-size: 22pt; color: #6b4e17; margin-top: 2mm; }

/* aberturas de coleção */
.abertura { padding: 0; display: grid; grid-template-rows: 60% 40%; }
.ab-feminina { background: linear-gradient(180deg, #f7dfe7, #ecc4d2); --c: #9b2752; }
.ab-masculina { background: linear-gradient(180deg, #d6e8f7, #b7d2ec); --c: #0d2a4d; }
.ab-unissex { background: linear-gradient(180deg, #f0e4cc, #e2cfa6); --c: #6b4e17; }
.ab-foto { display: grid; place-items: end center; padding-top: 18mm; }
.ab-foto img { width: 100mm; height: 150mm; object-fit: cover; object-position: center 35%; border-radius: 50mm 50mm 4mm 4mm; border: 2px solid #c9a45c; box-shadow: 0 0 0 6px rgba(255,255,255,.35), 0 12mm 20mm rgba(0,0,0,.25); }
.ab-texto { text-align: center; padding: 10mm 20mm 0; }
.ab-texto .olho { color: var(--c); }
.ab-texto h2 { font-family: Cinzel, serif; font-weight: 700; font-size: 44pt; letter-spacing: 3px; color: var(--c); line-height: 1; }
.ab-lema { font-size: 10pt; letter-spacing: 5px; text-transform: uppercase; color: var(--c); margin-top: 4mm; }
.ab-desc { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 15pt; line-height: 1.4; color: #3d3630; margin-top: 6mm; }
.ab-qtd { font-size: 9.5pt; letter-spacing: 2px; text-transform: uppercase; color: var(--c); margin-top: 6mm; }

/* páginas de lista */
.lista-feminina { --c: #9b2752; --bg: #fbe8ee; } .lista-masculina { --c: #0d2a4d; --bg: #e3f0fb; } .lista-unissex { --c: #6b4e17; --bg: #f7efdf; }
.cab-lista { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--c); padding-bottom: 2.5mm; margin-bottom: 6mm; }
.cab-lista span { font-family: Cinzel, serif; font-weight: 700; font-size: 17pt; letter-spacing: 2px; color: var(--c); }
.cab-lista i { font-style: normal; font-size: 8.5pt; letter-spacing: 3px; text-transform: uppercase; color: var(--c); }
.cartoes { display: grid; grid-template-rows: repeat(4, 1fr); gap: 4.5mm; height: 236mm; }
.cartao { display: grid; grid-template-columns: 40mm 1fr; gap: 6mm; align-items: center; background: var(--bg); border: 1px solid color-mix(in srgb, var(--c) 22%, transparent); border-radius: 3mm; padding: 3mm 6mm 3mm 3mm; overflow: hidden; }
.frasco { position: relative; container-type: inline-size; width: 38mm; aspect-ratio: 7 / 10; background-size: cover; background-position: center; border-radius: 2mm; background-color: #0b0b0d; }
.frasco .rotulo { position: absolute; left: 21.4%; width: 60.5%; top: 74.2%; height: 11.7%; display: grid; place-items: center; text-align: center;
  font-family: 'Kaushan Script', 'Great Vibes', cursive; font-size: 6.6cqw; line-height: 1; color: #141a2b; mix-blend-mode: multiply; padding: 0 3%; }
.frasco-fem .rotulo { left: 21.1%; width: 56%; top: 74.2%; height: 11.8%; }
.info { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.info-top { display: flex; gap: 3mm; align-items: center; }
.cartao .num { flex: 0 0 auto; width: 10mm; height: 10mm; border-radius: 50%; background: var(--c); color: #fff; display: grid; place-items: center; font-family: Cinzel, serif; font-weight: 700; font-size: 10.5pt; }
.cartao strong { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 21pt; line-height: 1; color: #17120e; }
.cartao em { display: block; font-style: normal; font-size: 8pt; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; color: var(--c); margin-top: 1.2mm; }
.cartao small { display: block; font-size: 9.5pt; color: #6b6158; margin-top: 2.5mm; }
.cartao small b { font-weight: 500; color: #3d3630; }
.cartao dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; margin-top: 3mm; padding-top: 3mm; border-top: 1px dashed color-mix(in srgb, var(--c) 30%, transparent); }
.cartao dt { font-size: 7.5pt; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c); font-weight: 500; }
.cartao dd { font-size: 9.5pt; line-height: 1.35; color: #3d3630; margin-top: .8mm; }
.cartao .tam { font-size: 8pt; letter-spacing: 1px; color: #8a7a64; margin-top: 3mm; }

/* comprar */
.intro { font-size: 11.5pt; line-height: 1.65; color: #3d3630; }
.precos { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; }
.precos div { background: #fffaf2; border: 1px solid #d9c6a3; border-radius: 3mm; padding: 4mm; text-align: center; }
.precos b { display: block; font-family: Cinzel, serif; font-size: 16pt; color: #0d2a4d; }
.precos span { display: block; font-size: 8pt; letter-spacing: 1.5px; text-transform: uppercase; color: #8a7a64; height: 4mm; }
.precos strong { display: block; font-family: 'Cormorant Garamond', serif; font-size: 26pt; color: #17120e; }
.passos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4mm; }
.passos div { background: #fffaf2; border: 1px solid #d9c6a3; border-radius: 3mm; padding: 4mm 3mm; text-align: center; }
.passos b { display: grid; place-items: center; width: 9mm; height: 9mm; margin: 0 auto 2mm; border-radius: 50%; background: #0d2a4d; color: #fff; font-family: Cinzel, serif; }
.passos p { font-size: 9.5pt; line-height: 1.45; color: #3d3630; }
.qrs { display: flex; justify-content: center; gap: 14mm; margin-top: 10mm; }
.qrs figure { width: 38mm; text-align: center; }
.qrs .qr { background: #fff; padding: 2mm; border-radius: 2mm; border: 1px solid #d9c6a3; }
.qrs .qr svg { width: 100%; height: auto; display: block; }
.qrs figcaption { font-size: 9pt; letter-spacing: 2px; text-transform: uppercase; color: #6b4e17; margin-top: 2mm; }
.frasco-masc { background-image: url(../img/frasco-masculino.webp); }
.frasco-fem { background-image: url(../img/frasco-feminino.webp); }
.linhas { list-style: none; margin-top: 8mm; }
.linhas li { border-bottom: 1px solid #d9c6a3; height: 14mm; }

/* compra direto da revista (só na tela; no PDF aparece a linha de preços) */
.cartao .tam { display: none; }
.compra { display: flex; flex-wrap: wrap; align-items: center; gap: 2mm; margin-top: 2.6mm; }
.compra span { flex: 1 0 100%; font-size: 7.6pt; letter-spacing: .8px; text-transform: uppercase; font-weight: 500; }
.selo-venda { color: #2f6b3a; }
.selo-enc { color: #8a5a10; }
.compra button { cursor: pointer; font: inherit; font-size: 9pt; letter-spacing: .5px; padding: 1.6mm 3.4mm; border-radius: 20mm; border: 1px solid var(--c); background: #fff; color: var(--c); transition: background .2s, color .2s; }
.compra button b { font-weight: 600; }
.compra button:hover, .compra button.ok { background: var(--c); color: #fff; }
.compra-enc button { border-style: dashed; }
@media print { .cartao .tam { display: block; } .compra { display: none; } }
/* aperta o cartão para caber a linha de compra */
.cartao small { margin-top: 1.4mm; }
.cartao dl { margin-top: 2mm; padding-top: 2mm; }
.compra { flex-wrap: nowrap; gap: 1.6mm; margin-top: 2.2mm; }
.compra span { flex: 1 1 auto; font-size: 7pt; letter-spacing: .5px; line-height: 1.2; }
.compra button { flex: 0 0 auto; font-size: 8.5pt; padding: 1.4mm 3mm; white-space: nowrap; }
