footer{background:#fff; color:#fff; font-size:12px; padding:0; margin:20px 0 0; font-family:'Poppins','Segoe UI',Arial,sans-serif;}
.office-map{padding:24px 0 0;}
.office-map .wrap{max-width:1240px; margin:0 auto; padding:0 20px; box-sizing:border-box;}
.map-card{display:grid; grid-template-columns:1.05fr 1fr; gap:0; background:#f8f8f8; border:1px solid #e9e9e9; border-radius:10px; overflow:hidden; box-shadow:0 10px 24px rgba(0,0,0,.05);}
.map-info{padding:24px 24px 24px 26px; display:flex; flex-direction:column; justify-content:center;}
.map-info h3{font-size:18px; color:var(--text-dark); margin-bottom:10px;}
.map-info p{font-size:14px; line-height:1.7; color:var(--text-gray); margin:0;}
.map-card iframe{width:100%; min-height:260px; border:0; display:block;}
footer .newsletter{margin:0; background:var(--orange); padding:32px 0 36px;}
footer .footer-links{background:#222; padding:22px 0;}
footer .footer-links p{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:2px 4px; margin:0; padding:0 20px; text-align:center; line-height:1.4;}
footer .footer-legal{background:#0f2243; padding:22px 0; margin:12px 0 0;}
footer .footer-legal .wrap{max-width:1180px; margin:0 auto; padding:0 20px;}
footer .footer-legal p{color:rgba(255,255,255,.75); font-size:12px; line-height:1.6; text-align:center; margin:0;}
footer a{color:#fff;}
footer a:hover{color:#fff;}
.footer-link{cursor:pointer; text-decoration:underline;}
.footer-social .social-label{color:#fff; font-weight:700; font-size:13px; letter-spacing:.04em; text-transform:uppercase;}
.footer-social .social-link{display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.16); color:#fff; transition:background .2s ease, transform .2s ease;}
.footer-social .social-link:hover{background:rgba(255,255,255,.28); transform:translateY(-1px);}

.modal-overlay{position:fixed; inset:0; background:rgba(0,0,0,.65); display:flex; align-items:center; justify-content:center; padding:20px; z-index:9999;}
.modal-overlay[hidden]{display:none !important;}
.modal-card{position:relative; width:min(560px, 100%); max-height:80vh; overflow:auto; background:#fff; color:#222; border-radius:4px; padding:28px; box-shadow:0 18px 45px rgba(0,0,0,.25);}
.modal-close{position:absolute; top:10px; right:12px; border:none; background:transparent; font-size:24px; cursor:pointer; color:#666;}
.modal-card h3{margin-bottom:12.5px; color:var(--text-dark); font-size:18px;}
.modal-card ul{padding-left:18px; margin:0; display:grid; gap:8px;}
.modal-card li{line-height:1.5;}
.modal-card strong{color:var(--orange);}

/* Modal content spacing and scrollbar adjustments */
.modal-card > * + *{margin-top:12px;}
.modal-card #modal-content{padding:10px 0 4px 0;}

/* Scrollbar: 4px for WebKit, thin for Firefox */
.modal-card{scrollbar-width:thin; scrollbar-color:rgba(0,0,0,0.18) transparent;}
.modal-card::-webkit-scrollbar{width:4px;height:4px}
.modal-card::-webkit-scrollbar-track{background:transparent}
.modal-card::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.18); border-radius:4px}

/* Modal content typography spacing */
.modal-card h3{margin-bottom:16px}
.modal-card #modal-content p{margin:0 0 14px; line-height:1.65; color:var(--text-dark)}
.modal-card #modal-content ul{padding-left:20px; margin:0 0 14px}
.modal-card #modal-content li{margin-bottom:8px}
.modal-card #modal-content hr{border:none; border-top:1px solid #eee; margin:14px 0}

/* Ensure scroll target is inside content if needed */
.modal-card{overflow:hidden}
.modal-card #modal-content{max-height:calc(80vh - 120px); overflow:auto}

/* ---------- Newsletter (matches screenshot: icon | text | input+button, fine print below) ---------- */
.newsletter{color:#fff; font-family:'Poppins','Segoe UI',Arial,sans-serif;}
.newsletter .msg,
.newsletter .msg h3,
.newsletter .msg p,
.newsletter .fine,
.newsletter input,
.newsletter button{font-family:inherit;}
.newsletter .wrap{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 210px;
  box-sizing:border-box;
}
.newsletter .icon{
  width:90px; height:90px; border-radius:10%;
  display:flex; align-items:center; justify-content:center;
  font-size:70px; flex:none;
  position:relative;
}
.newsletter .icon::after{
  content:"";
  display:block;
  width:1px;
  height:80px;
  background:rgba(255,255,255,.45);
  position:absolute;
  right:-14px;
  top:50%;
  transform:translateY(-50%);
}
.newsletter .msg{flex:0 0 auto; min-width:200px; text-align:left; margin-left:17px;}
.newsletter .msg h3{font-size:16px; margin-bottom:2px; font-weight:700;}
.newsletter .msg p{font-size:13px; opacity:.9;}

.newsletter form{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-left:auto;
  flex:1;
  max-width:480px;
}
.newsletter .field-row{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
}
.newsletter input{
  flex:1;
  min-width:0;
  padding:12px 16px;
  border:none;
  border-radius:4px;
  font-size:13px;
  outline:none;
}
.newsletter button{
  background:var(--text-dark);
  color:#fff;
  border:none;
  padding:12px 26px;
  border-radius:4px;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  white-space:nowrap;
  flex:none;
}

.newsletter .fine{
  width:100%;
  font-size:11.5px;
  opacity:.85;
  margin-top:5px;
  text-align:left;
  padding-left:0;
}





/* Stack on smaller screens */
@media (max-width: 768px){
  .map-card{grid-template-columns:1fr;}
  .map-card iframe{min-height:220px;}
  .newsletter .wrap{flex-direction:column; align-items:flex-start;}
  .newsletter form{margin-left:0; max-width:100%; width:100%;}
  .newsletter .fine{text-align:center;}
}

@media (max-width: 640px){
  .newsletter{padding:24px 0 28px;}
  .newsletter .wrap{
    padding:0 20px;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:14px;
  }
 .newsletter .icon{
  width:80px; height:80px; font-size:60px;
  margin:0 auto;
}
  .newsletter .icon::after{display:none;}
  .newsletter .msg{
    margin-left:0;
    min-width:0;
    text-align:center;
  }
  .newsletter .msg p br{display:none;}
  .newsletter form{
    width:100%; max-width:100%; margin-left:0;
  }
  .newsletter .field-row{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .newsletter input,
  .newsletter button{
    width:100%;
    padding:12px 14px;
  }
}

@media (max-width: 400px){
  .newsletter .wrap{padding:0 14px;}
}