:root{--primary:#1f6f8b;--dark-blue:#0e3a53;--light-gray:#f4f6f9;--border:#d9dee5;--orange:#f57c00;--text:#333}
*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;list-style:none}
html{font-size:10px;overflow-x:hidden;scroll-behavior:smooth}
body{font-family:"Lato",sans-serif;color:#0d1b3f; font-size:1.4rem;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{width:100%; max-width:100%;border:none;}
button,input,textarea,select{font:inherit;border:none;background:none}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
h1,h2,h3,h4,h5,h6{font-family:"Montserrat",sans-serif;}
.container{width:90%;margin:0 auto}

header{position:sticky;top: 0;z-index: 999;background:#fff; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
.top-header{background:#039;color:#fff;font-size:1.3rem;padding:0.8rem 0}
.top-header .container{display:flex;flex-direction:column;align-items:center;justify-content:center; gap:1rem;text-align:center;}
.contact-info, .contact-num{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;}
.contact-info i{color:#ffe400}
.top-header .contact-info span{margin-right:1rem}
.other-info-links ul{display:flex; color:#fff; gap:1rem; }
.other-info-links ul li a{display:flex; align-items:center; gap:0.5rem;}
.other-info-links img{width:2.8rem;height:3rem;}

.mainheader .container{position:relative; min-height:7.6rem;display:flex;align-items:center;justify-content:space-between;gap:1.6rem}
.logo{max-width:20rem;display:block}
.logo img{width:100%;height:auto}

#topheader,  .main-header{transition:all 0.3s ease;}
.hide-header-parts #topheader{transform:translateY(-100%);opacity:0;position:absolute;left:0;width:100%;pointer-events:none}
.hide-header-parts .main-header{box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}

/* NavBar */
.container .btn{color:black;font-size:2rem;cursor:pointer;display:block}
.close-btn{position:absolute;right:3rem;top:1rem}
.menu-icon,.close-icon{width:28px;height:28px;stroke:black;stroke-width:2;fill:none;stroke-linecap:round}
.close-icon{stroke:white;}
.container .nav-links{position:fixed;height:100vh;width:100%;max-width:35rem;top:0;left:-100%;background:#05347a;display:block;padding:5rem 1rem;overflow-y:auto;transition:left .3s ease; line-height:2.5rem;z-index:2}
#menu-btn:checked ~ .nav-links{left:0}
#menu-btn:checked ~ .menu-btn{display:none}
#close-btn:checked ~ .menu-btn{display:block}
.nav-links li{list-style:none;margin:0 1rem 0.5rem}
.nav-links li a{display:block;color:#f2f2f2;text-decoration:none;font-size:1.6rem;font-weight:500;padding:0.5rem 1.5rem;border-radius:.5rem;transition:.3s}
.nav-links li a:hover{background:#0647a8}
.arrow-icon{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s ease}
.mainheader input{display:none}

.breadcrumb{padding:1.6rem 0;border-bottom:.1rem solid #e2e8f0;background:#fff;margin:1rem 0}
.breadcrumb ol{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.breadcrumb a,.breadcrumb li{font-size:1.5rem;font-weight:500;color:#475569}
.breadcrumb a:hover{color:#0b52bc}

.page-title-wrapper{background:#fff;border-bottom:1px solid #e3e8ef}
.page-title{font-size:2.5rem;font-weight:600;color:#0e3a53;margin-bottom:1rem;line-height:1.7}

.blog-container{padding:4rem 0}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(32rem,1fr));gap:3rem}
.blog-card{background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 6px 2rem #00000014;transition:all .3s ease}
.blog-card:hover{transform:translateY(-6px);box-shadow:0 1.2rem 3rem #00000026}
.blog-thumb img{width:100%;height:22rem;}
.blog-content{padding:2rem}
.blog-content h2{font-size:2rem;margin-bottom:1rem;color:#222;font-weight:600}
.blog-content p{font-size:1.5rem;line-height:1.6;color:#555;margin-bottom:1.5rem}
.blog-meta{font-size:1.4rem;color:#888}
.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:5rem;flex-wrap:wrap}
.page-number,.page-btn{display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;border-radius:6px;border:1px solid #ddd;text-decoration:none;font-weight:500;color:#333;background:#fff;transition:all .2s ease}
.page-number:hover,.page-btn:hover{background:#0073e6;color:#fff;border-color:#0073e6}
.page-number.active{background:#0073e6;color:#fff;border-color:#0073e6;font-weight:600}
.page-btn{width:4rem}

.content{display:block}
.main-content{background:#fff;padding:20px;border-radius:4px;box-shadow:0 2px 6px #0000000d}
.main-content img{width:100%;border-radius:4px;margin-bottom:20px}
.main-content h2,.main-content h3{font-size:18px;color:var(--primary);margin:20px 0 10px}
.main-content h3{font-size:17px}
.main-content span{font-size:16px;font-weight:500;display:block;margin:10px 0;color:#222}
.main-content p{font-size:14px;margin-bottom:12px}
.main-content ul{list-style:none;padding-left:0;margin:15px 0}
.main-content ul li{position:relative;padding-left:28px;margin-bottom:10px;font-size:14px;line-height:1.6}
.main-content ul li::before{content:"\f058";font-family:"Font Awesome 7 Free";font-weight:900;position:absolute;left:0;top:2px;color:#1f6f8b;font-size:16px}
.main-content ol{counter-reset:custom-counter;padding-left:0;margin:15px 0;list-style:none}
.main-content ol li{counter-increment:custom-counter;position:relative;padding-left:28px;margin-bottom:12px;font-size:14px}
.main-content ol li::before{content:counter(custom-counter);position:absolute;left:0;top:2px;background:#1f6f8b;color:#fff;width:16px;height:16px;border-radius:50%;text-align:center;line-height:16px;font-size:10px;font-weight:600}
.main-content table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px;background:#fff;box-shadow:0 3px 10px #0000000d;border-radius:6px;overflow:hidden}
.main-content table thead{background:#0e3a53;color:#fff}
.main-content table th,.main-content table td{padding:12px 15px;text-align:left;border-bottom:1px solid #e3e8ef}
.main-content table th{font-weight:600}
.main-content table tbody tr:hover{background:#f4f8fb}
.main-content table tbody tr:last-child td{border-bottom:none}
.main-content a{color:var(--orange);text-decoration:none;border-bottom:1px solid transparent}
.main-content a:hover{border-bottom:1px solid var(--orange)}
.related-posts{margin-top:40px}
.related-title{font-size:22px;margin-bottom:20px}
.related-grid{display:grid;gap:30px}
.related-item img{width:100%;height:auto;object-fit:cover;border-radius:6px;margin:0 0 10px}
.related-item h3{font-size:16px;margin:0;line-height:1.4;color:#222;text-align:center}
.related-item a{text-decoration:none}
.main-content .related-item a:hover{border:none}
.related-item a:hover h3{color:#0056b3}
.sidebar{margin-top:20px}
.sidebar-box{background:#f8fbfd;border:1px solid var(--border);padding:20px;border-radius:4px}
.sidebar-box h3{font-size:16px;margin-bottom:15px;color:var(--primary)}
.sidebar input,.sidebar textarea{width:100%;padding:10px;margin-bottom:10px;border:1px solid var(--border);border-radius:3px;font-size:13px}
.sidebar textarea{height:80px;resize:none}
.captcha-wrapper{background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:10px;margin-bottom:15px}
.captcha-label{font-weight:600;color:#388099;font-size:16px;margin:0}
.captcha-controls{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.captcha-image-box{background:#fff;border:1px solid #cbd5e1;border-radius:6px;padding:0 0 0 15px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 2px #0000000d;width:max-content}
.captcha-image-box img{display:block;height:2.2rem;mix-blend-mode:multiply}
.captcha-refresh{background:none;border:none;cursor:pointer;color:#f28c28;padding:6px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease}
.captcha-refresh:hover{background-color:#e2e8f0;color:#3b82f6}
.captcha-refresh svg{width:2rem;height:2rem}
.captcha-input{width:10rem;padding:1rem 1.2rem;border:1px solid #cbd5e1;border-radius:6px;font-size:1.6rem;font-family:monospace;text-align:center;outline:none;transition:border-color 0.2s,box-shadow .2s}
.captcha-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}
.captcha-input::-webkit-outer-spin-button,.captcha-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.captcha-input[type=number]{appearance:textfield}
.submit-btn{background:var(--orange);color:#fff;border:none;padding:10px;width:100%;border-radius:3px;font-weight:500;cursor:pointer;margin-bottom:10px;font-weight:600;font-size:13px}
.submit-btn:hover{opacity:.9}
#formMsg{color:#c10000;font-size:14px;text-align:center;line-height:25px}
.hidden{display:none}
.error{color:red;padding:10px}


/* ================= FOOTER SECTION ================= */
.main-footer{background:#166bd4;color:#fff;padding-top:5rem;}
.footer-container{display:grid;grid-template-columns:1fr;gap:4rem;padding-bottom:5rem;border-bottom:1px solid #fff3}
.footer-col h3{color:#fff;font-size:2rem;font-weight:700;margin-bottom:2rem}
.footer-logo{width:16rem;margin-bottom:15px}
.about-footer p{color:#f0f0f0;line-height:2.6rem;margin-bottom:2rem}
.social-icons a{display:inline-block;color:#fff;background:#ffffff1a;width:3.5rem;height:3.5rem;line-height:3.5rem;text-align:center;border-radius:50%;margin-right:1rem;transition:all .3s ease}
.social-icons a:hover{background:#f28c28;color:#fff}
.links-footer ul,.contact-footer ul{list-style:none;padding:0;margin:0}
.contact-footer ul{margin:0 0 2rem;}
.links-footer ul li{margin-bottom:1rem}
.links-footer ul li a{color:#f0f0f0;text-decoration:none;transition:color .3s ease}
.links-footer ul li a:hover{color:#f28c28}
.contact-footer ul li{margin-bottom:1rem;display:flex;align-items:flex-start;gap:1rem}
.contact-footer ul li i{color:#f28c28;margin-top:4px}
.randomTxt{display:none;}
.subscribeSection, .subscribeSection form{display:flex; flex-direction:column; gap:1rem;}
.subscribeSection h4{color:#fff;font-size:2rem;font-weight:700;}
.subscribeInput{background: #eee;border:1px solid #fff;color: #000; height:3rem; padding:0.5rem; max-width:75rem;}
.footer-bottom{background:#233d8f;text-align:center;padding:15px 0}
.footer-bottom p{margin:0;font-size:1.3rem;color:#eee}

#backToTop{position:fixed;bottom:25px;right:25px;z-index:99;background:#f28c28;color:#fff;border:none;border-radius:50%;width:45px;height:45px;text-align:center;line-height:45px;font-size:1.2rem;cursor:pointer;transition:all .3s ease;opacity:0;visibility:hidden}
#backToTop.show{opacity:1;visibility:visible}
#backToTop:hover{background:#039;color:#fff;transform:translateY(-3px)}

@media(min-width:768px) {
	.top-header .container{display:flex;flex-direction:row;justify-content:space-between;}
	.top_social{display:none;}
	.mainheader .container{padding:0 3rem}

	.related-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:992px) {
	.page-title{font-size:3rem}
	.content{display:flex;gap:30px}
	.main-content{width:70%;text-align:justify}
	.related-grid{grid-template-columns:repeat(3,1fr)}
	.sidebar{width:30%;margin-top:0;align-self:stretch;position:relative}
	.sidebar_content{position:sticky;top:10px}
}

@media(min-width:1024px) {
	.top-header{height:5.8rem;}
	.contact-info{flex-direction:row;justify-content:flex-start;gap:3rem;}
	.logo{width:15rem}

}

@media (min-width:1200px) {
	.container .btn{display:none}
	.mainheader .container{min-height:9.2rem; display:flex; align-items:center; justify-content:space-between; padding:0 0.5rem;}
	.container .nav-links{position:static;height:auto;width:100%;max-width:100%; display:flex;padding:0; background:none; justify-content:flex-end;}
	.nav-links li{margin:0}
	.nav-links li a{display:inline-block; font-size:1.7rem; padding:0; color:#000}
	.nav-links li a:hover{background:#0647a8; color:#fff;}
	.nav-item{display:flex!important;align-items:center;justify-content:center;gap:6px;height:5rem;line-height:1;padding:0 1.5rem!important}
	.arrow-icon{stroke:#000;}
	.nav-links li a:hover .arrow-icon{stroke:#fff;}

	.pre-footer-container{grid-template-columns:repeat(3,1fr);text-align:left;align-items:start;gap:6rem;font-size:1.3rem;line-height:2.6rem;}
	.pfbox-heading{display:flex; gap:1rem; align-items:center;}
	.pre-footer-box ul{text-align:left}
	.disclaimer-text{display:-webkit-box;-webkit-line-clamp: 6; -webkit-box-orient: vertical;overflow: hidden; font-size:2rem;}

	.footer-container{grid-template-columns:1.5fr 1fr 1fr 1.5fr}
	.footer-logo{width:25rem;}
	.about-footer p{max-width:40rem}
	.subscribeInput{width:100%}
	.randomTxt{display:block;font-size:3rem;color: #fff;line-height:4rem; margin-bottom:2rem; text-align:center; }
	.randomTxt span{color: #f28c28;}

	.top_social{display:block;}
}

@media (min-width:1280px) {
	header{position:sticky;top: 0;z-index: 999;background:#fff; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
	#topheader, .serviceinfo__nav{transition:all 0.3s ease;}
	.hide-header-parts #topheader{transform:translateY(-100%);opacity:0;position:absolute;left:0;width:100%;pointer-events:none}
	.hide-navstrip{position:sticky; top:10rem;}

	.top-header{font-size:1.4rem;}
	.mainheader .container{padding:0}
	.logo{width:21rem}
	.nav-links li a{font-size:1.8rem;}
}

@media (min-width:1600px) {
	.container{width:80%}
	.nav-links li a{font-size:1.6rem; font-weight:600; text-transform:uppercase;}

	h1{font-size:5rem; line-height:1.1;}

	.blog-grid{grid-template-columns:repeat(auto-fit,minmax(45rem,1fr));}

	.pre-footer-container{font-size:1.8rem;line-height:2.8rem;}
	.pre-footer-box h3{font-size:2.5rem;font-weight:400; text-transform:uppercase;}

	.footer-container{font-size:1.6rem;}
}

[id]{scroll-margin-top:27rem;}


.faq-section{margin-top:40px;background:#fff;padding:20px;border-radius:6px;box-shadow:0 2px 8px #0000000d}
.faq-title{font-size:20px;color:#1f6f8b;margin-bottom:20px;font-weight:600}
.faq-accordion{width:100%}
.faq-item{border-bottom:1px solid #e3e8ef}
.faq-question{width:100%;background:#f4f8fb;border:none;padding:15px;text-align:left;font-size:14px;font-weight:500;color:#0e3a53;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}
.faq-question:hover{background:#e9f3f8}
.main-content span.faq-icon{font-size:18px;color:#f57c00;transition:transform .3s ease;display:inline;margin:0}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease;background:#fff}
.faq-answer p{padding:15px;font-size:14px;color:#333;line-height:1.6}
.faq-item.active .faq-answer{max-height:300px}
.faq-item.active .faq-icon{transform:rotate(45deg)}

@media(min-width:992px) {
	.faq-section{padding:10px 30px 30px}
	.faq-title{font-size:22px}
	.faq-question{font-size:15px;padding:18px}
	.faq-answer p{font-size:15px}
}


.post-meta{font-size:13px;color:#666;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.post-meta .author strong{color:#1f6f8b}
.meta-divider{color:#ccc;margin:0 5px}

@media(min-width:992px) {
.post-meta{font-size:14px}
}

.blog-toc{background:#f8f9fb;border:1px solid #d9e2ec;border-radius:8px;padding:18px 20px;margin:0 0 25px}
.blog-toc-title{font-size:20px;font-weight:700;margin-bottom:12px;color:#222}
.blog-toc-list{margin:0;padding-left:20px}
.main-content .blog-toc-list li::before{top:-2px}
.blog-toc-list a{color:#0056b3;text-decoration:none}
.main-content h2{scroll-margin-top:100px}
