:root{
  --accent:#0b1e33;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;color:#222;background:#fff;line-height:1.6;}
a{color:var(--accent);text-decoration:none;font-weight:500;}
header.hero{padding:80px 20px;text-align:center;border-bottom:1px solid #eee;}
.hero h1{font-size:48px;font-weight:700;margin-bottom:8px;color:var(--accent);}
.tagline{font-size:18px;margin-bottom:20px;color:#555;}
header nav a{margin:0 8px;font-size:14px;}
main{max-width:840px;margin:0 auto;padding:40px 20px;}
section{margin-bottom:60px;}
h2{font-size:28px;font-weight:600;margin-bottom:20px;color:var(--accent);}
article{margin-bottom:20px;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
figure{border:1px solid #eee;border-radius:6px;overflow:hidden;}
figure img{width:100%;display:block;}
figcaption{padding:8px 12px;font-size:14px;background:#f9f9f9;}
footer{text-align:center;padding:30px 10px;font-size:14px;color:#888;border-top:1px solid #eee;}
@media(max-width:600px){
  .hero h1{font-size:32px;}
  .tagline{font-size:16px;}
}

.breadcrumb{display:inline-block;margin-top:20px;color:var(--accent);} .breadcrumb:hover{text-decoration:underline;}
.grid figure img{height:180px;object-fit:cover;width:100%;}
.flow-img{display:block;margin:40px auto;width:60%;max-width:600px;height:auto;border:1px solid #eee;border-radius:6px;}
@media(max-width:700px){.flow-img{width:90%;max-width:90%;}}
.flow-fig figcaption{text-align:center;font-size:14px;color:#555;margin-top:8px;}

hr.divider{width:60%;max-width:600px;margin:60px auto;border:none;border-top:1px solid #ccc;}
@media(max-width:700px){hr.divider{width:90%;max-width:90%;}}