/* Contacto, cotizar y nosotros. Mobile-first. */

.contact-grid { display: grid; gap: var(--s-6); padding-bottom: var(--s-6); align-items: start; }
.contact-cards { list-style: none; display: grid; gap: var(--s-3); }
.contact-cards > li > a, .contact-cards > li > div {
    display: flex;
    align-items: center;
    gap: var(--s-4);
    min-height: 4.5rem;
    padding: var(--s-4);
    text-decoration: none;
    background: var(--c-white);
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg);
    transition: border-color var(--d-base), box-shadow var(--d-base), transform var(--d-base) var(--ease);
}
.contact-cards > li > a:hover { border-color: var(--c-deep); box-shadow: var(--sh-1); transform: translateY(-2px); }
.contact-cards .i { color: var(--c-deep); }
.contact-cards span { display: grid; line-height: 1.35; }
.contact-cards small { color: var(--c-muted); font-size: var(--fs-sm); }

.contact-form { padding: var(--s-5); background: var(--c-gray); border-radius: var(--r-xl); }
.contact-form h2 { font-size: var(--fs-lg); margin-bottom: var(--s-4); }
.contact-form .form__result { background: var(--c-white); }

.contact-aside h2 { font-size: var(--fs-lg); margin-bottom: var(--s-4); }

.steps { list-style: decimal; display: grid; gap: var(--s-3); padding-left: 1.25rem; margin-bottom: var(--s-5); }
.steps li { padding-left: var(--s-2); }
.steps li::marker { color: var(--c-deep); font-weight: 800; }
.steps strong { display: block; }

.about-grid { display: grid; gap: var(--s-7); padding-bottom: var(--s-6); }
.about-grid h2 { font-size: var(--fs-lg); margin-bottom: var(--s-3); }
.about-grid > section > p { color: var(--c-muted); margin-bottom: var(--s-4); max-width: 38rem; }
.plain-list { list-style: none; display: grid; gap: var(--s-1); }
.plain-list a { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3); border-radius: var(--r-md); text-decoration: none; }
.plain-list a:hover { background: var(--c-gray); }
.plain-list .i { color: var(--c-deep); width: 1.5rem; height: 1.5rem; }
.plain-list span { display: grid; line-height: 1.35; }
.plain-list small { color: var(--c-muted); font-size: var(--fs-sm); }
.about-cta { display: flex; flex-wrap: wrap; gap: var(--s-3); }
