.project-page { background:var(--cream); }.project-hero { display:grid; grid-template-columns:minmax(0,37rem) minmax(19rem,20.5rem); justify-content:start; align-items:center; gap:clamp(2.5rem,6vw,5rem); padding:5rem 0 3rem; }.project-hero h1,.project-story h2,.evidence-section h2,.project-bridge h2 { max-width:11ch; margin:0; color:var(--deep); font-size:clamp(3.1rem,6.2vw,5.8rem); letter-spacing:-.04em; line-height:.98; }.project-hero .lede { max-width:35rem; }.phone-capture { box-sizing:border-box; margin:0; padding:.55rem; overflow:hidden; border-radius:2.3rem; background:#102937; box-shadow:1rem 1rem 0 var(--aqua); }.phone-capture img { display:block; width:100%; border-radius:1.85rem; }.hero-capture { justify-self:start; width:min(100%,20.5rem); }.project-story { display:grid; grid-template-columns:.95fr 1.05fr; gap:5rem; padding-top:3.5rem; }.project-story h2,.evidence-section h2 { font-size:clamp(2.4rem,4.5vw,4.1rem); }.story-copy { max-width:38rem; padding-top:1.3rem; }.story-copy p,.evidence-copy>p { margin:0 0 1.4rem; color:#4c6670; font-size:1.1rem; line-height:1.7; }.project-principles { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; padding-top:1rem; padding-bottom:6rem; background:var(--line); border:1px solid var(--line); }.project-principles article { min-height:17rem; padding:2rem; background:white; }.project-principles article:nth-child(2) { background:var(--aqua); }.project-principles h3 { margin:.4rem 0 .8rem; color:var(--deep); font-size:1.4rem; letter-spacing:-.025em; line-height:1.12; }.project-principles article>p:last-child { color:#53707b; font-size:.95rem; line-height:1.6; }.evidence-section { display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,.7fr); gap:clamp(2.5rem,6vw,5rem); align-items:center; padding-top:2rem; padding-bottom:6.5rem; }.evidence-copy { max-width:34rem; }.evidence-copy .eyebrow { margin-bottom:1rem; }.evidence-copy h2 { margin-bottom:1.5rem; }.evidence-capture { justify-self:start; width:min(100%,18rem); margin:0; }.project-bridge { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:5rem; margin-bottom:5.5rem; padding:5rem clamp(1.6rem,6vw,5.5rem); overflow:hidden; color:white; background:var(--deep); }.project-bridge::after { content:""; position:absolute; right:clamp(1rem,6vw,4rem); bottom:1rem; width:min(34vw,19rem); aspect-ratio:1; background:url("assets/noble-squad-mark-dark.png") center/contain no-repeat; opacity:.13; pointer-events:none; }.project-bridge>* { position:relative; z-index:1; }.project-bridge .eyebrow { color:var(--gold); }.project-bridge h2 { color:white; font-size:clamp(2.6rem,5vw,4.4rem); }.bridge-copy { max-width:34rem; padding-top:1.2rem; }.bridge-copy p { margin:0 0 1.25rem; color:#c6d8d8; font-size:1.06rem; line-height:1.65; }.project-bridge .button-light { margin-top:.7rem; } @media (max-width:780px) { .project-hero,.project-story,.evidence-section,.project-bridge { grid-template-columns:1fr; gap:2.5rem; }.project-hero { min-height:auto; padding-top:4rem; }.hero-capture { justify-self:start; }.project-story { padding-top:4rem; }.project-principles { grid-template-columns:1fr; padding-bottom:3.5rem; }.project-principles article { min-height:0; }.evidence-section { align-items:start; padding-top:3.5rem; padding-bottom:3.5rem; }.evidence-capture { justify-self:start; }.project-bridge { margin-bottom:3rem; padding:3.5rem 1.5rem; } .bridge-copy,.story-copy,.evidence-copy { padding-top:0; } }