.support-section {
     display: grid;
     grid-template-columns: 320px 1fr;
     gap: 4rem;
     background: #fff;
     padding: 4rem;
     border-radius: 24px;
     box-shadow: 0 4px 18px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.04);
     border: 1px solid rgba(0,0,0,.08);
     align-items: flex-start;
}
/* ========================================================= INTRO ========================================================= */
 .support-intro {
     padding-right: 3rem;
     border-right: 1px solid rgba(0,0,0,.08);
}
 .support-intro h2 {
    font-size: clamp(2.3rem, 4vw, 4rem);
    line-height: 1;
    font-weight: 900;
    color: #222;
    margin: 0 0 2rem;
    max-width: 7ch;
}

 .support-intro h2:after{
     content: none;
 }
 .support-intro h2 span {
     display: block;
}
 .intro-divider {
     width: 70px;
     height: 6px;
     background: #cbb677;
     border-radius: 999px;
     margin-bottom: 2rem;
}
 .support-intro p {
     font-size: 1.3rem;
     line-height: 1.7;
     color: #444;
     max-width: 22ch;
     margin: 0;
}
/* ========================================================= GRID ========================================================= */
 .support-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 2rem 2.5rem;
}
/* ========================================================= ITEM ========================================================= */
 .support-item {
     display: flex;
     align-items: flex-start;
     gap: 1rem;
     text-decoration: none;
     color: inherit;
}

.support-content h3 a {
    color: #8b5a12;
    text-decoration: none;
    transition: color .2s ease, opacity .2s ease;
}

.support-content h3 a:hover {
    color: #8b5a12;
    text-decoration: underline;
    text-underline-offset: 4px;
}
.support-content h3 a:focus {
    outline: 2px solid rgba(203,182,119,.5);
    outline-offset: 4px;
    border-radius: 4px;
}

 .support-content {
     flex: 1;
}
/* ========================================================= ICON ========================================================= */
 .support-icon {
     width: 64px;
     height: 64px;
     min-width: 64px;
     border-radius: 50%;
     background: rgba(203,182,119,.14);
     display: flex;
     align-items: center;
     justify-content: center;
     transform: translateX(4px);
}
 .support-icon i {
     color: #8b5a12;
     font-size: 1.7rem;
     line-height: 1;
     transform: translateX(3px);
}
/* ========================================================= TEXT ========================================================= */
 .support-content h3 {
     font-size: 1.35rem;
     line-height: 1.2;
     font-weight: 800;
     color: #111;
     margin: 0 0 .4rem;
}
 .support-content p {
     margin: 0;
     font-size: 1.rem;
     line-height: 1.45;
     color: #555;
}

/* ========================================================= MOBILE ========================================================= */
 @media screen and (max-width: 1200px) {
     .support-section {
         grid-template-columns: 1fr;
    }
     .support-intro {
         border-right: none;
         border-bottom: 1px solid rgba(0,0,0,.08);
         padding-right: 0;
         padding-bottom: 2rem;
    }
}
 @media screen and (max-width: 900px) {
     .support-grid {
         grid-template-columns: 1fr;
    }
}
 @media screen and (max-width: 768px) {
     .support-section {
         padding: 2rem;
    }
     .support-intro h2 {
         font-size: 3.5rem;
         max-width: none;
    }
     .support-intro p {
         max-width: none;
    }
     .support-content h3 {
         font-size: 1.4rem;
    }
     .support-content p {
         font-size: 1rem;
    }
}
