/* Saint · temas do site (☀️ Creme · 🍷 Vinho · 🌙 Noite) e cor por serviço.
   O visitante escolhe no adesivo do topo; fica guardado no aparelho. Creme = o site de sempre.
   Regra da casa: nada chapado. Noite e Vinho mantêm grão, sombra e brilho; polaroids continuam papel. */

/* ---------- botão de tema (adesivo no topo) ---------- */
.tema54{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px 0 8px;border-radius:999px;background:#FBF7EE;color:#111;font:600 13px/1 var(--texto);box-shadow:0 1px 2px rgba(0,0,0,.35),0 6px 14px -4px rgba(0,0,0,.55),0 0 0 2px rgba(255,255,255,.85) inset;transform:rotate(-4deg);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.tema54:hover{transform:rotate(3deg) scale(1.06)}
.tema54:focus-visible{outline:3px solid var(--mostarda);outline-offset:3px}
.tema54 i{font-style:normal;font-size:18px;line-height:1}
.tema54 span{white-space:nowrap}
.top .wrap{gap:12px}
@media (max-width:860px){.tema54{height:36px;padding:0 10px 0 7px}.tema54 span{display:none}}

/* ---------- 🌙 NOITE: mesa de polaroids sob luz de abajur ---------- */
html[data-tema="noite"] .papel,html[data-tema="noite"] .sec.creme{
  background:radial-gradient(ellipse at 28% 12%,#3a2a20 0%,#1f1713 48%,#120d0b 100%);color:#F4E6C3;
  --preto:#F4E6C3;--tinta:#EDDFC2;--suave-c:#CDBFA6;--linha-c:#4a3b31;--papel:#1f1713;--papel-2:#2c211a}
html[data-tema="noite"] .papel::before{mix-blend-mode:screen;opacity:.07}
html[data-tema="noite"] .papel::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 78% 18%,rgba(243,175,48,.16),transparent 42%),radial-gradient(circle at 12% 80%,rgba(165,28,52,.14),transparent 40%)}
html[data-tema="noite"] .papel .lab,html[data-tema="noite"] .sec.creme .lab{color:var(--mostarda)}
html[data-tema="noite"] .papel .btn:hover{background:#F4E6C3;color:#111}
html[data-tema="noite"] .papel .filtros button[aria-pressed="true"]{background:#F4E6C3;color:#111;border-color:#F4E6C3}
html[data-tema="noite"] .papel .filtros button{border-color:rgba(244,230,195,.3)}
html[data-tema="noite"] .papel .campo input,html[data-tema="noite"] .papel .campo textarea,html[data-tema="noite"] .papel .campo select{background:#2a201b;color:#F4E6C3;border-color:#4a3b31}
/* cartões viram couro escuro com brilho na borda */
html[data-tema="noite"] :is(.cartao,.nota-card,.recado,.frente18,.passo18,.faq,.pack25,.plano25,.ag37-cidade,.dep39-c,.res47-c,.est-card,.est-sec,.det25,.pl26){
  background:linear-gradient(160deg,#2c221c,#1c1512);color:#F4E6C3;
  --preto:#F4E6C3;--suave-c:#CDBFA6;--linha-c:#4a3b31;
  box-shadow:0 0 0 1px rgba(244,230,195,.10),0 2px 4px rgba(0,0,0,.6),0 22px 40px -12px rgba(0,0,0,.85),0 0 40px -8px rgba(243,175,48,.18)}
html[data-tema="noite"] :is(.cartao,.nota-card,.faq,.pack25,.plano25,.res47-c,.est-sec) p{color:#D9CCB2}
/* polaroids e adesivos continuam papel de verdade */
html[data-tema="noite"] .print{--preto:#111111;--suave-c:#5E5652;background:#F7EFDC;box-shadow:0 1px 2px rgba(0,0,0,.6),0 18px 34px -10px rgba(0,0,0,.9),0 0 46px -6px rgba(243,175,48,.22)}
html[data-tema="noite"] .print figcaption{color:var(--vinho)}
html[data-tema="noite"] .stk{filter:drop-shadow(0 10px 18px rgba(0,0,0,.6)) brightness(.96)}
html[data-tema="noite"] .papel .mt,html[data-tema="noite"] .sec.creme .mt{color:var(--mostarda);background:linear-gradient(transparent 84%,rgba(243,175,48,.5) 84%,rgba(243,175,48,.5) 95%,transparent 95%);text-shadow:0 0 22px rgba(243,175,48,.35)}

/* ---------- 🍷 VINHO: a casa toda na cor da Saint ---------- */
html[data-tema="vinho"] .papel,html[data-tema="vinho"] .sec.creme{
  background:radial-gradient(ellipse at 30% 14%,#C23A52 0%,#A51C34 46%,#6E0F21 100%);color:#FBEFD6;
  --preto:#FBEFD6;--tinta:#FBEFD6;--suave-c:#F2D7C4;--linha-c:rgba(251,239,214,.28)}
html[data-tema="vinho"] .papel::before{mix-blend-mode:overlay;opacity:.16}
html[data-tema="vinho"] .papel .lab,html[data-tema="vinho"] .sec.creme .lab{color:var(--mostarda)}
html[data-tema="vinho"] .papel .btn.cheio{background:#111;border-color:#111;color:#FBEFD6;box-shadow:0 10px 24px -8px rgba(0,0,0,.6)}
html[data-tema="vinho"] .papel .btn:hover{background:#FBEFD6;color:#7A1226}
html[data-tema="vinho"] .papel .filtros button[aria-pressed="true"]{background:#FBEFD6;color:#7A1226;border-color:#FBEFD6}
html[data-tema="vinho"] .papel .filtros button{border-color:rgba(251,239,214,.4)}
html[data-tema="vinho"] .papel .mt,html[data-tema="vinho"] .sec.creme .mt{color:var(--mostarda);background:linear-gradient(transparent 84%,rgba(17,17,17,.45) 84%,rgba(17,17,17,.45) 95%,transparent 95%);text-shadow:0 2px 0 rgba(0,0,0,.25)}
/* cartões continuam papel creme (contraste lindo no vinho) */
html[data-tema="vinho"] :is(.cartao,.nota-card,.recado,.frente18,.passo18,.faq,.pack25,.plano25,.ag37-cidade,.dep39-c,.res47-c,.det25,.pl26,.print){--preto:#111111;--tinta:#2A2421;--suave-c:#5E5652;--linha-c:#D9CBA8;color:#111}
html[data-tema="vinho"] :is(.cartao,.faq,.pack25,.plano25,.res47-c) .lab{color:var(--vinho)}
html[data-tema="vinho"] .papel .campo input,html[data-tema="vinho"] .papel .campo textarea,html[data-tema="vinho"] .papel .campo select{background:#FBF8F1;color:#111}

/* ---------- 🎨 cor por serviço (as páginas de serviço e os cases pintam o destaque) ---------- */
body[data-servico="identidade"]{--mostarda:#F28AA0}
body[data-servico="fotografia"]{--mostarda:#F3AF30}
body[data-servico="video"]{--mostarda:#9EE6B8}
body[data-servico="social"]{--mostarda:#FFB38A}
.serv54{display:inline-flex;align-items:center;gap:8px}
.serv54 img{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));transform:rotate(-8deg)}
.filtros button .serv54 img{width:22px;height:22px}

@media (prefers-reduced-motion:reduce){.tema54{transition:none}}

/* ---------- v55: notas anterior/próxima · barra de leitura ---------- */
.nav55{padding:clamp(40px,6vw,72px) 0}
.nav55-g{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,3vw,32px);align-items:center}
.nav55-g .nota-card{text-decoration:none;display:block;transform:rotate(var(--r,0deg));transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.nav55-g .nota-card:hover{transform:rotate(0) translateY(-4px)}
.nav55-g .nota-card h3{font-size:clamp(20px,2.2vw,26px);margin-top:8px}
@media (max-width:720px){.nav55-g{grid-template-columns:1fr}.nav55-g .btn{justify-self:center}}
.barra55{position:fixed;left:0;top:0;height:4px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--vinho),var(--mostarda));box-shadow:0 0 12px rgba(243,175,48,.6);z-index:60;pointer-events:none}
/* reel de verdade grudado na capa do case (celular-adesivo) */
.case18 figure{position:relative}
.reel55{position:absolute;right:6%;bottom:-6%;width:clamp(74px,22%,150px);aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#111;border:4px solid #FBF7EE;transform:rotate(6deg);box-shadow:0 2px 4px rgba(0,0,0,.35),0 18px 30px -8px rgba(0,0,0,.6),0 0 30px -6px rgba(243,175,48,.35);z-index:2;pointer-events:none;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.reel55 video{width:100%;height:100%;object-fit:cover;display:block}
.case18:hover .reel55{transform:rotate(0) translateY(-6px) scale(1.04)}