/* public/assets/css/style.css */
:root{--brand:#d5200c;--dark:#111}
*{box-sizing:border-box}
body{font-family:Inter,Arial,Helvetica,sans-serif;margin:0;color:#111; background-image: url("kwa_back_two.jpg");
background-repeat: inherit; background-size: contain; background-position: center;  width: inherit;}
a{text-decoration:none;color:inherit}
.nav{display:flex;
    justify-content:space-between;
    padding:14px 22px;background:#111;color:#fff;
    /* position:sticky; */
    top:0;z-index:200;

}
#menu_btn{
    visibility: hidden;
}
/* #navs{
    visibility: visible;
} */
.nav .logo{
    /* display:flex; */
    background-image: url(pic_kwa.png);
    height: 48px;
    width: 48px;    
    background-repeat: no-repeat;
    background-position: center;    
    background-size: cover;
}


.nav .navlinks{display:flex;gap:18px;font-weight:700}
@media(max-width:760px){ .nav .navlinks_new{display:block} .hamburger{display:block} 

#menu_btn{
    visibility: visible;
}
#nav_top{
    visibility: hidden;
}

}
.hero{height:420px;
display:flex;align-items:center;
justify-content:center;
color:#fff;
font-size:56px;
font-weight:900}
.container{max-width:1100px;margin:36px auto;padding:0 18px}
.section-title{color:var(--brand);font-size:28px;font-weight:900;margin-bottom:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.card{background:#ff0000;border-radius:12px;overflow:hidden;box-shadow:0 8px 26px rgba(0,0,0,0.12)}
.card img,.card video{width:100%;height:180px;object-fit:cover;display:block}
.meta{padding:12px;font-weight:700}
.open{
    display: flex;
    justify-content: center;
    background:var(--brand);
    color:#fff;
    font-size: xx-large;
    width: 100%;
    /* padding:40px; */
    height: inherit;
    font-size: 100px;
    /* border-radius:12px; */
    text-align:center;
    font-weight:900}
.float-btn{position:fixed;right:20px;bottom:20px;background:var(--brand);color:#fff;padding:14px 22px;border-radius:999px;font-weight:800;box-shadow:0 12px 30px rgba(0,0,0,0.18);border:none;cursor:pointer}
.form-row{display:flex;gap:12px}
@media(max-width:700px){ .hero{height:260px;font-size:28px} .form-row{flex-direction:column} }