*{box-sizing:border-box}
html,body{height:100%; overflow-x:hidden;}
body{
  margin:0;
  font-family:'Rubik',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.55;
}
h1, h2, h3, h4, h5, h6, .logo-mark, .nav-links a, .btn {
  font-family: 'Poppins', sans-serif;
}
img,video,canvas,svg{max-width:100%;display:block}
iframe{max-width:100%}
video{height:auto}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
button,input,textarea,select{font:inherit}
button{touch-action:manipulation}
*:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* Prevent long strings/URLs from breaking layout */
p,li,h1,h2,h3,h4,h5,h6{overflow-wrap:anywhere;word-break:break-word}

.container{max-width:var(--container);margin:0 auto;padding:0 18px}
.section{padding:56px 0}
.section.alt{background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
.section-title{letter-spacing:.5px;text-transform:uppercase;margin:0 0 14px;font-size:14px;color:var(--brand); font-weight:700;}
.muted{color:var(--muted)}
.small{font-size:12px}
.center{display:flex;justify-content:center;margin-top:18px}

.card{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:24px;
  box-shadow:var(--shadow);
  transition: transform 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
}
.card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-hover);
}
.prose p{margin:0 0 12px; color:var(--muted);}
.prose h2,.prose h3{margin:0 0 10px; color:var(--text);}
.prose ol{margin:0 0 12px;padding-left:18px; color:var(--muted);}
.prose li{margin:6px 0}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.cards.tight{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.grid-2 > *,
.cards > *{min-width:0}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 24px;
  border-radius:var(--radius-sm);
  border:1px solid transparent;
  font-weight:600;
  cursor:pointer;
  transition:transform 0.4s ease, background 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  user-select:none;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--brand);color:#fff;}
.btn-primary:hover{background:var(--brand-2);}
.btn-primary:focus-visible,.btn-secondary:focus-visible,.btn-outline:focus-visible{outline:2px solid var(--brand); outline-offset:2px;}
.btn-secondary{background:var(--surface); color:var(--text); border-color:var(--border);}
.btn-secondary:hover{background:#E0E0E0;}
.btn-outline{background:transparent; border-color:var(--brand); color:var(--brand);}
.btn-outline:hover{background:var(--brand); color:#fff;}
.btn-sm{padding:8px 16px;font-size:13px}
.link{color:var(--brand);font-weight:600; transition:color 0.4s ease;}
.link:hover{color:var(--brand-2);}

/* Navbar */
.navbar{
  position:sticky;top:0;z-index:20;
  background:rgba(255, 255, 255, 0.98);
  border-bottom:1px solid var(--border);
  backdrop-filter: blur(12px);
}
.nav-container{display:flex;align-items:center;justify-content:space-between;min-height:80px;gap:12px;flex-wrap:nowrap;position:relative;}
.nav{
  margin-left:auto;
  min-width:0;
}
.logo{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
  min-width:0;
}
.logo-text{min-width:0}
.logo img {
  height: 46px;
  width: 46px;
  border-radius: 50%;
  object-fit: cover;
}
.logo-text { display:flex; flex-direction:column; }
.logo-mark{font-weight:700;letter-spacing:.5px; font-size:1.2rem; color:var(--brand);}
.logo-sub{font-size:11px;color:var(--muted);line-height:1.2; text-transform:uppercase; letter-spacing:0.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;}

.nav-links{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
  margin-left:auto;
  max-width:100%;
}
.nav-links li{max-width:100%}
.nav-links a{
  padding:9px 12px;
  border-radius:var(--radius-sm);
  white-space:nowrap;
  color:var(--text);
  font-weight:600;
  transition:color 0.4s ease, background 0.4s ease;
  line-height:1.2;
}
.nav-links a:hover{color:var(--brand-2);}
.nav-links a.active{color:var(--brand);}
.menu-toggle{display:none;background:var(--brand);color:#fff;border:none;border-radius:var(--radius-sm);padding:8px 12px; font-size:1.2rem; cursor:pointer;align-items:center;justify-content:center;min-width:44px;min-height:44px;flex-shrink:0;margin-left:auto;position:relative;z-index:25;}
.nav-cta .btn{padding:9px 14px;font-size:14px;}

.dropdown{position:relative}
.dropdown-menu{
  position:absolute;top:44px;left:0;min-width:220px;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:8px;
  box-shadow:var(--shadow-hover);
  display:none;
}
.dropdown-menu a{display:block;padding:10px 14px}
.dropdown.open>.dropdown-menu{display:block; animation:fadeUp 0.3s ease forwards;}

body.menu-open{overflow:hidden}

.card img,
.prose img{
  width:100%;
  height:auto;
  object-fit:cover;
}

.card h3,
.card p,
.card a{
  max-width:100%;
}

/* Hero */
.hero{
  padding:90px 0 70px;
  background: linear-gradient(rgba(249, 249, 249, 0.92), rgba(249, 249, 249, 0.96)), url('../assets/images/WhatsApp Image 2026-03-03 at 10.47.47 PM.jpeg') center/cover;
  border-bottom:1px solid var(--border);
}
.hero-content{max-width:860px;}
.eyebrow{color:var(--brand);margin:0 0 12px; font-weight:600; text-transform:uppercase; letter-spacing:1px; font-size:14px;}
.hero h1{margin:0 0 16px;font-size:54px;line-height:1.15; color:var(--brand);}
.lead{margin:0 0 24px;font-size:20px; color:var(--muted);}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px}

/* Page hero */
.page-hero{padding:34px 0;border-bottom:1px solid var(--border);background:var(--surface);}
.page-hero h1{margin:6px 0 0;font-size:32px; color:var(--text);}
.breadcrumb{margin:0;color:var(--muted);font-size:13px;overflow-wrap:anywhere}

/* Pills / split */
.split{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}
.pill{
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:12px 16px;
  background:var(--surface);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.pill strong{color:var(--text);}
.pill span{color:var(--muted);font-size:13px}

/* Form */
.form{display:grid;gap:16px}
.form label{display:grid;gap:8px; font-weight:600;}
.form span{font-size:13px;color:var(--muted); font-weight:400;}
.form input,.form textarea{
  width:100%;
  padding:14px;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  outline:none;
  font-family:inherit;
  transition:border-color 0.4s ease;
}
.form input[type="file"]{padding:10px}
.form input:focus,.form textarea:focus{border-color:var(--brand);}
.fieldset{border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px}
.fieldset legend{padding:0 8px;color:var(--text); font-weight:600;}
.radio{display:flex;gap:10px;align-items:center;margin:8px 0; font-weight:400;}

.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.chip{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:8px 16px;border-radius:999px;cursor:pointer; transition:all 0.4s ease;}
.chip:hover{background:var(--brand); color:#fff; border-color:var(--brand);}

/* Footer */
.footer{margin-top:0px; background:var(--surface-2); color:white;}
.footer-top{padding:24px 0;border-bottom:1px solid rgba(255,255,255,0.1)}
.quote{margin:0;color:white;font-weight:700}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;padding:48px 0}
.footer-links{display:grid;gap:12px}
.footer-links h4{ margin:0 0 8px; color:#fff; font-size:18px;}
.footer-links a{ color:#ccc; transition:color 0.4s ease;}
.footer-links a:hover{ color:var(--brand); }
.footer-contact{display:grid;gap:12px;margin-top:12px; color:#ccc;}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.1);padding:24px 0; color:#ccc; font-size:14px;}
.footer-bottom-inner{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}

/* Utilities */
.reveal{animation:fadeUp .6s ease-out both}
.text-center{text-align:center;}
.loading{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted);padding:24px;}
.spinner{width:18px;height:18px;border:3px solid var(--border);border-top-color:var(--brand);border-radius:50%;animation:spin 0.8s linear infinite;}
.empty{padding:24px;border:1px dashed var(--border);border-radius:var(--radius-sm);text-align:center;color:var(--muted);}

@keyframes spin{to{transform:rotate(360deg);}}

/* Language toggle */
.lang-toggle{
  position:fixed;
  right:16px;
  bottom:20px;
  z-index:30;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  font-weight:600;
  cursor:pointer;
  box-shadow:var(--shadow);
}
.lang-toggle:hover{background:#f1f1f1;}

.form-feedback{
  margin-top:12px;
  font-weight:600;
  font-size:14px;
}
.form-feedback--loading{color:var(--brand,#FF6300);}
.form-feedback--success{color:#198754;}
.form-feedback--error{color:#dc3545;}
