/* v4 - 2026-07-29 */
:root{
  --bg:#0D0C11;
  --bg-2:#151320;
  --gold:#E8B93A;
  --gold-dim:#8A7433;
  --text:#EDEAE2;
  --text-dim:#8D8797;
  --linha:rgba(237,234,226,0.09);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif; background:var(--bg); color:var(--text); line-height:1.7; font-size:16px;}
h1,h2,h3,h4{font-family:'Fraunces',serif; font-weight:500; color:var(--text); letter-spacing:-.01em;}
a{text-decoration:none; color:inherit;}
button{font:inherit; color:inherit; background:none; border:none; cursor:pointer;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}

/* Header */
header{position:sticky; top:0; z-index:50; background:rgba(13,12,17,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--linha);}
header .wrap{display:flex; align-items:center; justify-content:space-between; padding:14px 32px;}
.logo-wrap img{height:64px; width:auto;}
nav{display:flex; align-items:center; gap:36px;}
nav a{font-size:14px; font-weight:500; color:var(--text-dim); position:relative; padding:4px 0;}
nav a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--gold); transition:width .2s;}
nav a:hover{color:var(--text);}
nav a:hover::after{width:100%;}
.btn-login{display:flex; align-items:center; gap:7px; font-size:13px; color:var(--text); border:1px solid var(--linha); padding:8px 16px; border-radius:2px;}
.btn-login:hover{border-color:var(--gold-dim);}

/* Hero full-bleed com foto real */
.hero{position:relative; min-height:640px; display:flex; align-items:center; overflow:hidden; padding:0;}
.hero-bg{position:absolute; inset:0; background-size:cover; background-position:65% center; opacity:0; transition:opacity 1.2s ease;}
.hero-bg.is-active{opacity:1;}
.hero-overlay{position:absolute; inset:0; background:linear-gradient(90deg, #0D0C11 22%, rgba(13,12,17,0.86) 46%, rgba(13,12,17,0.32) 74%, rgba(13,12,17,0.05) 100%);}
.hero-content{position:relative; z-index:2; padding:80px 32px;}
.hero-content .wrap{max-width:620px; margin:0; padding-left:32px;}
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-style:italic; color:var(--gold); font-size:14px; margin-bottom:20px;}
.eyebrow::before{content:""; width:28px; height:1px; background:var(--gold);}
.hero h1{font-size:clamp(32px,3.6vw,48px); line-height:1.14; margin-bottom:22px;}
.hero p{color:var(--text-dim); font-size:16.5px; max-width:440px; margin-bottom:34px;}
.hero-cta{display:flex; align-items:center; gap:28px; flex-wrap:wrap;}
.btn-gold{display:inline-flex; align-items:center; gap:10px; border:1px solid var(--gold); color:var(--gold); padding:14px 26px; font-size:14px; font-weight:500; border-radius:2px; transition:.2s;}
.btn-gold:hover{background:var(--gold); color:var(--bg);}
.btn-gold svg{width:14px; height:14px;}
.link-plain{font-size:14px; color:var(--text-dim); border-bottom:1px solid var(--linha); padding-bottom:3px;}
.link-plain:hover{color:var(--text); border-color:var(--text-dim);}

section{padding:110px 32px;}
.head-block{max-width:600px; margin-bottom:60px;}
.head-block.center{margin-left:auto; margin-right:auto; text-align:center;}
.head-block h2{font-size:clamp(26px,3vw,34px); line-height:1.2;}
.head-block p{color:var(--text-dim); margin-top:14px; font-size:15px;}

/* Serviços — cards */
.servicos-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1px; background:var(--linha); border:1px solid var(--linha);}
.servico-card{background:var(--bg); padding:38px 32px; position:relative; transition:background .25s;}
.servico-card:hover{background:var(--bg-2);}
.servico-card .idx{position:absolute; top:28px; right:32px; font-family:'Fraunces',serif; font-style:italic; color:var(--linha); font-size:34px; transition:color .25s;}
.servico-card:hover .idx{color:rgba(232,185,58,0.22);}
.servico-icon{width:46px; height:46px; border:1px solid var(--gold-dim); border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:24px; color:var(--gold);}
.servico-icon svg{width:20px; height:20px;}
.servico-card h3{font-size:17px; font-weight:500; color:var(--text); margin-bottom:10px; position:relative;}
.servico-card p{color:var(--text-dim); font-size:14px; position:relative;}

.servico-cta{background:var(--bg-2); border:1px solid var(--gold-dim); padding:32px; display:flex; flex-direction:column; justify-content:space-between;}
.servico-cta h3{color:var(--gold); font-family:'Fraunces',serif; font-size:19px; font-weight:500; line-height:1.3; margin-bottom:18px;}
.servico-cta .cta-pill{align-self:flex-start; padding:12px 20px; font-size:13px; background:var(--gold); color:#161018;}
.servico-cta .cta-pill:hover{background:#F2CB6A;}

/* Como funciona */
.etapas{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--linha); border:1px solid var(--linha); position:relative;}
.etapas::before{content:""; position:absolute; top:24px; left:6%; right:6%; height:1px; background:var(--linha);}
.etapa{background:var(--bg-2); padding:0 18px; position:relative;}
.etapa-top{display:flex; align-items:baseline; gap:14px; margin-bottom:22px;}
.etapa .num{width:48px; height:48px; border-radius:50%; background:var(--bg); border:1px solid var(--gold-dim); color:var(--gold); display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; font-size:17px; line-height:1; margin-bottom:20px; position:relative; z-index:2;}
.etapa .linha-num{flex:1; height:1px; background:var(--linha); margin-bottom:6px;}
.etapa h4{font-size:15.5px; margin-bottom:8px; color:var(--text);}
.etapa p{font-size:13.5px; color:var(--text-dim);}
.etapa-arrow{position:absolute; top:50%; right:-13px; transform:translateY(-50%); z-index:3; width:26px; height:26px; border-radius:50%; background:var(--bg); border:1px solid var(--gold-dim); display:flex; align-items:center; justify-content:center; color:var(--gold);}
.etapa-arrow svg{width:12px; height:12px;}

/* Card CTA de destaque, ao final das etapas */
.cta-destaque{margin-top:1px; background:linear-gradient(120deg,var(--gold) 0%, #F2CB6A 100%); border-radius:20px; padding:44px 48px; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;}
.cta-destaque h3{font-family:'Fraunces',serif; font-size:24px; color:#161018; max-width:420px; line-height:1.25;}
.cta-pill{display:inline-flex; align-items:center; gap:10px; background:#161018; color:#fff; padding:16px 30px; border-radius:999px; font-size:14px; font-weight:600; white-space:nowrap;}
.cta-pill svg{width:14px; height:14px;}
.cta-pill:hover{background:#231A2E;}

/* Sobre */
.sobre{background:var(--bg-2);}
.sobre .wrap{display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center;}
.sobre-visual{position:relative; padding-top:118%; overflow:hidden;}
.sobre-visual img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.2s ease;}
.sobre-visual img.is-active{opacity:1;}
.sobre-visual::after{content:""; position:absolute; inset:0; border:1px solid var(--linha);}
.sobre ul{margin:24px 0; list-style:none;}
.sobre li{display:flex; gap:12px; margin-bottom:14px; font-size:14.5px; color:var(--text-dim);}
.sobre li span{color:var(--gold); font-family:'Fraunces',serif; font-style:italic;}
.sobre .stats{display:flex; gap:40px; margin-top:32px; padding-top:26px; border-top:1px solid var(--linha);}
.sobre .stats .num{font-family:'Fraunces',serif; font-size:26px; color:var(--gold);}
.sobre .stats .lbl{font-size:12px; color:var(--text-dim); margin-top:3px;}

/* Portfólio */
.portfolio-topo{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:52px; gap:24px; flex-wrap:wrap;}
.portfolio-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:18px;}
.album{position:relative; overflow:hidden; border:1px solid var(--linha);}
.album img{width:100%; height:100%; object-fit:cover; display:block; filter:brightness(0.82) saturate(0.95);}
.album:nth-child(1){grid-row:span 2;}
.album:nth-child(1) img{height:440px;}
.album:nth-child(2) img, .album:nth-child(3) img, .album:nth-child(4) img, .album:nth-child(5) img{height:211px;}
.album-tag{position:absolute; top:14px; left:14px; background:rgba(13,12,17,0.75); border:1px solid rgba(232,185,58,0.4); color:var(--gold); font-size:10px; letter-spacing:.05em; text-transform:uppercase; padding:5px 10px;}
.album-info{position:absolute; bottom:0; left:0; right:0; padding:18px 20px; background:linear-gradient(0deg, rgba(13,12,17,0.92), transparent);}
.album-info h4{color:#fff; font-size:15.5px; margin-bottom:2px;}
.album-info span{font-size:12px; color:rgba(255,255,255,0.6);}
.btn-outline{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--linha); color:var(--text); padding:12px 22px; font-size:13.5px;}
.btn-outline:hover{border-color:var(--gold-dim); color:var(--gold);}
.portfolio-nota{margin-top:26px; font-size:13px; color:var(--text-dim); border-left:2px solid var(--gold-dim); padding-left:14px; max-width:640px;}

/* Catálogo completo (portfolio.php) */
.categoria-filtro{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:48px;}
.categoria-filtro a{font-size:13px; color:var(--text-dim); border:1px solid var(--linha); padding:10px 20px; border-radius:999px; transition:.2s;}
.categoria-filtro a:hover{border-color:var(--gold-dim); color:var(--text);}
.categoria-filtro a.active{background:var(--gold); border-color:var(--gold); color:#161018; font-weight:500;}
.catalogo-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.catalogo-grid .album{display:block; aspect-ratio:4/5;}
.catalogo-grid .album img{width:100%; height:100%;}
@media(max-width:900px){
  .catalogo-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  .catalogo-grid{grid-template-columns:1fr; gap:16px;}
  .catalogo-grid .album{aspect-ratio:4/3;}
}

/* Paginação (portfolio.php) */
.paginacao{display:flex; align-items:center; gap:14px; justify-content:center; margin-top:52px; font-size:13.5px;}
.paginacao a, .paginacao span{padding:10px 18px; border:1px solid var(--linha); border-radius:6px; color:var(--text-dim); transition:.2s;}
.paginacao a:hover{border-color:var(--gold-dim); color:var(--gold);}
.paginacao .atual{color:var(--gold); border-color:var(--gold-dim);}

/* Hero da página de detalhe do projeto (portfolio-projeto.php) */
.projeto-hero{position:relative; min-height:400px; display:flex; align-items:flex-end; overflow:hidden; margin-bottom:56px;}
.projeto-hero-bg{position:absolute; inset:0; background-size:cover; background-position:center;}
.projeto-hero-overlay{position:absolute; inset:0; background:linear-gradient(0deg, #0D0C11 10%, rgba(13,12,17,0.78) 55%, rgba(13,12,17,0.3) 100%);}
.projeto-hero-content{position:relative; z-index:2; padding:48px 32px 40px;}
.projeto-hero-content h1{font-size:clamp(28px,3.4vw,42px); line-height:1.15; margin-top:10px;}
.projeto-hero-content p{color:var(--text-dim); margin-top:12px; font-size:15px;}

/* Seções "Antes / Depois / Geral" da página de detalhe */
.secao-titulo{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--gold); margin:0 0 20px; font-family:'Fraunces',serif; font-style:italic; font-weight:500;}
.galeria-fotos{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:56px;}
.galeria-fotos .foto{position:relative; overflow:hidden; border:1px solid var(--linha); border-radius:8px; aspect-ratio:4/3;}
.galeria-fotos .foto img{width:100%; height:100%; object-fit:cover; display:block;}
@media(max-width:900px){
  .galeria-fotos{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  .galeria-fotos{grid-template-columns:1fr;}
}

/* Orçamento */
.orcamento{background:var(--bg-2); position:relative; overflow:hidden;}
.orcamento::before{content:""; position:absolute; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle, rgba(232,185,58,0.10) 0%, transparent 70%); top:-180px; right:-120px;}
.orcamento .wrap{position:relative; display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:center;}
.orcamento-copy p{color:var(--text-dim); margin-top:16px; margin-bottom:30px; font-size:15px; max-width:400px;}
.orcamento-copy ul{list-style:none;}
.orcamento-copy li{display:flex; gap:12px; margin-bottom:14px; font-size:14px; color:var(--text-dim);}
.orcamento-copy li span{color:var(--gold); font-family:'Fraunces',serif; font-style:italic;}
.form-card{background:var(--bg); border:1px solid var(--linha); border-radius:20px; padding:40px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.form-grid input, .form-grid select{width:100%; padding:16px 20px; border:1px solid var(--linha); background:#E6E1D4; color:#2A2530; font-size:14px; border-radius:8px; font-family:'Inter',sans-serif;}
.form-grid input::placeholder{color:#847C6D;}
.form-grid select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none; cursor:pointer; padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A2530' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 18px center; background-size:14px;
}
.form-grid select:invalid{color:#847C6D;}
.form-full{grid-column:1/-1;}
.btn-gold-solid{justify-content:center; background:var(--gold); color:#161018; font-weight:600; padding:16px 22px; font-size:14px; display:flex; align-items:center; gap:8px; border-radius:8px;}
.btn-gold-solid:hover{background:#F2CB6A;}
@media(max-width:600px){
  .form-grid{gap:12px;}
  .form-grid input, .form-grid select{padding:14px 16px;}
}
@media(max-width:480px){
  .form-card{padding:20px;}
  .form-grid input, .form-grid select{padding:13px 14px; font-size:13.5px;}
  .btn-gold-solid{padding:14px 16px; font-size:13px; gap:6px;}
}

/* Honeypot anti-spam: existe no DOM, invisível para humanos */
.campo-honeypot{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

/* Mensagem de sucesso/erro do formulário de orçamento */
.form-alerta{padding:14px 20px; border-radius:12px; font-size:13.5px; margin-bottom:20px; border:1px solid var(--linha);}
.form-alerta-success{color:#8FD19E; border-color:#8FD19E;}
.form-alerta-error{color:#E28A82; border-color:#E28A82;}

/* Footer */
footer{border-top:1px solid var(--linha); padding:64px 32px 0;}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px;}
.footer-grid img{height:60px; margin-bottom:16px;}
.footer-grid h5{color:var(--text); font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; font-weight:600;}
.footer-grid ul{list-style:none;}
.footer-grid li{margin-bottom:11px; font-size:13.5px; color:var(--text-dim);}
.footer-contato{margin-bottom:11px; font-size:13.5px; color:var(--text-dim);}
.footer-bottom{padding:20px 0; font-size:12px; color:var(--text-dim); border-top:1px solid var(--linha); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}

@media(max-width:900px){
  .hero{min-height:auto;}
  .hero-content .wrap{padding-left:0;}
  .hero-overlay{background:linear-gradient(180deg, rgba(13,12,17,0.24) 0%, rgba(13,12,17,0.62) 42%, rgba(13,12,17,0.75) 68%, rgba(13,12,17,0.75) 100%);}
  .hero-bg{background-position:center;}
  .sobre .wrap{grid-template-columns:1fr;}
  .orcamento .wrap{grid-template-columns:1fr;}
  .form-card{padding:28px;}
  .etapas{grid-template-columns:repeat(2,1fr); row-gap:32px;}
  .etapas::before{display:none;}
  .etapa-arrow{display:none;}
  .portfolio-grid{grid-template-columns:1fr;}
  .album:nth-child(1) img{height:260px;}
  .album:nth-child(2) img,.album:nth-child(3) img,.album:nth-child(4) img,.album:nth-child(5) img{height:220px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  nav{display:none;}
  .form-grid{grid-template-columns:1fr;}
}