:root {
  --navy: #061426; --navy-deep: #030d1a; --glacier: #1c5a8f; --steel: #aebdca;
  --silver: #d9e1e7; --gold: #d8b66c; --white: #f5f8fb; --line: rgba(217,225,231,.48);
  --glass: rgba(3,13,26,.26); --gutter: clamp(1.25rem,4.8vw,4.75rem);
  --display: "Helvetica Neue",Arial,sans-serif; --serif: Georgia,"Times New Roman",serif; --ui: "Helvetica Neue",Arial,sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--navy); }
body { margin: 0; color: var(--white); background: var(--navy); font-family: var(--ui); overflow-x: hidden; }
a { color: inherit; }
svg { display:block; width:1.35rem; fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.skip-link { position:fixed; z-index:100; top:1rem; left:1rem; padding:.75rem 1rem; color:var(--navy); background:var(--silver); transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:absolute; z-index:20; top:.6rem; left:.9rem; right:.9rem; min-height:3.65rem; padding:0 1.6rem; border:1px solid rgba(217,225,231,.48); border-radius:.25rem; background:var(--glass); -webkit-backdrop-filter:blur(10px) saturate(115%); backdrop-filter:blur(10px) saturate(115%); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:3rem; transition:background-color .25s ease,border-color .25s ease; }
.site-header:hover { background:rgba(3,13,26,.42); border-color:rgba(217,225,231,.72); }
.wordmark { width:max-content; color:transparent; background:linear-gradient(100deg,var(--silver) 15%,#fff6d8 38%,var(--gold) 50%,var(--white) 62%,var(--silver) 85%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; font:600 1.32rem/1 var(--ui); letter-spacing:.42em; text-decoration:none; animation:metal-shimmer 8s linear infinite; }
.site-nav { display:flex; gap:clamp(2rem,5vw,4rem); }
.site-nav a,.text-link { font:400 .92rem/1.2 var(--ui); text-decoration-thickness:1px; text-underline-offset:.38em; }
.site-nav a { text-decoration:none; }
.site-nav a:hover { text-decoration:underline; }
.header-cta { justify-self:end; min-width:12rem; padding:.66rem 1rem; border:1px solid rgba(232,213,167,.78); border-radius:.18rem; background:rgba(3,13,26,.15); box-shadow:inset 0 0 18px rgba(216,182,108,.05),0 0 16px rgba(217,225,231,.05); }
.header-cta:hover { background:rgba(217,225,231,.12); }
.arrow-link { display:flex; align-items:center; justify-content:space-between; gap:1rem; text-decoration:none; }
.arrow-link svg { transition:transform .25s ease; }
.arrow-link:hover svg { transform:translateX(.32rem); }
.menu-toggle { display:none; }
.hero { position:relative; min-height:35.5rem; padding:7.5rem var(--gutter) 3.8rem; background-image:url("assets/rocky-mountains-family-hero.png"); background-position:center; background-size:cover; display:flex; align-items:flex-end; isolation:isolate; }
.hero::before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(3,13,26,.88) 0%,rgba(3,13,26,.55) 26%,rgba(3,13,26,.04) 58%),linear-gradient(0deg,rgba(3,13,26,.42) 0%,rgba(3,13,26,0) 40%); pointer-events:none; }
.hero::after { content:""; position:absolute; z-index:0; inset:0; pointer-events:none; opacity:.42; mix-blend-mode:screen; background:radial-gradient(circle at 14% 17%,rgba(255,238,190,.9) 0 1px,transparent 2px),radial-gradient(circle at 81% 22%,rgba(217,225,231,.9) 0 1px,transparent 2px),radial-gradient(circle at 69% 63%,rgba(216,182,108,.65) 0 1px,transparent 2px); background-size:181px 163px,223px 197px,257px 211px; animation:star-shimmer 6s ease-in-out infinite alternate; }
.hero-copy { position:relative; z-index:1; }
.hero-copy { max-width:42rem; text-shadow:0 2px 18px rgba(3,13,26,.82); }
.hero h1 { margin:0; max-width:18ch; font:400 clamp(3.7rem,4.4vw,4.25rem)/.94 var(--serif); letter-spacing:-.04em; }
.hero-copy>p { margin:1.15rem 0 1.65rem; color:var(--silver); font:400 clamp(1.25rem,1.7vw,1.7rem)/1.18 var(--serif); }
.hero-actions { display:flex; align-items:center; gap:2.2rem; }
.button { min-width:13rem; padding:.85rem 1.15rem; border:1px solid rgba(217,225,231,.9); border-radius:.18rem; background:rgba(3,13,26,.3); box-shadow:none; color:var(--white); font:450 .95rem/1 var(--ui); -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px); transition:color .2s ease,background-color .2s ease,border-color .2s ease; }
.button:hover { color:var(--navy); background:var(--silver); border-color:var(--silver); }
.expertise { min-height:2.7rem; padding:0 var(--gutter); color:var(--navy); background:linear-gradient(110deg,#a9b8c5 0%,#e3e8ec 45%,#bac6d0 100%); border-block:1px solid rgba(245,248,251,.6); display:flex; justify-content:center; align-items:center; gap:clamp(1rem,2.4vw,2.4rem); font:500 clamp(.75rem,1.15vw,.95rem)/1 var(--serif); letter-spacing:.28em; text-transform:uppercase; }
.expertise i { flex:0 0 .24rem; width:.24rem; aspect-ratio:1; border-radius:50%; background:var(--gold); box-shadow:0 0 8px rgba(216,182,108,.7); }
.work { padding:.75rem var(--gutter) 0; background:radial-gradient(circle at 82% 20%,rgba(28,90,143,.24),transparent 30%),var(--navy); display:grid; grid-template-columns:minmax(19rem,.38fr) 1fr; gap:clamp(2rem,5vw,5rem); }
.work h2 { margin:.35rem 0 0; color:var(--silver); font:400 clamp(2rem,3vw,3rem)/1.02 var(--serif); letter-spacing:-.025em; }
.work-list { display:grid; }
.work-list a { position:relative; min-height:3.75rem; padding:.45rem .4rem; border-top:1px solid var(--line); display:grid; grid-template-columns:3rem minmax(16rem,1fr) minmax(11rem,26%) 2rem; align-items:center; gap:1.25rem; overflow:hidden; text-decoration:none; transition:background-color .22s ease,padding-inline .22s ease; }
.work-list a:hover { padding-inline:.85rem; background:rgba(28,90,143,.16); }
.project-number { color:var(--gold); font:400 .8rem/1 var(--ui); }
.project-name { font:400 clamp(1.25rem,2vw,2rem)/1.05 var(--serif); }
.project-image { align-self:stretch; background-image:linear-gradient(rgba(6,20,38,.1),rgba(6,20,38,.1)),url("assets/rocky-mountains-family-hero.png"); background-size:220%; filter:saturate(.82) contrast(1.08); opacity:.9; box-shadow:inset 0 0 0 1px rgba(216,182,108,.18); transition:opacity .25s ease,transform .35s ease; }
.work-list a:hover .project-image { opacity:1; transform:scale(1.04); }
.project-image-one { background-position:12% 28%; } .project-image-two { background-position:70% 42%; } .project-image-three { background-position:48% 72%; }
.approach { min-height:6rem; padding:1.05rem clamp(2.25rem,12vw,12rem); color:var(--navy); background:linear-gradient(112deg,#aab8c4 0%,#e8edf0 42%,#e5d7b4 51%,#c5ccd0 62%,#b7c3cd 100%); background-size:180% 100%; display:grid; grid-template-columns:1fr 1px 1.35fr; align-items:center; gap:clamp(2rem,5vw,5rem); animation:silver-sweep 12s ease-in-out infinite alternate; }
.approach h2 { margin:0; font:400 clamp(1.8rem,2.6vw,2.65rem)/1 var(--serif); letter-spacing:-.035em; }
.approach-rule { width:1px; height:72%; background:rgba(6,20,38,.55); }
.approach p { margin:0; font:400 clamp(1.05rem,1.5vw,1.45rem)/1.14 var(--serif); }
.contact { min-height:5rem; padding:.9rem clamp(2.25rem,12vw,12rem); border-bottom:1px solid var(--line); background:var(--navy); display:grid; grid-template-columns:.48fr 1fr; align-items:center; gap:3rem; }
.contact h2 { margin:0; font:400 clamp(1.55rem,2.25vw,2.2rem)/1 var(--serif); }
.contact-button { width:100%; max-width:none; justify-content:center; position:relative; }
.contact-button svg { position:absolute; right:1.25rem; }
.site-footer { min-height:3.4rem; padding:0 clamp(2.25rem,8vw,8rem); color:var(--steel); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:2rem; font-size:.8rem; }
.site-footer .wordmark { color:var(--silver); font-size:.78rem; }
.site-footer p { margin:0; } .site-footer p:last-child { justify-self:end; }
:focus-visible { outline:2px solid var(--white); outline-offset:4px; }
@media (max-width:900px) {
  .site-header { grid-template-columns:1fr auto; min-height:3.75rem; padding-inline:1rem; }
  .menu-toggle { display:flex; align-items:center; gap:.55rem; border:0; background:none; color:var(--white); font:500 .85rem/1 var(--ui); }
  .menu-toggle svg { width:1.15rem; } .header-cta { display:none; }
  .site-nav { position:absolute; top:calc(100% + .45rem); left:0; width:100%; padding:1.2rem 1rem; border:1px solid rgba(217,225,231,.55); border-radius:.25rem; background:rgba(3,13,26,.58); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); flex-direction:column; gap:1.15rem; visibility:hidden; opacity:0; transform:translateY(-.55rem); transition:opacity .2s ease,transform .2s ease,visibility .2s; }
  .site-nav[data-open="true"] { visibility:visible; opacity:1; transform:translateY(0); }
  .hero { min-height:43rem; background-position:57% center; }
  .work { grid-template-columns:1fr; gap:1.4rem; padding-bottom:.5rem; }
  .work-list a { grid-template-columns:2.5rem 1fr 9rem 2rem; }
}
@media (max-width:620px) {
  .site-header { top:.45rem; left:.55rem; right:.55rem; }
  .wordmark { font-size:1rem; letter-spacing:.34em; }
  .hero { min-height:auto; padding:35rem 1.25rem 3rem; background-color:var(--navy); background-size:auto 48rem; background-position:center top; background-repeat:no-repeat; align-items:flex-start; }
  .hero::before { background:linear-gradient(0deg,rgba(3,13,26,1) 0%,rgba(3,13,26,.94) 38%,rgba(3,13,26,.12) 68%); }
  .hero h1 { font-size:clamp(3rem,13vw,3.45rem); }
  .hero-copy>p { font-size:1.18rem; } .desktop-only { display:none; }
  .hero-actions { align-items:stretch; flex-direction:column; gap:1.25rem; }
  .button { width:100%; min-width:0; }
  .expertise { justify-content:flex-start; align-items:flex-start; padding-block:1.1rem; flex-direction:column; gap:.75rem; font-size:.72rem; }
  .expertise i { display:none; }
  .work { padding:2rem 1.25rem .5rem; } .work h2 { max-width:8ch; }
  .work-list a { min-height:7rem; padding-block:1rem; grid-template-columns:2rem 1fr 1.4rem; gap:.7rem; }
  .project-image { display:none; } .project-name { font-size:1.45rem; }
  .approach { grid-template-columns:1fr; gap:1.4rem; padding:2.4rem 1.25rem; }
  .approach-rule { width:100%; height:1px; }
  .contact { grid-template-columns:1fr; padding:2.3rem 1.25rem; gap:1.5rem; }
  .contact h2 { font-size:2rem; }
  .site-footer { padding:1.4rem 1.25rem; grid-template-columns:1fr auto; row-gap:.9rem; }
  .site-footer p:first-of-type { grid-row:2; grid-column:1/-1; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }
@keyframes metal-shimmer { to { background-position:-220% 0; } }
@keyframes star-shimmer { from { opacity:.22; } to { opacity:.5; } }
@keyframes silver-sweep { from { background-position:0 0; } to { background-position:100% 0; } }