/* ===========================
   AMCASHPAY ENTERPRISE WEBSITE
   FINAL LOGO VISIBILITY FIX
   =========================== */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

:root{
--primary:#032f4f;
--secondary:#0b4f75;
--accent:#1fa2ff;
--accent-orange:#f97316;
--light:#f4f8fc;
--white:#ffffff;
--text:#1e293b;
--border:rgba(3,47,79,0.08);
--shadow:0 12px 34px rgba(3,47,79,0.10);
}

html{
scroll-behavior:smooth;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:linear-gradient(to bottom,#f4f8fc,#eef4fa);
color:var(--text);
line-height:1.7;
min-height:100vh;
}

/* ================= HEADER ================= */

.header{
background:linear-gradient(135deg,var(--primary),var(--secondary));
display:flex;
justify-content:space-between;
align-items:center;
padding:14px 34px;
position:sticky;
top:0;
z-index:999;
box-shadow:0 6px 22px rgba(0,0,0,0.16);
}

/* HEADER LOGO CARD */
.logo{
display:flex;
align-items:center;
justify-content:center;
text-decoration:none;
background:rgba(255,255,255,0.98);
padding:8px 18px;
border-radius:14px;
box-shadow:0 8px 24px rgba(0,0,0,0.18);
flex-shrink:0;
}

.logo img{
height:56px;
width:auto;
max-width:360px;
display:block;
object-fit:contain;
background:transparent;
}

/* NAVIGATION */

.menu{
display:flex;
align-items:center;
gap:18px;
flex-wrap:wrap;
}

.menu a{
color:var(--white);
text-decoration:none;
font-size:15px;
font-weight:700;
padding:10px 14px;
border-radius:10px;
transition:all 0.3s ease;
}

.menu a:hover,
.menu a.active{
background:rgba(255,255,255,0.16);
}

/* ================= MAIN ================= */

main{
width:100%;
}

.main{
height:78vh;
min-height:540px;
margin:26px;
border-radius:20px;
overflow:hidden;
background:var(--white);
box-shadow:var(--shadow);
border:1px solid var(--border);
}

iframe{
width:100%;
height:100%;
border:none;
background:var(--white);
}

/* ================= CONTENT ================= */

.content{
max-width:1120px;
margin:38px auto;
background:var(--white);
padding:46px;
border-radius:20px;
box-shadow:0 10px 30px rgba(3,47,79,0.07);
border:1px solid var(--border);
}

.content h1{
font-size:40px;
margin-bottom:22px;
color:var(--primary);
font-weight:800;
line-height:1.2;
}

.content h2{
font-size:30px;
margin-top:30px;
margin-bottom:14px;
color:var(--primary);
}

.content h3{
font-size:23px;
margin-top:28px;
margin-bottom:12px;
color:var(--secondary);
}

.content p{
margin-bottom:18px;
font-size:16px;
color:#334155;
}

.content ul{
padding-left:22px;
margin-bottom:18px;
}

.content li{
margin-bottom:10px;
}

/* FAQ */
.faq-item{
margin-bottom:28px;
padding-bottom:20px;
border-bottom:1px solid #dce7f2;
}

/* ================= FORM ================= */

.contact-form{
margin-top:24px;
}

.contact-form input,
.contact-form textarea{
width:100%;
padding:15px;
margin-top:14px;
border:1px solid #cbd5e1;
border-radius:12px;
font-size:15px;
background:#ffffff;
}

.contact-form input:focus,
.contact-form textarea:focus{
outline:none;
border-color:var(--accent);
box-shadow:0 0 0 4px rgba(31,162,255,0.14);
}

.contact-form button{
margin-top:18px;
padding:15px 26px;
background:linear-gradient(135deg,var(--accent-orange),#ea580c);
color:var(--white);
border:none;
border-radius:12px;
font-size:15px;
font-weight:700;
cursor:pointer;
}

/* ================= FOOTER ================= */

.footer{
background:linear-gradient(135deg,var(--primary),var(--secondary));
color:var(--white);
margin-top:60px;
padding-top:42px;
}

.footer-container{
max-width:1280px;
margin:auto;
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
padding:0 28px 36px;
gap:34px;
}

/* LEFT */
.footer-left{
flex:1;
min-width:280px;
max-width:360px;
}

/* FOOTER LOGO CARD */
.footer-logo{
display:inline-block;
background:rgba(255,255,255,0.98);
padding:12px 18px;
border-radius:16px;
box-shadow:0 10px 28px rgba(0,0,0,0.18);
margin-bottom:18px;
}

.footer-logo img{
width:300px;
height:auto;
max-width:100%;
display:block;
object-fit:contain;
background:transparent;
}

.tagline{
font-size:15px;
line-height:1.9;
color:rgba(255,255,255,0.90);
}

/* CENTER */
.footer-center{
flex:1;
min-width:280px;
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:14px 22px;
padding-top:8px;
}

.footer-center a{
color:var(--white);
text-decoration:none;
font-size:15px;
font-weight:700;
}

.footer-center a:hover{
opacity:0.82;
text-decoration:underline;
}

/* RIGHT */
.footer-right{
flex:1;
min-width:280px;
font-size:15px;
line-height:1.9;
text-align:right;
color:rgba(255,255,255,0.96);
}

.footer-right strong{
display:block;
font-size:18px;
margin-bottom:10px;
}

/* BOTTOM */
.footer-bottom{
text-align:center;
padding:16px;
font-size:13px;
background:rgba(0,0,0,0.18);
border-top:1px solid rgba(255,255,255,0.08);
}

/* ================= RESPONSIVE ================= */

@media(max-width:1100px){

.logo img{
height:50px;
max-width:300px;
}

.footer-logo img{
width:250px;
}

}

@media(max-width:992px){

.header{
flex-direction:column;
gap:16px;
padding:18px;
}

.menu{
justify-content:center;
}

.main{
height:68vh;
margin:16px;
}

.content{
margin:20px;
padding:30px;
}

.content h1{
font-size:32px;
}

.footer-container{
flex-direction:column;
text-align:center;
}

.footer-left,
.footer-center,
.footer-right{
max-width:100%;
text-align:center;
}

.footer-right{
text-align:center;
}

.footer-logo{
margin:auto auto 18px;
}

}

@media(max-width:576px){

.logo{
padding:8px 12px;
}

.logo img{
height:42px;
max-width:220px;
}

.menu{
gap:8px;
}

.menu a{
font-size:14px;
padding:8px 10px;
}

.main{
height:62vh;
}

.content{
padding:24px;
}

.content h1{
font-size:28px;
}

.contact-form button{
width:100%;
}

.footer-logo img{
width:210px;
}

}