body{
    font-family:'Segoe UI',sans-serif;
    margin:0;
    background:#eef3f1;
    color:#333;
}

/* HERO */
.hero-small{
    background:
    linear-gradient(rgba(12,92,43,0.75),rgba(12,92,43,0.75)),
    url('images/banner.jpg') center/cover no-repeat;
    height:130px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:white;
    font-size:34px;
    font-weight:600;
    letter-spacing:1px;
}

/* BREADCRUMB */
.breadcrumb{
    max-width:1200px;
    margin:25px auto;
    padding:0 20px;
    font-size:14px;
}

.breadcrumb a{
    text-decoration:none;
    color:#0c5c2b;
    font-weight:500;
}

/* MAP SECTION */
.map-section{
    max-width:1200px;
    margin:0 auto 70px;
    background:white;
    padding:45px;
    border-radius:16px;
    box-shadow:0 15px 40px rgba(0,0,0,0.08);
    text-align:center;
}

.map-container{
    position:relative;
    display:inline-block;
}

.map-container img{
    max-width:100%;
    height:auto;
}

/* TOOLTIP */
.tooltip{
    position:absolute;
    background:#0c5c2b;
    color:white;
    padding:8px 14px;
    border-radius:6px;
    font-size:14px;
    display:none;
    pointer-events:none;
    z-index:99999;
    white-space:nowrap;
}

/* OFFICE GRID */
.office-grid{
    max-width:1200px;
    margin:50px auto 50px;
    padding:0 20px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:30px;
}

.office-card{
    background:white;
    padding:30px;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
    border-top:4px solid #0c5c2b;
}

.btn-green{
    display:inline-block;
    padding:10px 22px;
    background:#0c5c2b;
    color:white;
    text-decoration:none;
    border-radius:8px;
    margin-top:12px;
    font-size:14px;
}