
:root{
  --navy:#07111d; --navy2:#0f2132; --ink:#142230; --muted:#5f6d79;
  --paper:#f5f2eb; --white:#fff; --gold:#c7a86b; --line:#d7d9d7;
  --max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
a{color:inherit}
.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:10px;top:10px;background:#fff;padding:8px 12px;z-index:999}
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,17,29,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{text-decoration:none;display:flex;align-items:baseline;gap:10px;letter-spacing:.02em}
.brand-main{font-size:27px;font-weight:700}
.brand-main span{color:var(--gold)}
.brand-sub{font-size:11px;letter-spacing:.26em;color:#c8d0d6}
.navlinks{display:flex;gap:28px}
.navlinks a{text-decoration:none;font-size:14px;color:#dfe6eb}
.navlinks a:hover{color:#fff}
.menu-toggle{display:none;border:1px solid #566473;background:transparent;color:white;padding:8px 10px}
.hero{background:linear-gradient(130deg,#07111d,#0e2335);color:#fff;padding:90px 0 80px}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:70px;align-items:center}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.18em;margin:0 0 16px;color:#6e7c87}
.gold{color:var(--gold)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(44px,7vw,82px);line-height:.98;letter-spacing:-.04em;margin-bottom:28px}
h2{font-size:clamp(36px,5vw,62px);line-height:1.05;letter-spacing:-.03em;margin-bottom:26px}
.lead{font-size:21px;max-width:690px;color:#d6dde3;margin-bottom:30px}
.btn{display:inline-block;text-decoration:none;background:var(--gold);color:#09131e;padding:13px 18px;font-weight:700;border:1px solid var(--gold)}
.btn.ghost{background:transparent;color:#fff}
.smallline{margin-top:22px;color:#94a4b2;font-size:14px}
.globe{text-align:center}
.globe svg{width:100%;max-width:430px;filter:drop-shadow(0 18px 34px rgba(0,0,0,.25))}
.globe p{color:#9eb0bd;font-size:14px;margin-top:8px}
.section{padding:95px 0}
.light{background:var(--paper)}
.dark{background:var(--navy);color:#fff}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.copy{font-size:19px}
.signature{margin-top:34px;font-weight:700}
.signature span{font-weight:400;color:var(--muted);font-size:15px}
.project-head{display:flex;justify-content:space-between;gap:30px;align-items:end}
.kicker{color:#c6d0d7;margin-bottom:6px}
.brocki-logo{font-size:clamp(48px,7vw,90px);margin:0;letter-spacing:-.04em}
.brocki-logo span{color:var(--gold);font-weight:400}
.project-sub{font-size:20px;color:#cbd5dc}
blockquote{margin:55px 0 18px;padding-left:24px;border-left:3px solid var(--gold);font-size:30px;font-family:Georgia,serif;color:#f0e4ca}
.bigcopy{font-size:25px;max-width:800px}
.muted{color:#a9b6c0;max-width:880px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.cards article{border:1px solid #2d4356;padding:28px;min-height:190px}
.cards span{color:var(--gold);font-size:13px;letter-spacing:.15em}
.cards h3{font-size:24px;margin:24px 0 8px}
.cards p{color:#b7c2ca}
.intro{font-size:20px;max-width:760px;color:var(--muted);margin-bottom:55px}
.timeline{border-top:1px solid var(--line)}
.timeline article{display:grid;grid-template-columns:180px 1fr;gap:38px;padding:34px 0;border-bottom:1px solid var(--line)}
.year{font-size:24px;font-weight:700;color:#8d7548}
.timeline h3{font-size:25px;margin-bottom:8px}
.timeline p{max-width:770px}
.timeline a,.text-link{font-weight:700;text-underline-offset:4px}
.perspective{background:#e7e1d5}
.contact{background:#112638;color:#fff}
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:start}
.contact p{color:#ccd5db;max-width:650px}
.contact-card{border-top:1px solid #506273;padding-top:22px;display:flex;flex-direction:column;gap:7px}
.contact-card strong{font-size:24px}
.contact-card a{font-size:20px;color:#fff}
footer{background:#07111d;color:#aab7c1;padding:28px 0}
.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;font-size:13px}
.footer-links{display:flex;gap:22px;justify-content:end}
.footer-links a{text-decoration:none}
.footer-brand{color:white}

.legal{max-width:850px;margin:70px auto;padding:0 20px}
.legal h1{font-size:48px;color:var(--ink)}
.legal h2{font-size:28px;margin-top:38px}
.legal p,.legal li{font-size:17px}

@media(max-width:800px){
  .wrap{width:min(100% - 28px,var(--max))}
  .nav{min-height:68px}
  .brand-sub{display:none}
  .menu-toggle{display:block}
  .navlinks{display:none;position:absolute;top:68px;left:0;right:0;background:#07111d;padding:18px 20px;flex-direction:column;border-top:1px solid #263644}
  .navlinks.open{display:flex}
  .hero{padding:65px 0}
  .hero-grid,.two-col,.contact-grid{grid-template-columns:1fr;gap:44px}
  .globe svg{max-width:320px}
  .section{padding:70px 0}
  .project-head{align-items:start;flex-direction:column}
  .cards{grid-template-columns:1fr}
  .timeline article{grid-template-columns:1fr;gap:6px}
  .footer-grid{grid-template-columns:1fr;gap:12px}
  .footer-links{justify-content:start}
}
