.project-section { padding-block: clamp(4.5rem, 7.5vw, 8rem); scroll-margin-top: 2rem; }
.partner-projects { background: #f2f2f2; color: #222222; color-scheme: light; }
.mcdl-projects, .project-page { background: #f6f5f1; color: #222222; color-scheme: light; }
.project-section-intro { display: flex; justify-content: space-between; align-items: end; gap: 3rem; margin-bottom: 3rem; }
.project-section-intro h2, .project-section-intro h1, .story-heading h1 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: clamp(2.7rem, 4.2vw, 5rem); line-height: 1.08; letter-spacing: -.045em; margin: 0; }
.project-section-intro em { font-weight: 400; color: #927039; }
.project-section-intro > p { max-width: 27rem; margin: 0 0 .3rem; line-height: 1.8; color: #666666; font-size: 1.05rem; }
.partner-project-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.partner-project { margin: 0; grid-column: span 2; min-width: 0; }
.partner-project:nth-child(-n+2) { grid-column: span 3; }
.partner-project img { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; }
.partner-project figcaption { padding-top: 1rem; display: flex; gap: .8rem; align-items: baseline; flex-wrap: wrap; }
.partner-project-number { font-size: .75rem; color: #666666; }
.partner-project h3 { margin: 0; font-family: Georgia, serif; font-size: clamp(1.2rem, 1.7vw, 1.8rem); font-weight: 400; }
.partner-project p { margin: .4rem 0 0; color: #666666; font-size: .875rem; }
.partner-project small { margin-left: auto; font-size: .65rem; color: #666666; }
.project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; }
.project-card { min-width: 0; display: flex; flex-direction: column; border-bottom: 1px solid #c9c5ba; }
.project-card-image { position: relative; margin: 0; background: #e4e0d6; overflow: hidden; }
.project-card-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; display: block; object-fit: cover; transition: transform .35s; }
.project-card:nth-child(2) .project-card-image img { object-fit: contain; padding: 1.5rem; }
.project-card-image figcaption { position: absolute; bottom: .8rem; left: .8rem; background: #f6f5f1ee; padding: .4rem .65rem; font-size: .65rem; color: #333333; }
.project-card-copy { display: flex; flex-direction: column; flex: 1; padding: 1.75rem 0; }
.project-card .section-eyebrow { font-size: .65rem; color: #79613c; line-height: 1.7; }
.project-card h3 { font-family: Georgia, serif; font-weight: 400; font-size: clamp(1.6rem, 2.15vw, 2.5rem); line-height: 1.2; letter-spacing: -.025em; margin: .8rem 0 1rem; }
.project-card-copy > p:not(.section-eyebrow) { color: #666666; font-size: .95rem; line-height: 1.8; margin: 0 0 1.5rem; }
.project-read-more { display: inline-flex; justify-content: space-between; align-items: center; gap: 2rem; min-height: 44px; padding: .7rem 1rem; border: 1px solid #bdbdbd; font-size: .85rem; font-weight: 600; align-self: start; margin-top: auto; transition: background .2s, color .2s; }
.project-read-more:hover { color: #fff; background: #222222; border-color: #222222; }
.project-read-more:focus-visible, .project-back:focus-visible { outline: 3px solid #927039; outline-offset: 5px; }
.project-page .site-header { color: #f4f1eb; color-scheme: dark; }
.project-main { padding-top: var(--header-height); }
.project-main .project-section-intro { margin-top: 2rem; }
.project-story { padding-block: 3rem 6rem; }
.project-back { display: inline-block; padding-block: .75rem; font-size: .85rem; }
.story-heading { max-width: 65rem; margin-block: 3rem; }
.story-heading h1 { margin-block: 1.5rem; font-size: clamp(2.7rem, 5.5vw, 6rem); }
.story-heading .section-description { max-width: 42rem; color: #666666; }
.story-image { margin: 0; }
.story-image img { display: block; width: 100%; height: clamp(20rem, 48vw, 42rem); object-fit: cover; background: #e4e0d6; }
.story-image img[src*="artplate"] { object-fit: contain; padding: 2rem; }
.story-image figcaption { padding-block: 1rem; font-size: .75rem; color: #666666; }
.story-body { display: grid; grid-template-columns: 1fr 2fr; gap: 4rem; border-top: 1px solid #d7d4cb; margin-top: 2rem; padding-top: 3rem; }
.story-body aside p:not(.section-eyebrow) { margin: .7rem 0 2rem; font-size: .9rem; line-height: 1.6; }
.story-body h2 { font-family: Georgia, serif; font-size: 2.2rem; font-weight: 400; margin: 0 0 1rem; }
.story-body > div > p { line-height: 1.9; font-size: 1.125rem; color: #666666; max-width: 44rem; margin: 0 0 2rem; }
@media (max-width: 1000px) { .project-section-intro { align-items: start; } .project-section-intro > p { max-width: 20rem; } .partner-project small { margin-left: 1.7rem; width: 100%; } .project-grid { gap: 1rem; } }
@media (max-width: 760px) { .project-section-intro { flex-direction: column; gap: 1.5rem; } .project-section-intro > p { max-width: 34rem; } .project-grid { grid-template-columns: 1fr; gap: 3rem; } .project-card h3 { font-size: 2rem; } .partner-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1rem; } .partner-project, .partner-project:nth-child(-n+2) { grid-column: span 1; } .partner-project:first-child { grid-column: 1 / -1; } .partner-project-number { display: none; } .partner-project small { margin-left: 0; } .story-body { grid-template-columns: 1fr; gap: 1rem; } }
@media (prefers-reduced-motion: reduce) { .project-card-image img, .project-read-more { transition: none; } }
/* Three-card carousel advances one project per step. */
.project-carousel { --visible-projects: 3; --project-gap: 1.75rem; }
.project-carousel:focus-visible { outline: 2px solid #927039; outline-offset: 8px; }
.project-carousel-window { overflow: hidden; }
.project-carousel-track { display: flex; gap: var(--project-gap); transition: transform .65s cubic-bezier(.22,.61,.36,1); }
.project-carousel .project-card { flex: 0 0 calc((100% - 2 * var(--project-gap)) / 3); }
.project-carousel .project-card-image img[src*="artplate"], .project-carousel .project-card-image img[src*="ballpen"] { object-fit: contain; padding: 1.5rem; }
.project-carousel .project-card:not(:has(img[src*="artplate"])) .project-card-image img:not([src*="ballpen"]) { object-fit: cover; padding: 0; }
.client-section { background: #fff; color: #222222; padding-block: clamp(3rem, 5vw, 6rem); text-align: center; }
.client-section .section-eyebrow { color: #79613c; }
.client-section h2 { font: 400 clamp(2.5rem, 4vw, 4rem) Georgia, serif; margin: 1rem 0 3rem; letter-spacing: -.04em; }
.client-logos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 2rem; align-items: center; }
.client-logos li { display: flex; justify-content: center; align-items: center; min-height: 70px; }
.client-logos img { display: block; width: 100%; max-width: 105px; height: 60px; object-fit: contain; }
@media (max-width: 1000px) { .client-logos { grid-template-columns: repeat(4, minmax(0,1fr)); } }
@media (max-width: 760px) { .project-carousel { --visible-projects: 1; --project-gap: 1rem; } .project-carousel .project-card { flex-basis: 100%; } .client-logos { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; } }
@media (prefers-reduced-motion: reduce) { .project-carousel-track { transition: none; } }
.projects-footer { margin-top: 2.5rem; text-align: center; }
.contact-section { background: #000000; color: #f4f1e9; padding-block: clamp(4.5rem,7.5vw,8rem); }
.contact-section .section-heading { border-color: #ffffff26; }
.contact-section .section-eyebrow { color: #d5b785; }
.contact-section .section-side-note { color: #cccccc; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem,7vw,8rem); align-items: start; }
.contact-copy h2 { margin: 0 0 2rem; font: 400 clamp(2.7rem,4.2vw,5rem)/1.08 Georgia,serif; letter-spacing: -.045em; }
.contact-copy h2 em { color: #d5b785; font-weight: 400; }
.contact-copy blockquote { margin: 0 0 1.5rem; max-width: 36rem; font-size: 1.08rem; line-height: 1.9; color: #d8d8d8; }
.contact-prompt { max-width: 30rem; margin: 1rem 0 0; color: #d8d8d8; line-height: 1.7; }
.contact-addresses { display: flex; flex-direction: column; align-items: start; gap: .6rem; margin-top: 2.5rem; }
.contact-addresses p { margin: 0 0 .5rem; color: #d5b785; font-size: .8rem; text-transform: uppercase; letter-spacing: .12em; }
.contact-addresses a { font-size: 1rem; overflow-wrap: anywhere; text-decoration: underline; text-underline-offset: .3rem; text-decoration-color: #ffffff40; }
.contact-form { padding: clamp(1.5rem,3vw,3rem); background: #111111; border: 1px solid #ffffff1a; }
.contact-form h3 { margin: 0 0 2rem; font: 400 1.85rem/1.25 Georgia,serif; }
.contact-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.contact-form label { display: block; font-size: .875rem; margin-bottom: .6rem; }
.contact-form label span { color: #b5b5b5; font-size: .75rem; }
.contact-form input,.contact-form textarea { width: 100%; min-width: 0; font: inherit; font-size: .9rem; line-height: 1.6; color: #f4f1e9; background: #000000; border: 1px solid #ffffff36; border-radius: 0; padding: .85rem 1rem; margin-bottom: 1.4rem; }
.contact-form textarea { resize: vertical; min-height: 9rem; }
.contact-form input::placeholder,.contact-form textarea::placeholder { color: #b0b0b0; }
.contact-form input:focus-visible,.contact-form textarea:focus-visible,.contact-addresses a:focus-visible { outline: 2px solid #d5b785; outline-offset: 3px; }
.contact-form-note,.contact-status { font-size: .8rem; line-height: 1.7; color: #d0d0d0; margin: 0 0 1.5rem; }
.contact-status:empty { display: none; }
.contact-status { margin: 1.25rem 0 0; }
.contact-success { padding: 2rem; border: 1px solid #d5b785; color: #f0d8aa; font: 400 clamp(1.5rem, 2.5vw, 2.2rem)/1.35 Georgia, serif; }
.contact-error { color: #f0aaa0; }
.contact-success-screen { grid-column: 1 / -1; min-height: 22rem; display: grid; place-content: center; gap: 1.25rem; padding: clamp(2rem, 7vw, 7rem); border: 1px solid #d5b785; text-align: center; }
.contact-success-screen .section-eyebrow { margin: 0; }
.contact-success-screen h2 { max-width: 52rem; margin: 0 auto; color: #f0d8aa; font: 400 clamp(2rem, 4vw, 4.5rem)/1.15 Georgia, serif; letter-spacing: -.035em; }
.contact-form button { cursor: pointer; font-family: inherit; }
@media(max-width:760px) { .contact-grid,.contact-fields { grid-template-columns: 1fr; } .contact-fields { gap: 0; } .client-logos img { max-width: 90px; height: 50px; } }