.office-holder{    width: 100%;max-width: 1200px;margin: 0 auto;display: flex;flex-direction: column;align-items: center;text-align: center;}
   .office-img-holder{    max-width: 1000px;width: 100%;height: 400px;background-size: cover;background-position: center;margin-bottom: -65px;}
   .office-img-holder img{ object-fit: cover;max-width: 100%;max-height: 100%;}
   .office-description {width: 80%;max-width: 800px;background: white;position: relative;top: 0px;padding: 20px;}
   .office-description img {    max-width: 100%;margin: 10px;max-height: 350px;}
   .office-incidental-holder {display: flex;align-items: center;flex-direction: row;width: 80%;    margin-top: 20px; margin-bottom:40px;    column-gap: 40px;}
   .office-incidental {    height: 300px;width: 50%;    background-position: center;}
   @media only screen and (max-width: 667px) { .office-incidental-holder{flex-direction: column;row-gap: 40px;width: 80%;} .office-incidental {    height: 300px;width: 100%;} }

   .agent-section {padding: 40px;}
   /* Grid layout */
   .agent-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 60px;}
   /* Individual agent card */
   .agent-card { text-align: center; }
   /* Image styling */
.agent-photo {
    width: 260px;              /* nice portrait width */
    height: 340px;             /* fixed height keeps layout consistent */
    object-fit: cover;         /* fills the space without distortion */
    border-radius: 6px;
    display: block;
    margin: 0 auto 20px auto;  /* centers image */
}



   /* Text styling */
   .agent-name { font-size: 1.2rem; margin: 0px 0 5px; }
   .agent-phone { font-size: 1rem; margin: 5px 0; }
   .agent-email { color: #0066cc; text-decoration: none; font-size: 1rem; }
   /* Responsive layout for mobile */
   @media screen and (max-width: 900px) { .agent-grid { grid-template-columns: repeat(2, 1fr); margin: 0 auto; }}
   @media screen and (max-width: 667px) { .agent-grid { grid-template-columns: 1fr; max-width: 320px; margin: 0 auto; } .agent-card{max-width: 320px;} }
/* Responsive */
@media (max-width: 667px) {
    .agent-photo {
        width: 200px;
        height: 260px;
    }
}
.float-photo {
    float: left;
    margin: 0 20px 20px 0;
}

/* Ensure text flows nicely around portrait image */
.agent-maintext {
    text-align: left;
    line-height: 1.6;
}

/* On mobile, remove float so layout stacks naturally */
@media (max-width: 667px) {
    .float-photo {
        float: none;
        display: block;
        margin: 0 auto 20px auto;
    }
}
.agent-contact {
    text-align: left;
    margin-bottom: 20px;
    font-size: 1rem;
    line-height: 1.8;
}

.agent-contact-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 6px;
}

.agent-label {
    font-weight: 700;
    color: #444;
    min-width: 70px;
}

.agent-value {
    font-weight: 400;
    color: #222;
}

.agent-email {
    color: #0066cc;
    text-decoration: none;
}

.agent-email:hover {
    text-decoration: underline;
}

/* mobile fix */
@media (max-width: 667px) {
    .agent-contact-row {
        flex-direction: column;
        align-items: flex-start;
    }
    .agent-label { min-width: auto; }
}