/* Contact
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.contact-section {
   position: relative;
   padding: var(--section-padding-y) 0;
   overflow: hidden;
   background-color: var(--mybone-primary-soft);
}

.contact-section::before {
   content: "";
   position: absolute;
   top: -140px;
   right: -100px;
   width: 320px;
   height: 320px;
   border-radius: 50%;
   background-color: rgba(8, 119, 187, 0.06);
   pointer-events: none;
}

.contact-panel {
   position: relative;
   z-index: 1;
   overflow: hidden;
   border: var(--border-width) solid var(--color-border-light);
   border-radius: var(--border-radius-2xl);
   background-color: var(--color-white);
   box-shadow: var(--shadow-md);
}

.contact-details {
   position: relative;
   padding: 3.5rem;
   overflow: hidden;
   background-color: var(--mybone-primary-soft);
}

.contact-details::after {
   content: "";
   position: absolute;
   right: -80px;
   bottom: -100px;
   width: 220px;
   height: 220px;
   border-radius: 50%;
   background-color: rgba(251, 193, 12, 0.15);
   pointer-events: none;
}

.contact-details > * { position: relative; z-index: 1; }

.contact-list {
   display: flex;
   flex-direction: column;
   gap: 2rem;
   margin-top: 2.5rem;
}

.contact-item {
   display: flex;
   align-items: flex-start;
   gap: 1rem;
}

.contact-item .icon-box { flex: 0 0 auto; }
.contact-item h3 { margin-bottom: 0.5rem; }
.contact-item address { font-style: normal; }
.contact-form-wrap { padding: 3.5rem; }
.contact-form-wrap > h2 { margin-bottom: 2rem; }

.contact-form textarea {
   resize: vertical;
   min-height: 160px;
}

@media (max-width: 991.98px) {
   .contact-section { padding: var(--section-padding-y-md) 0; }
   .contact-details, .contact-form-wrap { padding: 3rem; }
}

@media (max-width: 575.98px) {
   .contact-section { padding: var(--section-padding-y-sm) 0; }
   .contact-panel { border-radius: var(--border-radius-xl); }
   .contact-details, .contact-form-wrap { padding: 2rem 1.5rem; }
}

.contact-honeypot {
   position: absolute;
   left: -9999px;
   width: 1px;
   height: 1px;
   overflow: hidden;
}
