/* Intense Creative Studio
   Baseado na página aprovada (referencia/site-intense.html).
   Faixas alternadas em preto e off-white; o dourado marca títulos, números e botões.
   Cada faixa usa variáveis de tema (.escura, .clara, .dourada), para que o fundo
   escolhido no painel mantenha o texto legível. */

@font-face{font-family:"Poppins";font-style:normal;font-weight:300;font-display:swap;src:url(../fontes/poppins-300.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url(../fontes/poppins-400.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(../fontes/poppins-500.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url(../fontes/poppins-600.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url(../fontes/poppins-700.woff2) format("woff2")}

:root{
  --preto:#231F20;
  --preto-2:#2E292A;
  --dourado:#C6996A;
  --dourado-claro:#D9B48F;
  --off:#F7F7F7;
  --off-2:#ECE8E4;
  --cinza:#5E5657;
  --cinza-claro:#B9B1AC;
  --font-titulo:"Poppins", "Helvetica Neue", Arial, sans-serif;
  --font-texto:"Poppins", "Helvetica Neue", Arial, sans-serif;
  --max:1180px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--off);color:var(--preto);font-family:var(--font-texto);font-weight:300;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--preto)}
img{max-width:100%;display:block}
picture{display:contents}
source{display:none}
a{color:inherit}
:focus-visible{outline:2px solid var(--dourado);outline-offset:3px}
h1,h2,h3{font-family:var(--font-titulo);text-wrap:balance;margin:0}
p{margin:0}
[id]{scroll-margin-top:70px}
.pular{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--dourado);color:var(--preto);padding:10px 16px;font-weight:600;text-decoration:none}
.pular:focus{left:16px}

/* Temas das faixas */
.escura{
  --fundo:var(--preto);--texto:var(--off);--texto-suave:var(--cinza-claro);
  --cartao:var(--preto-2);--cartao-borda:rgba(198,153,106,.22);
  --espaco:var(--preto-2);--espaco-borda:rgba(198,153,106,.45);
  --linha:rgba(247,247,247,.12);--servico-fundo:var(--preto);
}
.clara{
  --fundo:var(--off);--texto:var(--preto);--texto-suave:var(--cinza);
  --cartao:#fff;--cartao-borda:var(--off-2);
  --espaco:var(--off-2);--espaco-borda:var(--cinza-claro);
  --linha:var(--off-2);--servico-fundo:var(--off);
}
.dourada{
  --fundo:var(--dourado);--texto:var(--preto);--texto-suave:var(--preto);
  --cartao:var(--dourado-claro);--cartao-borda:rgba(35,31,32,.2);
  --espaco:var(--dourado-claro);--espaco-borda:rgba(35,31,32,.35);
  --linha:rgba(35,31,32,.2);--servico-fundo:var(--dourado);
}
.escura,.clara,.dourada{background:var(--fundo);color:var(--texto)}

.faixa{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.miolo{max-width:var(--max);margin:0 auto;padding-block:96px}

.sobretitulo{font-family:var(--font-titulo);font-weight:500;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--dourado)}
.dourada .sobretitulo{color:var(--preto)}
.titulo-secao{font-weight:600;font-size:clamp(28px,4vw,44px);line-height:1.15;letter-spacing:-.01em}
.intro{max-width:62ch;font-size:17px;color:var(--texto-suave)}
.cabeca-secao{display:grid;gap:18px;margin-bottom:56px}

.botao{display:inline-flex;align-items:center;gap:12px;background:var(--dourado);color:var(--preto);text-decoration:none;font-family:var(--font-titulo);font-weight:600;font-size:15px;letter-spacing:.02em;padding:16px 28px;border-radius:2px;transition:background .2s ease, transform .2s ease}
.botao:hover{background:var(--dourado-claro);transform:translateY(-1px)}
.botao svg{width:18px;height:18px;flex:none}
.dourada .botao{background:var(--preto);color:var(--off)}
.dourada .botao:hover{background:var(--preto-2)}
.rodape-secao{margin-top:56px;display:flex;flex-wrap:wrap;align-items:center;gap:24px 32px}
.rodape-secao p{max-width:56ch;color:var(--texto-suave)}

/* Espaço reservado (foto ou vídeo ainda não enviado) */
.vazio{background:var(--espaco);border:1px dashed var(--espaco-borda);color:var(--texto-suave)}

/* Cabeçalho */
.topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--preto);border-bottom:1px solid rgba(198,153,106,.22)}
.topo .miolo{padding-block:14px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.topo .logo img{height:34px;width:auto}
.menu{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.menu a{text-decoration:none;color:var(--off);font-size:13px;font-weight:400;letter-spacing:.06em;opacity:.8}
.menu a:hover{opacity:1;color:var(--dourado)}
.topo .botao{padding:11px 18px;font-size:13px}

/* Abertura */
.abertura{position:relative;overflow:hidden}
.abertura .miolo{padding-block:96px 104px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:48px;align-items:center;position:relative;z-index:1}
.abertura-texto{display:grid;gap:26px;min-width:0}
.selo{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dourado)}
.selo::before{content:"";width:36px;height:1px;background:var(--dourado);flex:none}
.abertura h1{font-weight:600;font-size:clamp(34px,5.4vw,62px);line-height:1.08;letter-spacing:-.02em}
.abertura h1 em{font-style:normal;color:var(--dourado)}
.subtitulo{font-family:var(--font-titulo);font-weight:500;font-size:clamp(13px,1.4vw,15px);letter-spacing:.26em;text-transform:uppercase;color:var(--dourado)}
.abertura .apoio{max-width:58ch;font-size:17px;color:var(--texto-suave)}
.abertura .acoes{display:grid;gap:14px;justify-items:start}
.abertura .linha{font-size:14px;color:var(--texto-suave)}
.abertura .linha strong{color:var(--texto);font-weight:500}
.retrato{position:relative;justify-self:center;width:min(100%,420px);aspect-ratio:4/5}
.retrato-n{position:absolute;right:0;top:0;height:88%;width:auto;opacity:.95}
.retrato-foto{position:absolute;left:0;bottom:0;width:76%;aspect-ratio:4/5;max-width:100%;overflow:hidden}
.retrato-foto.vazio{border-color:rgba(198,153,106,.55);display:grid;place-items:center;text-align:center;padding:16px;font-size:13px;letter-spacing:.08em;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.retrato-foto.com-foto{box-shadow:0 24px 60px rgba(0,0,0,.35)}
.retrato-foto img{width:100%;height:100%;object-fit:cover}
/* PNG sem fundo: a pessoa fica livre na frente do N, sem caixa */
.retrato-foto.recorte{overflow:visible;box-shadow:none}
.retrato-foto.recorte img{object-fit:contain;object-position:50% 100% !important;filter:drop-shadow(0 18px 30px rgba(0,0,0,.35))}
.pontos{position:absolute;right:-60px;top:-40px;width:420px;height:auto;opacity:.18;pointer-events:none;z-index:0}

/* Para quem é */
.situacoes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.situacao{grid-column:span 2;background:var(--cartao);border:1px solid var(--cartao-borda);padding:32px 28px;display:grid;gap:14px;align-content:start;min-width:0}
.situacao:nth-child(-n+2){grid-column:span 3}
.situacao .num{font-family:var(--font-titulo);font-weight:600;font-size:13px;letter-spacing:.16em;color:var(--dourado)}
.dourada .situacao .num{color:var(--preto)}
.situacao h3{font-weight:600;font-size:20px;line-height:1.3;color:var(--texto)}
.situacao p{color:var(--texto-suave);font-size:15.5px}

/* Trabalhos */
.videos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.video{display:grid;gap:12px;align-content:start;min-width:0;margin:0}
.tela{aspect-ratio:9/16;max-width:100%;width:100%;position:relative;overflow:hidden}
.tela.vazio{color:inherit;display:grid;place-items:center;align-content:center;gap:12px;text-align:center;padding:12px}
.tela svg{width:44px;height:44px}
.tela.vazio span{font-size:12px;letter-spacing:.08em;color:var(--texto-suave)}
.video p{font-size:13px;line-height:1.5;color:var(--texto-suave)}
.video p strong{display:block;color:var(--texto);font-weight:500}

/* Vídeo com capa: só carrega o vídeo ao tocar */
.tocar{appearance:none;border:0;padding:0;margin:0;width:100%;height:100%;display:block;cursor:pointer;background:var(--preto-2);position:relative;color:inherit;font:inherit}
.tocar img{width:100%;height:100%;object-fit:cover}
.tocar .play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(35,31,32,0) 55%,rgba(35,31,32,.45));transition:background .2s ease}
.tocar .play svg{width:56px;height:56px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.35))}
.tocar:hover .play{background:rgba(35,31,32,.25)}
.tela video,.tela iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;object-fit:cover}

/* Serviços */
.servicos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--linha);border:1px solid var(--linha)}
.servico{background:var(--servico-fundo);padding:36px 30px;display:grid;gap:14px;align-content:start;min-width:0}
.servico svg{width:34px;height:34px;color:var(--dourado)}
.dourada .servico svg{color:var(--preto)}
.servico h3{font-weight:600;font-size:19px;line-height:1.3}
.servico p{color:var(--texto-suave);font-size:15.5px}

/* Como funciona */
.etapas{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 28px;counter-reset:etapa}
.etapa{display:grid;gap:12px;align-content:start;border-top:1px solid rgba(198,153,106,.4);padding-top:22px;position:relative;min-width:0}
.etapa::before{counter-increment:etapa;content:counter(etapa, decimal-leading-zero);font-family:var(--font-titulo);font-weight:600;font-size:40px;line-height:1;color:var(--dourado)}
.etapa::after{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--dourado)}
.dourada .etapa{border-top-color:rgba(35,31,32,.35)}
.dourada .etapa::before{color:var(--preto)}
.dourada .etapa::after{background:var(--preto)}
.etapa h3{font-weight:600;font-size:18px;color:var(--texto)}
.etapa p{font-size:15px;color:var(--texto-suave)}

/* Depoimentos */
.depoimentos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.depoimento{background:var(--cartao);border:1px solid var(--cartao-borda);padding:32px 28px;display:grid;gap:20px;align-content:space-between;min-width:0;margin:0}
.depoimento.vazio{background:var(--cartao);border:1px dashed var(--espaco-borda);color:inherit}
.depoimento .aspas{font-family:var(--font-titulo);font-weight:700;font-size:56px;line-height:.6;color:var(--dourado)}
.depoimento blockquote{margin:0;color:var(--texto-suave);font-size:15.5px}
.depoimento .autor{display:flex;align-items:center;gap:14px}
.depoimento .foto{width:48px;height:48px;border-radius:50%;background:var(--espaco);flex:none;overflow:hidden}
.depoimento .foto img{width:100%;height:100%;object-fit:cover}
.depoimento .autor strong{display:block;font-weight:600;color:var(--dourado);font-size:15px}
.dourada .depoimento .autor strong{color:var(--preto)}
.depoimento .autor span{font-size:13px;color:var(--texto-suave)}
.depoimento.com-video{padding:0;gap:0;align-content:start;overflow:hidden}
.depoimento.com-video .autor{padding:18px 20px}
.depoimento.com-video .tela{aspect-ratio:4/5}

/* Quem está por trás */
.sobre{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.sobre-texto{display:grid;gap:22px;min-width:0}
.foto-casal{aspect-ratio:4/5;max-width:100%;overflow:hidden}
.foto-casal.vazio{display:grid;place-items:center;font-size:13px;letter-spacing:.08em;text-align:center;padding:16px}
.foto-casal img,.socio .foto img{width:100%;height:100%;object-fit:cover}
.socios{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:12px}
.socio{display:grid;gap:12px;align-content:start;min-width:0}
.socio .foto{aspect-ratio:1;max-width:100%;overflow:hidden}
.socio .foto.vazio{display:grid;place-items:center;font-size:12px;letter-spacing:.08em;text-align:center;padding:12px}
.socio h3{font-weight:600;font-size:20px;color:var(--texto)}
.socio p{font-size:15px;color:var(--texto-suave)}

/* Chamada final */
.chamada .miolo{padding-block:88px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:center}
.chamada h2{font-weight:600;font-size:clamp(28px,4vw,42px);line-height:1.15}
.chamada p{font-size:17px;max-width:58ch;margin-top:18px}
.chamada:not(.dourada) p{color:var(--texto-suave)}
.chamada .botao{justify-self:start}

/* Rodapé */
.rodape .miolo{padding-block:64px 40px;display:grid;gap:40px}
.rodape-grade{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:40px}
.rodape .marca img{height:40px;width:auto}
.rodape .marca{display:grid;gap:16px;align-content:start}
.rodape .marca p{color:var(--texto-suave);font-size:15px;max-width:34ch}
.rodape h3{font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dourado);margin-bottom:12px}
.rodape .col p,.rodape .col a{font-size:15px;color:var(--texto);text-decoration:none;display:block}
.rodape .col a:hover{color:var(--dourado)}
.rodape .legal{border-top:1px solid var(--linha);padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:13px;color:var(--texto-suave)}

/* Aviso de cookies (só aparece se Analytics ou Pixel estiverem ativos) */
.cookies{position:fixed;left:16px;right:16px;bottom:16px;z-index:70;max-width:560px;margin-left:auto;background:var(--preto);color:var(--off);border:1px solid rgba(198,153,106,.4);padding:20px;display:grid;gap:14px;box-shadow:0 18px 40px rgba(0,0,0,.3);font-size:14px;line-height:1.6}
.cookies[hidden]{display:none}
.cookies p{color:var(--cinza-claro)}
.cookies .opcoes{display:flex;flex-wrap:wrap;gap:10px}
.cookies button{font:600 14px var(--font-titulo);padding:10px 18px;border-radius:2px;cursor:pointer;border:1px solid var(--dourado)}
.cookies .aceitar{background:var(--dourado);color:var(--preto)}
.cookies .recusar{background:transparent;color:var(--off)}

/* Faixa de pré-visualização (só para quem está no painel) */
.aviso-previa{position:sticky;top:0;z-index:80;background:var(--dourado);color:var(--preto);text-align:center;font:500 14px/1.4 var(--font-titulo);padding:10px 16px}
.aviso-previa a{font-weight:600}

@media (max-width:1020px){
  .menu{display:none}
  .videos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .etapas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .servicos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .servicos .servico:last-child{grid-column:span 2}
}
@media (max-width:760px){
  .miolo{padding-block:72px}
  .abertura .miolo{grid-template-columns:1fr;padding-block:64px 72px}
  .retrato{width:min(100%,320px);justify-self:start}
  .pontos{width:300px;right:-120px;top:-60px}
  .situacoes{grid-template-columns:1fr}
  .situacao,.situacao:nth-child(-n+2){grid-column:auto}
  .videos{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:8px}
  .video{flex:0 0 68%;scroll-snap-align:start}
  .servicos{grid-template-columns:1fr}
  .servicos .servico:last-child{grid-column:auto}
  .etapas{grid-template-columns:1fr;gap:36px}
  .depoimentos{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:8px}
  .depoimento{flex:0 0 85%;scroll-snap-align:start}
  .sobre{grid-template-columns:1fr;gap:40px}
  .chamada .miolo{grid-template-columns:1fr;padding-block:64px}
  .rodape-grade{grid-template-columns:1fr}
  .topo .logo img{height:28px}
  .topo .botao span{display:none}
  .topo .botao{padding:11px 13px}
}
@media (max-width:520px){.socios{grid-template-columns:1fr}.socio .foto{aspect-ratio:4/3}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.botao{transition:none}.botao:hover{transform:none}}
.link-cookies{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
.link-cookies:hover{color:var(--dourado)}