/* assets/css/style.css */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;600;700&display=swap');
html, body{ font-family: 'Source Sans 3', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-size:18px; color:#0f172a; margin:0; padding:0; }
a{ text-decoration:none; color:#0ea5e9; }
h1,h2,h3{ margin:0 0 10px; line-height:1.2; }

/* Layout */
.nav{ position:sticky; top:0; z-index:50; background:#111827; color:#fff; box-shadow:0 1px 0 rgba(255,255,255,.06); }
.nav .wrap{ max-width:1100px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:10px 16px; }
.nav .brand{ font-weight:700; font-size:22px; letter-spacing:.3px; }
.nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:18px; }
.nav a{ color:#cbd5e1; font-weight:600; }
.nav a:hover, .nav a.active{ color:#fff; }

.hero{ position:relative; min-height:80vh; display:flex; align-items:center; justify-content:center; color:#fff; background:url('../img/hero.jpg') center/cover fixed; }
.hero::after{ content:''; position:absolute; inset:0; background:rgba(0,0,0,.55); }
.hero .inner{ position:relative; z-index:2; text-align:center; max-width:900px; padding:20px; }
.hero h1{ font-size: clamp(36px, 6vw, 72px); font-weight:700; }
.hero p{ font-size: clamp(18px, 2.4vw, 24px); margin-top:16px; }
.hero .cta { display:inline-block; margin-top:28px; padding:12px 22px; border:2px solid #fff; color:#fff; border-radius:6px; font-weight:600; }
.hero .cta:hover{ background:#fff; color:#0f172a; }

.section{ max-width:1100px; margin:0 auto; padding:64px 16px; }
.section.center{ text-align:center; }
.section h2{ font-size: clamp(28px, 4vw, 42px); margin-bottom:12px; }
.section .lead{ color:#334155; max-width:860px; margin:0 auto 24px; }
.grid3{ display:grid; grid-template-columns: repeat(3, 1fr); gap:20px; }
.card{ background:#fff; border:1px solid #e2e8f0; border-radius:10px; padding:22px; box-shadow:0 1px 2px rgba(2,6,23,0.04); }
.card h3{ margin-top:6px; font-size:20px; }
.card p{ color:#475569; font-size:16px; }

/* Forms */
.form{ max-width:520px; margin:0 auto; }
.form .row{ margin-bottom:14px; }
.input, .select, .textarea{ width:100%; padding:12px 14px; border:1px solid #cbd5e1; border-radius:8px; font-size:16px; background:#fff; color:#0f172a; }
.textarea { width: 100%; min-height: 120px; padding: 12px 14px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #0f172a; font-family: 'Source Sans 3', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-size: 16px; -webkit-font-smoothing: antialiased; }
.btn{ display:inline-block; padding:12px 16px; border-radius:8px; background:#0ea5e9; color:#fff; font-weight:700; border:none; cursor:pointer; }
.btn.secondary{ background:#334155; }
.btn.link{ background:transparent; color:#0ea5e9; padding:0; }
.alert{ padding:12px 14px; border-radius:8px; margin-bottom:16px; font-size:15px; }
.alert.success{ background:#ecfdf5; color:#065f46; border:1px solid #34d399; }
.alert.error{ background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.small{ font-size:14px; color:#64748b; }
.table{ width:100%; border-collapse:collapse; margin-top:12px; }
.table th, .table td{ padding:10px; border-bottom:1px solid #e2e8f0; text-align:left; font-size:15px; }

/* Tabs for portal page */
.tabs{ width:100%; }
.tab-links{ display:flex; gap:8px; border-bottom:1px solid #e2e8f0; margin-bottom:16px; }
.tab-link{ appearance:none; border:none; background:#f8fafc; color:#334155; padding:10px 14px; border-radius:8px 8px 0 0; font-weight:700; cursor:pointer; }
.tab-link.active{ background:#0ea5e9; color:#fff; }
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }

/* Contact */
.contact-card{ max-width:700px; margin:0 auto; }

/* Footer */
.footer{ background:#111827; color:#94a3b8; padding:28px 16px; text-align:center; }
.footer a{ color:#e2e8f0; }

@media (max-width: 900px){ .grid3{ grid-template-columns: 1fr; } }