/* == CONTACT PAGE ONLY == */

.hero { background-image: url('../img/hero/hero-contact.jpg'); background-position:left top; background-repeat: no-repeat; background-size: cover; background-attachment: fixed;}
.hero::after  { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg,rgba(0, 0, 0, 1) 2%, rgba(0, 0, 0, 0.1) 15%);}

@media (max-width: 768px) { 
	.hero { background-image: url('../img/hero/hero-contact-md.jpg');}
	.hero::after  { content: ""; position: absolute; inset: 0; pointer-events: none;  background: linear-gradient(180deg,rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.3) 55%);}
}

.contact-card {background: var(--almost-white); padding:1.5rem; border-radius: 1rem; height:100%;}
.contact-card .flag {width: 42px; height: 42px; object-fit: cover;}
.contact-card a {font-weight: 400;}

/* == LOCATIONS == */

.global-map { position: absolute; top: -40px; right: 0; width: 450px; max-width: 450%; opacity: .5; pointer-events: none; z-index: 0; }

.location-flag { width: 46px; height: 46px; object-fit: cover; border-radius: 50%; }
.location-heading { display: flex; align-items: center; min-height: 46px; gap: .25rem; }
.location-heading h3 { color: var(--ada-blue); text-transform: uppercase; line-height: 1; }
.location-heading::after { content: ""; flex: 1; height: 1px; margin-left: 1.25rem; background: rgba(0, 111, 219, .2); }

.location-card { display: flex; align-items: flex-start; gap: 1.25rem; padding: 1.75rem; background: #fff; border: 1px solid rgba(0, 111, 219, .15); border-radius: 1rem; transition: transform .2s ease, box-shadow .2s ease; }
.location-card:hover { transform: translateY(-3px); box-shadow: 0 .5rem 1.5rem rgba(11, 45, 92, .08); }

.location-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 55px; width: 55px; height: 55px; color:var(--ada-blue); background: rgba(0, 117, 232, .08); border-radius: 50%; font-size: 1.2rem; }
.location-content a { color: var(--pf-navy); opacity: 0.7; font-weight: 300; font-size: 1.1rem; line-height: 1.3; display: inline-block;}
.location-content a:hover {text-decoration: underline;}

@media (max-width: 991.98px) {.global-map { width: 350px; opacity: .2; }}
@media (max-width: 767.98px) {
    .global-map { width: 300px; max-width: none; top: -20px; }
    .location-card { padding: 1.5rem; }
    .location-icon { flex-basis: 45px; width: 45px; height: 45px; }
}

/* == SOCIAL FOLLOW == */

.stay-connected-copy { max-width: 65% }
.social-icons { display: flex; align-items: center; gap: .75rem; margin-left: auto; padding-right: 2rem }
.social-icons a { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ada-blue); color: #fff; text-decoration: none; transition: background-color .2s ease, transform .2s ease }
.social-icons a i { font-size: .95rem; line-height: 1 }
.social-icons a:hover { background: var(--pf-navy); color: #fff; transform: translateY(-2px) }


.faq-link { display: flex; align-items: center; min-height: 72px; padding-left: 2rem; border-left: 1px solid rgba(0, 111, 219, .2); color: inherit; text-decoration: none }
.faq-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; margin-right: 1rem; border: 3px solid var(--ada-blue); border-radius: 50%; color: var(--ada-blue); font-size: 1.4rem; font-weight: 600 }
.faq-copy .eyebrow {font-size: 0.8rem;}
.faq-copy h3 { margin: 0; font-size: 1.15rem; line-height: 1.2 }
.faq-copy p { margin: .2rem 0 0; font-size: .8rem; line-height: 1.3; font-weight: 400; }
.faq-arrow { margin-left: 1rem; color: var(--ada-blue); font-size: .9rem }

.faq-link:hover .faq-arrow { transform: translateX(4px) }
.faq-link:hover h3 { color: var(--ada-blue) }

@media (max-width: 991.98px) {
    .social-icons { padding-right: 0; }
    .faq-link { padding: 1.25rem 0 0; border-top: 1px solid rgba(0, 111, 219, .2); border-left: 0; }
}

@media (max-width: 575.98px) {
    .stay-connected { display: block !important; }
    .social-icons { margin-top: 1rem; }
	.stay-connected {flex-wrap: wrap; }
    .social-icons {width: 100%; margin: 1rem 0 1.5rem 0; }
}