:root{ --bg:#0a0b0d; --panel:#121418; --muted:#9aa3b2; --brand:#f5c242; --brand2:#f0a500; --text:#f8fafc; }
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:Outfit,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1200px,92vw);margin-inline:auto}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.1rem;border-radius:14px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#1b1200;font-weight:700;border:none;cursor:pointer;box-shadow:0 10px 30px #0006;transition:transform .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn.secondary{background:#1f2937;color:#fff;border:1px solid #2b3342}
.tag{display:inline-block;padding:.25rem .6rem;border:1px solid #2b3342;border-radius:999px;color:var(--muted);font-size:.8rem}
header{position:sticky;top:0;z-index:100;backdrop-filter:blur(6px);background:linear-gradient(180deg,#0a0b0dea,#0a0b0d00)}
nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo img{width:220px;filter:drop-shadow(0 6px 14px #0009)}
.lang{position:relative; display:flex; align-items:center; gap:.6rem}
.lang .flag-btn{width:44px;height:44px;border-radius:12px;background:#1c2028;border:1px solid #2b3342;display:flex;align-items:center;justify-content:center;cursor:pointer}
.lang .flag-btn img{width:26px;height:18px;display:block}
.lang .menu{position:absolute;right:0;top:52px;background:#0e121a;border:1px solid #20283a;border-radius:12px;box-shadow:0 16px 36px #000b;padding:8px;display:none}
.lang .menu.open{display:block}
.lang .menu button{display:flex;gap:8px;align-items:center;width:100%;padding:8px 10px;border:none;background:transparent;color:#e8eefc;border-radius:8px;cursor:pointer}
.lang .menu button:hover{background:#141923}
.lang .menu img{width:22px;height:16px}

/* Hero */
.hero{position:relative;min-height:72vh;display:flex;align-items:center;overflow:hidden}
.hero video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%,-50%);z-index:-2;filter:brightness(.35)}
.hero .overlay{position:absolute;inset:0;background:radial-gradient(1000px 400px at 70% -10%,#fff2 0,#0000 70%),radial-gradient(800px 400px at 30% -10%,#f5c24220 0,#0000 70%);z-index:-1}
.grid{display:grid;gap:24px}
.hero-wrap{padding:12vh 0 6vh}
.hero h1{font-size:clamp(32px,5vw,56px);line-height:1.05;margin:0 0 10px}
.lead{font-size:clamp(16px,2.2vw,22px);color:#d1d7e6;max-width:52ch}
.kpi{display:flex;gap:18px;margin-top:16px;flex-wrap:wrap}
.kpi .chip{background:#0f1220;border:1px solid #202635;padding:.55rem .8rem;border-radius:12px;color:#cdd6f4}

section{padding:64px 0;border-top:1px solid #151a22}
h2{font-size:clamp(26px,3.2vw,34px);margin:0 0 16px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.card{background:linear-gradient(180deg,#121418,#0f1217);border:1px solid #1a2130;border-radius:18px;padding:18px;box-shadow:0 12px 24px #0006}
.card h3{margin:6px 0 8px;font-size:1.1rem}
.card p{color:#c7cfdd}

.process{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.step{padding:16px;border:1px dashed #2a3242;border-radius:16px}

.faq details{background:#0f1320;border:1px solid #20283a;border-radius:16px;padding:14px}
.faq summary{cursor:pointer;font-weight:600}
.faq p{color:#cbd5e1}

footer{padding:40px 0;color:#a5adbd}

/* WhatsApp floating button: official style */
.wa{position:fixed;right:18px;bottom:18px;z-index:99}
.wa a{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#25D366,#128C7E);border:none;box-shadow:0 16px 34px rgba(0,0,0,.35)}
.wa a svg{width:40px;height:40px;fill:#fff}
.wa a:hover{transform:scale(1.06)}

/* Contact */
.contact{background:linear-gradient(180deg,#0b0c10,#0b0c10)}
form{display:grid;gap:12px;grid-template-columns:1fr 1fr}
form input, form textarea, form select{background:#0e121a;color:#e8eefc;border:1px solid #20283a;border-radius:12px;padding:.9rem;font-size:1rem}
form textarea{grid-column:1/-1;min-height:120px}
form button{grid-column:1/-1}
.legal{font-size:.85rem;color:#9aa3b2}

/* Cookie widget bottom-left */
.cookie-fab{position:fixed;left:18px;bottom:18px;width:56px;height:56px;border-radius:50%; background:rgba(20,24,32,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 28px #0009;display:flex;align-items:center;justify-content:center; z-index:120;cursor:pointer;transition:transform .15s ease, box-shadow .2s ease}
.cookie-fab:hover{transform:translateY(-2px);box-shadow:0 16px 36px #000a}
.cookie-fab img{width:28px;height:28px}
.cookie-card{position:fixed;left:18px;bottom:86px;max-width:360px;background:rgba(20,24,32,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08); color:#e8eefc;border-radius:14px;box-shadow:0 18px 50px #000b;padding:14px 14px;z-index:121;display:none;opacity:0;transform:translateY(8px)}
.cookie-card.show{display:block;animation:fadeInUp .25s ease forwards}
.cookie-card h4{margin:0 0 6px;font-size:1rem}
.cookie-card p{margin:0 0 10px;color:#cbd5e1}
.cookie-card .row{display:flex;gap:8px;justify-content:flex-end}
.cookie-card button{padding:.6rem .9rem;border-radius:10px;border:1px solid #2b3342;background:#1c2028;color:#fff;cursor:pointer}
.cookie-card .accept{background:linear-gradient(135deg,var(--brand),var(--brand2));border:none;color:#1b1200;font-weight:700}

@keyframes fadeInUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* Responsive */
@media (max-width:1024px){ .logo img{width:180px} }
@media (max-width:768px){ form{grid-template-columns:1fr} form button{grid-column:1/-1} }
@media (max-width:640px){
  nav{padding:10px 0}
  .logo img{width:140px}
  .btn{padding:.8rem 1rem}
  .lang .flag-btn{width:40px;height:40px}
  .hero-wrap{padding:10vh 0 5vh}
  .hero h1{font-size:clamp(28px,8vw,40px)}
  .wa a{width:64px;height:64px}
  .wa a svg{width:32px;height:32px}
}


/* Fallback when video is missing or blocked */
.hero.no-video{
  background-image:url('/assets/images/hero-fallback.jpg');
  background-size:cover;
  background-position:center;
}


/* v14: accreditation row */
.accred{display:flex;gap:12px;align-items:center;margin-top:14px;flex-wrap:wrap}
.accred span{font-weight:600;color:#e9edf7}
.accred img{height:28px;width:auto;display:block}
@media (max-width:640px){ .accred{gap:10px} .accred img{height:24px} }

/* v14: bigger header logo */
.logo img{width:260px}
@media (max-width:1024px){ .logo img{width:200px} }
@media (max-width:640px){ .logo img{width:150px} }


/* v15 footer badge */
.footer-badge{margin-top:18px;display:flex;align-items:center;gap:10px;opacity:.95}
.footer-badge img{height:24px;width:auto}
.footer-badge span{font-size:.95rem;color:#e9edf7}
@media (max-width:640px){ .footer-badge{flex-wrap:wrap} .footer-badge img{height:22px} }
body{background-image:none !important;}


/* v16 - Hero spacing tweaks */
.hero-wrap .tag{margin-bottom:12px}
.hero h1{margin-bottom:14px}
.hero .lead{margin-top:10px;margin-bottom:18px}
.kpi{margin-top:18px;margin-bottom:14px}
.accred{margin-top:14px;margin-bottom:18px}

/* v16 - Accreditation pill style */
.accred{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.accred .pill{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;border-radius:14px;
  background:linear-gradient(180deg,#12161f,#0e121a);
  border:1px solid #1f2735; box-shadow:0 8px 18px rgba(0,0,0,.25);
}
.accred .pill span{font-weight:700;color:#e9edf7;letter-spacing:.1px}
.accred .pill img{height:36px;width:auto;display:block;filter:drop-shadow(0 3px 8px rgba(0,0,0,.35))}
@media (max-width:640px){
  .accred .pill{padding:8px 12px}
  .accred .pill img{height:28px}
}

/* v16 - Slide-in from right for ministry logo */
@keyframes slideInRight {
  0% { transform: translateX(24px); opacity: 0; }
  100%{ transform: translateX(0);   opacity: 1; }
}
.accred .pill img.animate-from-right{
  animation: slideInRight .6s ease-out .15s both;
}


/* v17 - Service cards with images */
.service-card{padding:0;overflow:hidden}
.service-card .service-img{width:100%;height:220px;object-fit:cover;display:block}
.service-card h3{padding:14px 16px 6px}
.service-card p{padding:0 16px 18px;color:#c7cfdd}
.cards{gap:22px}