:where(.project){--mat:var(--color-sky)}.project-hero{--marker:var(--color-cobalt);position:relative;padding-bottom:var(--spacing-section-sm);background:var(--tint-sky);background:color-mix(in srgb,var(--mat) 30%,var(--color-cream));overflow:hidden}.project-hero--with-cover{padding-bottom:calc(var(--spacing-section-sm) + 3rem)}.project-hero::before{content:"";position:absolute;top:-12rem;right:-10rem;width:34rem;height:34rem;border:1.5px solid rgba(17,17,17,0.1);border-radius:50%;pointer-events:none}.project-hero__inner{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-5);max-width:56rem}.project-hero__inner .breadcrumbs{margin-bottom:var(--space-2)}.project-hero__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-muted)}.project-hero__type{padding:0.3rem 0.75rem;border:var(--border-ink);border-radius:var(--radius-pill);background:var(--mat);color:var(--color-ink);transition:translate var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.project-hero__type:hover{color:var(--color-ink);translate:-2px -2px;box-shadow:3px 3px 0 var(--color-ink)}.project-hero__dot{width:0.3rem;height:0.3rem;border-radius:50%;background:var(--color-border-strong)}.project-hero__concept{padding:0.25rem 0.6rem;border:1px solid var(--color-ink);border-radius:var(--radius-pill);background:var(--color-cream);color:var(--color-ink)}.project-hero__title{max-width:18ch;font-size:var(--text-h1);letter-spacing:var(--tracking-tight);line-height:1.05}.project-hero__summary{max-width:58ch;font-size:var(--text-lg);line-height:1.5;color:#4E4E4B}.project-hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2)}.project-hero__actions .button--primary{--button-bg:var(--color-ink);--button-border:var(--color-ink)}.project-hero__actions .button--primary:hover{--button-bg:var(--color-marigold);--button-fg:var(--color-ink);--button-border:var(--color-ink)}.project-hero__actions .button--secondary{--button-bg:var(--color-cream);--button-border:var(--color-ink)}.project-hero__actions .button--secondary:hover{--button-bg:var(--color-marigold);--button-border:var(--color-ink)}.project-cover{position:relative;z-index:1;margin:-3rem 0 0}.project-cover__frame{border:var(--border-ink);border-radius:var(--radius-large);background:var(--color-surface);box-shadow:8px 8px 0 var(--color-ink);overflow:hidden}.project-cover__image{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover}.project-body{padding-top:var(--space-12)}.project-layout{display:grid;gap:var(--space-8)}.project-main{display:flex;flex-direction:column;gap:var(--space-12);max-width:46rem}.glance{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5);border:var(--border-ink);border-radius:var(--radius-large);background:var(--color-cream);box-shadow:6px 6px 0 var(--mat)}.glance__title{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-muted)}.glance__list{display:flex;flex-direction:column;margin:0}.glance__row{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) 0;border-top:1px solid var(--color-border);font-size:var(--text-sm)}.glance__row:first-child{border-top:0;padding-top:0}.glance__row dt{flex:none;font-weight:600;color:var(--color-muted)}.glance__row dd{margin:0;font-weight:700;text-align:right}.glance__row--stack{flex-direction:column;gap:var(--space-2)}.glance__row--stack dd{text-align:left}.glance__chips,.glance__links{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:0;list-style:none}.glance__chips a,.glance__links a{display:inline-flex;align-items:center;gap:0.3rem;padding:0.3rem 0.7rem;border:var(--border-ink);border-radius:var(--radius-pill);background:var(--color-cream);font-size:var(--text-xs);font-weight:700;color:var(--color-ink);transition:background-color var(--duration-fast) var(--ease-out)}.glance__chips a:hover,.glance__links a:hover{background:var(--mat);color:var(--color-ink)}.glance__links a{background:var(--color-ink);color:var(--color-cream)}.glance__note{padding-top:var(--space-3);border-top:1px dashed var(--color-border-strong);font-size:var(--text-xs);line-height:1.5;color:var(--color-muted)}.story-blocks{display:flex;flex-direction:column;gap:var(--space-10)}.story-block{display:flex;flex-direction:column;gap:var(--space-4)}.story-block__head{display:flex;align-items:center;gap:var(--space-3);padding-bottom:var(--space-3);border-bottom:1.5px solid var(--color-ink)}.story-block__num{display:grid;flex:none;place-items:center;width:2.25rem;height:2.25rem;border:var(--border-ink);border-radius:50%;background:var(--mat);font-family:var(--font-display);font-size:1.05rem;font-style:italic;line-height:1}.story-block--approach .story-block__num{background:var(--color-marigold)}.story-block--solution .story-block__num{background:var(--color-mint)}.story-block--result .story-block__num{background:var(--color-coral)}.story-block__title{font-size:var(--text-h3);letter-spacing:-0.01em}.story-block__body{font-size:var(--text-lg);line-height:1.55}.story-block__body p{max-width:62ch}.story-empty{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-6);border:1.5px dashed var(--color-ink);border-radius:var(--radius-large);color:#4E4E4B}.story-empty__title{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-muted)}.gallery{display:grid;gap:var(--space-5);margin:0;padding:0;list-style:none}.gallery__frame{margin:0;border:var(--border-ink);border-radius:var(--radius-large);background:var(--color-surface);overflow:hidden}.gallery__image{display:block;width:100%;height:auto}.gallery__caption{padding:var(--space-3) var(--space-4);border-top:var(--border-ink);font-size:var(--text-sm);color:var(--color-muted)}.project-quote .testimonial{padding:var(--space-6);border:var(--border-ink);border-radius:var(--radius-large);background:var(--tint-butter);box-shadow:6px 6px 0 var(--color-ink)}.project-share{padding-top:var(--space-6);border-top:1.5px solid var(--color-ink)}.project-nav{display:grid;gap:var(--space-4)}.project-nav__link{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5);border:var(--border-ink);border-radius:var(--radius-large);background:var(--color-cream);color:var(--color-ink);transition:translate var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}.project-nav__link:hover{color:var(--color-ink);translate:-4px -4px;box-shadow:6px 6px 0 var(--mat)}.project-nav__link--next{align-items:flex-end;text-align:right}.project-nav__label{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-muted)}.project-nav__link--prev .project-nav__label .icon{transform:rotate(180deg)}.project-nav__title{font-size:var(--text-base);font-weight:700;line-height:1.3}.project-more{border-top:1.5px solid var(--color-ink)}.project-more__grid{display:grid;gap:var(--space-6)}@media (min-width: 640px){.project-nav{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 768px){.project-hero--with-cover{padding-bottom:calc(var(--spacing-section-sm) + 5rem)}.project-cover{margin-top:-5rem}.project-body{padding-top:var(--space-16)}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery__item:first-child{grid-column:1 / -1}.project-more__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.glance{padding:var(--space-6)}}@media (min-width: 1024px){.project-layout{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:var(--space-12);align-items:start}.project-rail{position:sticky;top:calc(var(--header-height) + var(--space-8))}.project-main{max-width:none}.project-more__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8)}}@media (min-width: 1280px){.project-layout{grid-template-columns:minmax(0,3fr) minmax(0,8fr);column-gap:var(--space-16)}}@media (prefers-reduced-motion: reduce){.project-nav__link,.project-hero__type,.glance__chips a{transition:none}.project-nav__link:hover{translate:0}}