.completed-projects-page { background: #e8e1d6; color: #2c251f; }
.project-detail-link { position: absolute; z-index: 2; inset: 0; border-radius: inherit; }
.project-detail-link:focus-visible { outline: 2px solid #fff; outline-offset: -7px; }
.completed-project-card:focus-within > img { transform: scale(1.06); }
.project-transition { position: fixed; z-index: 99999; inset: 0; display: grid; place-items: center; background: #e8e1d6; color: #2c251f; pointer-events: none; transform: translateY(-100%); transition: transform .38s cubic-bezier(.76, 0, .24, 1); }
.project-transition .logo-mark { border-color: #2c251f; }
.project-detail-page .project-transition { animation: project-curtain-open .75s cubic-bezier(.76, 0, .24, 1); }
.is-project-leaving .project-transition { animation: none; transform: translateY(0); pointer-events: auto; }
.project-detail-page { background: #e8e1d6; color: #2c251f; }
.project-detail-hero { position: relative; isolation: isolate; min-height: 85svh; min-height: max(600px, 85svh); overflow: hidden; color: #fff; }
.project-detail-cover { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: project-cover-reveal 1.3s cubic-bezier(.2, .65, .3, 1) both; }
.project-detail-hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgba(10,13,10,.45), transparent 45%, rgba(10,13,10,.65)); }
.project-detail-hero-content { position: absolute; left: var(--side-space); right: var(--side-space); bottom: 65px; animation: project-title-reveal 1s .2s both; }
.project-back { display: inline-flex; align-items: center; gap: 14px; color: inherit; text-decoration: none; font-size: 10px; letter-spacing: .12em; }
.project-detail-hero h1 { margin: 28px 0 18px; font-size: clamp(54px, 7.5vw, 130px); font-weight: 300; line-height: 1; letter-spacing: -.06em; }
.project-detail-hero-content > p { margin: 0; font-size: 16px; }
.project-detail-number { position: absolute; right: var(--side-space); bottom: 70px; font-size: 11px; letter-spacing: .14em; }
.project-banner-slide { opacity: 0; transform: scale(1.06); animation: none; transition: opacity 1s ease, transform 6.8s ease; }
.project-banner-slide.is-active { opacity: 1; transform: scale(1); }
.project-banner-controls { position: absolute; z-index: 3; right: var(--side-space); bottom: 64px; display: flex; align-items: center; gap: 13px; }
.project-banner-controls[hidden] { display: none; }
.project-banner-controls .project-detail-number { position: static; min-width: 60px; text-align: center; }
.project-banner-controls button { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #ffffff60; border-radius: 50%; background: #15151530; color: #fff; cursor: pointer; font-size: 10px; }
.project-banner-controls button:hover { background: #ffffff25; }
.project-banner-controls button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.project-banner-progress { width: 70px; height: 1px; background: #ffffff50; overflow: hidden; }
.project-banner-progress i { display: block; width: 100%; height: 100%; background: #fff; transform: scaleX(0); transform-origin: left; }
.project-banner-progress.is-running i { animation: project-banner-progress 6s linear forwards; }
.project-slide-details[hidden] { display: none; }
@keyframes project-banner-progress { to { transform: scaleX(1); } }
@media (max-width: 850px) {
	.project-detail-hero-content { bottom: 100px; }
	.project-banner-controls { left: var(--side-space); right: auto; bottom: 28px; }
}
.project-detail-info { display: grid; grid-template-columns: 1fr 1.4fr; gap: 45px; padding: 70px var(--side-space); }
.project-detail-info h2 { margin: 0; font-weight: 300; font-size: 36px; letter-spacing: -.04em; }
.project-detail-info dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; }
.project-detail-info dt { font-size: 9px; letter-spacing: .14em; color: #756f64; }
.project-detail-info dd { margin: 14px 0 0; font-size: 16px; }
.project-detail-content { padding: 0 var(--side-space) 60px; line-height: 1.8; }
.project-detail-content img { max-width: 100%; height: auto; }
.project-detail-navigation { display: flex; justify-content: space-between; align-items: center; gap: 32px; margin: 0 var(--side-space); padding: 48px 0 65px; border-top: 1px solid #c8bfb1; }
.project-next { color: inherit; text-decoration: none; text-align: right; }
.project-next > span { display: block; font-size: 10px; letter-spacing: .12em; color: #756f64; }
.project-next strong { display: block; margin-top: 8px; font-size: 10px; font-weight: 400; letter-spacing: .12em; }
.project-next i { margin-left: 14px; font-size: 10px; }
.project-detail-page a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
@keyframes project-curtain-open { from { transform: translateY(0); } to { transform: translateY(-100%); } }
@keyframes project-cover-reveal { from { transform: scale(1.08); } to { transform: scale(1); } }
@keyframes project-title-reveal { from { opacity: 0; transform: translateY(25px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) {
	.project-detail-hero { min-height: max(560px, 80svh); }
	.project-detail-hero-content { bottom: 100px; }
	.project-detail-number { bottom: 25px; }
	.project-detail-info { grid-template-columns: 1fr; padding-top: 45px; padding-bottom: 45px; gap: 30px; }
	.project-detail-info dl { gap: 12px; }
	.project-detail-info dd { font-size: 13px; }
	.project-detail-navigation { align-items: flex-start; }
	.project-next i { margin-left: 8px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.project-transition { display: none; }
	.project-detail-cover, .project-detail-hero-content { animation: none; }
	.project-banner-slide { transition: none; transform: none; }
	.project-banner-progress.is-running i { animation: none; }
	.completed-project-card:focus-within > img { transform: none; }
}
.completed-projects-banner { isolation: isolate; color: #fff; }
.completed-projects-banner .banner-overlay { background: rgba(14, 14, 13, .54); }
.completed-projects-banner .banner-title h1 { font-size: clamp(44px, 5.2vw, 94px); line-height: 1.04; }
.completed-projects-collection { padding: clamp(65px, 6vw, 105px) var(--side-space) clamp(80px, 8vw, 140px); }
.completed-projects-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 45px; margin-bottom: 50px; }
.completed-projects-heading .section-label { margin-bottom: 22px; }
.completed-projects-heading h2 { margin: 0; font-size: clamp(32px, 3.1vw, 54px); font-weight: 300; line-height: 1.1; letter-spacing: -.05em; }
.completed-projects-heading > p { max-width: 340px; margin: 0; color: #756f64; font-size: 13px; line-height: 1.8; }
.completed-projects-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 25px; margin-bottom: 32px; border-bottom: 1px solid #c8bfb1; }
.completed-projects-filters { display: flex; flex-wrap: wrap; gap: 10px; }
.completed-projects-filters[hidden] { display: none; }
.completed-projects-filters button { padding: 12px 20px; border: 1px solid #c8bfb1; border-radius: 30px; background: transparent; color: #605a50; font: inherit; font-size: 12px; cursor: pointer; transition: background .25s ease, color .25s ease, border-color .25s ease; }
.completed-projects-filters button:hover { background: #d9cfbf; border-color: #a89b88; }
.completed-projects-filters button.is-active { background: #2c2d28; color: #f5f3ee; border-color: #2c2d28; }
.completed-projects-filters button:focus-visible { outline: 2px solid #2c251f; outline-offset: 3px; }
.completed-projects-count { flex-shrink: 0; font-size: 10px; letter-spacing: .12em; color: #756f64; }
.completed-projects-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.completed-project-card { position: relative; isolation: isolate; aspect-ratio: 1.5; overflow: hidden; border-radius: 12px; background: #77766d; color: #fff; scroll-margin-top: 50px; }
.completed-project-card[hidden] { display: none; }
.completed-project-card > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .65, .3, 1); }
.completed-project-card::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(10, 13, 10, .22) 55%, rgba(10, 13, 10, .76) 100%); }
.completed-project-caption { position: absolute; bottom: 28px; left: 28px; right: 28px; }
.completed-project-caption h3 { margin: 0 0 7px; font-size: clamp(24px, 2vw, 36px); font-weight: 400; line-height: 1.1; letter-spacing: -.05em; }
.completed-project-caption p { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.9); }
@media (hover: hover) { .completed-project-card:hover > img { transform: scale(1.06); } }
@media (max-width: 1000px) {
	.completed-projects-heading { flex-direction: column; align-items: flex-start; gap: 22px; }
	.completed-projects-heading > p { max-width: 500px; }
	.completed-projects-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	.completed-projects-toolbar { align-items: flex-start; }
	.completed-projects-count { padding-top: 14px; }
	.completed-project-caption { bottom: 23px; left: 23px; right: 23px; }
}
@media (max-width: 600px) {
	.completed-projects-grid { grid-template-columns: 1fr; gap: 22px; }
	.completed-projects-toolbar { flex-direction: column; gap: 18px; }
	.completed-projects-filters { gap: 8px; }
	.completed-projects-filters button { padding: 10px 15px; font-size: 11px; }
	.completed-projects-count { padding-top: 0; }
	.completed-projects-banner .banner-title h1 { font-size: clamp(38px, 10vw, 54px); }
	.completed-projects-banner .banner-title p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
	.completed-project-card > img, .completed-projects-filters button { transition: none; }
	.completed-project-card:hover > img { transform: none; }
}

.project-media-tabs { display: flex; gap: 10px; margin: 0 var(--side-space) 32px; padding-top: 60px; padding-bottom: 22px; border-bottom: 1px solid #c8bfb1; }
.project-media-tabs[hidden], .project-media > section[hidden] { display: none; }
.project-media-tabs button { padding: 12px 26px; border: 1px solid #c8bfb1; border-radius: 30px; background: transparent; color: #605a50; font: inherit; font-size: 14px; cursor: pointer; transition: color .2s ease, background .2s ease; }
.project-media-tabs button:hover { background: #d9cfbf; }
.project-media-tabs button[aria-selected="true"] { background: #2c2d28; border-color: #2c2d28; color: #f5f3ee; }
.project-media-tabs button:focus-visible { outline: 2px solid #2c251f; outline-offset: 4px; }
.project-media.is-tabbed > section { padding-top: 0; padding-bottom: 65px; }
.project-media.is-tabbed > section > h2 { display: none; }
.project-plans, .project-photo-section { padding: 75px var(--side-space) 0; }
.project-photo-section { padding-bottom: 85px; }
.project-plans h2, .project-photo-section h2 { margin: 0 0 32px; font-size: clamp(28px, 2.8vw, 44px); font-weight: 300; letter-spacing: -.045em; }
.project-plans-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, 320px); gap: clamp(40px, 7vw, 110px); align-items: start; }
.project-specification { max-width: 860px; }
.project-specification-note { font-size: 9px; letter-spacing: .13em; color: #8b8172; }
.project-specification h3 { margin: 15px 0 20px; font-size: clamp(28px, 2.6vw, 42px); font-weight: 300; line-height: 1.1; letter-spacing: -.045em; }
.project-specification-intro { margin: 0; max-width: 760px; font-size: 14px; line-height: 1.8; color: #756f64; }
.project-specification-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 26px; margin: 28px 0 32px; }
.project-specification-facts > div { padding: 18px 0; border-bottom: 1px solid #c8bfb1; }
.project-specification-facts dt { color: #756f64; font-size: 11px; margin-bottom: 9px; }
.project-specification-facts dd { margin: 0; font-size: 28px; font-weight: 300; letter-spacing: -.04em; }
.project-specification-facts small { font-size: 13px; color: #756f64; }
.project-specification-text { display: grid; gap: 23px; }
.project-specification-text h4 { margin: 0 0 9px; font-size: 15px; font-weight: 500; letter-spacing: -.02em; }
.project-specification-text p { margin: 0; color: #756f64; font-size: 13px; line-height: 1.85; }
.project-plans-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
.project-plans-grid figure { margin: 0; }
.project-plan-image { position: relative; display: grid; place-items: center; padding: 18px; background: #f5f3ee; border: 1px solid #d2c8b8; overflow: hidden; }
.project-plan-image > img { display: block; width: 100%; height: 245px; object-fit: contain; transition: transform .45s ease; }
.project-plans-grid figcaption { margin-top: 16px; font-size: 11px; color: #756f64; letter-spacing: .12em; }
.project-photo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.project-photo-tile { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: #d2c8b8; border-radius: 4px; }
.project-photo-tile > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease, filter .6s ease; }
.project-image-expand { position: absolute; right: 16px; bottom: 16px; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #ffffff60; background: #24252185; color: #fff; border-radius: 50%; font-size: 12px; opacity: 0; transform: translateY(5px); transition: opacity .3s ease, transform .3s ease; }
@media (hover: hover) {
    .project-photo-tile:hover > img { transform: scale(1.06); filter: brightness(.9); }
    .project-plan-image:hover > img { transform: scale(1.025); }
    [data-project-image]:hover .project-image-expand { opacity: 1; transform: none; }
}
[data-project-image]:focus-visible .project-image-expand { opacity: 1; transform: none; }
.project-lightbox-open { overflow: hidden; }
.project-lightbox { position: fixed; inset: 0; width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 20px 28px; border: 0; background: #151515; color: #f5f3ee; }
.project-lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 16px; }
.project-lightbox::backdrop { background: #151515ed; }
.project-lightbox.is-plan { background: #f5f3ee; color: #2c251f; }
.project-lightbox-toolbar, .project-lightbox-controls { display: flex; align-items: center; gap: 20px; }
.project-lightbox-toolbar { justify-content: space-between; }
.project-lightbox-label { font-size: 12px; }
.project-lightbox-controls { justify-content: center; }
.project-lightbox-count { min-width: 50px; text-align: center; font-size: 12px; }
.project-lightbox button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid currentColor; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.project-lightbox button:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.project-lightbox-stage { min-height: 0; display: flex; align-items: center; justify-content: center; }
.project-lightbox-stage img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 850px) {
    .project-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .project-plan-image { padding: 16px; }
    .project-plans-layout { grid-template-columns: minmax(0, 1fr) 230px; gap: 30px; }
    .project-plan-image > img { height: 220px; }
}
@media (max-width: 700px) {
    .project-plans-layout { grid-template-columns: 1fr; gap: 36px; }
    .project-plans-grid { width: 100%; max-width: 320px; justify-self: center; }
}
@media (max-width: 520px) {
    .project-plans, .project-photo-section { padding-top: 50px; }
    .project-plans-grid { grid-template-columns: 1fr; gap: 28px; }
    .project-plan-image > img { height: 220px; }
    .project-specification-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
    .project-photo-grid { gap: 10px; }
    .project-lightbox { padding: 15px; }
    .project-image-expand { right: 9px; bottom: 9px; width: 28px; height: 28px; opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .project-plan-image > img, .project-photo-tile > img, .project-image-expand { transition: none; }
    .project-plan-image:hover > img, .project-photo-tile:hover > img { transform: none; }
}