@media only screen and (min-width: 768px) {

}
@media only screen and (max-width: 1550px) {

}
@media only screen and (max-width: 1199px) {

}
@media only screen and (max-width: 1155px){}
@media only screen and (max-width: 1023px){

}
@media only screen and (max-width: 991px) {
    .home-hero-row { flex-direction: column; align-items: stretch; gap: 35px; padding: 60px 0; }
    .home-hero-content,
    .home-hero-contact { width: 100%; }
    .home-hero-content h1 { font-size: 38px; }
}
@media only screen and (max-width: 767px) {
    .port-banner-box { min-height: 250px; }
    .service-banner-box { min-height: 250px; }

    .port-banner-title h1 { font-size: 45px; }
    .port-banner-title h2 { font-size: 45px; }
    .service-banner-title h1 { font-size: 45px; }
    .service-banner-title h2 { font-size: 45px; }

    .port-card { padding: 10px; }
    .port-card-image img { width: 100%; height: 180px; object-fit: cover; }
    .port-card-content { padding: 20px 10px 10px; }
    .port-card-content h3 { font-size: 22px; margin-bottom: 15px; }
    .port-card-content p { font-size: 14px; line-height: 1.6; margin-bottom: 20px; }
    .port-card-content .btn { display: inline-block; width: auto; padding: 10px 20px; }
    
    .port-box-section { padding: 2rem 0; }
    .other-ports-section { padding: 2rem 0; }
    .other-ports-intro h2 { font-size: 30px; margin-bottom: 12px; }
    .other-ports-intro p { margin: 0; line-height: 1.7; }
    .additional-port-message h3 { font-size: 26px; margin-bottom: 10px; }
    .additional-port-message p { margin: 0; line-height: 1.6; }

    .service-card .service-content { padding: 15px 10px 5px; }
    
    .port-box-section h1 { font-size: 33px; }
    .service-box-section h1 { font-size: 33px; }
    .service-box-section h2 { font-size: 33px; }
    .service-information-title h2 { font-size: 33px; }
    .port-information-title h2 { font-size: 33px; }
    
    .services-carousel { height: 430px; }
    .service-card { width: calc(100% - 30px); max-width: 380px; min-height: 0; padding: 25px; }
    .carousel-controls { gap: 45px; margin-top: 0; }
    .service-card.prev { transform: translate(-145%, -50%) scale(.82); }
    .service-card.next { transform: translate(45%, -50%) scale(.82); }

    .banner-title-row { flex-direction: column; align-items: flex-start; gap: 10px; padding: 3rem 0 1.5rem; }
    .banner-title-row .btn { padding: 10px 20px; font-size: 14px; }
}
@media only screen and (max-width: 575px) {
    .port-banner-title h1 { font-size: 35px; }
    .port-banner-title h2 { font-size: 35px; }
    .service-banner-title h1 { font-size: 35px; }
    .service-banner-title h2 { font-size: 35px; }
    
    .port-box-section h1 { font-size: 28px; }
    .port-box-section h2 { font-size: 32px; }
    .service-box-section h1 { font-size: 28px; }
    .service-box-section h2 { font-size: 28px; }
    .service-information-title h2 { font-size: 28px; }
    .port-information-title h2 { font-size: 28px; }

    .port-banner-box { min-height: 200px; }
    .service-banner-box { min-height: 200px; }
    
    .home-hero-content h1 { font-size: 32px; }
    .home-hero-buttons { flex-direction: column; align-items: stretch; }
    .home-hero-buttons .btn { width: 100%; text-align: center; }
    .home-contact-card { padding: 25px; }

    .banner-title-row { padding: 3rem 0 1rem; }
}
@media only screen and (max-width: 479px) {
    .port-banner-title h1 { font-size: 30px; }
    .port-banner-title h2 { font-size: 30px; }
    .service-banner-title h1 { font-size: 30px; }
    .service-banner-title h2 { font-size: 30px; }

}