/* Alignment, scale and the work itself form the visual identity of this page. */
/* One centered row: the complete message on the left, the living mark on the right. */
@media(min-width:761px){
 .hero-stage{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:auto;align-content:center;align-items:center;gap:6%;padding:calc(var(--header-height) + 86px) var(--pad) 48px}
 .hero-stage .hero-main,.hero-stage h1{display:block}
 .hero-stage h1{font-size:clamp(48px,6.7vw,104px);line-height:1.02;letter-spacing:-.055em}
 .hero-stage .hero-line{font-size:inherit;line-height:inherit;letter-spacing:inherit}
 .hero-stage .hero-mark{grid-column:2;grid-row:1;width:min(100%,520px);height:auto;min-height:0;aspect-ratio:1;max-height:none;align-self:center;justify-self:center;z-index:1}
 .hero-stage .hero-intro{display:block;max-width:470px;margin-top:28px}
 .hero-intro>p{font-size:18px;line-height:1.5}
 .hero-intro .text-link{margin-top:24px}
 .hero-bottom{min-height:60px}
}
.hero-stage .hero-mark img{opacity:1}
.consultancy-note{max-width:none;font-size:14px;color:#c7d4cd}
.hero-bottom #rotating-copy{font-size:12px;color:#9db5aa}
.hero-bottom>a{font-size:12px}
.practice{background:#091310}
.journey-intro{display:block;margin-bottom:30px}
.journey-intro h2{font-size:clamp(36px,4.3vw,66px);line-height:1.14;max-width:1050px;letter-spacing:-.045em}
.journey-intro>p{font-size:18px;margin-top:25px;color:#9bb6a8}
.journey-step{border:0}
.journey-copy h3{font-size:clamp(42px,4.9vw,74px);font-weight:500;letter-spacing:-.055em;margin-bottom:20px}
.journey-copy p{font-size:18px;line-height:1.6;max-width:390px}
.journey-copy>span{border:0;padding:0;font-size:13px;color:#89a697}
.journey-sticky .journey-step{opacity:1}
.journey-sticky .journey-step:not(.is-current){opacity:1}
.journey-sticky .journey-step:not(.is-current) h3{opacity:.6}
.journey-copy h3{transition:opacity .6s}
.journey-sticky .journey-visual{height:clamp(340px,50svh,530px)}
.alignment-study{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transition:opacity .7s}
.alignment-study path{fill:none;stroke:#c0e7d3;stroke-width:1.1;vector-effect:non-scaling-stroke}
.alignment-study path:nth-child(3n+2){stroke:#659286;stroke-width:.75}
.alignment-study path:nth-child(3n){stroke:#5b7971;stroke-width:.5}
.alignment-inline{height:230px;position:relative}
.journey-sticky .alignment-inline{display:none}
.alignment-caption{display:flex;justify-content:space-between;gap:15px;color:#bbd0c4;font-size:15px;padding-top:12px}
.journey-sticky .alignment-caption{position:absolute;left:0;right:0;bottom:20px}
.journey-sticky .journey-scene{transform:translateY(12px);transition-duration:.65s,.85s,0s}
.journey-sticky .journey-scene.is-current{transform:none}
.journey-product img{border:0;box-shadow:0 28px 50px -22px #0009}
.journey-identity img{width:100%;height:auto;display:block}
.scene-note{font-size:12px;color:#89a497;text-align:left;margin-top:18px}
.offerings{border:0;margin-top:70px;padding-top:70px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:50px}
.offerings>h3{grid-column:1/-1;font:400 16px/1.5 Satoshi;letter-spacing:0;color:#9bb6a8;margin:0 0 10px}
.offering{display:block;border:0;padding:0;grid-column:1/10}
.offering:nth-of-type(2){grid-column:3/12}
.offering:nth-of-type(3){grid-column:6/-1}
.offering h4{font:500 clamp(50px,7.5vw,112px)/1.04 General;letter-spacing:-.055em;color:#e4ede6}
.offering h4>span{display:block;font:400 16px/1.5 Satoshi;letter-spacing:0;margin-top:19px;color:#b1c6b9}
.offering ul{display:flex;flex-wrap:wrap;gap:7px 24px;font-size:13px;color:#86a595;margin-top:7px}
.work-section{background:#071011;color:#e2ede6;padding-top:clamp(80px,8vw,135px)}
.work-title{display:block}
.work-title h2{font:500 clamp(46px,6.5vw,96px)/1.06 General;letter-spacing:-.055em}
.work-title>div{padding:0;max-width:none;margin-top:30px}
.work-title>div>p:only-child{font:400 18px/1.6 Satoshi;letter-spacing:0;color:#9ab4a8;max-width:none}
.work-viewer{display:flex;flex-direction:column;gap:0;background:transparent;box-shadow:none;padding:55px var(--pad) 34px;margin-top:30px}
.work-viewer:before,.work-viewer:after{display:none}
.work-viewer>.material-field{opacity:.25}
.work-panels{width:100%;max-width:1280px;align-self:center;order:0}
.work-rail{order:1;align-self:center;width:min(100%,560px);margin:30px 0 0;padding:0}
.work-tabs{flex-direction:row;border:0;padding:0;gap:0}
.work-tabs button{flex:1;align-items:center;text-align:center;font:400 16px/1.5 Satoshi;letter-spacing:0;padding:12px 10px;color:#839e90}
.work-tabs button[aria-selected=true]{color:#dfeee3}
.work-indicator{top:auto;bottom:0;left:0;width:var(--indicator-size,33.333%);height:1px;background:#96b9a3;transform:translateX(var(--indicator-position,0px));transition:transform .65s var(--ease-out),width .65s var(--ease-out)}
.product-artifact img{border:0;border-radius:0;box-shadow:0 35px 60px -35px #000b}
.identity-artifact{min-height:clamp(270px,38vw,590px);padding:0 5%;background:none}
.identity-artifact img{border:0;box-shadow:none}
.artifact-caption{font-size:12px;color:#8ca799;padding:22px 0 0;max-width:none}
.work-foot{margin-top:12px;gap:40px;align-items:center}
.work-foot .text-link{color:#cce0d3;border-color:#89a79766}
.work-foot .text-link:hover{color:white}
.work-foot .disclosure{color:#839c90;max-width:360px}
.publishing-artifact{display:flex;padding:30px 0;background:transparent;border:0;box-shadow:none;min-height:clamp(330px,33vw,500px)}
.workflow-kicker{font:400 18px/1.5 Satoshi;letter-spacing:0;color:#b5cdbd;margin:0 0 50px}
.workflow{display:flex;flex-wrap:wrap;gap:22px 36px;margin:0;padding:0}
.workflow li,.workflow li:last-child{flex:0 0 auto;width:auto;border:0;padding:0;display:block;transition:opacity .5s,color .5s}
.workflow h4{font:500 clamp(39px,5.3vw,76px)/1.1 General;letter-spacing:-.055em;margin:0 0 14px}
.workflow p{font-size:13px;color:#acc2b3;line-height:1.5}
.workflow-track{height:1px;background:#557b6440;margin-top:65px;position:relative;overflow:hidden}
.workflow-track>span{position:absolute;width:20%;height:1px;background:#badbc7;transform:translateX(var(--workflow-progress,0%))}
.contact-layout h2{font-size:clamp(44px,6.4vw,96px);line-height:1.1;letter-spacing:-.05em}
.contact-link{font-size:clamp(34px,4vw,58px)}
@media(max-width:900px){
 .offerings{gap:44px 14px}.offering:nth-of-type(2){grid-column:2/-1}.offering:nth-of-type(3){grid-column:4/-1}
 .offering h4{font-size:clamp(47px,8.6vw,78px)}
 .journey-copy h3{font-size:43px}
 .alignment-inline{height:190px}.alignment-caption{font-size:13px}
 .work-rail{margin-top:25px}.work-viewer{padding-top:35px}
}
@media(max-width:760px){
 .consultancy-note{font-size:12px}
 .hero-stage .hero-intro>p{font-size:17px}
 .hero-stage h1{font-size:clamp(52px,12vw,84px)}
 .journey-intro h2{font-size:clamp(34px,7.5vw,54px)}
 .journey-intro h2 br{display:none}.journey-intro>p{font-size:16px}
 .offerings{display:block;margin-top:20px;padding-top:45px}
 .offerings>h3{font-size:14px;margin-bottom:38px}
 .offering{padding:0;margin-top:38px}.offering h4{font-size:clamp(43px,10.5vw,70px)}
 .offering:nth-of-type(2){margin-left:5%}.offering:nth-of-type(3){margin-left:12%}
 .offering h4>span{font-size:16px;margin-top:16px}
 .offering ul{font-size:13px;gap:5px 16px}
 .work-title h2{font-size:clamp(40px,10.6vw,65px)}
 .work-title>div>p:only-child{font-size:16px}
 .work-viewer{margin-top:15px;padding-bottom:22px}
 .work-tabs button{font-size:14px;padding:12px 6px}
 .artifact-caption{font-size:11px}
 .identity-artifact{min-height:240px;padding:0}
 .publishing-artifact{padding:14px 0;min-height:0}
 .workflow-kicker{font-size:16px;margin-bottom:30px}
 .workflow{display:grid;grid-template-columns:1fr 1fr;gap:27px 24px}
 .workflow h4{font-size:36px;margin-bottom:8px}.workflow p{font-size:12px}
 .workflow li:last-child{grid-column:auto}
 .workflow-track{margin-top:35px}
 .work-foot{margin-top:10px;gap:20px}
 .contact-layout h2{font-size:clamp(39px,10vw,66px)}
}
@media(prefers-reduced-motion:reduce){.alignment-study{transition:none}.workflow li{transition:none}}
@media(min-width:761px) and (max-height:850px){
 .hero-stage{padding-top:calc(var(--header-height) + 76px);padding-bottom:32px}
 .hero-stage h1{font-size:clamp(48px,min(6.7vw,10.5svh),92px)}
 .hero-stage .hero-mark{width:min(100%,480px,60svh)}
 .hero-stage .hero-intro{margin-top:24px}
}
@media(min-width:540px) and (max-height:540px){
 .hero-stage{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:auto;gap:6%;padding-top:calc(var(--header-height) + 62px);padding-bottom:28px}
 .hero-stage h1{font-size:clamp(36px,4.8vw,54px)}
 .hero-stage .hero-line{font-size:inherit;line-height:1.02;letter-spacing:-.055em}
 .hero-stage .hero-mark{grid-column:2;grid-row:1;width:min(100%,360px,60svh);height:auto;aspect-ratio:1}
 .hero-stage .hero-intro{margin-top:20px}
 .hero-stage .hero-intro>p{font-size:15px}
}
/* Controls precede the changing canvas, so a selection keeps its result in view. */
.work-rail{order:0;margin:0 0 36px}
.work-panels{order:1}
@media(max-width:760px){.work-rail{margin-bottom:26px}}
.work-viewer>.material-field{mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent)}
.closing-section .contact-layout{display:block;padding-top:60px;padding-bottom:75px}
.contact-layout>.contact-action{max-width:none;padding:0}
.contact-link{font:500 clamp(52px,13vw,190px)/1.05 General;letter-spacing:-.065em;border:0;padding:0;gap:25px}
.contact-link h2{font:inherit;letter-spacing:inherit;margin:0}
.contact-link svg{width:clamp(32px,7vw,100px);flex-shrink:0}
@media(max-width:760px){.closing-section .contact-layout{padding-top:48px;padding-bottom:52px}.contact-link{gap:18px}}

/* Keep the complete word and its syntax mark inside very narrow panes. */
@media(max-width:300px){.hero-stage h1{font-size:clamp(38px,18vw,52px)}}
