
body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f5f6f8;color:#222;}
img{max-width:100%;display:block;}
.site-header{background:#1a2332;color:#fff;position:sticky;top:0;z-index:20;}
.container{width:min(1100px,92vw);margin:0 auto;}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px;}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
.logo-mark{width:40px;height:40px;border-radius:999px;background:linear-gradient(180deg,#4a90e2,#2e5c8a);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;}
.logo-text{display:flex;flex-direction:column;}
.logo-title{font-weight:600;font-size:.98rem;}
.logo-subtitle{font-size:.75rem;opacity:.85;}
.main-nav{display:flex;gap:16px;font-size:.95rem;}
.main-nav a{color:#cfd6ff;text-decoration:none;padding:6px 10px;border-radius:999px;transition:background .2s,color .2s;}
.main-nav a:hover{background:rgba(255,255,255,.12);color:#fff;}
.hero{position:relative;min-height:70vh;display:flex;align-items:flex-end;color:#fff;background:#000;}
.hero-menara{background:#000 url('/assets/images/Screenshot_1.jpg') center/cover no-repeat;}
.hero-petronas{background:#000 url('/assets/images/Screenshot_1.jpg') center/cover no-repeat;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,.15));}
.hero-content{position:relative;padding:80px 0;}
.hero-content h1{font-size:clamp(2.4rem,4vw,3.1rem);margin:0 0 8px;}
.hero-content p{font-size:1.05rem;max-width:620px;margin:0 0 22px;}
.hero-buttons{display:flex;flex-wrap:wrap;gap:12px;}
.section{padding:56px 0;}
.section-alt{padding:56px 0;background:#fff;}
.grid{display:grid;gap:32px;}
.two-col{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.three-col{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.card-list{list-style:none;margin:0;padding:0;}
.card-list li{margin-bottom:8px;}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;border-radius:999px;border:none;cursor:pointer;font-weight:600;font-size:.95rem;text-decoration:none;}
.btn-primary{background:linear-gradient(180deg,#4a90e2,#2e5c8a);color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.25);}
.btn-primary:hover{background:linear-gradient(180deg,#3a7bc2,#1e4a6a);}
.btn-secondary{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.7);color:#fff;}
.section h1,.section h2{margin-top:0;}
.note{font-size:.9rem;color:#666;margin-top:10px;}
.why-grid{gap:32px;}
.why-card{background:#fff;border-radius:0;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.12);transition:transform .3s,box-shadow .3s;}
.why-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(0,0,0,.2);}
.why-img{height:210px;background-size:cover;background-position:center;transition:transform .4s;}
.why-card:hover .why-img{transform:scale(1.1);}
.why-card h3{padding:18px 18px 6px;margin:0;}
.why-card p{padding:0 18px 20px;margin:0;font-size:.95rem;color:#555;}
.step-list{padding-left:20px;}
.step-list li{margin-bottom:6px;}
.faq-list{display:grid;gap:22px;}
.faq-item h2{margin-bottom:6px;font-size:1.1rem;}
.faq-item p{margin:0;font-size:.95rem;color:#555;}
.contact-form{display:flex;flex-direction:column;gap:12px;}
.contact-form label{display:flex;flex-direction:column;font-size:.95rem;gap:4px;}
.contact-form input,.contact-form textarea{padding:9px 10px;border-radius:6px;border:1px solid #ccc;font:inherit;}
.site-footer{background:#0b0f26;color:#c6c8e8;margin-top:40px;padding:32px 0 16px;}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;font-size:.9rem;}
.site-footer h3,.site-footer h4{margin-top:0;color:#fff;}
.footer-bottom{margin-top:18px;border-top:1px solid rgba(255,255,255,.08);padding-top:10px;}
.footer-bottom-inner{font-size:.8rem;color:#9093c4;}
.site-footer a{color:#f1f3ff;}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:rgba(11,15,38,.98);color:#f5f6ff;padding:10px 0;z-index:50;}
.cookie-banner-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;}
.cookie-banner-buttons{display:flex;gap:8px;}
.cookie-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:98;}
.cookie-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;z-index:99;}
.cookie-modal-inner{background:#fff;border-radius:14px;padding:24px 24px 18px;max-width:480px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.35);}
.cookie-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.cookie-more{font-size:.85rem;color:#555;}
@media(max-width:720px){.header-inner{flex-direction:column;align-items:flex-start;}.main-nav{flex-wrap:wrap;}.hero-content{padding:60px 0;}.cookie-banner-inner{flex-direction:column;align-items:flex-start;}}

/* NEW COOKIE SYSTEM */
#cookie-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(2px);
    z-index: 9998;
    display: none;
}

#cookie-box {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #ffffff;
    padding: 26px;
    width: 90%;
    max-width: 420px;
    border-radius: 14px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.35);
    z-index: 9999;
    display: none;
}

.cookie-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.cookie-btn {
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    font-weight: 600;
}

.cookie-btn.primary {
    background: linear-gradient(180deg,#4a90e2,#2e5c8a);
    color: #fff;
}

.cookie-btn.secondary {
    background: #e5e5e5;
    color: #000;
}

.cookie-footer {
    margin-top: 12px;
    font-size: 0.9rem;
    color: #666;
}

.transparency-block {
    background: #f8f9fa;
    border-left: 4px solid #4a90e2;
    padding: 20px 24px;
    margin-bottom: 24px;
    border-radius: 6px;
}

.transparency-block h2 {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 1.3rem;
}

.transparency-block p {
    margin: 0;
    color: #444;
}

.content-image {
    width: 100%;
    max-width: 600px;
    margin: 24px auto;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.image-caption {
    text-align: center;
    font-size: 0.9rem;
    color: #666;
    margin-top: 8px;
    margin-bottom: 24px;
}

