:root {
  --v: #181A2E;
  --vm: #252840;
  --d: #C07C3B;
  --c: #F8F6F2;
  --co: #ECEAE4;
  --b: rgba(24,26,46,0.1);
  --ts: rgba(24,26,46,0.45);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--c);color:var(--v);line-height:1.75;font-weight:300}

nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;height:72px;background:rgba(248,246,242,0.95);backdrop-filter:blur(16px);border-bottom:0.5px solid var(--b)}
.nav-logo{height:48px;width:auto}
.nav-links{display:flex;align-items:center;gap:2rem}
.nav-link{font-size:11px;letter-spacing:0.08em;color:var(--ts);text-decoration:none;font-weight:500;text-transform:uppercase;transition:color .2s}
.nav-link:hover,.nav-link.on{color:var(--v)}
.nav-btn{background:var(--v);color:var(--c);padding:10px 20px;font-family:'Montserrat',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;border:none;cursor:pointer;text-decoration:none;transition:background .2s}
.nav-btn:hover{background:var(--vm)}

.wrap{max-width:720px;margin:0 auto;padding:4rem 5vw 5rem}
.wrap-wide{max-width:900px;margin:0 auto;padding:4rem 5vw 5rem}

.eye{font-size:10px;letter-spacing:0.22em;color:var(--d);text-transform:uppercase;font-weight:600;font-family:'Montserrat',sans-serif;margin-bottom:1rem}
h1{font-family:'Montserrat',sans-serif;font-size:clamp(28px,4vw,42px);font-weight:800;line-height:1.1;letter-spacing:-0.02em;margin-bottom:1rem}
h1 em{font-style:normal;color:var(--d)}
.meta{font-size:13px;color:var(--ts);margin-bottom:2.5rem;padding-bottom:1.5rem;border-bottom:0.5px solid var(--b)}
.meta time{margin-right:1rem}

article h2{font-family:'Montserrat',sans-serif;font-size:1.35rem;font-weight:700;margin:2.5rem 0 1rem;letter-spacing:-0.01em}
article h3{font-family:'Montserrat',sans-serif;font-size:1.05rem;font-weight:600;margin:1.75rem 0 .75rem}
article p{margin-bottom:1.25rem;color:rgba(24,26,46,0.85)}
article ul,article ol{margin:0 0 1.25rem 1.25rem;color:rgba(24,26,46,0.85)}
article li{margin-bottom:.5rem}
article a{color:var(--d);text-decoration:underline;text-underline-offset:3px}
article a:hover{color:var(--vm)}

.cta-box{background:var(--v);color:var(--c);padding:1.75rem 2rem;margin:2.5rem 0;border-radius:4px}
.cta-box p{color:rgba(248,246,242,0.85);margin-bottom:1rem}
.cta-box a{display:inline-block;background:var(--d);color:var(--v);padding:10px 18px;font-family:'Montserrat',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none}

.card-list{display:grid;gap:1.5rem;margin-top:2rem}
.card{border:0.5px solid var(--b);padding:1.75rem;transition:box-shadow .2s}
.card:hover{box-shadow:0 8px 32px rgba(24,26,46,.08)}
.card h2{font-size:1.15rem;margin:0 0 .5rem}
.card h2 a{color:var(--v);text-decoration:none}
.card h2 a:hover{color:var(--d)}
.card p{font-size:14px;color:var(--ts);margin:0}

footer{background:var(--v);color:rgba(248,246,242,.5);padding:3rem 5vw;font-size:12px}
footer a{color:rgba(248,246,242,.7);text-decoration:none}
footer a:hover{color:var(--d)}
.site-footer{text-align:center}
.site-footer-links{margin-top:.75rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem 1.25rem}

@media(max-width:640px){
  .nav-links{display:none}
  .wrap,.wrap-wide{padding:3rem 4vw 4rem}
}