/* Standalone study: the reference's transparency and restrained motion, not its assets. */
body.color-west{--paper:#ffffff;--ink:#333333;--dark:#003e78;--accent:#f1471c;--brand:#003e78;--deep-teal:#003e78;background:#ffffff}
.color-west .nav{background:rgba(255,255,255,.62);backdrop-filter:blur(7px);color:#003e78;border-bottom:1px solid #ffffff55;transition:background 1s,box-shadow 1s}
body.color-west .nav.solid{background:rgba(255,255,255,.92)!important}.color-west .nav.solid .links a{color:#003e78}.color-west .nav .burger,.color-west .nav:not(.solid) .burger,.color-west .nav.solid .burger{color:#003e78;border-color:#003e7860}
body.color-west .brand img{background:transparent!important;padding:0!important}
.color-west .hero video{filter:none}.color-west .hero-fade{background:linear-gradient(0deg,#003e7855,transparent 58%),linear-gradient(180deg,#ffffff14,transparent 28%)!important}
.color-west .hero-copy{bottom:15vh;left:4vw;padding:34px 40px;max-width:82vw;background:rgba(0,62,120,.59);border-left:3px solid #f1471c;box-shadow:0 20px 60px #003e7826;animation:west-fade 1.15s ease-out both}
.color-west .hero h1{font-size:clamp(40px,5.3vw,76px);margin-top:16px;text-shadow:none}.color-west .hero-copy .eyebrow{animation:west-up 1.1s .12s both}.color-west .hero h1{animation:west-down 1.1s .2s both}
.color-west .rot,.color-west .safety-accent{color:#fff!important}.color-west .kin span{background:#003e788f;padding:12px 18px;text-shadow:none;font-size:clamp(16px,1.8vw,26px)}
.color-west .ticker{background:#003e78;color:#fff}.color-west .ticker b{color:#f1471c}
.color-west .craft-band{background:#fff;color:#333333}.color-west .craft-band em,.color-west .service-intro em,.color-west .approach em{color:#003e78}
.color-west .service-intro{background:linear-gradient(100deg,#ffffff,#ffffff);color:#333333}
.color-west .project-stories{background:linear-gradient(#003e78c9,#003e78c9),url(m/framing.jpg) center/cover;color:#fff;background-attachment:fixed}.color-west .project-story{background:#fff;color:#333333;box-shadow:0 18px 45px #003e7833}.color-west .project-story img{transition:transform .7s,filter .7s}.color-west .project-story:hover img{filter:saturate(1.12)}.color-west .project-story .project-type{color:#003e78}
.color-west .approach{background:linear-gradient(135deg,#fff 65%,#ffffff)}.color-west .promise-symbol{background:#003e78;outline-color:#003e7844}.color-west .promise-band:before{border-color:#003e7840}.color-west .values span{border-color:#003e78}
.color-west .tile:after{background:linear-gradient(0deg,#003e78cc,#003e784d)}.color-west .tile:before{transform:scale(1.06);transition:transform .7s}.color-west .tile:hover:before{transform:scale(1)}
.color-west .partners{background:#fff}.color-west .estimating-invite{background:linear-gradient(90deg,#003e78d9,#003e78b0),url(p/p14.jpg) center/cover;color:#fff}
body.color-west footer,body.color-west .disclaimer{background:#003e78;color:#ffffff}
.color-west .cta,.color-west .big-link{transition:transform .3s,box-shadow .3s}.color-west .cta:hover,.color-west .big-link:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0002}
.color-west .west-reveal{transition:opacity .9s,transform .9s}.color-west .west-reveal.west-wait{opacity:0;transform:translateY(22px)}
@keyframes west-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes west-down{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:none}}@keyframes west-fade{from{opacity:0}to{opacity:1}}
@media(max-width:860px){.color-west .color-label{font-size:10px}.color-west .color-compare a{font-size:9px;padding:8px 4px}.color-west .hero-copy{left:4vw;right:4vw;max-width:none;bottom:13vh;padding:26px 20px}.color-west .hero h1{font-size:38px;line-height:1.04}.color-west .hero .eyebrow{font-size:10px;line-height:1.6}.color-west .kin{top:23vh;max-width:80vw}.color-west .kin span{font-size:15px}.color-west .project-stories{background-attachment:scroll}.color-west .nav.open .links a{color:#fff}.color-west .hero{min-height:660px}}
@media(prefers-reduced-motion:reduce){.color-west .hero-copy,.color-west .hero h1,.color-west .hero .eyebrow{animation:none}.color-west .west-reveal.west-wait{opacity:1;transform:none}.color-west *{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
@media(min-width:861px){.color-west .hero-copy{width:min(920px,90vw);max-width:90vw;box-sizing:border-box}}
body.color-west .project-stories{background:linear-gradient(#003e78c9,#003e78c9),url(m/framing.jpg) center/cover;color:#fff}body.color-west .project-stories :is(h2,h1.seo-page-heading){color:#fff}body.color-west .project-story{background:#fff;color:#333333}body.color-west .tile:after{background:linear-gradient(0deg,#003e78cc,#003e784d)}body.color-west .promise-symbol{background:#003e78;outline-color:#003e7844}body.color-west .footer-line{color:#ffffff}
@media(prefers-reduced-motion:reduce){body.color-west .hero .rot b,body.color-west .kin span{transition:none;animation:none}.color-west .p-track,.color-west .ticker div{animation:none!important}}
/* Match the supplied reference: translucent white, not frosted glass. */
body.color-west .nav{backdrop-filter:none;background:rgba(255,255,255,.56)}
@media(min-width:861px){.color-west .hero-copy{width:min(1100px,90vw)}.color-west .hero h1{font-size:clamp(40px,5vw,72px)}}
body.color-west{font-family:'Economica',sans-serif;font-size:20px}
.color-west h1,.color-west :is(h2,h1.seo-page-heading),.color-west h3,.color-west .nav,.color-west .color-compare{font-family:'Poppins',sans-serif}.color-west h1,.color-west :is(h2,h1.seo-page-heading),.color-west h3,.color-west .rot b{font-weight:300}.color-west .hero h1{font-size:clamp(38px,4.6vw,66px);line-height:1.1}.color-west .nav .links a{font-weight:500;letter-spacing:.08em}.color-west .hero .eyebrow,.color-west .kin span{font-family:'Economica',sans-serif;font-weight:400}.color-west .kin span{font-size:24px;letter-spacing:.07em}.color-west .hero .eyebrow{font-size:19px;letter-spacing:.1em}.color-west .cta,.color-west .big-link{font-family:'Mulish',sans-serif;font-weight:600}.color-west .promise p{font-size:19px;line-height:1.4}.color-west .project-story-copy p{font-size:21px}.color-west .founders-copy .lede{font-size:23px;line-height:1.5}.color-west .service-intro p,.color-west .craft-band p{font-size:23px;line-height:1.5}.color-west .color-compare{font-size:12px}
@media(max-width:860px){.color-west .hero h1{font-size:35px;line-height:1.15}.color-west .hero .eyebrow{font-size:15px;line-height:1.35}.color-west .kin span{font-size:19px}.color-west .hero-copy{padding:26px 20px}.color-west .promise h3{font-size:17px}.color-west .founders-copy .lede{font-size:21px}}
.color-west .west-reveal.west-left.west-wait{transform:translateX(-35px)}.color-west .west-reveal.west-right.west-wait{transform:translateX(35px)}
.color-west .project-stories,.color-west .craft-band,.color-west .service-intro{overflow:hidden}
@media(max-width:860px){.color-west .west-reveal.west-left.west-wait,.color-west .west-reveal.west-right.west-wait{transform:translateX(-18px)}}
@media(prefers-reduced-motion:reduce){.color-west .west-reveal.west-left.west-wait,.color-west .west-reveal.west-right.west-wait{transform:none}}
/* Main-site extension. Sizes remain owned by the separate typography sheet. */
body.color-west .nav.force,body.color-west .nav.open{background:rgba(255,255,255,.94);color:#003e78;backdrop-filter:none}
body.color-west .nav .links a{position:relative;color:#003e78;box-shadow:none;transition:color .3s,opacity .3s}
body.color-west .nav .links a:before,body.color-west .nav .links a:after{content:"";position:absolute;left:0;right:0;height:2px;background:#003e78;opacity:0;transform:scaleX(.4);transition:opacity .25s,transform .25s}
body.color-west .nav .links a:before{top:0}body.color-west .nav .links a:after{bottom:0}
body.color-west .nav .links a:hover:before,body.color-west .nav .links a:hover:after,body.color-west .nav .links a:focus-visible:before,body.color-west .nav .links a:focus-visible:after,body.color-west .nav .links a.cur:before,body.color-west .nav .links a.cur:after{opacity:1;transform:scaleX(1)}
body.color-west .nav .links a:hover,body.color-west .nav .links a.cur{color:#003e78}
body.color-west .cta,body.color-west .big-link{background:#f1471c;color:#fff}
body.color-west .film,body.color-west .gallery,body.color-west .edge,body.color-west .sp{background:#003e78}
body.color-west .story,body.color-west .services,body.color-west .tech,body.color-west .five,body.color-west .contact-page{background:#ffffff;color:#333333}
body.color-west .cp-list b,body.color-west .lane span,body.color-west .project-type{color:#003e78}
body.color-west .lane.on,body.color-west .inq{border-top-color:#003e78}body.color-west .lane.on{border-left-color:#003e78}
body.color-west .card{border-top-color:#003e78}body.color-west .send{background:#003e78;color:#fff}
body.color-west .west-reveal.west-wait{opacity:0}body.color-west .west-reveal:not(.west-wait){opacity:1;transform:none}
@media(max-width:860px){body.color-west .nav.open .links{background:rgba(255,255,255,.97)}body.color-west .nav.open .links a{color:#003e78;align-self:flex-start}body.color-west .hero-copy{padding:25px 20px}}
@media(prefers-reduced-motion:reduce){body.color-west .west-reveal.west-wait{opacity:1;transform:none}}

body.color-west .nav .links a:before,body.color-west .nav .links a:after{height:3px}

/* Exact reference palette, measured live from West's computed CSS. Logo is unchanged. */
body.color-west{--paper:#fff;--ink:#333;--dark:#003e78;--accent:#003e78;--brand:#003e78;--deep-teal:#003e78}
body.color-west .cta,body.color-west .big-link{background:#003e78;color:#fff}
body.color-west .hero-copy{border-left:0;background:rgba(0,62,120,.59)}
body.color-west .kin span{background:rgba(0,62,120,.59);border-color:#003e78}
body.color-west .hero-fade{background:linear-gradient(0deg,#003e7855,transparent 58%),linear-gradient(180deg,#ffffff14,transparent 28%)!important}
body.color-west .promise-symbol span{background:#003e78;color:#fff}body.color-west .promise-symbol{border-color:#fff}body.color-west .promise-symbol:after{border-color:#003e78}
body.color-west .promise p,body.color-west .lead,body.color-west .lane em,body.color-west .routed{color:#333}
body.color-west .ticker b{color:#fff}body.color-west .services .eyebrow,body.color-west .tech-copy{color:#333}
body.color-west .nav .links a{letter-spacing:0}body.color-west .nav .links a:before,body.color-west .nav .links a:after{height:3px}
/* Keep the rotating words visible when hero entrance and word updates coincide. */
body.color-west .hero .rot{height:1.2em}
body.color-west .hero .rot b{animation:none;opacity:1;transform:none}
body.color-west .gallery .gal-note,body.color-west .edge-grid p{color:#fff}
/* Polish within the reference direction: calm spacing and a clear focus state. */
body.color-west .hero h1{margin-top:20px}body.color-west .hero-copy{box-shadow:none}
body.color-west .project-story{box-shadow:0 12px 32px #003e7818}body.color-west .project-story-copy{padding:32px}
body.color-west .nav .links a:focus-visible{outline:2px solid #003e78;outline-offset:5px}
body.color-west .partners .p-track:hover{animation-play-state:paused}
@media(max-width:860px){body.color-west .project-story-copy{padding:26px}body.color-west .hero h1{margin-top:20px}}
/* Separate Careers, using the same West palette and form treatment. */
body.color-west .careers-page .cp-left{align-self:start}
body.color-west .careers-page :is(h2,h1.seo-page-heading) em{color:#003e78;font-style:normal}
body.color-west .careers-page .lead{font-size:18px;line-height:1.7}
body.color-west .careers-application{margin-top:0}
body.color-west .careers-application h3{color:#003e78}
body.color-west .careers-application .intro{font-size:18px;line-height:1.6}
body.color-west .careers-application .legal{color:#333333}

/* Alan's supplied project photograph, in the About introduction. */
body.color-west #pg-about .about-project-photo{margin:36px 0 0;width:100%;border-bottom:4px solid #003e78}
body.color-west #pg-about .about-project-photo img{display:block;width:100%;height:auto}
@media(max-width:860px){body.color-west #pg-about .about-project-photo{margin-top:26px}}

/* Careers: preserve the portrait crew footage, with manual playback. */
body.color-west .careers-film{margin:30px 0 0;width:100%;max-width:460px}body.color-west .careers-film video{display:block;width:100%;aspect-ratio:9/16;background:#080d14;border-bottom:4px solid #003e78}body.color-west .careers-film figcaption{padding:12px 0;font-size:18px;color:#003e78}

/* Rotating hero words use the original logo mark orange. */
body.color-west .hero .rot,body.color-west .hero .rot b{color:#f15a22!important}
