:root { --navy: #24478c; --gold: #b8913f; --ink: #222; --muted: #666; --bg: #f7f5f0; }
* { box-sizing: border-box; }
body { margin: 0; font-family: Georgia, "Times New Roman", serif; color: var(--ink); background: var(--bg); line-height: 1.6; }
a { color: var(--navy); }
header, main, footer { max-width: 1040px; margin: 0 auto; padding: 0 16px; }
header { text-align: center; padding-top: 48px; }
header .brand { font-size: 2.4rem; color: var(--navy); text-decoration: none; letter-spacing: .04em; }
header p { color: var(--muted); margin: .4rem 0 0; font-size: 1.1rem; }
nav { margin-top: 1rem; font-family: Arial, sans-serif; font-size: .95rem; }
nav a { margin: 0 .7rem; text-decoration: none; }
nav a:hover { text-decoration: underline; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; margin: 48px 0; }
.tile { display: flex; flex-direction: column; align-items: center; background: #fff; border: 1px solid #e3ddd0; border-top: 4px solid var(--gold);
        border-radius: 6px; padding: 32px 20px; text-decoration: none; color: var(--ink); transition: transform .15s, box-shadow .15s; }
.tile:hover, .tile:focus-visible { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(36, 71, 140, .15); }
.tile img { height: 150px; width: auto; max-width: 100%; object-fit: contain; }
.tile h2 { font-size: 1.25rem; color: var(--navy); margin: 1rem 0 .3rem; text-align: center; }
.tile span { font-family: Arial, sans-serif; font-size: .9rem; color: var(--muted); }
.phone { text-align: center; font-size: 1.3rem; margin-bottom: 48px; }
.phone a { text-decoration: none; font-weight: bold; }
.page { background: #fff; border: 1px solid #e3ddd0; border-radius: 6px; padding: 24px 32px; margin: 40px 0; }
.page h1 { color: var(--navy); margin-top: 0; }
footer { text-align: center; font-family: Arial, sans-serif; font-size: .85rem; color: var(--muted); padding-bottom: 32px; }
@media (max-width: 600px) { header .brand { font-size: 1.8rem; } .page { padding: 16px; } }