/* White editorial direction: quiet surfaces, real photography, precise type. */
:root {
  --paper: #fff;
  --paper-deep: #f7f7f5;
  --ink: #262624;
  --green: #262624;
  --green-deep: #161615;
  --green-light: #65645f;
  --clay: #8c857b;
  --muted: #72716c;
  --line: #deded9;
  --sans: 'Noto Sans KR', Arial, sans-serif;
}
body { word-break: keep-all; }
.site-header { background: rgba(255,255,255,.96); border-bottom: 1px solid #eeeeea; }
.brand-mark { stroke-width: 1.4; }
.wordmark strong { font-size: 23px; letter-spacing: .1em; }
.wordmark small { font-size: 8px; }
.primary-nav { gap: 27px; }
.primary-nav a { font-size: 12px; }
.hero { grid-template-columns: .94fr 1.06fr; gap: 44px; min-height: 710px; padding-block: 74px 95px; }
.hero-copy { padding-block: 12px 24px; }
.hero h1 { font-size: clamp(40px,4.15vw,58px); line-height: 1.46; letter-spacing: -.06em; }
.hero-line { display: block; white-space: nowrap; }
.hero h1 em { color: var(--muted); }
.hero-description { font-size: 14px; line-height: 2; max-width: 390px; margin-top: 27px; }
.hero-note { margin-top: 40px; }
.hero-visual { height: 490px; background: #f0f0ec; }
.hero-visual img { object-fit: cover; filter: none; }
.hero-visual::before, .hero-vertical-label { display: none; }
.hero-visual figcaption { font-size: 9px; bottom: -31px; color: #686761; }
.hero-index { bottom: 32px; }
.eyebrow, .section-kicker { font-size: 10px; }
.button { font-size: 12px; min-height: 51px; }
.button-dark { background: #262624; }
.nav-contact { border-color: #9d9c95; }
.ticker { background: #fff; color: #74736f; border-top: 1px solid #e6e6e1; border-bottom: 1px solid #e6e6e1; height: 56px; font-size: 9px; }
.ticker i { color: #b0aaa1; font-size: 11px; }
.approach h2, .services h2, .work-heading h2, .mood-copy h2,
.process h2, .faq h2, .contact-copy h2, .studio-inner h2,
.archive-cta h2, .case-end h2 { font-size: clamp(35px,3.8vw,49px); line-height: 1.55; }
.approach-body p { font-size: 14px; color: #65645f; }
.approach-body .lead { font-size: 19px; }
.material-image { width: 79%; height: auto; margin-top: 76px; }
.material-image img { height: auto; }
.material-image figcaption, .mood-image figcaption { font-size: 10px; color: #6b6a65; line-height: 1.8; }
.services { background: #f8f8f6; }
.services-heading>p, .process-heading>p { font-size: 13px; line-height: 1.9; }
.service-row p { font-size: 13px; }
.service-tag { font-size: 9px; }
.featured-project { background: #fafaf8; color: var(--ink); padding: 44px; border-top: 1px solid #deded9; border-bottom: 1px solid #deded9; }
.featured-index, .featured-index span:last-child, .project-type, .side-caption { color: #77746d; }
.featured-copy h3 { font-size: 47px; }
.project-intro { color: #65645f; font-size: 13px; }
.button-outline { color: #343430; border: 1px solid #b0afa8; }
.button-outline:hover { background: #262624; color: #fff; }
.featured-side { border-left-color: #d8d8d1; }
.featured-side::before { display: none; }
.side-quote { font-size: 21px; }
.side-caption { font-size: 11px; }
.mood-section { background: #fff; border-top: 1px solid #e9e9e4; border-bottom: 1px solid #e9e9e4; }
.mood-layout { grid-template-columns: 1fr .83fr; gap: 14%; }
.mood-copy>p:not(.eyebrow) { font-size: 14px; line-height: 2; }
.mood-image { height: auto; }
.mood-image img { height: auto; max-height: 650px; object-fit: contain; }
.process-list h3 { font-size: 19px; }
.process-list p { font-size: 13px; }
.studio-band { background: #f6f6f3; color: var(--ink); }
.studio-index, .studio-inner .eyebrow { color: #7b7871; }
.studio-inner h2 em { color: #72716c; }
.studio-inner>div>p:last-child { font-size: 13px; color: #686761; }
.round-link { border-color: #c5c4bd; }
.round-link:hover { background: #262624; color: #fff; }
.faq-list summary { font-size: 14px; padding-block: 24px; }
.faq-list details p { font-size: 13px; }
.faq-heading>p { font-size: 13px; }
.contact-section { background: #fafaf8; color: var(--ink); border-top: 1px solid #e0e0da; }
.contact-copy .eyebrow { color: #77746d; }
.contact-copy h2 em { color: #77746d; }
.contact-copy>p:not(.eyebrow) { font-size: 14px; color: #65645f; }
.contact-direct, .phone-link { border-color: #d7d7d0; }
.phone-link { font-size: 13px; }
.phone-link span:first-child { color: #77746d; }
.contact-form-wrap { background: #fff; border: 1px solid #dfdfd8; padding: 30px; }
.form-heading { color: #65645f; }
.form-dot { background: #888176; }
.form-notice { color: #72716c; border-left-color: #c3bdb3; font-size: 11px; }
.contact-form-wrap label { color: #5f5e58; font-size: 12px; }
.contact-form-wrap input, .contact-form-wrap textarea, .contact-form-wrap select { color: #262624; border-color: #cecec6; font-size: 13px; padding-block: 12px; }
.contact-form-wrap input::placeholder, .contact-form-wrap textarea::placeholder { color: #8c8b84; }
.contact-form-wrap input:focus, .contact-form-wrap textarea:focus, .contact-form-wrap select:focus { border-color: #262624; outline: 1px solid #8c857b; outline-offset: 3px; }
.button-light { background: #262624; color: #fff; border-color: #262624; }
.button-light:hover { background: #fff; color: #262624; }
.form-result { color: #5f5c53; font-size: 12px; }
.site-footer { background: #fff; border-top: 1px solid #e6e6e0; }
.footer-top>p { font-size: 14px; }
.footer-links { font-size: 12px; }
.footer-bottom { font-size: 10px; }
.page-hero h1, .case-hero h1 { font-size: clamp(40px,4.7vw,61px); line-height: 1.5; }
.page-intro { font-size: 14px; }
.archive-card { background: #f7f7f4; }
.archive-visual { background: #f0f0eb; color: #262624; }
.archive-visual::before, .archive-visual::after { border-color: #dadad3; }
.archive-odri { color: #393934; }
.archive-big-number, .archive-visual-caption { color: #77746d; }
.archive-info>p { font-size: 13px; }
.archive-note { font-size: 11px; line-height: 1.8; }
.archive-read { font-size: 12px; }
.case-name { background: #f7f7f4; color: var(--ink); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.case-name .eyebrow, .case-name-index { color: #77746d; }
.case-name h2 em { color: #6a6861; }
.case-name-inner>div>p:not(.eyebrow) { color: #65645f; font-size: 14px; }
.case-name .quote-note { color: #656057!important; }
.story-content>p:not(.eyebrow):not(.case-disclaimer) { font-size: 14px; }
.detail-list p { font-size: 12px; }
.case-meta strong { font-size: 13px; }
.story-content .case-disclaimer { font-size: 11px; }
/* Photographic archive: labels describe visible spaces, not invented project names. */
.photo-archive { padding-top: 40px; padding-bottom: 100px; }
.photo-archive-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; padding: 30px 0; border-top: 1px solid var(--line); }
.photo-archive-heading h2 { font: 400 34px/1.55 var(--serif); letter-spacing: -.05em; margin: 0; }
.photo-archive-heading p { max-width: 390px; font-size: 12px; color: var(--muted); }
.photo-archive-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 45px 30px; align-items: start; }
.photo-archive-grid figure { margin: 0; }
.photo-archive-grid img { width: 100%; height: auto; }
.photo-archive-grid figure:nth-child(2) { padding-top: 70px; }
.photo-archive-grid figure:nth-child(3), .photo-archive-grid figure:nth-child(4) { width: 84%; }
.photo-archive-grid figure:nth-child(4) { margin-left: auto; padding-top: 70px; }
.photo-archive-grid figcaption { display: flex; justify-content: space-between; margin-top: 13px; font-size: 11px; color: #72716c; }
.photo-source { margin: 30px 0 0; font-size: 11px; line-height: 1.9; color: #72716c; }
.photo-source a { border-bottom: 1px solid #b5b2aa; }
/* Testimonials from supplied screenshots: one long review remains one review. */
.reviews { border-top: 1px solid var(--line); }
.reviews__intro { margin-bottom: 45px; }
.reviews__intro .eyebrow { margin-bottom: 18px; }
.reviews__title { margin: 0; max-width: 620px; font: 400 clamp(32px,3.6vw,46px)/1.55 var(--serif); letter-spacing: -.055em; }
.reviews__grid { display: grid; grid-template-columns: .8fr 1fr 1.35fr; align-items: start; }
.review-card { background: #fff; border-top: 1px solid #9e9a91; padding: 27px 25px 5px; min-width: 0; }
.review-card:first-child { padding-left: 0; }
.review-card:last-child { padding-right: 0; }
.review-card+.review-card { border-left: 1px solid #e6e5df; }
.review-card__meta { display: flex; flex-direction: column; gap: 7px; margin-bottom: 23px; }
.review-card__label { font-size: 11px; color: #68655d; letter-spacing: .03em; }
.review-card__project { font-size: 10px; color: #77746d; }
.review-card__quote { margin: 0; }
.review-card__quote p { font-size: 15px; line-height: 2; margin: 0 0 20px; color: #45453f; }
.review-card--message .review-card__quote p:first-child { font-family: var(--serif); font-size: 20px; line-height: 1.9; }
.review-card__source { font-size: 10px; color: #77746d; line-height: 1.8; margin-top: 28px; }
.review-card__details { margin-top: 17px; }
.review-card__more { cursor: pointer; font-size: 12px; color: #393932; padding-block: 9px; }
.review-card__quote--continued { margin-top: 20px; }
.review-card__quote--continued p { font-size: 13px; }
.reviews__disclaimer { color: #77746d; font-size: 11px; margin: 35px 0 0; max-width: 790px; line-height: 1.9; }
@media(max-width:1000px) {
  .primary-nav { gap: 15px; }
  .primary-nav a { font-size: 11px; }
  .hero { gap: 30px; }
  .hero h1 { font-size: 40px; }
  .reviews__grid { grid-template-columns: 1fr 1fr; gap: 30px; }
  .review-card { padding-inline: 0; }
  .review-card+.review-card { border-left: 0; }
  .review-card--neighborhood { grid-column: 1/-1; max-width: 750px; }
}
@media(max-width:720px) {
  .site-header { height: 72px; }
  .primary-nav { top: 71px; background: #fff; }
  .primary-nav a { font-size: 13px; }
  .wordmark strong { font-size: 19px; }
  .hero { display: flex; gap: 0; min-height: auto; padding-block: 49px 44px; }
  .hero h1 { font-size: clamp(30px,8.6vw,43px); line-height: 1.5; }
  .hero-copy { padding-bottom: 36px; }
  .hero-description { font-size: 13px; margin-top: 20px; }
  .hero-visual { height: auto; margin-right: 0; }
  .hero-visual img { height: auto; }
  .hero-visual figcaption { font-size: 8px; bottom: -29px; }
  .hero-index { margin-top: 47px; }
  .ticker { font-size: 8px; height: 46px; }
  .eyebrow, .section-kicker { font-size: 9px; }
  .approach h2, .services h2, .work-heading h2, .mood-copy h2, .process h2, .faq h2, .contact-copy h2, .studio-inner h2 { font-size: 34px; }
  .approach-body p { font-size: 13px; }
  .material-image { width: 100%; height: auto; margin-top: 45px; }
  .service-row p, .process-list p { font-size: 12px; }
  .services-heading>p, .process-heading>p { font-size: 12px; }
  .featured-project { padding: 27px 22px; }
  .featured-side { border-top-color: #d8d8d1; }
  .project-intro { font-size: 12px; }
  .side-caption { font-size: 10px; }
  .mood-layout { grid-template-columns: 1fr; gap: 35px; }
  .mood-copy>p:not(.eyebrow) { font-size: 13px; }
  .mood-image img { max-height: none; }
  .studio-inner>div>p:last-child { font-size: 12px; }
  .faq-list summary { font-size: 13px; }
  .faq-list details p, .faq-heading>p { font-size: 12px; }
  .contact-copy>p:not(.eyebrow) { font-size: 13px; }
  .contact-form-wrap { padding: 24px 20px; }
  .phone-link { font-size: 12px; }
  .form-notice { font-size: 10px; }
  .footer-top>p { font-size: 12px; }
  .footer-links { font-size: 10px; }
  .footer-bottom { font-size: 9px; }
  .mobile-contact { background: #fff; color: #262624; border-top: 1px solid #dddcd5; box-shadow: 0 -3px 14px rgba(0,0,0,.04); }
  .mobile-contact span:first-child, .mobile-contact span:last-child { color: #68655d; }
  .page-hero h1, .case-hero h1 { font-size: 36px; }
  .page-intro { font-size: 13px; }
  .photo-archive { padding-bottom: 70px; }
  .photo-archive-heading { display: block; }
  .photo-archive-heading h2 { font-size: 28px; }
  .photo-archive-grid { grid-template-columns: 1fr; gap: 31px; }
  .photo-archive-grid figure:nth-child(n) { width: 100%; padding-top: 0; margin-left: 0; }
  .reviews__intro { margin-bottom: 32px; }
  .reviews__title { font-size: 32px; }
  .reviews__grid { grid-template-columns: 1fr; gap: 32px; }
  .review-card { padding: 23px 0 0; }
  .review-card__quote p { font-size: 14px; }
  .review-card__source { margin-top: 20px; }
  .case-name-inner>div>p:not(.eyebrow), .story-content>p:not(.eyebrow):not(.case-disclaimer) { font-size: 13px; }
  .detail-list p { font-size: 11px; }
}
@media(max-width:390px) {
  .hero h1 { font-size: 30px; }
  .hero-line { white-space: normal; }
  .hero-description { font-size: 12px; }
}

/* Field journal: the designer's words, without a marketing rewrite. */
.site-journal { padding-block: 58px 110px; border-top: 1px solid var(--line); display: grid; grid-template-columns: .75fr 1.25fr; gap: 10%; }
.journal-heading h2 { font: 400 32px/1.65 var(--serif); letter-spacing: -.05em; margin: 0 0 22px; }
.journal-heading>p:last-child { font-size: 12px; color: var(--muted); }
.journal-prose { max-width: 700px; }
.journal-prose p { font-size: 15px; line-height: 2.2; color: #52514b; margin: 0 0 28px; }
.journal-prose p:nth-child(4) { font-family: var(--serif); font-size: 21px; color: #393932; padding: 22px 0; border-block: 1px solid var(--line); }
.journal-prose p:nth-child(9), .journal-prose p:last-child { font-family: var(--serif); font-size: 25px; color: #34342e; line-height: 1.8; margin-block: 30px; }
.project-card+.project-card { margin-top: 40px; }
.project-photo { padding: 0; background: #f3f3ef; }
.project-photo::before, .project-photo::after { display: none; }
.project-photo img { height: 100%; width: 100%; object-fit: cover; }
.project-photo-card { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 38px; background: #fafaf8; border-block: 1px solid var(--line); }
.project-photo-card>img { min-height: 310px; }
.project-photo-card__copy { padding: 38px; align-self: center; }
.project-photo-card h3 { font: 400 32px/1.5 var(--serif); letter-spacing: -.04em; margin: 12px 0 18px; }
.project-photo-card p { font-size: 13px; line-height: 1.9; color: var(--muted); }
.photo-status { font-size: 11px!important; color: #807c73!important; }
/* Original screenshot pixels, with private identities removed. */
.review-captures { margin: 26px 0 0; }
.review-captures__heading { font-size: 10px; color: #72716c; margin: 0 0 12px; letter-spacing: .04em; }
.capture-thumbnails { display: grid; grid-template-columns: 1fr; gap: 12px; }
.capture-thumbnails--sequence { grid-template-columns: 1fr 1fr; }
.capture-link { display: block; padding: 8px; border: 1px solid #e2e1db; background: #f8f8f5; transition: border-color .2s; }
.capture-link:hover { border-color: #8d877c; }
.capture-link img { width: 100%; height: 150px; object-fit: contain; object-position: top center; }
.capture-thumbnails--sequence img { height: 190px; object-fit: cover; object-position: top center; }
.capture-link span { display: flex; justify-content: space-between; gap: 8px; margin-top: 9px; font-size: 10px; color: #625f57; }
.capture-is-open { overflow: hidden; }
.capture-dialog { border: 1px solid #d5d3cb; border-radius: 0; padding: 0; width: min(920px,calc(100vw - 44px)); max-height: 90vh; max-height: 90dvh; color: #262624; background: #fff; box-shadow: 0 12px 80px rgba(0,0,0,.12); }
.capture-dialog::backdrop { background: rgba(24,24,22,.68); }
.capture-dialog__header { display: flex; justify-content: space-between; align-items: center; padding: 16px 22px; border-bottom: 1px solid var(--line); gap: 20px; }
.capture-dialog__header h2 { margin: 0; font: 400 16px/1.6 var(--sans); }
.capture-dialog__header button, .capture-dialog__footer button { cursor: pointer; padding: 8px 13px; border: 1px solid #b8b5ac; color: #36342e; background: #fff; font-size: 12px; }
.capture-dialog__header button:hover, .capture-dialog__footer button:hover:not(:disabled) { background: #f0efe9; }
.capture-dialog__stage { padding: 24px; background: #f5f5f0; overflow: auto; max-height: 64vh; max-height: 64dvh; }
.capture-dialog__image { width: 100%; height: auto; max-width: 820px; margin-inline: auto; object-fit: contain; }
.capture-dialog__footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 22px; border-top: 1px solid var(--line); }
.capture-dialog__count { font-size: 11px; color: #737067; white-space: nowrap; }
.capture-dialog__footer p { font-size: 11px; color: #737067; margin: 0; line-height: 1.7; }
.capture-dialog__navigation { display: flex; gap: 8px; }
.capture-dialog button:disabled { opacity: .4; cursor: default; }
@media(max-width:720px) {
  .site-journal { padding-block: 35px 70px; grid-template-columns: 1fr; gap: 30px; }
  .journal-heading h2 { font-size: 27px; }
  .journal-prose p { font-size: 14px; line-height: 2.1; margin-bottom: 25px; }
  .journal-prose p:nth-child(4) { font-size: 18px; }
  .journal-prose p:nth-child(9), .journal-prose p:last-child { font-size: 21px; }
  .project-photo-card { grid-template-columns: 1fr; }
  .project-photo-card>img { min-height: 0; height: auto; }
  .project-photo-card__copy { padding: 27px 24px; }
  .project-photo-card h3 { font-size: 27px; }
  .capture-link img { height: 190px; }
  .capture-thumbnails--sequence img { height: 220px; }
  .capture-dialog { width: calc(100vw - 24px); max-height: 94vh; max-height: 94dvh; }
  .capture-dialog__header { padding: 12px 14px; }
  .capture-dialog__stage { padding: 12px; max-height: 65vh; max-height: 65dvh; }
  .capture-dialog__footer { padding: 12px 14px; gap: 10px; flex-wrap: wrap; }
  .capture-dialog__footer p { width: 100%; order: 3; font-size: 10px; }
  .capture-dialog__navigation { margin-left: auto; }
}

/* Actual inquiry form: compact, neutral, and readable within the existing white layout. */
.form-notice--live { border-left-color: #8b867c; }
.inquiry-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.inquiry-consent { display: grid; gap: 11px; margin-top: 2px; }
.contact-form-wrap .inquiry-check { display: flex; align-items: flex-start; gap: 9px; color: #4f4e49; font-size: 11px; line-height: 1.7; cursor: pointer; }
.contact-form-wrap .inquiry-check input { appearance: none; flex: 0 0 15px; width: 15px; height: 15px; min-height: 15px; margin: 2px 0 0; padding: 0; border: 1px solid #8f8e87; border-radius: 0; background: #fff; cursor: pointer; }
.contact-form-wrap .inquiry-check input:checked { border-color: #262624; background: #262624; box-shadow: inset 0 0 0 3px #fff; }
.contact-form-wrap .inquiry-check input:focus-visible { outline: 2px solid #262624; outline-offset: 3px; }
.contact-form-wrap .inquiry-check b { color: #6b6861; font-weight: 500; }
.privacy-details { border-top: 1px solid #deded8; border-bottom: 1px solid #deded8; color: #67655f; }
.privacy-details summary { padding: 11px 2px; color: #4f4e49; font-size: 11px; cursor: pointer; }
.privacy-details > div { padding: 0 2px 12px; }
.privacy-details p { margin: 0 0 5px; font-size: 10px; line-height: 1.7; }
.privacy-details p:last-child { margin-bottom: 0; }
.privacy-details b { color: #3e3d39; font-weight: 600; }
.privacy-details .privacy-caution { margin-top: 9px; color: #625d55; }
.form-submit[disabled] { cursor: wait; opacity: .72; }
.form-result[data-state="pending"] { color: #67655f; }
.form-result[data-state="success"] { color: #3e5141; }
.form-result[data-state="error"] { color: #7a4a3e; }
.form-noscript { margin: 17px 0 0; color: #625f58; font-size: 11px; line-height: 1.8; }
.form-noscript a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 720px) {
  .contact-form-wrap .inquiry-check { font-size: 10px; }
  .privacy-details summary { font-size: 10px; }
  .privacy-details p, .form-noscript { font-size: 9px; }
}

/* Verified project essentials, without invented scope, dates or budgets. */
.project-facts { padding-block: 34px 45px; border-top: 1px solid var(--line); margin-bottom: 35px; }
.project-facts h2 { font-family: var(--serif); font-size: 25px; font-weight: 400; line-height: 1.6; margin: 0 0 23px; }
.project-facts dl { margin: 0; }
.project-facts dl>div { display: flex; align-items: baseline; gap: 25px; padding-block: 16px; border-top: 1px solid var(--line); }
.project-facts dt { flex: 0 0 110px; font-size: 12px; color: var(--muted); }
.project-facts dd { margin: 0; max-width: 720px; font-size: 14px; color: #65645f; line-height: 1.9; }
.project-facts>p { font-size: 11px; color: var(--muted); line-height: 1.8; margin: 20px 0 0; }
.project-facts a { text-decoration: underline; text-underline-offset: 4px; }
.footer-policy { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 650px) {
  .project-facts { padding-block: 26px 32px; margin-bottom: 20px; }
  .project-facts h2 { font-size: 22px; margin-bottom: 18px; }
  .project-facts dl>div { display: block; padding-block: 15px; }
  .project-facts dt { margin-bottom: 7px; }
  .project-facts dd { font-size: 13px; }
}
