
:root{--navy:#062f61;--navy2:#001e46;--gold:#e5a51a;--ink:#082d5a;--soft:#f6f7f9}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#111;background:#fff}
a{color:inherit}
.hero-art{position:relative;line-height:0;background:#fff}
.hero-art picture,.hero-art img{display:block;width:100%;height:auto}
.hero-link{position:absolute;display:block;background:transparent;border-radius:8px;z-index:5}
.hero-link:focus,.hero-link:hover{outline:3px solid rgba(229,165,26,.75);outline-offset:-3px}
.hero-link.resume{left:7.55%;top:84.90%;width:20.45%;height:10.10%}
.hero-link.story{left:34.55%;top:84.90%;width:29.95%;height:10.10%}
.hero-link.contact{left:71.05%;top:84.90%;width:20.45%;height:10.10%}
.why{max-width:1220px;margin:auto;padding:28px 30px 18px}
.why h2{text-align:center;color:var(--ink);font-size:25px;margin:0}
.gold-line{width:58px;height:3px;background:var(--gold);margin:12px auto 22px}
.story-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:75px;align-items:center;max-width:1040px;margin:auto}
.story-copy{font-size:15px;line-height:1.45}
.story-copy p{margin:0 0 18px}
.story-grid img{width:100%;height:242px;object-fit:cover;border-radius:14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.cards article{background:var(--soft);border-radius:12px;padding:18px 22px;display:flex;gap:16px;min-height:126px}
.circle{width:66px;height:66px;flex:0 0 66px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:34px}
.circle-svg{width:38px;height:38px;display:block;color:#fff}
.cards h3{font-size:15px;color:var(--ink);margin:4px 0 8px}
.cards p{font-size:12px;line-height:1.45;margin:0}
.closing{background:linear-gradient(90deg,var(--navy),var(--navy2));color:#fff;display:flex;align-items:center;justify-content:center;gap:22px;padding:14px 20px;text-align:center}
.closing span{font-size:44px;color:var(--gold)}
.closing p{font-size:17px;line-height:1.4;margin:0}
footer{display:flex;justify-content:space-around;gap:18px;align-items:center;padding:18px 30px;font-size:12px;color:#21334a;flex-wrap:wrap}
footer a{text-decoration:none}
.page{max-width:760px;margin:auto;padding:60px 24px;color:#082d5a}
.back{display:inline-block;margin-bottom:25px;color:#082d5a;text-decoration:none}
.page h1{font-size:42px;margin:0 0 18px}
.contact-card{background:#f6f7f9;border-radius:14px;padding:28px;font-size:20px;line-height:2}
.contact-card a{text-decoration:none}
@media(max-width:780px){
  .hero-link.resume{left:6.9%;top:67.45%;width:86.2%;height:8.85%}
  .hero-link.story{left:6.9%;top:79.95%;width:86.2%;height:8.85%}
  .hero-link.contact{left:6.9%;top:92.45%;width:86.2%;height:7.15%}
  .why{padding:22px 18px}
  .why h2{font-size:22px}
  .story-grid{grid-template-columns:1fr;gap:16px}
  .story-grid img{height:190px;order:-1}
  .cards{grid-template-columns:1fr}
  .cards article{min-height:auto}
  .closing p{font-size:14px}
  footer{flex-direction:column;padding:18px}
}
