﻿/* =========================================================
   Fundo do site: "mesa de revelação".
   Papel liso neutro quente (sem textura), linhas finas de
   enquadramento em dourado e a seção de trabalhos em câmara escura,
   com tira de filme. Substitui as manchas de gradiente embaçado.
   Carregado depois de todos os outros estilos.
   ========================================================= */
:root {
  --papel: #f7f4ee;
  --papel-claro: #fcfaf6;
  --camara: #0f0e0c;
  --marfim: #f6f0e4;
  --fio: #a8885838;          /* fio dourado fino */
  --fio-forte: #a8885866;
  --grao: none;              /* sem textura: fundo liso */
}

/* ---------- papel liso, neutro quente, com luz suave só no topo ---------- */
body.page-home, body.page-cat {
  background-color: var(--papel);
  background-image: radial-gradient(90% 520px at 50% 0%, #fffdf9 0%, #fffdf900 100%);
  background-repeat: no-repeat;
}
body::before { display: none; }   /* tira também o granulado de filme global */

/* as manchas embaçadas de antes saem */
.aurora, .bg-deco { display: none !important; }

/* ---------- home: fios de enquadramento ---------- */
.home { position: relative; }
.home::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none; top: 0; bottom: 0; left: 8px; right: 8px;
  border-left: 1px solid var(--fio); border-right: 1px solid var(--fio);
}
.home-top { position: relative; padding-bottom: 12px; border-bottom: 1px solid var(--fio); margin: 0 -18px; padding-left: 20px; padding-right: 20px; }
.home-top::after { /* marca de registro no canto */
  content: "+"; position: absolute; left: 3px; bottom: -9px; font: 400 15px/1 var(--mono); color: var(--gold); background: var(--papel); padding: 0 2px;
}
.home-top::before {
  content: "+"; position: absolute; right: 3px; bottom: -9px; font: 400 15px/1 var(--mono); color: var(--gold); background: var(--papel); padding: 0 2px;
}

/* o perfil ganha a grade dos terços, como no visor da câmera */
.profile::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none; inset: 6px -6px -6px;
  background:
    linear-gradient(90deg, #0000 calc(33.33% - .5px), var(--fio) calc(33.33% - .5px) calc(33.33% + .5px), #0000 calc(33.33% + .5px)),
    linear-gradient(90deg, #0000 calc(66.66% - .5px), var(--fio) calc(66.66% - .5px) calc(66.66% + .5px), #0000 calc(66.66% + .5px)),
    linear-gradient(#0000 calc(33.33% - .5px), var(--fio) calc(33.33% - .5px) calc(33.33% + .5px), #0000 calc(33.33% + .5px)),
    linear-gradient(#0000 calc(66.66% - .5px), var(--fio) calc(66.66% - .5px) calc(66.66% + .5px), #0000 calc(66.66% + .5px));
  -webkit-mask-image: radial-gradient(closest-side, #000 55%, #0000 100%); mask-image: radial-gradient(closest-side, #000 55%, #0000 100%);
}

/* serviços: cartões de papel com fio dourado, sem sombra de "app" */
.svc { background: #fffdf8b3; border: 1px solid var(--fio-forte); box-shadow: none; border-radius: 6px; }

/* ---------- trabalhos: câmara escura com tira de filme ---------- */
.page-home #fotos, .page-home #bloco-videos { position: relative; isolation: isolate; color: var(--marfim); }
.page-home #fotos { margin-top: 72px; padding: 64px 0 40px; }
.page-home #bloco-videos { margin-top: 0; padding: 8px 0 64px; }
.page-home #fotos::before, .page-home #bloco-videos::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%);
  background:
    radial-gradient(60% 420px at 50% 0%, #ae8d5a40 0%, #ae8d5a00 100%),
    var(--grao),
    var(--camara);
  background-size: 100% 100%, 240px 240px, auto;
}
.page-home #bloco-videos::before { /* continua a mesma câmara escura, sem emenda */
  background: var(--grao), var(--camara); background-size: 240px 240px, auto;
}
.film-frames { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.page-home #fotos::after, .page-home #bloco-videos::after { /* furos da tira de filme */
  content: ""; position: absolute; z-index: -1; pointer-events: none; left: 50%; width: 100vw; transform: translateX(-50%); height: 100%; top: 0;
  background:
    linear-gradient(90deg, #f6f0e42e 0 10px, #0000 10px 24px) 0 14px / 24px 9px repeat-x;
}
.page-home #bloco-videos::after { background: none; }
.page-home #bloco-videos:not([hidden])::after {
  background: linear-gradient(90deg, #f6f0e42e 0 10px, #0000 10px 24px) 0 calc(100% - 23px) / 24px 9px repeat-x;
}
.page-home #fotos:has(+ #bloco-videos:not([hidden]))::after { background: linear-gradient(90deg, #f6f0e42e 0 10px, #0000 10px 24px) 0 14px / 24px 9px repeat-x; }
.page-home #fotos:not(:has(+ #bloco-videos:not([hidden])))::after {
  background:
    linear-gradient(90deg, #f6f0e42e 0 10px, #0000 10px 24px) 0 14px / 24px 9px repeat-x,
    linear-gradient(90deg, #f6f0e42e 0 10px, #0000 10px 24px) 0 calc(100% - 23px) / 24px 9px repeat-x;
}
.page-home #fotos .block-head { align-items: flex-end; border-bottom: 1px solid #f6f0e426; padding-bottom: 14px; margin-bottom: 22px; }
.page-home #fotos .block-head h2, #bloco-videos .block-head h2 { color: var(--marfim); }
.page-home #fotos .block-head::after, #bloco-videos .block-head::after {
  content: "Casamentos & eventos"; font: 500 10px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: #d8bf8c; padding-bottom: 6px;
}
.page-home #bloco-videos .block-head::after { content: "Cenas em movimento"; }
.page-home #fotos .poster { box-shadow: 0 0 0 1px #f6f0e41f, 0 28px 40px -26px #000; }
.page-home #fotos .poster:hover { box-shadow: 0 0 0 1px #d8bf8c88, 0 30px 46px -24px #000; }

/* ---------- contato: cartão com moldura dupla, como foto emoldurada ---------- */
.contact-card, .cat-cta {
  background: var(--papel-claro); border: 1px solid var(--fio-forte); border-radius: 6px;
  box-shadow: inset 0 0 0 9px var(--papel-claro), inset 0 0 0 10px var(--fio-forte);
}
.contact-mark { color: var(--gold); opacity: .1; }

/* ---------- páginas de trabalho: mesmo papel e fios ---------- */
.page-cat .cat-head { padding-top: 34px; border-bottom: 1px solid var(--fio); margin: 0 12px; padding-left: 8px; padding-right: 8px; }
.page-cat .t-capa { padding-top: 22px; }

/* ---------- celular ---------- */
@media (max-width: 1023px) {
  .page-home #fotos { margin-top: 56px; padding-top: 58px; }
}
@media (min-width: 1024px) {
  .home::before { left: 12px; right: 12px; }
  .home-top { margin: 0 -40px; padding-left: 42px; padding-right: 42px; }
  .page-home #fotos { margin-top: 96px; padding: 84px 0 56px; }
  .page-home #bloco-videos { padding-bottom: 84px; }
  .contact-card { box-shadow: inset 0 0 0 12px var(--papel-claro), inset 0 0 0 13px var(--fio-forte); }
}

