/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, sans-serif;
}

body{
background:#f5f7fa;
}

/* MAIN */
.portal-content{
padding:20px;
max-width:1200px;
margin:auto;
}

.page-title{
text-align:center;
margin-bottom:20px;
}

/* TABS */
.contact-tabs{
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:center;
margin-bottom:20px;
}

.tab{
padding:10px 20px;
border:none;
background:#ddd;
cursor:pointer;
border-radius:5px;
}

.tab.active{
background:#007bff;
color:white;
}

.tab-content{
display:none;
text-align:center;
margin-bottom:20px;
}

.tab-content.active{
display:block;
}

/* EMERGENCY */
.emergency{
background:#ffdddd;
padding:15px;
border-left:5px solid red;
margin-bottom:20px;
text-align:center;
}

/* GRID */
.contact-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
}

/* FORM */
.contact-form{
background:white;
padding:20px;
border-radius:8px;
}

.contact-form input,
.contact-form textarea{
width:100%;
padding:10px;
margin-bottom:10px;
border:1px solid #ccc;
border-radius:5px;
}

.contact-form button{
width:100%;
padding:12px;
background:#007bff;
color:white;
border:none;
border-radius:5px;
}

/* QUICK CONTACT */
.quick-contact{
background:white;
padding:20px;
border-radius:8px;
display:flex;
flex-direction:column;
gap:10px;
}

.quick-contact button{
padding:12px;
border:none;
border-radius:5px;
cursor:pointer;
}

.call{ background:#28a745; color:white; }
.chat{ background:#17a2b8; color:white; }
.appointment{ background:#ffc107; }

/* LOCATION */
.location{
margin-top:30px;
text-align:center;
}

.location iframe{
width:100%;
height:300px;
border:none;
border-radius:8px;
margin-top:10px;
}

.direction-btn{
display:inline-block;
margin-top:10px;
padding:10px 20px;
background:#007bff;
color:white;
border-radius:5px;
}

/* FAQ */
.faq{
margin-top:30px;
}

.faq-item{
margin-bottom:10px;
}

.faq-question{
width:100%;
padding:10px;
background:#007bff;
color:white;
border:none;
text-align:left;
cursor:pointer;
}

.faq-answer{
display:none;
padding:10px;
background:#eee;
}

/* DOWNLOAD */
.info-download{
text-align:center;
margin-top:30px;
}

.info-download button{
padding:12px 20px;
background:#28a745;
color:white;
border:none;
border-radius:5px;
}

/* ========================= */
/* 📱 MOBILE RESPONSIVENESS */
/* ========================= */
@media(max-width:768px){

.contact-grid{
grid-template-columns:1fr;
}

.contact-tabs{
flex-direction:column;
align-items:center;
}

}

/* ========================= */
/* 💻 TABLET */
/* ========================= */
@media(min-width:769px) and (max-width:1024px){

.contact-grid{
grid-template-columns:1fr 1fr;
}

}

.nav-menu {
  display: flex;
  gap: 20px;
}

.hamburger {
  display: none;
  font-size: 24px;
  cursor: pointer;
}

/* Mobile */
@media (max-width: 768px) {
  .nav-menu {
    display: none;
    flex-direction: column;
  }

  .nav-menu.active {
    display: flex;
  }

  .hamburger {
    display: block;
  }
}