/* Página de servicios de AI Matic (sitios, tiendas, SEO...). Usa los tokens de aimatic.css. */
.serv-portada{position:relative;min-height:92svh;display:flex;align-items:flex-end;padding:140px var(--margen) clamp(56px,10vh,110px);overflow:hidden}
.serv-fondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8;pointer-events:none}
.serv-portada::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.4) 55%,transparent 80%),linear-gradient(0deg,#000 0%,transparent 40%);pointer-events:none}
.serv-portada-texto{position:relative;z-index:1;max-width:var(--ancho);width:100%;margin:0 auto}
.serv-bajada{margin-top:24px;max-width:560px;font-size:clamp(18px,1.8vw,22px);color:#c3c5cc;line-height:1.45}

.serv-lista-seccion{max-width:var(--ancho);margin:0 auto;padding:clamp(40px,8vh,96px) var(--margen) clamp(80px,14vh,160px)}
.serv-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.serv{position:relative;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);padding:clamp(24px,3vw,36px);min-height:280px;display:flex;flex-direction:column;gap:12px;overflow:hidden;transition:border-color .5s var(--lento),transform .5s var(--lento)}
.serv:hover{border-color:var(--linea-fuerte);transform:translateY(-3px)}
.serv::before{content:"";position:absolute;right:-30%;top:-40%;width:80%;aspect-ratio:1;background:radial-gradient(closest-side,rgba(37,99,255,.14),transparent);pointer-events:none}
.serv-num{font-size:13px;font-weight:500;letter-spacing:.14em;color:var(--tenue)}
.serv h2{margin-top:auto;font-size:clamp(24px,2.4vw,32px);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.serv p{color:#c3c5cc;font-size:16px}
.serv strong{color:var(--texto);font-weight:500}

@media (max-width:900px){ .serv-lista{grid-template-columns:1fr 1fr} }
@media (max-width:600px){ .serv-lista{grid-template-columns:1fr} .serv{min-height:220px} }