/* v1.4 - filters section visible, image effect controls via CSS variables */
.atico-pg{
  --font-serif: 'Playfair Display', serif;
  --font-sans: 'Montserrat', sans-serif;
  --color-text: #f0f0f0;
  color: var(--color-text);
  font-family: var(--font-sans);
}

.atico-pg .proyectos-header{ text-align:center; padding:120px 5% 80px; }
.atico-pg .pg-title{ font-family:var(--font-serif); font-size: clamp(2.5rem, 6vw, 4.5rem); margin:0 0 20px 0; }
.atico-pg .subtitulo{ font-size:1.3rem; color: rgba(240,240,240,.7); max-width:600px; margin:0 auto; line-height:1.7; }

.atico-pg .portfolio-aviso{
  font-family:var(--font-serif); font-style:italic; font-weight:700;
  font-size:1.2rem; color: rgba(240,240,240,.7);
  max-width:720px; margin:60px auto 0 auto; padding:20px; border:1px solid rgba(240,240,240,.2);
  line-height:1.8; display:inline-block; box-sizing:border-box;
}

.atico-pg .portafolio-seccion{ padding:0 5% 100px; max-width:1400px; margin:0 auto; }
.atico-pg .filtros-container{ display:flex; justify-content:center; gap:20px; margin-bottom:60px; flex-wrap:wrap; }
.atico-pg .filtro-btn{ background:none; border:1px solid rgba(240,240,240,.2); color:rgba(240,240,240,.7); padding:10px 25px; font-family:var(--font-sans); text-transform:uppercase; font-size:.8rem; letter-spacing:1px; cursor:pointer; transition:all .25s ease; }
.atico-pg .filtro-btn:hover{ border-color:#fff; color:#fff; }
.atico-pg .filtro-btn.active{ background:#fff; color:#000; border-color:#fff; }

.atico-pg .proyectos-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap:30px; }
.atico-pg .proyecto-card{ aspect-ratio:4/3; position:relative; overflow:hidden; background:#111; transition: opacity .4s ease, transform .3s ease; }
.atico-pg .card-imagen-wrapper{ display:block; width:100%; height:100%; position:relative; }
.atico-pg .proyecto-card img{
  width:100%; height:100%; object-fit:cover;
  filter: grayscale(var(--img-gray, 100%)) blur(var(--img-blur, 0)) brightness(var(--img-bright, .9));
  transition:filter .35s ease, transform .5s ease;
  will-change:transform,filter;
}
.atico-pg .proyecto-card:hover img{
  filter: grayscale(var(--img-gray-hover, 0%)) blur(var(--img-blur-hover, 0)) brightness(var(--img-bright-hover, 1));
}

.atico-pg .card-overlay{ position:absolute; bottom:0; left:0; right:0; padding:25px;
  background:linear-gradient(to top, var(--card-overlay, rgba(0,0,0,.8)) 20%, transparent 100%);
}
.atico-pg .card-overlay h3{ font-family:var(--font-serif); font-size:1.5rem; margin:0; line-height:1.3; transform: translateY(10px); opacity:0; transition: all .4s ease .1s; }
.atico-pg .proyecto-card:hover .card-overlay h3{ transform: translateY(0); opacity:1; }

.atico-pg .cross-link-seccion{ text-align:center; padding:40px 5%; border-top:1px solid rgba(240,240,240,.2); border-bottom:1px solid rgba(240,240,240,.2); margin:0 auto; max-width:1400px; }
.atico-pg .cross-link-seccion a{ color:#f0f0f0; font-size:1.3rem; text-decoration:none; font-family:var(--font-serif); font-style:italic; transition: color .3s ease; }
.atico-pg .cross-link-seccion a:hover{ color: rgba(240,240,240,.7); }

.atico-pg .contacto-seccion{ padding:120px 5%; background:#0a0a0a; }
.atico-pg .contacto-header{ text-align:center; margin-bottom:60px; }
.atico-pg .contacto-header h2{ font-family:var(--font-serif); font-size: clamp(2rem, 4vw, 3rem); }
.atico-pg .contacto-form{ max-width:700px; margin:0 auto; display:grid; gap:30px; }
.atico-pg .form-grupo{ position:relative; }
.atico-pg .form-input{ width:100%; background:transparent; border:none; border-bottom:1px solid rgba(240,240,240,.2); padding:15px 0; font-family:var(--font-sans); color:#f0f0f0; font-size:1.1rem; transition: border-color .3s ease; }
.atico-pg .form-input:focus{ outline:none; border-color: #f0f0f0; }
.atico-pg .form-label{ position:absolute; top:15px; left:0; color:rgba(240,240,240,.7); pointer-events:none; transition: all .3s ease; }
.atico-pg .form-input:focus ~ .form-label, .atico-pg .form-input:not(:placeholder-shown) ~ .form-label{ top:-10px; font-size:.8rem; }
.atico-pg textarea.form-input{ resize:vertical; min-height:100px; }
.atico-pg .form-submit{ justify-self:center; padding:15px 50px; border:1px solid #f0f0f0; background:#f0f0f0; color:#000; font-family:var(--font-sans); text-transform:uppercase; letter-spacing:1px; font-size:.9rem; cursor:pointer; transition:all .3s ease; }
.atico-pg .form-submit:hover{ background:transparent; color:#f0f0f0; }

.elementor-widget-atico_projects_grid .atico-pg *{ box-sizing:border-box; }