/* UI UX Pro Max: Minimalism & Swiss Style + Portfolio Grid, on the original page. */
html { font-size: var(--review-body); }
.wrap, .section, .nav-inner, .foot-inner {
  width: min(var(--max), calc(100% - var(--review-edge) * 2));
  max-width: var(--max);
  margin-inline: auto;
  padding-inline: 0;
}
.nav {
  height: var(--nav-h);
  border-bottom: 0;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--canvas) 97%, transparent),
    color-mix(in srgb, var(--canvas) 86%, transparent) 26%,
    color-mix(in srgb, var(--canvas) 69%, transparent) 50%,
    color-mix(in srgb, var(--canvas) 47%, transparent) 70%,
    color-mix(in srgb, var(--canvas) 21%, transparent) 88%,
    transparent
  );
}
@media (prefers-reduced-transparency: reduce) {
  .nav { background: var(--canvas); }
}
.nav-inner { height: var(--nav-h); gap: var(--review-heading-gap); }
.badge { display: flex; align-items: center; justify-content: center; min-width: var(--review-control); min-height: var(--review-control); }
.badge-mark { width: var(--review-logo-size); height: var(--review-logo-size); }
.nav-links a, .lang button { font-size: var(--review-meta); min-height: var(--review-control); }
.nav .lang button:not(.is-on), .nav-links a.is-on { color: var(--ink-ui); }
.lang { gap: var(--review-control-gap); }
.lang button { min-width: var(--review-control); padding-inline: 0; }
.nav-toggle { width: var(--review-control); height: var(--review-control); }
.nav-drawer { top: var(--nav-h); }
.nav-drawer-lang .lang button { min-width: var(--review-control); }
a:focus-visible, button:focus-visible, .nav-toggle:focus-visible {
  outline: var(--review-focus) solid var(--ink);
  outline-offset: var(--review-focus-offset);
}
.nav-links a:hover, .foot a:hover { opacity: 1; text-decoration: underline; text-underline-offset: var(--review-focus-offset); }
.hero { padding-top: var(--review-hero-top); }
.hero-copy { display: grid; grid-template-columns: minmax(0, 1fr) var(--review-summary-width); gap: var(--gap); align-items: end; margin-bottom: var(--review-copy-gap); }
.hero h1 { font-size: var(--fs-h1); font-weight: var(--review-copy-weight); line-height: var(--review-display-leading); max-width: none; }
.hero .lede { font-size: var(--review-lede); line-height: var(--review-body-leading); color: var(--mute); margin-top: 0; }
.hero-summary .review-action { margin-top: var(--review-feature-gap); }
.review-action { display: inline-flex; align-items: center; justify-content: center; gap: var(--review-feature-gap); min-height: var(--review-control); padding-inline: var(--review-control-padding); font-size: var(--review-meta); font-weight: var(--review-title-weight); background: var(--ink); color: var(--paper); cursor: pointer; transition: background var(--review-motion) ease; }
.review-action:hover { background: var(--ink-ui); }
.hero-well { aspect-ratio: var(--review-media-ratio); max-height: var(--review-media-cap); }
.hero-well > video { object-position: center; }
.reel-control { position: absolute; z-index: 2; bottom: var(--review-feature-gap); right: var(--review-feature-gap); width: var(--review-control); height: var(--review-control); padding: 0; border: 0; background: transparent; color: var(--paper); cursor: pointer; }
.reel-control:not([hidden]) { display: grid; place-items: center; }
.reel-control svg { width: var(--review-feature-gap); height: var(--review-feature-gap); fill: currentColor; stroke: var(--ink); stroke-width: 1; paint-order: stroke fill; opacity: .75; }
.reel-control:hover svg, .reel-control:focus-visible svg { opacity: 1; }
.reel-control:focus-visible { outline-color: var(--paper); }
.reel-pause, .reel-control[data-playing="true"] .reel-play { display: none; }
.reel-control[data-playing="true"] .reel-pause { display: block; }
.section { margin-top: var(--review-section-space); }
.section-head { display: flex; justify-content: space-between; align-items: center; gap: var(--gap); margin-bottom: var(--review-heading-gap); }
.section-head h2 { color: var(--ink); font-size: var(--fs-h2); font-weight: var(--review-heading-weight); line-height: var(--review-title-leading); }
.all-work { display: inline-flex; align-items: center; min-height: var(--review-control); gap: var(--review-caption-gap); font-size: var(--review-meta); text-decoration: underline; text-underline-offset: var(--review-focus-offset); white-space: nowrap; }
.work-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--review-heading-gap) var(--gap); align-items: start; }
.work-card { display: block; min-width: 0; }
.work-picture, .service-picture { display: block; overflow: hidden; border-radius: var(--r-card); background: var(--review-surface); }
.work-picture { aspect-ratio: var(--review-primary-ratio); }
.work-picture img { display: block; width: 100%; height: 100%; object-fit: cover; scale: var(--review-thumbnail-zoom, 1); transition: transform var(--review-image-motion) ease; }
.work-picture--film { --review-thumbnail-zoom: var(--review-film-crop); }
.work-picture--panorama { --review-thumbnail-zoom: var(--review-panorama-crop); }
.work-picture--editor img { object-position: left center; }
.work-picture--seats img { object-position: right center; }
.work-card:hover img, .service-card:hover img { transform: scale(var(--review-image-scale)); }
.work-caption { display: grid; gap: var(--review-fine-gap); margin-top: var(--review-caption-gap); }
.work-caption h3 { font-size: var(--review-title); font-weight: var(--review-title-weight); line-height: var(--review-caption-leading); letter-spacing: var(--trk); }
.work-caption p { font-size: var(--review-meta); color: var(--mute); }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.service-card { display: block; min-width: 0; }
.service-picture img { transition: transform var(--review-image-motion) ease; }
.service-copy { margin-top: var(--review-feature-gap); }
.service-copy h3 { font-size: var(--review-feature-title); font-weight: var(--review-title-weight); line-height: var(--review-caption-leading); letter-spacing: var(--trk); }
.service-copy p { font-size: var(--review-body); line-height: var(--review-body-leading); color: var(--mute); margin-top: var(--review-caption-gap); }
.consult { margin-top: var(--review-heading-gap); color: var(--ink); font-size: var(--review-body); }
.consult a { display: inline-block; padding-block: var(--review-caption-gap); text-decoration: underline; text-underline-offset: var(--review-focus-offset); }
.partners-logos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--review-partner-gap); }
.partners-logos li { min-height: var(--review-control); display: flex; justify-content: center; align-items: center; }
.partners-logos img { width: auto; max-width: 100%; height: var(--review-partner-height); max-height: none; object-fit: contain; }
#contact { padding-top: var(--review-contact-space); padding-bottom: var(--review-contact-space); }
.contact-mail { font-size: var(--review-contact-size); font-weight: var(--review-heading-weight); line-height: var(--review-title-leading); margin: 0; max-width: 100%; }
.contact-mail:hover { opacity: 1; text-decoration: underline; text-decoration-thickness: var(--review-focus); text-underline-offset: var(--review-focus-offset); }
.contact-hint { margin-top: var(--review-caption-gap); font-size: var(--review-meta); }
.contact-hint a { display: inline-block; min-height: var(--review-control); color: var(--mute); padding-block: var(--review-caption-gap); }
.foot { margin-top: var(--review-footer-space); padding-block: var(--review-footer-inset); }
.foot-inner { gap: var(--gap); align-items: center; }
.foot p, .foot a { font-size: var(--review-legal); line-height: var(--review-body-leading); color: var(--mute); }
.foot-links { gap: var(--review-feature-gap); }
.foot-links a { display: inline-flex; align-items: center; min-height: var(--review-control); color: var(--ink); }
.foot-biz { max-width: none; }
.foot-biz p, .foot-biz a { font-size: var(--review-legal); color: var(--mute); line-height: var(--review-body-leading); }
.atomic { white-space: nowrap; }
.skip-link { position: fixed; z-index: 100; top: var(--review-control-gap); left: var(--review-edge); padding: var(--review-caption-gap) var(--review-control-padding); background: var(--ink); color: var(--paper); transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.read-link:hover { text-decoration: underline; text-underline-offset: var(--review-focus-offset); }
.story-head { margin-bottom: var(--review-heading-gap); }
.section-kicker { margin-bottom: var(--review-feature-gap); font-size: var(--review-meta); font-weight: var(--review-title-weight); letter-spacing: var(--review-eyebrow-tracking); }
.story-head h2 { color: var(--ink); font-size: var(--review-case-title); font-weight: var(--review-heading-weight); line-height: var(--review-title-leading); letter-spacing: var(--trk); word-break: keep-all; }
.section-note { max-width: var(--review-reading-width); margin-top: var(--review-feature-gap); font-size: var(--review-lede); line-height: var(--review-body-leading); color: var(--mute); }
.review-section p, .review-section li, .review-section dd { line-height: var(--review-body-leading); }
.purpose-list { border-bottom: var(--review-rule) solid var(--line); }
.purpose-row { display: grid; grid-template-columns: var(--review-control) minmax(0, 1fr) auto; align-items: start; gap: var(--gap); padding-block: var(--review-heading-gap); border-top: var(--review-rule) solid var(--line); }
.purpose-row h3 { font-size: var(--review-feature-title); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); }
.purpose-row p { max-width: var(--review-reading-width); margin-top: var(--review-caption-gap); color: var(--mute); }
.row-number { font-size: var(--review-number-size); line-height: var(--review-title-leading); }
.purpose-type { display: inline-flex; align-items: center; gap: var(--review-feature-gap); font-size: var(--review-meta); padding-block: var(--review-fine-gap); }
.work-caption .work-summary { font-size: var(--review-body); line-height: var(--review-body-leading); color: var(--ink); margin-top: var(--review-control-gap); }
.work-caption .case-credit, .case-credit { font-size: var(--review-legal); color: var(--mute); margin-top: var(--review-caption-gap); }
.case-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: var(--review-heading-gap); align-items: start; margin-bottom: var(--review-heading-gap); }
.case-split > *, .studio-content > *, .software-breakdown > *, .brief-grid > * { min-width: 0; }
.story-copy > p + p { margin-top: var(--review-feature-gap); }
.case-facts { margin-top: var(--review-heading-gap); }
.case-facts > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); gap: var(--review-feature-gap); padding-block: var(--review-feature-gap); border-top: var(--review-rule) solid var(--line); }
.case-facts dt { font-size: var(--review-meta); color: var(--mute); }
.case-facts dd { margin: 0; }
.read-link { display: inline-flex; align-items: center; gap: var(--review-feature-gap); min-height: var(--review-control); margin-top: var(--review-feature-gap); font-size: var(--review-meta); font-weight: var(--review-title-weight); }
.story-media { margin: 0; min-width: 0; }
.case-photo { display: block; aspect-ratio: var(--review-primary-ratio); overflow: hidden; border-radius: var(--r-card); background: var(--canvas-2); }
.case-photo img { display: block; width: 100%; height: 100%; object-fit: cover; scale: var(--case-photo-crop, 1); }

/* Keep the framing consistent for source files with baked-in borders. */
.case-photo img:is([src$="/changdeokgung/hero.jpg"], [src$="/changdeokgung/still-01.jpg"]) {
  --case-photo-crop: var(--review-case-panorama-crop);
}
.case-photo img:is(
  [src$="/casaroma.jpg"], [src$="/casaroma/hero.png"], [src$="/casaroma/still-01.png"], [src$="/casaroma/still-03.png"],
  [src$="/das/hero.png"], [src$="/das/still-01.png"], [src$="/das/still-02.png"], [src$="/das/still-03.png"],
  [src$="/das/still-05.png"], [src$="/das/still-06.png"], [src$="/das/webflow-seat-tray.png"]
) {
  --case-photo-crop: var(--review-case-film-crop);
}
.case-photo img:is([src$="/casaroma/still-02.png"], [src$="/snaptoon/hero.jpg"], [src$="/snaptoon/still-02.jpg"]) {
  --case-photo-crop: var(--review-case-tight-crop);
}
.case-photo img:is(
  [src$="/bathroom/still-01.jpg"], [src$="/bathroom/still-02.jpg"], [src$="/bathroom/still-03.jpg"],
  [src$="/vtouch/still-02.png"], [src$="/vtouch/still-07.png"], [src$="/vtouch/still-08.png"], [src$="/vtouch/webflow-gesture-panel.png"]
) {
  --case-photo-crop: var(--review-case-inset-crop);
}
.case-photo img:is([src$="/bathroom/hero.png"], [src$="/snaptoon/still-01.png"], [src$="/snaptoon.jpg"]) { object-position: left center; }
.story-media figcaption, .media-note { margin-top: var(--review-caption-gap); color: var(--mute); font-size: var(--review-meta); line-height: var(--review-body-leading); }
.gallery-buttons { display: flex; flex-wrap: wrap; gap: var(--review-control-gap); margin-top: var(--review-feature-gap); }
.gallery-buttons[hidden], [data-gallery-frame][hidden] { display: none; }
.gallery-buttons button { min-height: var(--review-control); padding-inline: var(--review-control-padding); font-size: var(--review-meta); border: var(--review-rule) solid var(--line); background: var(--paper); color: var(--ink); cursor: pointer; }
.gallery-buttons button[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.three-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--review-heading-gap); border-top: var(--review-rule) solid var(--line); padding-top: var(--review-heading-gap); }
.note-number { display: block; font-size: var(--review-meta); margin-bottom: var(--review-feature-gap); }
.three-notes h3 { font-size: var(--review-title); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); }
.three-notes p { color: var(--mute); margin-top: var(--review-caption-gap); }
.image-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); margin-top: var(--review-heading-gap); }
.visual-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--review-heading-gap); }
.visual-article h3 { margin-top: var(--review-feature-gap); font-size: var(--review-feature-title); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); }
.visual-article > p { margin-top: var(--review-feature-gap); }
.visual-article .detail-note { color: var(--mute); }
.case-takeaways { margin: var(--review-feature-gap) 0 0; padding-left: var(--review-control-padding); }
.case-takeaways li + li { margin-top: var(--review-caption-gap); }
#exhibition-case .case-split { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.software-breakdown { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: var(--review-heading-gap); align-items: start; }
.process-list { list-style: none; margin: 0; padding: 0; border-bottom: var(--review-rule) solid var(--line); }
.process-list li { display: grid; grid-template-columns: var(--review-control) minmax(0, 1fr) minmax(0, 1.8fr); gap: var(--gap); padding-block: var(--review-heading-gap); border-top: var(--review-rule) solid var(--line); }
.process-list h3 { font-size: var(--review-feature-title); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); }
.process-output { font-size: var(--review-meta); color: var(--mute); margin-top: var(--review-caption-gap); }
.tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--review-heading-gap); }
.tool-card { min-width: 0; }
.tool-card img { width: 100%; height: auto; border-radius: var(--r-card); }
.tool-card h3 { font-size: var(--review-feature-title); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); margin-top: var(--review-feature-gap); }
.tool-card p { margin-top: var(--review-caption-gap); color: var(--mute); }
.studio-content, .brief-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--review-heading-gap); align-items: start; }
.studio-principles { margin: 0; }
.studio-principles > div { border-top: var(--review-rule) solid var(--line); padding-block: var(--review-feature-gap); }
.studio-principles dt { font-size: var(--review-feature-title); font-weight: var(--review-title-weight); }
.studio-principles dd { margin: var(--review-caption-gap) 0 0; }
.faq-list { border-bottom: var(--review-rule) solid var(--line); }
.faq-list details { border-top: var(--review-rule) solid var(--line); }
.faq-list summary { cursor: pointer; min-height: var(--review-control); padding-block: var(--review-feature-gap); padding-right: var(--review-caption-gap); font-size: var(--review-lede); font-weight: var(--review-title-weight); line-height: var(--review-title-leading); }
.faq-list details > p { max-width: var(--review-reading-width); padding-bottom: var(--review-heading-gap); color: var(--mute); }
.brief-list { margin-top: var(--review-feature-gap); padding-left: var(--review-control-padding); }
.brief-list li + li { margin-top: var(--review-caption-gap); }
.brief-mail { padding: var(--review-heading-gap); background: var(--review-surface); border-radius: var(--r-card); }
.brief-mail .contact-mail { display: inline-flex; align-items: center; min-height: var(--review-control); font-size: var(--review-lede); }
@media (max-width: 1023px) {
  .hero-copy { grid-template-columns: minmax(0, 1fr); }
  .hero-summary { display: flex; align-items: center; justify-content: space-between; gap: var(--gap); }
  .hero-summary .review-action { margin-top: 0; }
  .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-grid { grid-template-columns: minmax(0, 1fr); gap: var(--review-heading-gap); }
  .service-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); align-items: center; }
  .service-copy { margin-top: 0; }
  .service-copy p { font-size: var(--review-meta); }
  .service-copy h3 { font-size: var(--review-title); }
  .case-split, #exhibition-case .case-split, .software-breakdown { grid-template-columns: minmax(0, 1fr); }
  .purpose-row { grid-template-columns: var(--review-control) minmax(0, 1fr); }
  .purpose-type { grid-column: 2; }
  .process-list li { grid-template-columns: var(--review-control) minmax(0, 1fr); }
  .process-list li > div { grid-column: 2; }
}
@media (max-width: 600px) {
  .hero-summary { align-items: flex-start; flex-direction: column; gap: var(--review-feature-gap); }
  .hero .lede { font-size: var(--review-body); }
  .hero-well { max-height: none; }
  .work-grid { grid-template-columns: minmax(0, 1fr); }
  .work-caption h3 { font-size: var(--review-feature-title); }
  .service-grid { grid-template-columns: minmax(0, 1fr); gap: var(--review-heading-gap); }
  .service-card { display: block; }
  .service-copy { margin-top: var(--review-feature-gap); }
  .service-copy h3 { font-size: var(--review-feature-title); }
  .service-copy p { font-size: var(--review-body); }
  .partners-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partners-logos img { max-width: 100%; }
  .foot-inner { align-items: flex-start; }
  .section-note { font-size: var(--review-body); }
  .purpose-row { gap: var(--review-feature-gap); }
  .purpose-row h3, .process-list h3 { font-size: var(--review-title); }
  .three-notes, .image-pair, .visual-grid, .tool-grid, .studio-content, .brief-grid { grid-template-columns: minmax(0, 1fr); }
  .three-notes { gap: var(--review-heading-gap); }
  .work-caption .work-summary { font-size: var(--review-meta); }
  .brief-mail { padding: var(--review-feature-gap); }
  #bathroom-case .case-gallery, #software-case .case-split > .story-media { order: -1; }
  #installation-case { display: flex; flex-direction: column; }
  #installation-case > .story-media { order: 1; }
  #installation-case > .case-split { order: 2; margin-top: var(--review-heading-gap); }
  #installation-case > .image-pair { order: 3; margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  html.js-ready .fade:not(.is-in) { opacity: 1; transform: none; }
}
