:root { --ink:#093e40; --deep:#043337; --amber:#f8b51a; --paper:#f5f3ed; --muted:#dfe7e4; --line:rgba(9,62,64,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.container { width:min(1180px,calc(100% - 64px)); margin:auto; }
.site-header { height:86px; padding:0 max(32px,calc((100vw - 1244px)/2)); background:var(--deep); color:white; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:10; }
.brand img { display:block; width:260px; height:auto; }
nav { display:flex; align-items:center; gap:28px; font-size:13px; font-weight:700; }
nav > a:not(.nav-cta) { opacity:.82; transition:opacity .2s; } nav > a:hover { opacity:1; }
.nav-cta { padding:12px 16px; border:1px solid rgba(255,255,255,.4); } .nav-cta span,.button span { color:var(--amber); margin-left:7px; }
.menu-toggle { display:none; }
.hero { min-height:720px; height:calc(100vh - 86px); max-height:900px; color:white; position:relative; display:grid; align-items:center; overflow:hidden; }
.hero-image { position:absolute; inset:0; background:url('assets/hero-wasatch-home.png') center/cover no-repeat; transform:scale(1.01); }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,35,38,.86) 0%,rgba(0,35,38,.53) 37%,rgba(0,20,24,.03) 70%),linear-gradient(0deg,rgba(0,25,28,.4),transparent 44%); }
.hero-content { position:relative; z-index:1; padding-top:28px; }
.eyebrow,.section-label { font:500 11px/1.3 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.14em; }
.eyebrow { color:var(--amber); margin:0 0 22px; } .light { color:var(--amber); }
h1,h2,h3,p { margin-top:0; } h1 { font-size:clamp(50px,6.4vw,92px); line-height:.99; max-width:780px; margin-bottom:25px; letter-spacing:-.065em; font-weight:700; }
.hero-copy { font-size:17px; max-width:460px; line-height:1.7; color:rgba(255,255,255,.88); margin-bottom:34px; }
.button { display:inline-block; padding:16px 20px; font-size:13px; font-weight:800; transition:transform .2s,background .2s; } .button:hover { transform:translateY(-2px); }
.button-amber { background:var(--amber); color:var(--deep); } .button-amber span { color:var(--deep); }
.scroll-cue { position:absolute; z-index:2; right:clamp(24px,5vw,70px); bottom:30px; font:500 11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.1em; display:flex; align-items:center; gap:10px; }
.scroll-cue span { height:1px; width:42px; background:var(--amber); }
.section { padding:120px 0; }
.intro { display:grid; grid-template-columns:1fr 2.15fr; gap:80px; }
.intro .section-label { padding-top:14px; }.display-copy { max-width:850px; margin-bottom:32px; font-size:clamp(29px,3.5vw,50px); letter-spacing:-.055em; line-height:1.16; font-weight:600; }
.text-link { font-size:13px; font-weight:800; border-bottom:1px solid var(--ink); padding-bottom:8px; }.text-link span { margin-left:10px; color:#d48d00; }
.services { background:#dfe6e2; }.service-grid { display:grid; grid-template-columns:repeat(3,1fr); }.service-grid article { min-height:310px; padding:34px 42px 32px 0; margin-right:32px; border-top:1px solid var(--line); }.service-grid article+article { padding-left:32px; border-left:1px solid var(--line); }
.service-number { font:500 12px 'DM Mono',monospace; color:#b37800; }.service-grid h2 { font-size:26px; letter-spacing:-.04em; margin:55px 0 12px; }.service-grid p:last-child { max-width:290px; line-height:1.72; font-size:14px; color:rgba(9,62,64,.78); }
.statement { background:var(--deep); color:#fff; }.statement-grid { display:grid; grid-template-columns:1fr 2.15fr; gap:80px; }.statement h2 { font-size:clamp(36px,4.6vw,66px); line-height:1.04; letter-spacing:-.06em; margin-bottom:22px; }.statement h2+p { font-size:16px; line-height:1.8; max-width:620px; color:#d5e2df; }.principles { margin-top:46px; display:flex; flex-wrap:wrap; gap:10px; }.principles span { border:1px solid rgba(255,255,255,.35); padding:10px 13px; font:500 10px 'DM Mono',monospace; letter-spacing:.07em; text-transform:uppercase; }
.work-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:42px; }.work-heading p { font-size:15px; width:300px; line-height:1.6; }.project-grid { display:grid; grid-template-columns:1.38fr 1fr; gap:24px; }.project-image { min-height:350px; background-size:cover; background-position:center; }.project-large .project-image { min-height:500px; }.project-image-one { background-image:linear-gradient(0deg,rgba(0,31,35,.46),transparent 50%),url('assets/hero-wasatch-home.png'); }.project-image-two { background-image:linear-gradient(0deg,rgba(0,31,35,.12),transparent),url('assets/hero-wasatch-home.png'); background-position:82% center; }.project-meta { padding:16px 0 12px; display:flex; justify-content:space-between; gap:15px; border-bottom:1px solid var(--line); }.project-meta h3 { margin:0; font-size:17px; letter-spacing:-.03em; }.project-meta span,.work-note { font:500 10px 'DM Mono',monospace; color:#6f8885; text-transform:uppercase; letter-spacing:.1em; }.work-note { margin:55px 0 0; }
.contact { padding:105px 0; background:var(--amber); color:var(--deep); }.contact-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:80px; }.contact .section-label { color:var(--deep); }.contact h2 { margin:22px 0 0; font-size:clamp(40px,4.9vw,72px); letter-spacing:-.065em; line-height:.98; }.contact-copy { padding-top:54px; }.contact-copy p { max-width:430px; line-height:1.75; font-size:16px; }.button-outline { margin-top:18px; border:1px solid var(--deep); }.button-outline span { color:var(--deep); }
footer { background:var(--deep); color:#d8e1df; padding:34px 0; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:22px; font-size:11px; }.footer-inner img { width:205px; }.footer-inner p { margin:0; }.footer-inner a { color:var(--amber); font-weight:700; }
@media (max-width:760px) { .container { width:min(100% - 40px,1180px); }.site-header { height:74px; padding:0 20px; }.brand img { width:210px; }.menu-toggle { display:block; background:none; border:0; color:white; font:600 12px Manrope,sans-serif; }.menu-toggle span { display:inline-block; width:6px; height:6px; margin-left:5px; background:var(--amber); border-radius:50%; } nav { position:absolute; display:none; top:74px; left:0; right:0; padding:25px 20px 30px; align-items:flex-start; flex-direction:column; background:var(--deep); } nav.open { display:flex; }.hero { height:calc(100vh - 74px); min-height:600px; }.hero-overlay { background:linear-gradient(90deg,rgba(0,35,38,.84),rgba(0,35,38,.3)),linear-gradient(0deg,rgba(0,25,28,.45),transparent 55%); }.section { padding:76px 0; }.intro,.statement-grid,.contact-grid { grid-template-columns:1fr; gap:28px; }.intro .section-label { padding-top:0; }.service-grid,.project-grid { grid-template-columns:1fr; }.service-grid article,.service-grid article+article { min-height:auto; padding:25px 0 34px; margin:0; border-left:0; }.service-grid h2 { margin-top:32px; }.work-heading { display:block; }.work-heading p { width:auto; margin-top:25px; }.project-large .project-image,.project-image { min-height:330px; }.contact-copy { padding-top:0; }.footer-inner { flex-direction:column; align-items:flex-start; }.scroll-cue { display:none; } }

nav > a.active { color:var(--amber); opacity:1; }
.work-link { display:inline-block; margin-top:55px; }
.projects-hero { padding:110px 0 105px; background:linear-gradient(115deg,#083f41 0%,#064c4c 50%,#0a363a 100%); color:white; position:relative; overflow:hidden; }.projects-hero:after { content:"W"; position:absolute; right:-2vw; bottom:-11vw; font-size:min(55vw,740px); line-height:.7; font-weight:800; color:rgba(255,255,255,.035); letter-spacing:-.15em; }.projects-hero > div { position:relative; z-index:1; }.projects-hero h1 { margin:16px 0 23px; }.projects-hero .eyebrow { color:var(--amber); }.projects-hero p:last-child { max-width:525px; font-size:17px; line-height:1.75; color:#d7e4e0; }
.projects-list { padding:104px 0 130px; }.projects-list-heading { display:flex; justify-content:space-between; gap:40px; margin-bottom:44px; }.projects-list-heading > p:last-child { width:360px; margin:0; font-size:14px; line-height:1.7; color:#52706e; }.project-card { display:grid; grid-template-columns:1.1fr 1fr; min-height:455px; margin-bottom:30px; background:#e5ebe8; }.project-card.reverse { grid-template-columns:1fr 1.1fr; }.project-card.reverse .project-art { order:2; }.project-card.reverse .project-content { order:1; }.project-art { position:relative; min-height:340px; overflow:hidden; padding:28px; color:white; display:flex; align-items:flex-end; }.project-art:before { content:""; position:absolute; inset:0; opacity:.82; background:linear-gradient(135deg,rgba(0,0,0,.15),transparent 55%); }.project-art:after { content:""; position:absolute; width:70%; height:100%; right:-17%; bottom:-33%; border:1px solid rgba(255,255,255,.38); border-radius:50% 50% 0 0; transform:rotate(29deg); }.project-art span { align-self:flex-start; position:relative; z-index:1; font:500 11px 'DM Mono',monospace; letter-spacing:.15em; }.project-art strong { position:relative; z-index:1; font-size:clamp(80px,12vw,160px); line-height:.68; letter-spacing:-.13em; }.project-art i { position:absolute; z-index:1; width:46%; height:2px; bottom:23%; left:31%; background:var(--amber); transform:rotate(-36deg); }.tg-card .project-art { background:linear-gradient(145deg,#064c4b,#1d7270 55%,#0e3337); }.pb-card .project-art { background:linear-gradient(145deg,#8a663c,#bd9262 52%,#65442e); }.sr-card .project-art { background:linear-gradient(145deg,#6d5f6c,#a58f9a 53%,#4a404d); }.sv-card .project-art { background:linear-gradient(145deg,#34586c,#6397a0 55%,#27444f); }.project-content { padding:62px clamp(32px,5vw,78px); display:flex; align-items:flex-start; flex-direction:column; }.card-kicker { margin-bottom:34px; font:500 10px 'DM Mono',monospace; color:#a36e00; letter-spacing:.1em; text-transform:uppercase; }.project-content h2 { margin:0 0 15px; font-size:clamp(31px,3.5vw,50px); letter-spacing:-.065em; line-height:1; }.project-content > p:not(.card-kicker) { max-width:440px; font-size:14px; line-height:1.7; color:#456260; }.project-content ul { list-style:none; padding:0; margin:19px 0 25px; display:flex; flex-wrap:wrap; gap:7px; }.project-content li { padding:6px 8px; background:#d2ddd8; font:500 9px 'DM Mono',monospace; letter-spacing:.045em; text-transform:uppercase; }.project-link { margin-top:auto; font-size:13px; font-weight:800; border-bottom:1px solid var(--ink); padding-bottom:8px; }.project-link span { margin-left:8px; color:#b67b00; }.project-cta { padding:106px 0; background:var(--deep); color:#fff; }.project-cta h2 { font-size:clamp(41px,5vw,72px); letter-spacing:-.07em; line-height:.98; margin:22px 0 34px; }
@media (max-width:760px) { .projects-hero { padding:78px 0; }.projects-list { padding:70px 0 80px; }.projects-list-heading { display:block; margin-bottom:30px; }.projects-list-heading > p:last-child { width:auto; margin-top:20px; }.project-card,.project-card.reverse { grid-template-columns:1fr; margin-bottom:20px; }.project-card.reverse .project-art,.project-card.reverse .project-content { order:initial; }.project-art { min-height:250px; }.project-content { padding:34px 25px; min-height:360px; }.card-kicker { margin-bottom:23px; }.project-cta { padding:76px 0; } }
