.art-contact {
–art-primary: #FF6B35; /* Orange Artinove */
–art-accent: #4B5563; /* Gris Artinove */
–art-text: #1F2937;
–art-muted: #6B7280;
–art-border: #E5E7EB;
–art-bg: #FFFFFF;
color: var(–art-text);
background: var(–art-bg);
font-family: system-ui, -apple-system, “Segoe UI”, Roboto, “Helvetica Neue”, Arial, sans-serif;
line-height: 1.6;
font-size: 16px;
}
.art-contact .container {
max-width: 960px;
margin: 0 auto;
padding: clamp(20px, 3vw, 40px) 16px;
text-align: center;
}
.art-contact h1 {
font-size: clamp(28px, 3.5vw, 36px);
color: var(–art-primary);
margin-bottom: 20px;
font-weight: 700;
}
.art-contact p.muted {
color: var(–art-muted);
margin-bottom: 40px;
}
.art-contact .grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 24px;
}
.art-contact .card {
border: 1px solid var(–art-border);
border-radius: 12px;
padding: 24px;
background: #fff;
box-shadow: 0 1px 2px rgba(0,0,0,0.05);
transition: transform .2s;
}
.art-contact .card:hover {
transform: translateY(-3px);
}
.art-contact .icon {
font-size: 36px;
margin-bottom: 12px;
color: var(–art-primary);
}
.art-contact a {
color: var(–art-primary);
text-decoration: none;
font-weight: 600;
}
.art-contact a:hover {
text-decoration: underline;
}