.projects-hero { background: linear-gradient(112deg, rgba(3,7,12,.99), rgba(5,13,18,.96) 55%, rgba(18,35,31,.9)); min-height: 39rem; overflow: hidden; padding-block: calc(var(--header-height) + var(--space-12)) var(--space-10); position: relative; }
.projects-hero__glow { background: radial-gradient(circle, rgba(88,187,212,.14), transparent 65%); height: 42rem; position: absolute; right: -8rem; top: 1rem; width: 52rem; }
.projects-hero__inner { align-items: center; display: grid; gap: clamp(3rem,7vw,8rem); grid-template-columns: minmax(0,.9fr) minmax(30rem,1fr); position: relative; }
.projects-hero__copy { --flow-space: var(--space-6); z-index: 2; }
.projects-hero h1 { font-size: clamp(2.5rem,4.3vw,4.6rem); max-width: 14ch; text-transform: uppercase; }
.projects-hero h1 span { color: var(--color-accent); display: block; }
.projects-hero .lede { max-width: 42rem; }
.project-console { aspect-ratio: 1.2; background: radial-gradient(circle at center, rgba(88,187,212,.09), transparent 48%); border: 1px solid var(--color-border); box-shadow: var(--glow-tech); overflow: hidden; position: relative; }
.project-console::before { background-image: linear-gradient(rgba(88,187,212,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(88,187,212,.08) 1px,transparent 1px); background-size: 2rem 2rem; content:""; inset:0; mask-image: radial-gradient(circle,#000,transparent 75%); position:absolute; }
.project-console__header,.project-console__footer { color: var(--color-text-faint); display:flex; font-family:var(--font-mono); font-size:.68rem; justify-content:space-between; letter-spacing:.1em; left:var(--space-5); position:absolute; right:var(--space-5); text-transform:uppercase; }
.project-console__header { border-bottom:1px solid var(--color-border); padding-bottom:var(--space-3); top:var(--space-5); }
.project-console__header strong { color:var(--color-success); }
.project-console__footer { bottom:var(--space-5); border-top:1px solid var(--color-border); padding-top:var(--space-3); }
.project-console__core { align-items:center; background:rgba(5,11,18,.92); border:1px solid var(--color-accent); border-radius:50%; box-shadow:var(--glow-gold); display:flex; height:8.5rem; justify-content:center; left:50%; position:absolute; text-align:center; text-transform:uppercase; top:50%; transform:translate(-50%,-50%); width:8.5rem; z-index:2; }
.project-console__core span { color:var(--color-text); font-family:var(--font-display); font-weight:700; letter-spacing:.09em; }
.project-console__orbit { border:1px solid var(--color-border-strong); border-radius:50%; inset:21% 17%; position:absolute; }
.project-console__orbit--two { border-color:var(--color-border); inset:12% 8%; transform:rotate(42deg); }
.project-console__orbit span { background:var(--color-bg-deep); border:1px solid var(--color-border); color:var(--color-tech); font-family:var(--font-mono); font-size:.62rem; letter-spacing:.08em; padding:.35rem .6rem; position:absolute; text-transform:uppercase; }
.project-console__orbit span:first-child { left:4%; top:12%; }.project-console__orbit span:last-child { bottom:12%; right:2%; }
.project-experience,.project-domains,.project-principles { background:var(--color-bg-deep); position:relative; }
.project-experience::before,.project-domains::before,.delivery-system::before,.quality-compliance::before,.project-principles::before,.projects-cta::before { background:linear-gradient(90deg,transparent,rgba(88,187,212,.45),rgba(197,154,61,.28),transparent); content:""; height:1px; left:var(--gutter); position:absolute; right:var(--gutter); top:0; }
.project-experience__grid { display:grid; gap:clamp(3rem,8vw,8rem); grid-template-columns:minmax(0,.8fr) minmax(30rem,1fr); }.project-experience__grid .flow{--flow-space:var(--space-5)}.project-experience__grid p:not(.lede){color:var(--color-text-muted)}
.experience-rail { display:flex; flex-wrap:wrap; gap:var(--space-2); list-style:none; margin-top:var(--space-10); }.experience-rail li{background:rgba(18,34,49,.45);border:1px solid var(--color-border);color:var(--color-text-muted);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;padding:.65rem .85rem;text-transform:uppercase}
.projects-heading { align-items:end; display:grid; gap:var(--space-10); grid-template-columns:minmax(0,1fr) minmax(20rem,.65fr); margin-bottom:clamp(2.5rem,5vw,4rem); }.projects-heading .flow{--flow-space:var(--space-5)}.projects-heading .lede{justify-self:end}
.project-grid { display:grid; gap:1px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.project-card { background:linear-gradient(145deg,rgba(16,26,25,.95),rgba(4,10,15,.98)); border:1px solid var(--color-border); min-height:24rem; padding:clamp(1.5rem,3vw,2.5rem); transition:border-color var(--duration-base),transform var(--duration-base); }
.project-card:hover { border-color:var(--color-border-strong); transform:translateY(-3px); }
.project-card__meta { align-items:center; display:flex; justify-content:space-between; }.project-card__meta span{color:var(--color-accent);font-family:var(--font-mono)}.project-card__meta strong{color:var(--color-tech);font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase}
.project-card h3 { font-size:clamp(1.45rem,2vw,2rem); margin-top:var(--space-12); text-transform:uppercase; }.project-card p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-top:var(--space-4)}
.project-card ul { display:flex; flex-wrap:wrap; gap:var(--space-2); list-style:none; margin-top:var(--space-8); }.project-card li{border:1px solid var(--color-border);color:var(--color-text-faint);font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;padding:var(--space-2);text-transform:uppercase}
.project-note { border-left:2px solid var(--color-accent); color:var(--color-text-muted); font-size:var(--font-size-sm); margin-top:var(--space-8); padding:var(--space-3) var(--space-5); }.project-note strong{color:var(--color-text)}
.delivery-system { background:linear-gradient(180deg,var(--color-bg),var(--color-bg-deep)); position:relative; }
.delivery-track { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); list-style:none; }.delivery-track li{border:1px solid var(--color-border);min-height:18rem;padding:var(--space-6);position:relative}.delivery-track li+li{border-left:0}.delivery-track span{color:var(--color-accent);font-family:var(--font-mono)}.delivery-track h3{font-size:var(--font-size-lg);margin-top:var(--space-12);text-transform:uppercase}.delivery-track p{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-top:var(--space-4)}
.quality-compliance { background:linear-gradient(145deg,rgba(8,19,30,.98),rgba(9,20,18,.98)); position:relative; }.quality-compliance__grid{align-items:start;display:grid;gap:clamp(3rem,8vw,8rem);grid-template-columns:minmax(0,.8fr) minmax(32rem,1fr)}.quality-compliance__copy{--flow-space:var(--space-5)}.quality-compliance__copy p:not(.lede){color:var(--color-text-muted)}.documentation-matrix{display:grid;grid-template-columns:1fr 1fr;list-style:none}.documentation-matrix li{align-items:center;border:1px solid var(--color-border);display:grid;gap:var(--space-4);grid-template-columns:auto 1fr;min-height:5.5rem;padding:var(--space-4)}.documentation-matrix span{color:var(--color-accent);font-family:var(--font-mono);font-size:var(--font-size-xs)}.documentation-matrix strong{font-family:var(--font-display);font-size:var(--font-size-sm);letter-spacing:.04em;text-transform:uppercase}
.project-principles__grid { align-items:start; display:grid; gap:clamp(3rem,8vw,8rem); grid-template-columns:minmax(0,.8fr) minmax(30rem,1fr); }.project-principles__grid .flow{--flow-space:var(--space-5)}.project-principles dl{display:grid;grid-template-columns:1fr 1fr}.project-principles dl div{border:1px solid var(--color-border);min-height:13rem;padding:var(--space-6)}.project-principles dt{color:var(--color-tech);font-family:var(--font-display);font-size:var(--font-size-lg);font-weight:700;text-transform:uppercase}.project-principles dd{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-top:var(--space-4)}
.projects-cta { background:var(--color-bg-deep); padding-block:clamp(3rem,5vw,4.5rem); position:relative; }.projects-cta__panel{align-items:end;background:rgba(11,22,34,.72);border:1px solid var(--color-border-strong);box-shadow:var(--glow-tech);display:grid;gap:var(--space-10);grid-template-columns:minmax(0,1fr) auto;padding:clamp(2rem,5vw,4rem)}.projects-cta__panel .flow{--flow-space:var(--space-5)}
@media(max-width:63.99rem){.projects-hero__inner{grid-template-columns:1fr}.project-console{margin:auto;max-width:38rem;width:100%}.project-experience__grid,.projects-heading,.quality-compliance__grid{grid-template-columns:1fr}.projects-heading .lede{justify-self:start}.project-grid{grid-template-columns:repeat(2,1fr)}.delivery-track{grid-template-columns:repeat(2,1fr)}.delivery-track li+li{border-left:1px solid var(--color-border)}.project-principles__grid{grid-template-columns:1fr}}
@media(max-width:47.99rem){.projects-hero{min-height:auto;padding-top:calc(var(--header-height) + var(--space-10))}.projects-hero h1{font-size:clamp(2.35rem,11vw,3.5rem)}.project-console{aspect-ratio:1;height:auto}.project-console__orbit span{display:none}.project-grid,.delivery-track,.documentation-matrix,.project-principles dl{grid-template-columns:1fr}.project-card{min-height:0}.delivery-track li{min-height:0}.projects-cta__panel{align-items:start;grid-template-columns:1fr;padding:var(--space-6)}.projects-cta__panel .button{width:100%}}

/* Editorial photography */
.projects-hero{background:linear-gradient(90deg,rgba(3,7,12,.99) 0%,rgba(3,8,13,.94) 37%,rgba(3,8,13,.35) 64%,rgba(3,8,13,.16) 100%),url("../images/projects/projects-hero-v1.png") center/cover no-repeat;min-height:44rem}
.section-image{border:1px solid var(--color-border);margin-top:var(--space-8);overflow:hidden}.section-image img{aspect-ratio:16/9;display:block;object-fit:cover;width:100%}
.project-card{min-height:0;overflow:hidden;padding:0}.project-card__image{aspect-ratio:16/9;display:block;object-fit:cover;transition:transform var(--duration-slow) var(--ease-command);width:100%}.project-card:hover .project-card__image{transform:scale(1.035)}.project-card__body{padding:clamp(1.5rem,3vw,2.25rem)}
.delivery-system__image{border:1px solid var(--color-border);margin-bottom:var(--space-8);max-height:25rem;overflow:hidden}.delivery-system__image img{display:block;height:clamp(15rem,30vw,25rem);object-fit:cover;width:100%}
@media(max-width:47.99rem){.projects-hero{background-position:62% center;min-height:auto;padding-bottom:var(--space-16);padding-top:calc(var(--header-height) + var(--space-16))}.projects-hero::after{background:rgba(3,7,12,.22);content:"";inset:0;position:absolute}.projects-hero__inner{z-index:1}}
.projects-hero__inner{z-index:2}
.project-experience__image{align-self:stretch;margin-top:0}.project-experience__image img{height:100%;min-height:24rem}
.project-console--overlay{background:radial-gradient(circle at center,rgba(5,11,18,.24),transparent 58%);border-color:rgba(88,187,212,.18);bottom:var(--space-8);height:auto;max-height:38rem;position:absolute;right:clamp(1.25rem,4vw,4rem);top:calc(var(--header-height) + var(--space-8));width:min(49vw,45rem);z-index:1}.project-console--overlay .project-console__orbit--one{animation:project-orbit 22s linear infinite}.project-console--overlay .project-console__orbit--two{animation:project-orbit-reverse 28s linear infinite}.project-console--overlay .project-console__orbit span{animation:project-label-stabilise 22s linear infinite}.project-console--overlay .project-console__orbit--two span{animation:project-label-stabilise-reverse 28s linear infinite}
@keyframes project-orbit{to{transform:rotate(360deg)}}@keyframes project-orbit-reverse{from{transform:rotate(42deg)}to{transform:rotate(-318deg)}}@keyframes project-label-stabilise{to{transform:rotate(-360deg)}}@keyframes project-label-stabilise-reverse{from{transform:rotate(-42deg)}to{transform:rotate(318deg)}}
@media(max-width:63.99rem){.project-console--overlay{opacity:.7;right:-5rem;width:min(65vw,38rem)}}@media(max-width:47.99rem){.project-console--overlay{bottom:8%;height:16rem;opacity:.48;right:-7rem;top:auto;width:22rem}.project-console--overlay .project-console__header,.project-console--overlay .project-console__footer,.project-console--overlay .project-console__orbit span{display:none}.project-console--overlay .project-console__core{height:6rem;width:6rem}}
@media(prefers-reduced-motion:reduce){.project-console--overlay .project-console__orbit,.project-console--overlay .project-console__orbit span{animation:none}}