:root{
  --navy:#1a2b4d; --ink:#1b1f24; --muted:#6b7280; --surface:#f5f7fb; --border:#e5e7eb; --bg:#ffffff;
  --maxw:1080px; --pad:18px; --gap:22px; --header-h:74px;
  --mail:#0b3c91; --tel:#0b5fff;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--ink); line-height:1.7; background:#fff;}
img{max-width:100%; display:block;}
a{color:var(--navy); text-decoration:none;} a:hover{text-decoration:underline;}
.header{position:sticky; top:0; background:#fff; border-bottom:1px solid var(--border); z-index:10;}
.navbar{max-width:var(--maxw); margin:0 auto; padding:14px var(--pad);
  display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center;}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:48px; width:auto;}
.nav{display:flex; align-items:center; gap:12px; justify-content:center;}
.nav a{color:var(--ink); font-weight:700; padding:8px 10px; border-radius:8px;}
.nav a:hover{background:var(--surface); text-decoration:none;}
@media (max-width:860px){ .nav{flex-wrap:wrap; justify-content:center;} .nav a{padding:6px 8px;} }
section[id]{scroll-margin-top: calc(var(--header-h) + 12px);}
.container{max-width:var(--maxw); margin:0 auto; padding:32px var(--pad);}
.section{margin-top:40px;}
h1,h2,h3{line-height:1.25; margin:0 0 10px 0;}
h1{font-size:clamp(28px,3.2vw,42px); color:var(--navy);}
h2{font-size:clamp(22px,2.6vw,28px); border-left:4px solid var(--navy); padding-left:10px; color:var(--navy);}
h3{font-size:18px; color:var(--ink);}
p.lead{font-size:18px; color:var(--muted); margin-top:-4px;}
small.muted{color:var(--muted);}
.hero{display:grid; grid-template-columns:260px 1fr; gap:28px; align-items:start;}
@media (max-width:820px){ .hero{grid-template-columns:1fr; gap:18px;} }
.photo{border-radius:14px; overflow:hidden; border:1px solid var(--border); background:#fff;}
.badges{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 16px 0;}
.badge{background:var(--surface); color:var(--ink); border:1px solid var(--border); padding:6px 10px; border-radius:999px; font-size:13px; font-weight:700;}
blockquote{background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--navy); border-radius:10px; padding:14px 16px; margin:10px 0;}
.card{background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px;}
ul.clean{padding-left:18px; margin:0;}
ul.clean li{margin:8px 0;}
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.gallery figure{margin:0; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:#fff;}
.gallery img,.gallery video{width:100%; height:auto; display:block;}
@media (max-width:980px){ .gallery{grid-template-columns:1fr 1fr;} }
@media (max-width:640px){ .gallery{grid-template-columns:1fr;} }
.timeline{display:grid; gap:14px;}
.period{display:grid; grid-template-columns:160px 1fr; gap:16px; align-items:start; background:#fff; border:1px solid var(--border); border-radius:14px; padding:14px;}
.period .when{background:#eef2f9; border:1px solid #d6dfef; border-left:4px solid var(--navy); border-radius:10px; padding:10px 12px; font-weight:900; color:#1a2b4d; text-align:center;}
@media (max-width:700px){ .period{grid-template-columns:1fr;} .period .when{text-align:left;} }
.footer-contact{background:linear-gradient(0deg, #f8faff 0%, #ffffff 100%); border-top:1px solid var(--border);}
.footer-grid{max-width:var(--maxw); margin:0 auto; padding:28px var(--pad); display:grid; grid-template-columns:1fr; gap:20px; align-items:start;}
.footer-card{background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px;}
.contact .cta{font-weight:900; margin:6px 0 8px;}
.contact a.mail{color:var(--mail); font-weight:900; font-size:1.1em;}
.contact a.tel{color:var(--tel); font-weight:900; font-size:1.1em;}
footer{padding:16px var(--pad); text-align:center; color:var(--muted); border-top:1px solid var(--border);}