* { margin:0; padding:0; box-sizing:border-box; font-family:'Segoe UI', Arial, sans-serif; }
body { background:#f6f8f9; color:#1d2b36; line-height:1.55; }
a { color:#136a8a; }
.topbar { background:#0e3a4d; color:#fff; padding:14px 48px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.logo { font-size:24px; font-weight:700; letter-spacing:.3px; color:#fff; text-decoration:none; }
.logo span { color:#ffd166; }
nav a { color:#cfe3ec; text-decoration:none; margin-left:26px; font-size:15px; }
nav a:hover { color:#fff; }
.hero { background:linear-gradient(160deg,rgba(14,58,77,.88) 0%,rgba(19,106,138,.72) 55%,rgba(31,158,155,.55) 100%), url('img/hero-wise.jpg') center/cover; color:#fff; padding:64px 48px 92px; position:relative; overflow:hidden; }
.hero h1 { font-size:44px; max-width:640px; line-height:1.15; }
.hero p { margin-top:16px; font-size:18px; max-width:560px; color:#dceef5; }
.hero .cta { margin-top:28px; display:inline-block; background:#ffd166; color:#0e3a4d; font-weight:700; padding:14px 28px; border-radius:8px; text-decoration:none; font-size:16px; }
.chips { margin-top:22px; font-size:13px; color:#bfe0ea; }
.chips b { color:#fff; }
.wave { position:absolute; bottom:-2px; left:0; width:100%; }
.wrap { max-width:1160px; margin:0 auto; padding:0 24px; }
h2 { font-size:26px; margin-bottom:6px; }
.sub { color:#5b7180; font-size:15px; margin-bottom:24px; }
.section { padding:56px 0 8px; }
.cards { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.card { background:#fff; border:1px solid #e2eaee; border-radius:12px; overflow:hidden; box-shadow:0 1px 3px rgba(14,58,77,.06); text-decoration:none; color:inherit; display:block; }
.card:hover { box-shadow:0 4px 14px rgba(14,58,77,.12); }
.card .img { height:150px; background-size:cover; background-position:center; }
.card .body { padding:16px 18px 20px; }
.card h3 { font-size:17px; margin-bottom:6px; color:#0e3a4d; }
.card p { font-size:13.5px; color:#5b7180; line-height:1.45; }
.affcards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.aff { background:#fff; border:1px solid #e2eaee; border-radius:12px; padding:22px; position:relative; box-shadow:0 1px 3px rgba(14,58,77,.06); }
.badge { position:absolute; top:14px; right:14px; background:#eef3f5; border:1px solid #d3dee3; color:#5b7180; font-size:11px; padding:3px 8px; border-radius:20px; text-transform:uppercase; letter-spacing:.5px; }
.aff h3 { font-size:18px; margin-bottom:6px; }
.aff p { font-size:13.5px; color:#5b7180; line-height:1.5; }
.fineprint { font-size:12px; color:#8499a4; margin-top:14px; }
.sponsor { margin:56px 0 8px; background:#fff; border:1.5px dashed #b9c9d1; border-radius:12px; padding:34px; text-align:center; color:#7a8f9a; position:relative; }
.sponsor .badge { top:12px; right:12px; }
.sponsor h3 { color:#43586380; font-size:18px; font-weight:600; }
.sponsor p { font-size:13px; margin-top:6px; }
.fb { margin-top:56px; background:#fff; border:1px solid #e2eaee; border-radius:14px; padding:34px 40px; display:flex; align-items:center; justify-content:space-between; box-shadow:0 1px 3px rgba(14,58,77,.06); flex-wrap:wrap; gap:16px; }
.fb .left { display:flex; align-items:center; gap:18px; }
.fb .icon { width:52px; height:52px; border-radius:50%; background:#1877f2; color:#fff; display:flex; align-items:center; justify-content:center; font-size:26px; font-weight:800; font-family:Arial; flex-shrink:0; }
.fb h3 { font-size:20px; }
.fb p { color:#5b7180; font-size:14px; margin-top:5px; }
.fb .btn { background:#1877f2; color:#fff; padding:13px 26px; border-radius:8px; text-decoration:none; font-weight:700; font-size:15px; white-space:nowrap; }
.news { margin-top:56px; background:#0e3a4d; border-radius:14px; color:#fff; padding:36px 40px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.news h3 { font-size:22px; }
.news p { color:#bfe0ea; font-size:14px; margin-top:6px; }
.news .form { display:flex; gap:10px; }
.news input { padding:12px 16px; border-radius:8px; border:none; width:240px; font-size:14px; }
.news button { padding:12px 20px; border-radius:8px; border:none; background:#ffd166; font-weight:700; color:#0e3a4d; font-size:14px; cursor:pointer; }
footer { margin-top:64px; background:#0a2c3b; color:#9fb9c4; padding:28px 48px; display:flex; justify-content:space-between; font-size:13px; flex-wrap:wrap; gap:10px; }
footer b { color:#fff; }
footer a { color:#9fb9c4; text-decoration:none; margin-left:14px; }
footer a:hover { color:#fff; }
.page { max-width:860px; margin:0 auto; padding:48px 24px 24px; }
.page h1 { font-size:34px; color:#0e3a4d; margin-bottom:8px; }
.page .intro { color:#5b7180; font-size:16px; margin-bottom:28px; }
.page h2 { font-size:22px; color:#0e3a4d; margin:32px 0 10px; }
.page p, .page li { font-size:15.5px; color:#2b3d49; margin-bottom:12px; }
.page ul { padding-left:22px; }
.page table { width:100%; border-collapse:collapse; margin:16px 0 24px; background:#fff; border:1px solid #e2eaee; border-radius:10px; overflow:hidden; font-size:14.5px; }
.page th { background:#0e3a4d; color:#fff; text-align:left; padding:10px 14px; }
.page td { padding:9px 14px; border-top:1px solid #e8eff2; }
.page tr:nth-child(even) td { background:#f2f6f8; }
.pageimg { width:100%; border-radius:12px; margin:10px 0 20px; }
.note { background:#fff8e6; border:1px solid #f0dfae; border-radius:10px; padding:14px 18px; font-size:14px; color:#6b5d2e; margin:18px 0; }
@media (max-width:900px) { .cards,.affcards { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .cards,.affcards { grid-template-columns:1fr; } .hero h1 { font-size:32px; } nav a { margin-left:14px; font-size:14px; } .topbar { padding:12px 20px; } .hero { padding:44px 20px 80px; } }
