/* Contact Info block styles */ .contact-info { background: var(--color-white); padding-block: clamp(3rem, 6vw, 4rem); position: relative; } .contact-info__grid { display: grid; gap: 2rem; grid-template-columns: 1fr; position: relative; } .contact-info__details { max-width: 36rem; padding-inline: clamp(1.5rem, 5vw, 3rem); } .contact-info__heading { color: var(--color-cwc-blue-01); font-family: var(--font-quincy, 'Quincy', serif); font-size: clamp(2.5rem, 6vw, 4.5rem); font-weight: 400; line-height: 1.05; margin: 0 0 1.5rem; } .contact-info__items { display: flex; flex-direction: column; gap: 0.75rem; list-style: none; margin: 0 0 2.5rem; padding: 0; } .contact-info__item { align-items: flex-start; color: var(--color-dark); display: flex; font-size: 1rem; gap: 0.75rem; line-height: 1.5; } .contact-info__icon { align-items: center; color: var(--color-cwc-blue-03); display: inline-flex; flex-shrink: 0; height: 1.5rem; justify-content: center; width: 1.5rem; } .contact-info__icon img { display: block; height: 100%; width: 100%; } .contact-info__value { color: inherit; text-decoration: none; } a.contact-info__value:hover { color: var(--color-secondary); } .contact-info__map { background: color-mix(in oklch, var(--color-cwc-blue-03) 30%, white); border-radius: 0.5rem; min-height: 24rem; position: relative; } @media (min-width: 1024px) { .contact-info__grid { grid-template-columns: 1fr 1fr; } .contact-info__details { padding-inline: clamp(1.5rem, 5vw, 3rem) 0; } .contact-info__map { align-self: stretch; border-radius: 0; margin-right: calc(50% - 50vw); margin-left: 0; min-height: 32rem; width: calc(50vw - 0px); } } @media (max-width: 767px) { .contact-info { padding-block: 2rem; } .contact-info__map { margin-inline: clamp(1.5rem, 5vw, 3rem); min-height: 18rem; } }