/* GLOBAL FIX */
html,body{overflow-x:hidden;}
body{font-family:'Poppins',sans-serif;margin:0;padding:0;color:#222;}
/* CONTAINER */
.container{max-width:1280px;}
/* TOP BAR */
.top-bar{background:#0b2c5f;color:#fff;font-size:14px;padding:12px 0;}
.top-left{font-weight:500;}
.top-right span{margin-left:20px;cursor:pointer;}
/* HEADER */
.main-header{background:#fff;position:sticky;top:0;z-index:999;transition:all .3s ease;}
.main-header.scrolled{box-shadow:0 6px 20px rgba(0,0,0,0.08);}
/* NAVBAR */
.navbar{padding:20px 0;}
/* LOGO */
.navbar-brand img{height:80px;width:auto;transition:.3s;}
.navbar-brand img:hover{transform:scale(1.05);}
/* MENU */
.navbar-nav{margin-left:40px;}
.nav-link{font-size:17px;font-weight:600;margin:0 16px;letter-spacing:.5px;color:#1a1a1a;position:relative;transition:all .3s ease;text-transform:uppercase;}
.nav-link:hover{color:#0b2c5f;}
/* PREMIUM UNDERLINE HOVER */
.nav-link::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:#1fb6a6;transition:.3s;}
.nav-link:hover::after{width:100%;}
/* ENQUIRY BUTTON */
.btn-enquiry{background:#1fb6a6;color:#fff;padding:12px 28px;border-radius:40px;font-weight:600;font-size:15px;text-decoration:none;transition:.3s;box-shadow:0 8px 20px rgba(0,0,0,.1);}
.btn-enquiry:hover{background:#0b2c5f;transform:translateY(-2px);}
/* MOBILE MENU */
@media (max-width:991px){
.navbar-collapse{background:#fff;padding:20px;margin-top:15px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.08);}
.nav-link{margin:8px 0;font-size:16px;}
.btn-enquiry{display:block;width:100%;text-align:center;margin-top:10px;}
.navbar-brand img{height:55px;}
}
/* TOP BAR MOBILE */
@media (max-width:768px){
.top-bar .container{flex-direction:column;text-align:center;gap:5px;}
}
/* HERO SECTION */
.hero-section{padding:140px 0;background:#f7f9fc;}
.hero-title{font-size:54px;font-weight:700;line-height:1.2;margin-bottom:25px;color:#0b2c5f;}
.hero-highlight{color:#1fb6a6;}
.hero-text{font-size:18px;color:#555;margin-bottom:35px;max-width:520px;line-height:1.7;}
.hero-buttons{display:flex;gap:20px;flex-wrap:wrap;}
.btn-primary-custom{background:#1fb6a6;color:#fff;padding:15px 34px;border-radius:8px;font-weight:600;text-decoration:none;transition:.3s;box-shadow:0 8px 20px rgba(0,0,0,.08);}
.btn-primary-custom:hover{background:#0b2c5f;transform:translateY(-2px);}
.btn-outline-custom{border:2px solid #0b2c5f;color:#0b2c5f;padding:13px 30px;border-radius:8px;font-weight:600;text-decoration:none;transition:.3s;}
.btn-outline-custom:hover{background:#0b2c5f;color:#fff;}
.hero-image img{width:100%;max-width:520px;display:block;margin:auto;}
/* PREMIUM HERO VISUAL */
.hero-premium-visual{position:relative;max-width:560px;margin:auto;height:460px;}
.main-product-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 40px 90px rgba(0,0,0,.15);border:1px solid rgba(0,0,0,.05);position:relative;z-index:2;transition:.3s;}
.main-product-card img{width:100%;border-radius:10px;display:block;}
/* FLOATING MINI CARDS */
.floating-card{position:absolute;width:90px;height:90px;background:#fff;border-radius:14px;box-shadow:0 20px 40px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;animation:floatCard 6s ease-in-out infinite;}
.floating-card img{width:48px;}
.card-1{top:-20px;left:-20px;}
.card-2{bottom:-20px;right:-20px;animation-delay:1s;}
.card-3{top:40%;right:-40px;animation-delay:2s;}
/* FLOAT ANIMATION */
@keyframes floatCard{0%{transform:translateY(0);}50%{transform:translateY(-12px);}100%{transform:translateY(0);}}
/* HOVER DEPTH */
.hero-premium-visual:hover .main-product-card{transform:translateY(-8px);}
/* RESPONSIVE */
@media (max-width:991px){
.hero-section{text-align:center;padding:100px 0;}
.hero-title{font-size:38px;}
.hero-text{margin:auto;}
.hero-buttons{justify-content:center;}
.hero-premium-visual{margin-top:40px;height:auto;}
}
@media (max-width:576px){
.hero-title{font-size:30px;}
.hero-text{font-size:16px;}
.btn-primary-custom,.btn-outline-custom{width:100%;text-align:center;}
}
/* ABOUT SECTION */
.about-section{padding:120px 0;background:#fff;}
.about-image-wrapper{position:relative;max-width:520px;margin:auto;}
.about-image-bg{position:absolute;width:100%;height:100%;background:#1fb6a6;top:25px;left:25px;border-radius:16px;opacity:.15;}
.about-image{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 35px 80px rgba(0,0,0,.18);transition:.3s;}
.about-image img{width:100%;display:block;}
.about-image:hover{transform:translateY(-8px);box-shadow:0 45px 100px rgba(0,0,0,.22);}
.section-title{font-size:42px;font-weight:700;margin-bottom:25px;color:#0b2c5f;}
.about-text{font-size:17px;color:#555;line-height:1.7;margin-bottom:20px;}
.about-btn{display:inline-block;margin-top:15px;background:#1fb6a6;color:#fff;padding:12px 28px;border-radius:6px;text-decoration:none;font-weight:600;transition:.3s;}
.about-btn:hover{background:#0b2c5f;}
/* SOLUTIONS */
.solutions-section{padding:120px 0;background:#f7f9fc;}
.section-subtitle{max-width:650px;margin:auto;color:#666;margin-top:10px;}
.solution-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 25px 60px rgba(0,0,0,.08);transition:.3s;height:100%;display:flex;flex-direction:column;}
.solution-card:hover{transform:translateY(-8px);box-shadow:0 35px 80px rgba(0,0,0,.12);}
.solution-image img{width:100%;height:auto;display:block;}
.solution-card h3{font-size:20px;margin:20px;color:#0b2c5f;}
.solution-card p{font-size:15px;color:#666;margin:0 20px 25px;line-height:1.6;}
@media (max-width:576px){
.solutions-section{padding:80px 0;}
}
/* WHY */
.why-section{padding:120px 0;background:#fff;}
.why-card{background:#f7f9fc;padding:35px;border-radius:12px;text-align:center;transition:.3s;height:100%;}
.why-card:hover{transform:translateY(-8px);box-shadow:0 25px 60px rgba(0,0,0,.08);}
.why-icon{font-size:36px;margin-bottom:15px;}
.why-card h4{font-size:20px;color:#0b2c5f;margin-bottom:10px;}
.why-card p{font-size:15px;color:#666;}
/* GLOBAL */
.global-section{padding:120px 0;background:linear-gradient(135deg,#0b2c5f,#1fb6a6);color:#fff;position:relative;overflow:hidden;}
.global-title{font-size:42px;font-weight:700;margin-bottom:20px;}
.global-text{font-size:18px;line-height:1.7;opacity:.9;}
.global-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.global-card{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);padding:30px;border-radius:12px;text-align:center;border:1px solid rgba(255,255,255,.2);transition:.3s;}
.global-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.25);}
.global-card h4{font-size:22px;margin-bottom:5px;}
.global-card p{font-size:14px;opacity:.9;}
@media (max-width:576px){
.global-grid{grid-template-columns:1fr;}
.global-title{font-size:32px;}
}
/* CTA */
.cta-section{padding:120px 0;background:linear-gradient(135deg,#f8fbff,#eef4ff);}
.cta-card{background:#fff;padding:60px 40px;border-radius:14px;max-width:850px;margin:auto;box-shadow:0 30px 80px rgba(0,0,0,.08);border:1px solid #e8eef7;}
.cta-title{font-size:38px;font-weight:700;margin-bottom:15px;color:#0b2c5f;}
.cta-text{font-size:18px;color:#555;max-width:650px;margin:auto;margin-bottom:30px;}
.cta-btn{background:#1fb6a6;color:#fff;padding:14px 40px;border-radius:6px;font-weight:600;text-decoration:none;transition:.3s;display:inline-block;}
.cta-btn:hover{background:#159a8c;transform:translateY(-2px);}
/* FOOTER */
.footer{background:linear-gradient(135deg,#071a36,#0b2c5f);color:#d5e1f2;padding:90px 0 30px;}
.footer-logo{font-size:26px;font-weight:700;color:#fff;margin-bottom:15px;}
.footer-text{line-height:1.7;opacity:.85;}
.footer-title{color:#fff;margin-bottom:18px;font-size:18px;position:relative;}
.footer-title::after{content:"";display:block;width:35px;height:3px;background:#1fb6a6;margin-top:6px;}
.footer-links{list-style:none;padding:0;}
.footer-links li{margin-bottom:10px;}
.footer-links a{color:#c9d6ec;text-decoration:none;transition:.3s;display:inline-block;}
.footer-links a:hover{color:#1fb6a6;transform:translateX(4px);}
.footer-contact p{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;line-height:1.5;}
.footer-contact a{color:#c9d6ec;text-decoration:none;transition:.3s;}
.footer-contact a:hover{color:#1fb6a6;}
.footer-contact i{color:#1fb6a6;min-width:18px;margin-top:3px;}
.footer-social{margin-top:18px;display:flex;gap:10px;}
.footer-social a{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:#0d2a54;border-radius:6px;color:#c9d6ec;transition:.3s;}
.footer-social a:hover{background:#1fb6a6;color:#fff;transform:translateY(-2px);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:40px;padding-top:20px;text-align:center;font-size:14px;opacity:.7;}
@media (max-width:768px){
.footer{text-align:center;}
.footer-contact p{justify-content:center;}
.footer-social{justify-content:center;}
}
/* About Us Page */
.about-hero{position:relative;height:420px;background:url("../images/about-banner.jpg") center/cover no-repeat;display:flex;align-items:center;color:#fff;}
.about-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(11,44,95,0.85),rgba(31,182,166,0.75));}
.about-hero-content{position:relative;z-index:2;max-width:650px;}
.about-hero h1{font-size:48px;font-weight:700;margin-bottom:15px;}
.about-hero p{font-size:18px;opacity:.95;margin-bottom:15px;}
.breadcrumb-about{font-size:14px;}
.breadcrumb-about a{color:#fff;text-decoration:none;opacity:.85;}
.breadcrumb-about span{margin:0 6px;opacity:.6;}
.about-company-premium{padding:120px 0;background:#ffffff;}
.about-img-wrapper{position:relative;padding:20px;}
.about-img{width:100%;border-radius:10px;box-shadow:0 35px 80px rgba(0,0,0,0.15);border:6px solid #ffffff;}
.about-img-wrapper::before{content:"";position:absolute;top:0;left:0;width:90%;height:90%;border:3px solid #1fb6a6;border-radius:10px;z-index:-1;}
.about-content{padding-left:30px;}
.about-title{font-size:36px;margin-bottom:20px;color:#0b2c5f;}
.about-content p{color:#555;line-height:1.7;margin-bottom:20px;}
.about-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:25px;}
.about-card{background:#f7fbff;padding:20px;border-radius:8px;border-left:4px solid #1fb6a6;transition:.3s;}
.about-card:hover{transform:translateY(-4px);box-shadow:0 15px 35px rgba(0,0,0,0.08);}
.about-card h3{font-size:18px;margin-bottom:6px;color:#0b2c5f;}
.about-card p{font-size:14px;color:#666;margin:0;}
@media(max-width:768px){.about-content{padding-left:0;margin-top:30px;}}
@media(max-width:768px){.about-cards{grid-template-columns:1fr;}}
.about-story{padding:120px 0;background:#f7fbff;}
.section-title{font-size:36px;font-weight:700;color:#0b2c5f;margin-bottom:10px;}
.section-subtitle{color:#666;max-width:600px;margin:auto;}
.about-values-dark{padding:120px 0;background:linear-gradient(135deg,#071a36,#0b2c5f);color:#fff;}
.values-title{font-size:38px;font-weight:700;margin-bottom:10px;}
.values-subtitle{opacity:.85;max-width:600px;margin:auto;}
.value-card-dark{background:rgba(255,255,255,0.05);padding:35px;border-radius:12px;text-align:center;transition:.4s;border:1px solid rgba(255,255,255,0.08);backdrop-filter:blur(6px);height:100%;}
.value-card-dark:hover{transform:translateY(-10px);background:rgba(255,255,255,0.1);box-shadow:0 25px 60px rgba(0,0,0,0.4);}
.value-icon-dark{width:70px;height:70px;margin:auto;margin-bottom:15px;background:#1fb6a6;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;color:#fff;transition:.4s;}
.value-card-dark:hover .value-icon-dark{transform:scale(1.1) rotate(6deg);box-shadow:0 0 20px rgba(31,182,166,0.6);}
.value-card-dark h4{margin-bottom:10px;font-size:20px;}
.value-card-dark p{font-size:14px;opacity:.85;}
@media(max-width:768px){.about-values-dark{padding:80px 0;}}
@media(max-width:768px){.values-title{font-size:30px;}}
@media(max-width:992px){.values-left{text-align:center;margin-bottom:40px;}}
.contact-hero{position:relative;height:420px;background:url("../images/contact-banner.jpg") center/cover no-repeat;display:flex;align-items:center;color:#fff;}
.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(11,44,95,0.85),rgba(31,182,166,0.75));}
.hero-content{position:relative;z-index:2;max-width:650px;}
.hero-content h1{font-size:48px;font-weight:700;margin-bottom:15px;}
.hero-content p{font-size:18px;opacity:.9;margin-bottom:10px;}
.hero-breadcrumb{font-size:14px;}
.hero-breadcrumb a{color:#fff;text-decoration:none;}
.hero-breadcrumb span{margin:0 6px;}
.contact-cards{padding:60px 0;background:#f8fbff;}
.contact-card{background:#fff;padding:35px;border-radius:10px;text-align:center;box-shadow:0 20px 40px rgba(0,0,0,0.08);transition:.3s;}
.contact-card:hover{transform:translateY(-6px);}
.contact-card i{font-size:30px;color:#1fb6a6;margin-bottom:10px;}
.contact-main{padding:100px 0;}
.contact-details h3{color:#0b2c5f;margin-bottom:15px;}
.contact-details p{margin-bottom:10px;color:#555;}
.contact-details i{color:#1fb6a6;margin-right:6px;}
.contact-form{background:#fff;padding:40px;border-radius:10px;box-shadow:0 20px 50px rgba(0,0,0,0.08);}
.form-control{height:50px;border-radius:6px;border:1px solid #e0e6ef;}
textarea.form-control{height:auto;}
.contact-btn{background:#1fb6a6;color:#fff;padding:12px 30px;border:none;border-radius:6px;margin-top:10px;transition:.3s;}
.contact-btn:hover{background:#0b2c5f;}
.contact-map{margin-top:60px;}
.contact-form-box{background:#fff;padding:45px;border-radius:10px;box-shadow:0 30px 70px rgba(0,0,0,0.08);max-width:600px;margin:auto;}
.contact-form-box h2{text-align:center;margin-bottom:30px;color:#0b2c5f;}
.form-group{position:relative;margin-bottom:20px;}
.form-group i{position:absolute;left:15px;top:16px;color:#1fb6a6;font-size:16px;}
.form-group input,.form-group textarea{width:100%;padding:14px 15px 14px 45px;border:1px solid #e0e6ef;border-radius:6px;font-size:15px;transition:.3s;}
.form-group input:focus,.form-group textarea:focus{border-color:#1fb6a6;outline:none;box-shadow:0 0 0 3px rgba(31,182,166,0.15);}
textarea{min-height:120px;resize:none;}
.submit-btn{width:100%;padding:14px;background:#1fb6a6;color:#fff;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:.3s;}
.submit-btn:hover{background:#0b2c5f;}
#formMessage{margin-top:15px;text-align:center;font-weight:500;color:green;}
.page-hero{
position:relative;
height:420px;
background:url("../images/page-banner.jpg") center/cover no-repeat;
display:flex;
align-items:center;
color:#fff;
}
.hero-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(
135deg,
rgba(11,44,95,0.85),
rgba(31,182,166,0.75)
);
}
.hero-content{
position:relative;
z-index:2;
max-width:650px;
}
.hero-content h1{
font-size:48px;
font-weight:700;
margin-bottom:15px;
}
.hero-content p{
font-size:18px;
opacity:.9;
}
.hero-breadcrumb{
margin-top:15px;
font-size:14px;
}
.hero-breadcrumb a{
color:#fff;
text-decoration:none;
}
.hero-breadcrumb span{
margin:0 6px;
}
.solutions-premium{
padding:140px 0;
background:
radial-gradient(circle at top right,#e8f5ff,#ffffff);
}
/* GRID */
.solutions-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
margin-top:70px;
}
/* PANEL */
.solution-panel{
background:#fff;
padding:50px 40px;
border-radius:20px;
position:relative;
overflow:hidden;
box-shadow:0 30px 80px rgba(0,0,0,0.08);
transition:.4s;
}
/* HOVER EFFECT */
.solution-panel:hover{
transform:translateY(-15px);
box-shadow:0 40px 100px rgba(0,0,0,0.15);
}
/* BACKGROUND SHAPE */
.solution-panel::before{
content:"";
position:absolute;
top:-80px;
right:-80px;
width:160px;
height:160px;
background:linear-gradient(
135deg,
#1fb6a6,
#0b2c5f
);
border-radius:50%;
opacity:.08;
}
/* ICON */
.panel-icon{
width:85px;
height:85px;
border-radius:18px;
background:linear-gradient(
135deg,
#1fb6a6,
#0b2c5f
);
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:32px;
margin-bottom:25px;
transition:.4s;
}
/* ICON HOVER */
.solution-panel:hover .panel-icon{
transform:scale(1.15) rotate(8deg);
}
/* TITLE */
.solution-panel h3{
font-size:22px;
color:#0b2c5f;
margin-bottom:10px;
}
/* TEXT */
.solution-panel p{
color:#666;
font-size:15px;
line-height:1.7;
}
/* RESPONSIVE */
@media(max-width:992px){
.solutions-grid{
grid-template-columns:repeat(2,1fr);
}
}
@media(max-width:600px){
.solutions-grid{
grid-template-columns:1fr;
}
}
.cta-premium{
position:relative;
padding:120px 0;
background:linear-gradient(
135deg,
#0b2c5f,
#1fb6a6
);
text-align:center;
color:#fff;
overflow:hidden;
}
/* BACKGROUND OVERLAY */
.cta-overlay{
position:absolute;
top:-120px;
right:-120px;
width:400px;
height:400px;
background:radial-gradient(
circle,
rgba(255,255,255,0.25),
transparent
);
}
/* CONTENT */
.cta-content{
position:relative;
max-width:1000px;
margin:auto;
}
.cta-content h2{
font-size:42px;
font-weight:700;
margin-bottom:20px;
}
.cta-content p{
font-size:18px;
opacity:.9;
margin-bottom:35px;
line-height:1.7;
}
/* BUTTON */
.cta-button{
display:inline-block;
padding:16px 40px;
background:#fff;
color:#0b2c5f;
font-weight:600;
border-radius:50px;
text-decoration:none;
transition:.3s;
box-shadow:0 15px 40px rgba(0,0,0,0.2);
}
.cta-button:hover{
transform:translateY(-4px);
box-shadow:0 20px 60px rgba(0,0,0,0.3);
background:#f5f5f5;
}
.page-hero{
position:relative;
height:420px;
background:url("../images/page-banner.jpg") center/cover no-repeat;
display:flex;
align-items:center;
color:#fff;
}
.hero-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(
135deg,
rgba(11,44,95,0.85),
rgba(31,182,166,0.75)
);
}
.hero-content{
position:relative;
z-index:2;
max-width:650px;
}
.hero-content h1{
font-size:48px;
font-weight:700;
margin-bottom:15px;
}
.hero-content p{
font-size:18px;
opacity:.9;
}
.hero-breadcrumb{
margin-top:15px;
font-size:14px;
}
.hero-breadcrumb a{
color:#fff;
text-decoration:none;
}
.hero-breadcrumb span{
margin:0 6px;
}
.eaeu-section{
padding:140px 0;
background:linear-gradient(
180deg,
#ffffff,
#f3f8ff
);
}
.eaeu-wrapper{
display:grid;
grid-template-columns:1fr 1fr;
gap:80px;
align-items:center;
}
/* IMAGE */
.eaeu-image{
position:relative;
}
.eaeu-image img{
width:100%;
border-radius:18px;
box-shadow:0 40px 90px rgba(0,0,0,0.15);
transition:0.4s;
}
.eaeu-image img:hover{
transform:translateY(-10px);
box-shadow:0 50px 110px rgba(0,0,0,0.2);
}
/* CONTENT */
.eaeu-content h2{
font-size:40px;
color:#0b2c5f;
margin-bottom:25px;
font-weight:700;
}
.eaeu-content p{
font-size:17px;
line-height:1.8;
color:#555;
margin-bottom:20px;
}
/* LIST */
.eaeu-content ul{
margin-top:25px;
padding-left:0;
list-style:none;
}
.eaeu-content li{
font-size:16px;
margin-bottom:12px;
padding-left:28px;
position:relative;
}
.eaeu-content li::before{
content:"✓";
position:absolute;
left:0;
color:#1fb6a6;
font-weight:700;
}
/* RESPONSIVE */
@media(max-width:992px){
.eaeu-wrapper{
grid-template-columns:1fr;
gap:50px;
}
}
.rep-feature-wrapper{
max-width:900px;
margin:70px auto 0;
display:flex;
flex-direction:column;
gap:40px;
}
/* FEATURE ITEM */
.rep-feature-item{
display:flex;
gap:30px;
align-items:flex-start;
padding:35px;
background:#ffffff;
border-radius:14px;
box-shadow:0 20px 60px rgba(0,0,0,0.06);
transition:0.3s;
}
.rep-feature-item:hover{
transform:translateY(-6px);
box-shadow:0 25px 80px rgba(0,0,0,0.1);
}
/* ICON */
.rep-feature-icon{
width:70px;
height:70px;
display:flex;
align-items:center;
justify-content:center;
border-radius:14px;
background:linear-gradient(135deg,#1fb6a6,#0b2c5f);
color:#fff;
font-size:26px;
flex-shrink:0;
}
/* CONTENT */
.rep-feature-content h3{
font-size:22px;
color:#0b2c5f;
margin-bottom:8px;
}
.rep-feature-content p{
color:#555;
line-height:1.7;
margin-bottom:12px;
}
.rep-feature-content ul{
list-style:none;
padding:0;
margin:0;
}
.rep-feature-content li{
font-size:15px;
color:#333;
margin-bottom:6px;
display:flex;
align-items:center;
gap:8px;
}
.rep-feature-content li i{
color:#1fb6a6;
}
/* MOBILE */
@media(max-width:768px){
.rep-feature-item{
flex-direction:column;
text-align:center;
align-items:center;
}
}
/* DARK SECTION */
.section-dark{
padding:80px 0;
background:linear-gradient(
135deg,
#0b2c5f,
#153f7a
);
color:#fff;
}
/* HEADER */
.section-header{
max-width:700px;
margin:auto;
margin-bottom:70px;
}
.section-header h2{
font-size:40px;
font-weight:700;
margin-bottom:10px;
}
.section-header p{
font-size:17px;
opacity:0.9;
}
/* GRID */
.why-partner-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
}
/* LIGHT CARDS */
.why-card{
background:#ffffff;
padding:35px;
border-radius:14px;
text-align:center;
box-shadow:0 20px 60px rgba(0,0,0,0.2);
transition:0.3s;
}
.why-card:hover{
transform:translateY(-8px);
box-shadow:0 30px 80px rgba(0,0,0,0.3);
}
/* ICON */
.why-icon{
width:70px;
height:70px;
margin:auto;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:linear-gradient(
135deg,
#1fb6a6,
#34d3c2
);
color:#fff;
font-size:26px;
margin-bottom:15px;
}
/* TEXT */
.why-card h4{
font-size:18px;
color:#0b2c5f;
margin-bottom:8px;
}
.why-card p{
font-size:14px;
color:#555;
line-height:1.7;
}
/* RESPONSIVE */
@media(max-width:992px){
.why-partner-grid{
grid-template-columns:repeat(2,1fr);
}
}
@media(max-width:600px){
.why-partner-grid{
grid-template-columns:1fr;
}
.section-dark{
padding:120px 0;
}
}
/* LIGHT CTA SECTION */
.cta-light{
padding:150px 0;
background:linear-gradient(
180deg,
#ffffff,
#f4f9ff
);
text-align:center;
}
/* CTA BOX */
.cta-light-box{
max-width:720px;
margin:auto;
}
/* TITLE */
.cta-light-box h2{
font-size:40px;
color:#0b2c5f;
margin-bottom:15px;
font-weight:700;
}
/* TEXT */
.cta-light-box p{
font-size:17px;
color:#555;
line-height:1.7;
margin-bottom:35px;
}
/* BUTTON */
.cta-light-btn{
display:inline-block;
padding:16px 40px;
background:linear-gradient(
135deg,
#1fb6a6,
#0b2c5f
);
color:#fff;
font-weight:600;
border-radius:40px;
text-decoration:none;
transition:0.3s;
box-shadow:0 20px 50px rgba(0,0,0,0.15);
}
.cta-light-btn:hover{
transform:translateY(-4px);
box-shadow:0 25px 70px rgba(0,0,0,0.25);
}
/* SECTION */
.ceo-highlight{
padding:20px 0 100px 0;
background:linear-gradient(
180deg,
#ffffff,
#f3f8ff
);
}
/* CARD */
.ceo-card{
display:grid;
grid-template-columns:320px 1fr;
gap:80px;
background:#ffffff;
padding:60px;
border-radius:18px;
box-shadow:0 40px 100px rgba(0,0,0,0.1);
align-items:center;
position:relative;
}
/* SIDE HIGHLIGHT LINE */
.ceo-card::before{
content:"";
position:absolute;
left:0;
top:0;
height:100%;
width:6px;
background:linear-gradient(
180deg,
#1fb6a6,
#0b2c5f
);
border-radius:6px 0 0 6px;
}
/* PHOTO */
.ceo-photo img{
width:100%;
border-radius:16px;
box-shadow:0 30px 70px rgba(0,0,0,0.15);
}
/* TEXT */
.ceo-role{
color:#1fb6a6;
font-weight:600;
text-transform:uppercase;
font-size:14px;
letter-spacing:1px;
}
.ceo-details h2{
font-size:42px;
margin:10px 0 20px;
color:#0b2c5f;
}
.ceo-details p{
font-size:16px;
line-height:1.8;
color:#555;
margin-bottom:15px;
}
/* RESPONSIVE */
@media(max-width:992px){
.ceo-card{
grid-template-columns:1fr;
text-align:center;
}
.ceo-card::before{
display:none;
}
}
.quality-certifications{
padding:160px 0;
background:linear-gradient(
180deg,
#ffffff,
#f7fbff
);
}
/* WRAPPER */
.quality-wrapper{
margin-top:70px;
display:flex;
flex-direction:column;
gap:30px;
max-width:900px;
margin-left:auto;
margin-right:auto;
}
/* ITEM */
.quality-item{
display:flex;
align-items:flex-start;
gap:25px;
background:#ffffff;
padding:30px;
border-radius:14px;
box-shadow:0 20px 60px rgba(0,0,0,0.08);
transition:0.3s;
}
.quality-item:hover{
transform:translateY(-5px);
box-shadow:0 30px 80px rgba(0,0,0,0.12);
}
/* ICON */
.quality-icon{
width:60px;
height:60px;
display:flex;
align-items:center;
justify-content:center;
border-radius:12px;
background:linear-gradient(
135deg,
#1fb6a6,
#0b2c5f
);
color:#fff;
font-size:24px;
flex-shrink:0;
}
/* TEXT */
.quality-content h4{
font-size:20px;
color:#0b2c5f;
margin-bottom:6px;
}
.quality-content p{
font-size:15px;
color:#555;
line-height:1.7;
}
/* MOBILE */
@media(max-width:768px){
.quality-item{
flex-direction:column;
align-items:center;
text-align:center;
}
}
.core-values-dark{
padding:100px 0 160px 0;
background:linear-gradient(
135deg,
#0b2c5f,
#153f7a
);
color:#ffffff;
}
/* HEADER */
.section-header{
max-width:700px;
margin:auto;
margin-bottom:70px;
}
.section-header h2{
font-size:40px;
margin-bottom:10px;
font-weight:700;
}
.section-header p{
font-size:17px;
}
/* GRID */
.values-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
}
/* CARD */
.value-card{
background:#ffffff;
padding:35px;
border-radius:14px;
text-align:center;
transition:0.3s;
box-shadow:0 25px 70px rgba(0,0,0,0.25);
}
.value-card:hover{
transform:translateY(-8px);
box-shadow:0 35px 90px rgba(0,0,0,0.35);
}
/* ICON */
.value-icon{
width:70px;
height:70px;
margin:auto;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:linear-gradient(
135deg,
#1fb6a6,
#34d3c2
);
color:#fff;
font-size:28px;
margin-bottom:15px;
}
/* TEXT */
.value-card h4{
font-size:18px;
color:#0b2c5f;
margin-bottom:8px;
}
.value-card p{
font-size:14px;
color:#555;
line-height:1.7;
}
/* RESPONSIVE */
@media(max-width:992px){
.values-grid{
grid-template-columns:repeat(2,1fr);
}
}
@media(max-width:600px){
.values-grid{
grid-template-columns:1fr;
}
.core-values-dark{
padding:120px 0;
}
}
.btn-whatsapp{
display:inline-flex;
align-items:center;
gap:8px;
padding:10px 18px;
background:#25D366;
color:#fff;
border-radius:30px;
font-size:14px;
font-weight:500;
text-decoration:none;
transition:0.3s;
}
.btn-whatsapp:hover{
background:#1ebe5b;
color:#fff;
transform:translateY(-2px);
}
/* ============================================================
BIOBAXY — FULL MOBILE & TABLET RESPONSIVENESS
Added on top of existing CSS
Breakpoints: 1200px, 992px, 768px, 576px, 400px
============================================================ */
/* ── GLOBAL ── */
*{box-sizing:border-box;}
img{max-width:100%;height:auto;}
/* ── TOP BAR ── */
@media(max-width:768px){
.top-bar{padding:8px 0;}
.top-bar .container{flex-direction:column;gap:4px;text-align:center;}
.top-left{font-size:12px;}
.top-right span{margin-left:8px;font-size:12px;}
}
/* ── NAVBAR ── */
@media(max-width:991px){
.navbar{padding:12px 0;}
.navbar-brand img{height:50px !important;}
.navbar-collapse{background:#fff;padding:15px;margin-top:10px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.1);}
.nav-link{margin:6px 0 !important;font-size:15px !important;padding:8px 10px;}
.btn-whatsapp{display:block;width:100%;text-align:center;margin-top:10px;}
}
/* ── HERO SECTION ── */
@media(max-width:1200px){
.hero-title{font-size:44px;}
.hero-section{padding:100px 0;}
}
@media(max-width:991px){
.hero-section{padding:80px 0 60px;text-align:center;}
.hero-title{font-size:36px;}
.hero-text{font-size:16px;margin:0 auto 25px;}
.hero-buttons{justify-content:center;gap:12px;}
.hero-premium-visual{margin-top:50px;height:320px;}
.floating-card{width:70px;height:70px;}
.floating-card img{width:36px;}
}
@media(max-width:768px){
.hero-section{padding:60px 0 50px;}
.hero-title{font-size:30px;}
.hero-text{font-size:15px;}
.hero-premium-visual{height:260px;}
.card-3{right:-10px;}
.card-1{left:-10px;}
}
@media(max-width:576px){
.hero-title{font-size:26px;}
.btn-primary-custom,.btn-outline-custom{width:100%;text-align:center;display:block;}
.hero-buttons{flex-direction:column;gap:10px;}
.hero-premium-visual{height:auto;}
.floating-card{display:none;}
}
/* ── ABOUT SECTION ── */
@media(max-width:991px){
.about-section{padding:80px 0;}
.about-image-wrapper{margin-bottom:40px;}
.section-title{font-size:32px;}
.about-text{font-size:16px;}
}
@media(max-width:576px){
.about-section{padding:60px 0;}
.section-title{font-size:26px;}
.about-image-bg{display:none;}
}
/* ── SOLUTIONS SECTION ── */
@media(max-width:991px){
.solutions-section{padding:80px 0;}
}
@media(max-width:768px){
.solutions-section{padding:60px 0;}
.solution-card h3{font-size:17px;}
}
@media(max-width:576px){
.solutions-section{padding:50px 0;}
}
/* ── WHY SECTION ── */
@media(max-width:991px){
.why-section{padding:80px 0;}
}
@media(max-width:768px){
.why-section{padding:60px 0;}
.why-card{padding:25px;}
}
/* ── GLOBAL SECTION ── */
@media(max-width:991px){
.global-section{padding:80px 0;}
.global-title{font-size:32px;}
.global-text{font-size:16px;}
.global-grid{margin-top:40px;}
}
@media(max-width:576px){
.global-section{padding:60px 0;}
.global-title{font-size:26px;}
.global-grid{grid-template-columns:1fr 1fr;gap:15px;}
.global-card{padding:20px;}
.global-card h4{font-size:18px;}
}
@media(max-width:400px){
.global-grid{grid-template-columns:1fr;}
}
/* ── CTA SECTION ── */
@media(max-width:991px){
.cta-section{padding:80px 0;}
.cta-title{font-size:28px;}
.cta-text{font-size:16px;}
.cta-card{padding:40px 25px;}
}
@media(max-width:576px){
.cta-section{padding:60px 0;}
.cta-title{font-size:24px;}
.cta-btn{display:block;width:100%;text-align:center;}
.cta-card{padding:30px 20px;}
}
/* ── PAGE HERO (services, EAEU, contact) ── */
@media(max-width:768px){
.page-hero,.about-hero,.contact-hero{height:300px;}
.hero-content h1,.about-hero h1,.hero-content h1{font-size:32px !important;}
.hero-content p,.about-hero p{font-size:15px !important;}
}
@media(max-width:576px){
.page-hero,.about-hero,.contact-hero{height:250px;}
.hero-content h1,.about-hero h1{font-size:26px !important;}
}
/* ── SOLUTIONS PREMIUM (services page) ── */
@media(max-width:991px){
.solutions-premium{padding:80px 0;}
.solutions-grid{grid-template-columns:repeat(2,1fr);gap:20px;margin-top:40px;}
.solution-panel{padding:35px 25px;}
}
@media(max-width:600px){
.solutions-premium{padding:60px 0;}
.solutions-grid{grid-template-columns:1fr;}
.solution-panel{padding:30px 20px;}
}
/* ── CTA PREMIUM (services page) ── */
@media(max-width:768px){
.cta-premium{padding:80px 0;}
.cta-content h2{font-size:28px;}
.cta-content p{font-size:15px;}
.cta-button{display:block;width:90%;margin:0 auto;text-align:center;}
}
@media(max-width:576px){
.cta-premium{padding:60px 0;}
.cta-content h2{font-size:24px;}
}
/* ── EAEU SECTION ── */
@media(max-width:991px){
.eaeu-section{padding:80px 0;}
.eaeu-wrapper{grid-template-columns:1fr;gap:40px;}
.eaeu-content h2{font-size:30px;}
}
@media(max-width:576px){
.eaeu-section{padding:60px 0;}
.eaeu-content h2{font-size:24px;}
.eaeu-content p{font-size:15px;}
}
/* ── REP FEATURE ── */
@media(max-width:768px){
.rep-feature-item{flex-direction:column;align-items:center;text-align:center;padding:25px 20px;}
.rep-feature-icon{width:60px;height:60px;font-size:22px;}
.rep-feature-content h3{font-size:18px;}
.rep-feature-content li{justify-content:center;}
}
/* ── WHY PARTNER GRID ── */
@media(max-width:991px){
.why-partner-grid{grid-template-columns:repeat(2,1fr);gap:20px;}
.section-dark{padding:80px 0;}
}
@media(max-width:576px){
.why-partner-grid{grid-template-columns:1fr;}
.section-dark{padding:60px 0;}
}
/* ── CTA LIGHT ── */
@media(max-width:768px){
.cta-light{padding:80px 0;}
.cta-light-box h2{font-size:28px;}
.cta-light-box p{font-size:15px;}
.cta-light-btn{display:block;width:90%;margin:0 auto;text-align:center;}
}
@media(max-width:576px){
.cta-light{padding:60px 0;}
.cta-light-box h2{font-size:22px;}
}
/* ── ABOUT COMPANY PREMIUM ── */
@media(max-width:991px){
.about-company-premium{padding:80px 0;}
.about-content{padding-left:0 !important;margin-top:30px;}
.about-title{font-size:28px;}
}
@media(max-width:576px){
.about-company-premium{padding:60px 0;}
.about-title{font-size:24px;}
.about-cards{grid-template-columns:1fr !important;}
}
/* ── CEO HIGHLIGHT ── */
@media(max-width:991px){
.ceo-card{grid-template-columns:1fr !important;gap:30px !important;padding:40px 30px;text-align:center;}
.ceo-card::before{display:none;}
.ceo-photo img{max-width:260px;margin:0 auto;}
.ceo-details h2{font-size:30px;}
}
@media(max-width:576px){
.ceo-highlight{padding:20px 0 60px;}
.ceo-card{padding:30px 20px;}
.ceo-details h2{font-size:24px;}
}
/* ── CORE VALUES ── */
@media(max-width:991px){
.core-values-dark{padding:80px 0 100px;}
.values-grid{grid-template-columns:repeat(2,1fr) !important;gap:20px !important;}
.section-header h2{font-size:30px !important;}
}
@media(max-width:576px){
.core-values-dark{padding:60px 0;}
.values-grid{grid-template-columns:1fr !important;}
.value-card{padding:25px;}
}
/* ── QUALITY CERTIFICATIONS ── */
@media(max-width:991px){
.quality-certifications{padding:80px 0;}
}
@media(max-width:768px){
.quality-certifications{padding:60px 0;}
.quality-item{flex-direction:column;align-items:center;text-align:center;padding:25px 20px;}
.quality-icon{width:55px;height:55px;font-size:20px;}
}
@media(max-width:576px){
.quality-certifications{padding:50px 0;}
}
/* ── CONTACT PAGE ── */
@media(max-width:991px){
.contact-main{padding:60px 0;}
.contact-form-box{padding:30px 20px;}
}
@media(max-width:768px){
.contact-cards{padding:40px 0;}
.contact-card{padding:25px 20px;margin-bottom:10px;}
.contact-details{margin-bottom:40px;}
}
@media(max-width:576px){
.contact-main{padding:40px 0;}
.contact-form-box{padding:25px 15px;}
.contact-form-box h2{font-size:22px;}
.submit-btn{font-size:15px;}
}
/* ── FOOTER ── */
@media(max-width:991px){
.footer{padding:70px 0 30px;}
.footer-col{margin-bottom:35px;}
}
@media(max-width:768px){
.footer{padding:60px 0 20px;text-align:center;}
.footer-title::after{margin:6px auto 0;}
.footer-contact p{justify-content:center;}
.footer-social{justify-content:center;}
.footer-links a:hover{transform:none;}
}
@media(max-width:576px){
.footer{padding:50px 0 20px;}
.footer-logo{font-size:22px;}
}
/* ── SECTION HEADER ── */
@media(max-width:768px){
.section-header{margin-bottom:40px !important;}
.section-header h2{font-size:26px !important;}
.section-header p{font-size:15px !important;}
}
/* ── CONTAINER PADDING ON SMALL SCREENS ── */
@media(max-width:576px){
.container{padding-left:16px !important;padding-right:16px !important;}
}
/* ── PREVENT HORIZONTAL SCROLL ── */
@media(max-width:576px){
.hero-premium-visual,.about-image-wrapper,.eaeu-wrapper{overflow:hidden;}
}