/* Estilo compartilhado das páginas de orçamento da Relevante (casamento, ensaios, 15 anos) */
:root {
  --marrom: #6b3a28;
  --marrom-escuro: #4f2a1c;
  --tinta: #1c1a18;
  --texto: #4a4540;
  --suave: #8a837c;
  --papel: #ffffff;
  --creme: #f7f3ee;
  --linha: #e6dfd6;
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Open Sans", system-ui, sans-serif;
  --largura: 1120px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 72px; } /* o título da seção não fica atrás da barra do topo */
html.carregando { scroll-behavior: auto; }
body { background: var(--papel); color: var(--texto); font: 300 16px/1.7 var(--sans); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; color: var(--tinta); line-height: 1.1; }
h2 { font-size: clamp(2.2rem, 5vw, 3.4rem); }
h2 em, h3 em { font-style: italic; }
.wrap { max-width: var(--largura); margin: 0 auto; padding: 0 24px; }
section { position: relative; }

/* ---------- topo ---------- */
.nav { position: fixed; top: 0; right: 0; left: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; padding: 14px 24px; transition: background .3s, box-shadow .3s; }
.nav.solida { background: rgba(255,255,255,.96); box-shadow: 0 1px 0 var(--linha); }
.nav .marca { height: 34px; opacity: 0; transition: opacity .3s; }
.nav.solida .marca { opacity: 1; }
.nav ul { display: flex; gap: 26px; list-style: none; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 400; }
.nav ul a { text-decoration: none; color: #fff; transition: color .3s; }
.nav.solida ul a { color: var(--tinta); }
.nav ul a:hover { opacity: .6; }
/* celular: botão de menu que abre a lista em tela cheia */
.menu-botao { display: none; }
@media (max-width: 760px) {
  .menu-botao { display: flex; flex-direction: column; justify-content: center; gap: 7px; position: relative; z-index: 2; width: 44px; height: 44px; margin-right: -10px; padding: 0 10px; background: none; border: 0; cursor: pointer; }
  .menu-botao span { display: block; height: 1px; background: #fff; transition: transform .35s ease, background .3s; }
  .nav.solida .menu-botao span, .nav.aberto .menu-botao span { background: var(--tinta); }
  .nav.aberto .menu-botao span:first-child { transform: translateY(4px) rotate(45deg); }
  .nav.aberto .menu-botao span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .nav ul { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; flex-direction: column; align-items: center; justify-content: center; gap: 30px; background: var(--creme); opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s; }
  .nav.aberto ul { opacity: 1; visibility: visible; }
  .nav ul a, .nav.solida ul a { color: var(--tinta); font: italic 400 2rem var(--serif); letter-spacing: 0; text-transform: none; }
  .nav ul .menu-orcamento a { font: 400 12px var(--sans); letter-spacing: .25em; text-transform: uppercase; color: var(--marrom); border-bottom: 1px solid rgba(107,58,40,.35); padding-bottom: 4px; }
  .nav.aberto .marca { opacity: 1; position: relative; z-index: 2; }
  html.menu-aberto { overflow: hidden; }
}
.menu-orcamento { display: none; }
@media (max-width: 760px) { .menu-orcamento { display: list-item; margin-top: 18px; } }

/* ---------- capa (mesmo estilo da capa da galeria) ---------- */
@font-face { font-family: "Ivy Presto"; src: url("fonts/ivy-presto-display-thin.otf") format("opentype"); font-weight: 100; font-display: swap; }
.capa { height: 100vh; height: 100svh; min-height: 520px; display: grid; place-items: center; overflow: hidden; background: #0a0a0a var(--capa-fundo, url("video/capa.webp")) center / cover no-repeat; }
@media (max-aspect-ratio: 4/5) { .capa { background-image: var(--capa-fundo-celular, url("video/capa-celular.webp")); } }
.capa video { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.capa::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.3); }
.capa .conteudo { position: relative; z-index: 1; text-align: center; color: #fff; padding: 0 24px; }
/* entrada da capa igual à galeria: título sobe, assinatura e "Explore" aparecem logo depois */
html.carregando .capa h1, html.carregando .capa .assinatura, html.carregando .explore { opacity: 0; }
html:not(.carregando) .capa h1 { animation: surge 1s ease both; }
html:not(.carregando) .capa .assinatura { animation: aparece 1s .5s ease both; }
html:not(.carregando) .explore { animation: aparece 1s .9s ease both, pula 1s 1.9s infinite; }
@keyframes aparece { from { opacity: 0; } }
.capa h1 { font-family: "Ivy Presto", var(--serif); font-weight: 100; color: #fff; text-transform: uppercase; letter-spacing: .15em; padding-left: .15em; line-height: 1.1; font-size: clamp(2.3rem, 7.4vw, 7.5rem); margin-bottom: 48px; }
.capa .assinatura { display: flex; align-items: center; justify-content: center; gap: 20px; color: rgba(255,255,255,.6); font-size: 9px; letter-spacing: .55em; text-transform: uppercase; }
.capa .assinatura::before, .capa .assinatura::after { content: ""; width: 40px; height: 1px; background: rgba(255,255,255,.3); }
.explore { position: absolute; z-index: 1; left: 50%; bottom: 96px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 16px; color: #fff; text-decoration: none; font-size: 10px; letter-spacing: .5em; padding-left: .5em; text-transform: uppercase; }
.explore svg { width: 20px; height: 20px; }
@keyframes pula { 0%,100% { transform: translate(-50%, -25%); animation-timing-function: cubic-bezier(.8,0,1,1); } 50% { transform: translate(-50%, 0); animation-timing-function: cubic-bezier(0,0,.2,1); } }
@keyframes surge { from { opacity: 0; transform: translateY(16px); } }
@media (max-width: 760px) {
  .explore { bottom: 64px; }
  .capa h1 { margin-bottom: 32px; }
  .capa .assinatura { gap: 14px; letter-spacing: .38em; white-space: nowrap; }
  .capa .assinatura::before, .capa .assinatura::after { width: 24px; }
}

/* ---------- sobre ---------- */
.sobre { padding: 110px 0 90px; }
.sobre .wordmark { width: min(300px, 72vw); margin: 0 auto 56px; }
.sobre .grade { display: grid; grid-template-columns: 1fr 300px 1fr; gap: 48px; align-items: center; font-size: 15px; }
.sobre .grade p + p { margin-top: 1em; }
.sobre .foto-casal { width: 300px; height: 300px; border-radius: 50%; object-fit: cover; }
@media (max-width: 900px) {
  .sobre .grade { grid-template-columns: 1fr; gap: 36px; text-align: left; }
  .sobre .foto-casal { order: -1; margin: 0 auto; width: 240px; height: 240px; }
}
.faixa { height: clamp(260px, 48vw, 560px); width: 100%; object-fit: cover; }

/* ---------- portfólio ---------- */
.portfolio { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 22vw; gap: 4px; max-height: none; }
.portfolio img { width: 100%; height: 100%; object-fit: cover; }
.portfolio .alto { grid-row: span 2; }
.portfolio .largo { grid-column: span 2; }
.portfolio .selo { grid-column: span 2; grid-row: span 2; display: grid; place-items: center; background: var(--creme); }
.portfolio .selo span { width: 150px; height: 150px; border-radius: 50%; background: var(--marrom); display: grid; place-items: center; }
.portfolio .selo img { width: 62px; height: auto; object-fit: contain; }
@media (max-width: 760px) {
  .portfolio { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 46vw; }
  .portfolio .selo { grid-row: auto; }
  .portfolio .selo span { width: 110px; height: 110px; }
  .portfolio .selo img { width: 46px; }
}

/* ---------- filme de pré-wedding (entre o portfólio e os momentos) ---------- */
.filme { margin-top: 4px; aspect-ratio: 1440 / 604; overflow: hidden; background: #0a0a0a var(--filme-fundo, url("video/prewedding.webp")) center / cover no-repeat; }
.filme video { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
/* vídeos de fundo: ninguém pausa, abre em tela cheia ou vê botão de play por cima */
.capa video, .filme video { pointer-events: none; -webkit-touch-callout: none; user-select: none; transition: opacity .8s ease; }
.capa video.bloqueado, .filme video.bloqueado { opacity: 0; }
/* reprodutor quadro a quadro (iPhones que recusam vídeo automático) */
.video-quadros { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; opacity: 0; transition: opacity .8s ease; }
.video-quadros.visivel { opacity: 1; }
.capa video::-webkit-media-controls, .filme video::-webkit-media-controls,
.capa video::-webkit-media-controls-start-playback-button, .filme video::-webkit-media-controls-start-playback-button,
.capa video::-webkit-media-controls-overlay-play-button, .filme video::-webkit-media-controls-overlay-play-button { display: none !important; -webkit-appearance: none; }
@media (max-aspect-ratio: 4/5) { .filme { aspect-ratio: 16 / 9; } }

/* ---------- momentos ---------- */
.momento { display: grid; grid-template-columns: 1fr 1fr; min-height: 560px; }
.momento img { width: 100%; height: 100%; object-fit: cover; min-height: 420px; }
.momento .texto { display: flex; flex-direction: column; justify-content: center; padding: 64px clamp(24px, 7vw, 96px); font-size: 15px; }
.momento h2 { margin-bottom: 26px; }
.momento.invertido .texto { order: -1; }
/* bloco sem foto (Pré Wedding: o filme logo acima já faz esse papel) */
.momento.so-texto { grid-template-columns: 1fr; min-height: 0; }
.momento.so-texto .texto { max-width: 760px; margin: 0 auto; padding-top: 96px; padding-bottom: 96px; text-align: center; }
@media (max-width: 760px) {
  .momento { grid-template-columns: 1fr; min-height: 0; }
  .momento.invertido .texto { order: 0; }
  .momento img { min-height: 0; height: 110vw; }
  .momento .texto { padding: 44px 24px 56px; }
}
.frase { min-height: clamp(360px, 60vw, 720px); display: grid; place-items: center; overflow: hidden; }
.frase img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.frase::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.3); }
.frase h2 { position: relative; z-index: 1; color: #fff; text-align: center; padding: 0 24px; font-size: clamp(2.2rem, 6vw, 4.4rem); }

/* ---------- pacotes (estilo convite: arcos, itálico, sem caixas) ---------- */
.pacotes { padding: 120px 0 110px; background: var(--creme); }
.titulo-secao { text-align: center; margin-bottom: 72px; }
.titulo-secao .sobretitulo { font-size: 11px; letter-spacing: .4em; text-transform: uppercase; color: var(--marrom); margin-bottom: 18px; }
.titulo-secao h2 em { color: var(--marrom); }
.titulo-secao .apresentacao { max-width: 460px; margin: 20px auto 0; font-size: 15px; }
.pacotes-lista { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.pacote { text-align: center; font-variant-numeric: lining-nums; }
.pacote:nth-child(2) { margin-top: 64px; }
.arco { aspect-ratio: 3 / 4; border-radius: 999px 999px 0 0; overflow: hidden; margin-bottom: 30px; }
.arco img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease; }
.pacote:hover .arco img { transform: scale(1.04); }
.pacote .numero { font: italic 400 1.1rem var(--serif); color: var(--marrom); }
.pacote h3 { font-size: clamp(2.6rem, 4vw, 3.3rem); font-style: italic; margin: 2px 0 6px; }
.pacote .tipo { font-size: 11px; letter-spacing: .35em; text-transform: uppercase; color: var(--suave); }
.pacote .valor { font: 400 1.9rem var(--serif); color: var(--tinta); margin: 22px 0 34px; }
.pacote .valor small { display: block; font: italic 400 .95rem var(--serif); color: var(--suave); margin-bottom: 2px; }
.pacote h4 { display: flex; align-items: center; justify-content: center; gap: 14px; font-size: 10px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--marrom); margin: 30px 0 12px; }
.pacote h4::before, .pacote h4::after { content: ""; width: 26px; height: 1px; background: currentColor; opacity: .4; }
.pacote ul { list-style: none; font-size: 14.5px; line-height: 1.5; }
.pacote li { padding: 3px 0; }
.pacote .recebem li { font-family: var(--serif); font-style: italic; font-size: 16px; color: var(--tinta); }
.quero { display: inline-flex; align-items: center; gap: 10px; margin-top: 38px; font: italic 400 1.15rem var(--serif); color: var(--marrom); text-decoration: none; padding-bottom: 4px; border-bottom: 1px solid rgba(107,58,40,.35); transition: gap .25s, border-color .25s; }
.quero:hover { gap: 16px; border-color: var(--marrom); }
@media (max-width: 900px) {
  .pacotes { padding: 88px 0 80px; }
  .pacotes-lista { grid-template-columns: 1fr; gap: 88px; max-width: 420px; margin: 0 auto; }
  .pacote:nth-child(2) { margin-top: 0; }
}

.botao { display: inline-flex; align-items: center; justify-content: center; gap: 10px; margin-top: 28px; padding: 15px 22px; background: var(--marrom); color: #fff; text-decoration: none; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 400; transition: background .2s; }
.botao:hover { background: var(--marrom-escuro); }

.pagamento { margin: 110px auto 0; max-width: 860px; text-align: center; }
.pagamento h3 { font-size: clamp(1.8rem, 3vw, 2.3rem); }
.pagamento h3 em { color: var(--marrom); }
.pagamento .opcoes { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 36px; }
.pagamento .opcao { padding: 8px 28px; font-size: 14px; line-height: 1.55; }
.pagamento .opcao + .opcao { border-left: 1px solid var(--linha); }
.pagamento .opcao strong { display: block; font: italic 400 1.45rem var(--serif); color: var(--tinta); margin-bottom: 8px; }
@media (max-width: 640px) {
  .pagamento { margin-top: 90px; }
  .pagamento .opcoes { grid-template-columns: 1fr; }
  .pagamento .opcao { padding: 22px 12px; }
  .pagamento .opcao + .opcao { border-left: 0; border-top: 1px solid var(--linha); }
}

/* ---------- álbuns ---------- */
.cabecalho-marrom { background: var(--marrom); color: #fff; text-align: center; padding: 56px 24px; }
.cabecalho-marrom h2 { color: #fff; font-style: italic; }
.album { display: grid; grid-template-columns: 1fr 1fr; }
.album img { width: 100%; height: 100%; object-fit: cover; min-height: 440px; max-height: 620px; }
.album .texto { padding: 56px clamp(24px, 6vw, 88px); display: flex; flex-direction: column; justify-content: center; font-size: 15px; }
.album.invertido .texto { order: -1; }
.album h3 { font-size: clamp(2rem, 4vw, 2.8rem); margin-bottom: 18px; }
.tabela { width: 100%; border-collapse: collapse; margin-top: 22px; font-size: 14px; }
.tabela caption { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--tinta); padding-bottom: 8px; }
.tabela th, .tabela td { text-align: left; padding: 10px 0; border-bottom: 1px solid var(--linha); font-weight: 300; }
.tabela th { font-weight: 400; color: var(--tinta); }
.tabela td:last-child, .tabela th:last-child { text-align: right; }
.tabela thead th { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--suave); font-weight: 400; }
.tabela td.valor { color: var(--tinta); font-weight: 400; white-space: nowrap; }
@media (max-width: 760px) {
  .album { grid-template-columns: 1fr; }
  .album.invertido .texto { order: 0; }
  .album img { min-height: 0; height: 100vw; }
  .album .texto { padding: 40px 24px 56px; }
}

.extras { padding: 100px 0; }
.extras .linha { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 6vw, 72px); align-items: center; }
.extras .linha + .linha { margin-top: 90px; }
.extras h3 { font-size: clamp(2rem, 4vw, 2.6rem); margin-bottom: 18px; }
.extras .foto { aspect-ratio: 4 / 5; width: 100%; object-fit: cover; }
.extras .duas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.extras .duas img { aspect-ratio: 3 / 4; width: 100%; object-fit: cover; }
.extras .valor-destaque { margin-top: 22px; font: 400 1.5rem var(--serif); color: var(--tinta); }
.extras .valor-destaque small { display: block; font: 300 14px var(--sans); color: var(--texto); }
@media (max-width: 760px) {
  .extras { padding: 70px 0; }
  .extras .linha { grid-template-columns: 1fr; }
  .extras .linha.invertida .texto { order: -1; }
}

/* ---------- perguntas ---------- */
.faq { background: #1d1b19; color: #d9d3cc; padding: 110px 0; overflow: hidden; }
.faq > img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: .16; }
.faq .wrap { position: relative; }
.faq h2 { color: #fff; text-align: center; }
.faq .grupo { max-width: 780px; margin: 56px auto 0; }
.faq h3 { color: #fff; font-style: italic; font-size: 2rem; margin-bottom: 12px; }
.faq details { border-bottom: 1px solid rgba(255,255,255,.16); }
.faq summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 44px 1fr 20px; align-items: center; gap: 8px; padding: 20px 0; color: #fff; font-weight: 400; font-size: 16px; line-height: 1.4; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .num { font: 400 1.3rem var(--serif); color: #c89b83; }
.faq summary .mais { position: relative; width: 14px; height: 14px; }
.faq summary .mais::before, .faq summary .mais::after { content: ""; position: absolute; left: 0; top: 6.5px; width: 14px; height: 1px; background: #fff; transition: transform .25s; }
.faq summary .mais::after { transform: rotate(90deg); }
.faq details[open] .mais::after { transform: rotate(0); }
.faq details p { padding: 0 28px 24px 52px; font-size: 15px; }
.faq summary:focus-visible { outline: 1px solid #c89b83; outline-offset: 4px; }
@media (max-width: 560px) { .faq details p { padding-left: 0; padding-right: 0; } }

/* ---------- final ---------- */
.final { min-height: 100vh; min-height: 100svh; display: grid; place-items: end center; overflow: hidden; background: #111; }
.final > img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.final::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 35%, rgba(0,0,0,.8)); }
.final .conteudo { position: relative; z-index: 1; text-align: center; color: #fff; padding: 0 24px 10vh; }
.final h2 { color: #fff; font-style: italic; margin-bottom: 14px; }
.final p { font-size: 15px; }
.final .botao { background: #fff; color: var(--marrom); }
.final .botao:hover { background: var(--creme); }
.final .contatos { margin-top: 36px; font-size: 13px; letter-spacing: .06em; line-height: 2; }
.final .contatos a { text-decoration: none; }
.final .contatos a:hover { text-decoration: underline; }
.final .validade { margin-top: 14px; font-size: 12px; opacity: .7; }

/* ---------- whatsapp flutuante ---------- */
.zap { position: fixed; right: 18px; bottom: 18px; z-index: 30; width: 56px; height: 56px; border-radius: 50%; background: #25d366; display: grid; place-items: center; box-shadow: 0 6px 20px rgba(0,0,0,.25); transition: transform .2s; }
.zap:hover { transform: scale(1.06); }
.zap svg { width: 30px; height: 30px; fill: #fff; }

/* ---------- entrada suave ---------- */
.revela { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.revela.visivel { opacity: 1; transform: none; }
/* "Reduzir movimento" ligado (comum em iPhone): mantém os esmaecimentos, tira só o que desliza ou pula */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .revela { transform: none; transition: opacity 1s ease; }
  html:not(.carregando) .capa h1 { animation: aparece 1.2s ease both; }
  html:not(.carregando) .explore { animation: aparece 1s .9s ease both; }
  .intro-marca { animation: aparece 1.5s ease-out both; }
}

/* iPhones mais antigos (iOS 14 ou menos) não entendem aspect-ratio: alturas equivalentes */
@supports not (aspect-ratio: 1 / 1) {
  .filme { height: 41.9vw; }
  .arco { height: 0; padding-top: 133.33%; position: relative; }
  .arco img { position: absolute; top: 0; left: 0; }
  .extras .foto { height: 110vw; max-height: 560px; }
  .extras .duas img { height: 60vw; max-height: 320px; }
}
@media (max-aspect-ratio: 4/5) { @supports not (aspect-ratio: 1 / 1) { .filme { height: 56.25vw; } } }

/* ---------- abertura (igual à da galeria): some quando a capa está pronta ---------- */
@font-face { font-family: "Ivy Presto"; src: url("fonts/ivy-presto-display-light.otf") format("opentype"); font-weight: 300; font-display: swap; }
html.carregando { overflow: hidden; }
.intro { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; background: #fdfcfb; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; transition: opacity 1.2s cubic-bezier(.43,.13,.23,.96), visibility 1.2s; }
.intro.saiu { opacity: 0; visibility: hidden; }
/* se o script falhar por qualquer motivo, a abertura some sozinha depois de 8 s */
.intro:not(.saiu) { animation: intro-sai 1.2s 20s forwards; }
.intro-marca { font-family: "Ivy Presto", var(--serif); font-weight: 300; font-style: italic; font-size: clamp(24px, 3vw, 30px); letter-spacing: .8em; margin-right: -.8em; text-transform: uppercase; color: #1a1a1a; animation: intro-entra 1.5s ease-out both; }
.intro-linha { position: relative; width: 48px; height: 1px; background: #e4e4e7; overflow: hidden; }
.intro-linha::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.4); animation: intro-corre 2s linear infinite; }
@keyframes intro-entra { from { opacity: 0; transform: scale(.95); } }
@keyframes intro-corre { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes intro-sai { to { opacity: 0; visibility: hidden; } }

/* ---------- peças usadas nas páginas de ensaios e 15 anos ---------- */
/* capa com foto (quando a página não tem vídeo): a foto "respira" devagar */
.capa > img.capa-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; animation: respira 24s ease-in-out infinite alternate; }
@keyframes respira { from { transform: scale(1.02); } to { transform: scale(1.12); } }

/* faixa de foto com o emblema "amar é para vida toda" por cima */
.faixa-emblema { position: relative; overflow: hidden; }
.faixa-emblema .faixa { display: block; }
.faixa-emblema .emblema { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: clamp(110px, 17vw, 210px); height: auto; filter: drop-shadow(0 2px 12px rgba(0,0,0,.3)); }

/* mosaico de fotos lado a lado */
.mosaico { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 4px; }
.mosaico img { width: 100%; height: clamp(300px, 34vw, 560px); object-fit: cover; }
.mosaico.dois { grid-template-columns: 3fr 2fr; }
.mosaico.dois img { height: clamp(280px, 42vw, 640px); }
@media (max-width: 760px) {
  .mosaico { grid-template-columns: repeat(2, 1fr); }
  .mosaico img { height: 70vw; }
  .mosaico.dois { grid-template-columns: 1fr; }
  .mosaico.dois img { height: 80vw; }
}

/* uma única forma de pagamento */
.pagamento .opcoes.uma { grid-template-columns: 1fr; max-width: 440px; margin-left: auto; margin-right: auto; }
.pagamento .opcoes.uma .opcao { border: 0; }

/* faixa de foto em tamanho grande (mostra a foto quase inteira, até a altura da tela) */
.faixa.faixa-alta { height: clamp(440px, 85vw, 100vh); object-position: center 45%; }
.faixa-alta + .faixa { margin-top: 4px; } /* mesmo espaço de 4px usado entre as outras fotos */

/* ---------- peças do guia do ensaio ---------- */
.guia-intro { padding: 110px 0 70px; text-align: center; }
.guia-intro .wordmark { width: min(260px, 66vw); margin: 0 auto 40px; }
.guia-intro h2 { margin-bottom: 22px; }
.guia-intro h2 em { color: var(--marrom); }
.guia-intro p { max-width: 640px; margin: 0 auto; font-size: 16px; }
.guia-intro p + p { margin-top: 1em; }

/* linha do tempo: antes, no dia, depois */
.etapas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; max-width: 900px; margin: 56px auto 0; }
.etapa { padding: 8px 28px; text-align: center; }
.etapa + .etapa { border-left: 1px solid var(--linha); }
.etapa .numero { font: italic 400 1.1rem var(--serif); color: var(--marrom); }
.etapa h3 { font: italic 400 1.6rem var(--serif); margin: 4px 0 8px; }
.etapa p { font-size: 14px; }
@media (max-width: 700px) {
  .etapas { grid-template-columns: 1fr; }
  .etapa { padding: 22px 12px; }
  .etapa + .etapa { border-left: 0; border-top: 1px solid var(--linha); }
}

/* dicas dentro dos blocos de foto + texto */
.dicas { list-style: none; margin-top: 22px; font-size: 15px; }
.dicas li { position: relative; padding: 8px 0 8px 26px; border-top: 1px solid var(--linha); }
.dicas li:last-child { border-bottom: 1px solid var(--linha); }
.dicas li::before { content: ""; position: absolute; left: 4px; top: 19px; width: 10px; height: 1px; background: var(--marrom); }
.dicas strong { font-weight: 600; color: var(--tinta); }

/* paleta de cores sugerida */
.paleta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.paleta span { display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--suave); }
.paleta i { display: block; width: 52px; height: 52px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.evitar { margin-top: 18px; font-size: 14px; }
.evitar strong { font-weight: 600; color: var(--marrom); }

/* checklist do que levar */
.checklist-secao { padding: 110px 0; background: var(--creme); }
.checklist { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 48px; max-width: 820px; margin: 48px auto 0; }
.checklist li { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--linha); font-size: 15px; cursor: pointer; user-select: none; }
.checklist li::before { content: ""; flex: none; width: 18px; height: 18px; border: 1px solid var(--marrom); border-radius: 50%; transition: background .2s; }
.checklist li.marcado { color: var(--suave); text-decoration: line-through; }
.checklist li.marcado::before { background: var(--marrom) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M5 12l4 4 10-10'/%3E%3C/svg%3E") center / 12px no-repeat; }
.checklist-nota { text-align: center; margin-top: 22px; font-size: 13px; color: var(--suave); }
@media (max-width: 700px) { .checklist { grid-template-columns: 1fr; } }

/* locais para se inspirar (guia do ensaio): cada local é um carrossel para arrastar para o lado */
.locais { padding: 110px 0 90px; overflow: hidden; }
.local + .local { margin-top: 90px; }
.local-cabecalho { text-align: center; margin-bottom: 26px; padding: 0 24px; }
.local-cabecalho h3 { font: italic 400 clamp(2rem, 4vw, 2.8rem) var(--serif); color: var(--tinta); }
.local-cabecalho p { margin-top: 6px; font-size: 11px; letter-spacing: .35em; text-transform: uppercase; color: var(--marrom); }
.carrossel { position: relative; }
.carrossel-trilho { display: flex; gap: 4px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; padding: 0 max(24px, calc((100vw - 1120px) / 2)); scroll-padding: 0 max(24px, calc((100vw - 1120px) / 2)); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.carrossel-trilho::-webkit-scrollbar { display: none; }
.carrossel-trilho img { flex: 0 0 auto; height: clamp(380px, 62vh, 640px); width: auto; max-width: none; object-fit: cover; scroll-snap-align: start; user-select: none; -webkit-user-drag: none; }
.carrossel-seta { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--tinta); font: 400 22px/1 var(--serif); cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.15); transition: opacity .25s; }
.carrossel-seta.anterior { left: max(12px, calc((100vw - 1120px) / 2 - 24px)); }
.carrossel-seta.proxima { right: max(12px, calc((100vw - 1120px) / 2 - 24px)); }
.carrossel-seta[disabled] { opacity: 0; pointer-events: none; }
.carrossel-rodape { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 18px; font-size: 11px; letter-spacing: .3em; color: var(--suave); }
.carrossel-rodape .dica { font: italic 400 14px var(--serif); letter-spacing: 0; color: var(--marrom); }
@media (hover: none) { .carrossel-seta { display: none; } }
@media (hover: hover) { .carrossel-rodape .dica { display: none; } }
@media (max-width: 760px) {
  .locais { padding: 80px 0 60px; }
  .carrossel-trilho img { height: min(60vh, 460px); } /* deixa aparecer a ponta da próxima foto, convidando a arrastar */
}
