/* Serviços: grade compacta de cards (arte, título e texto); o card inteiro leva ao contato com o serviço escolhido. */
.servicos-grade{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}
/* Divisórias finas: cada card tem borda à esquerda e em cima; a margem -1px + overflow escondem as bordas externas. */
.service-row{border-left:1px solid var(--rule);border-top:1px solid var(--rule);margin:-1px 0 0 -1px}
.service-row a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;height:100%;padding:28px 24px}
.service-row h3{font-size:22px;letter-spacing:-.5px;line-height:1.15;margin:6px 0 0;transition:color .2s}
.service-row p{font-size:14px;line-height:1.55;color:var(--mute);max-width:280px;margin:0}
.service-row a:hover h3{color:var(--blue)}
@media(max-width:900px){
  .servicos-grade{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px){
  .service-row a{padding:22px 12px;gap:8px}
  .service-row h3{font-size:18px;letter-spacing:-.3px;overflow-wrap:break-word}
  .service-row p{font-size:13px;line-height:1.5}
}
/* Nova arte: céu ao fundo, ilhas nas laterais e um objeto 3D por serviço. */
#servicos{position:relative;isolation:isolate;max-width:none;overflow:hidden;padding-left:max(5%,(100% - 1296px)/2);padding-right:max(5%,(100% - 1296px)/2);background:linear-gradient(#ffffffd9,#ffffffc2),#dbe8fb url('../img/nova-arte/ceu-azul-com-nuvens-suaves-11.webp') center/cover}
.servicos-ceu{position:absolute;inset:0;z-index:-1;pointer-events:none}
.servicos-ilha{position:absolute;height:auto;--altura:-26px;--giro:3deg}
.servicos-ilha-1{width:clamp(80px,9vw,150px);right:-2.5%;top:9%;--duracao:8.5s;--atraso:-2s}
.servicos-ilha-2{width:clamp(70px,7vw,120px);left:-2.5%;top:55%;--duracao:7s;--atraso:-4s;--giro:-3deg}
.servico-arte{display:block;height:120px;width:auto;max-width:100%;object-fit:contain;--altura:-8px;--giro:.8deg}
.service-row:nth-of-type(even) .servico-arte{--duracao:8s;--atraso:-3s;--giro:-.8deg}
/* Câmera sobre a ilha: um reflexo de luz cruza a lente a cada ciclo. Parado, o brilho fica fora da lente. */
.camera-arte{position:relative}
.camera-arte img{display:block;height:100%;width:auto}
.camera-reflexo{position:absolute;left:24.5%;top:22%;width:17.5%;height:33%;border-radius:50%;overflow:hidden;pointer-events:none}
.camera-reflexo:before{content:'';position:absolute;inset:-20% -60%;background:linear-gradient(105deg,#fff0 40%,#ffffffd9 50%,#fff0 60%);transform:translateX(-100%);animation:camera-reflexo 4.5s ease-in-out infinite}
@keyframes camera-reflexo{
  0%{transform:translateX(-100%)}
  22%,100%{transform:translateX(100%)}
}
@media(max-width:650px){
  #servicos{padding-left:6%;padding-right:6%}
  .servico-arte{height:84px}
  .servicos-ilha-1{top:3%}
}