:root {
  --ink: #252520;
  --muted: #77756e;
  --line: #dedbd2;
  --paper: #f4f2ec;
  --ivory: #faf9f5;
  --white: #fff;
  --dark: #1e1f1d;
  --dark-line: rgba(255,255,255,.18);
  --dark-muted: #c7c4ba;
  --gold: #b28a51;
  --max: 1360px;
  --pad: clamp(22px,5vw,84px);
  --serif-ko: "Noto Serif KR", "Batang", serif;
  --serif-en: "Cormorant Garamond", Georgia, serif;
  --sans: "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x:hidden; }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.72;
  word-break: keep-all;
  text-rendering: optimizeLegibility;
}
img, video { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
h1,h2,h3,p,figure,dl,dd { margin:0; }

.skip-link {
  position: fixed;
  left: 16px;
  top: -100px;
  z-index: 999;
  padding: 10px 14px;
  background:#111;
  color:#fff;
}
.skip-link:focus { top:16px; }

.shell { width:min(100%,var(--max)); margin-inline:auto; padding-inline:var(--pad); }
.section-light { background:var(--ivory); }

.site-header {
  position:fixed;
  inset:0 0 auto;
  z-index:70;
  height:76px;
  border-bottom:1px solid transparent;
  transition:background .35s ease,border-color .35s ease,color .35s ease;
}
.site-header.is-scrolled {
  background:rgba(250,249,245,.88);
  color:var(--ink);
  border-color:rgba(37,37,32,.10);
  backdrop-filter:blur(16px);
}
.header-inner { height:100%; display:flex; align-items:center; justify-content:space-between; }
.brandmark-link { display:inline-flex; align-items:center; width:clamp(190px,18vw,248px); }
.brandmark-image { display:block; width:100%; height:auto; }
.wordmark { font-size:14px; font-weight:400; letter-spacing:.17em; }
.desktop-nav { display:flex; gap:34px; font-size:9px; font-weight:400; letter-spacing:.18em; }
.desktop-nav a { position:relative; padding-block:8px; }
.desktop-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:2px; height:1px; background:currentColor; transition:right .25s ease; }
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after { right:0; }
.menu-toggle { display:none; width:42px; height:42px; border:0; padding:0; color:inherit; background:transparent; cursor:pointer; }
.menu-toggle::before,.menu-toggle::after,.menu-toggle span { content:""; display:block; width:22px; height:1px; margin:5px auto; background:currentColor; transition:transform .25s ease,opacity .25s ease; }
.menu-toggle[aria-expanded="true"] span { opacity:0; }
.menu-toggle[aria-expanded="true"]::before { transform:translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"]::after { transform:translateY(-6px) rotate(-45deg); }
.mobile-nav { display:none; position:fixed; inset:76px 0 auto; z-index:69; padding:26px var(--pad) 32px; border-bottom:1px solid var(--line); background:rgba(250,249,245,.96); backdrop-filter:blur(16px); }
.mobile-nav.is-open { display:grid; gap:18px; }
.mobile-nav a { font-family:var(--serif-en); font-size:27px; font-weight:300; letter-spacing:.02em; }

.eyebrow,.section-index,.goal-no,.brand-no,.visit { font-size:9px; font-weight:400; letter-spacing:.18em; }

.hero { position:relative; min-height:100svh; overflow:hidden; background:#f6f4ee; }
.hero-media,.hero-video,.hero-poster,.hero-scrim { position:absolute; inset:0; width:100%; height:100%; }
.hero-video { z-index:1; object-fit:cover; }
.hero-poster { z-index:0; background:url("../images/hero_poster_1920x1080.jpg") center/cover no-repeat; }
.hero-scrim {
  z-index:2;
  background:linear-gradient(90deg,rgba(250,249,245,.97) 0%,rgba(250,249,245,.84) 27%,rgba(250,249,245,.46) 45%,rgba(250,249,245,.06) 72%);
}
.hero-inner { position:relative; z-index:3; min-height:100svh; display:flex; align-items:center; padding-top:100px; padding-bottom:84px; }
.hero-copy { max-width:850px; }
.hero h1 {
  margin-top:28px;
  font-family:var(--serif-ko);
  font-size:clamp(48px,6vw,94px);
  font-weight:300;
  line-height:1.13;
  letter-spacing:-.047em;
}
.hero-lead { margin-top:34px; color:#65645e; font-size:clamp(15px,1.25vw,19px); line-height:1.85; }
.hero-actions { display:flex; gap:34px; margin-top:38px; }
.text-link { display:inline-flex; align-items:center; gap:12px; padding-bottom:7px; border-bottom:1px solid rgba(37,37,32,.45); font-size:9px; font-weight:400; letter-spacing:.17em; }
.text-link span { font-size:13px; transition:transform .25s ease; }
.text-link:hover span { transform:translate(3px,3px); }
.scroll-cue { position:absolute; z-index:4; left:50%; bottom:28px; display:grid; place-items:center; gap:9px; transform:translateX(-50%); font-size:8px; letter-spacing:.18em; }
.scroll-cue i { width:1px; height:28px; background:linear-gradient(var(--ink),transparent); animation:scrollline 2.1s ease-in-out infinite; }
@keyframes scrollline { 0%,100%{transform:scaleY(.25);transform-origin:top;opacity:.35} 50%{transform:scaleY(1);opacity:1} }

.about { padding-block:clamp(105px,13vw,190px); }
.about-grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(340px,.74fr); gap:clamp(56px,8vw,128px); align-items:center; }
.about-copy h2,.section-heading h2,.closing h2 {
  margin-top:24px;
  font-family:var(--serif-ko);
  font-size:clamp(40px,5.2vw,76px);
  font-weight:300;
  line-height:1.2;
  letter-spacing:-.04em;
}
.body-large { max-width:650px; margin-top:38px; color:var(--muted); font-size:clamp(16px,1.35vw,20px); }
.value-list { margin-top:62px; border-top:1px solid var(--line); }
.value-list > div { display:grid; grid-template-columns:42px 150px 1fr; gap:20px; align-items:center; min-height:78px; border-bottom:1px solid var(--line); }
.value-list span { color:#9a978e; font-size:9px; letter-spacing:.14em; }
.value-list strong { font-weight:400; letter-spacing:.10em; }
.value-list p { color:var(--muted); font-size:13px; }
.about-visual { position:relative; max-width:520px; margin-left:auto; }
.about-visual::before { content:""; position:absolute; z-index:-1; inset:26px -24px -26px 26px; border:1px solid var(--line); }
.about-visual img { width:100%; aspect-ratio:4/5; object-fit:cover; }
.about-visual figcaption { margin-top:18px; color:#8d8a81; font-size:8px; letter-spacing:.18em; text-align:right; }

.vision { padding-block:clamp(110px,13vw,190px) 0; }
.section-heading { display:grid; grid-template-columns:2fr 7fr 3fr; gap:24px; align-items:end; }
.section-heading .section-index { align-self:start; padding-top:15px; }
.section-heading h2 { grid-column:2/3; margin-top:0; }
.heading-note { grid-column:3/4; max-width:310px; padding-bottom:10px; color:var(--muted); font-size:13px; }
.goal-stack { display:grid; gap:clamp(100px,13vw,180px); margin-top:clamp(90px,11vw,150px); }
.goal-row { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:clamp(46px,7vw,112px); align-items:center; }
.goal-row.reverse .goal-media { order:2; }
.goal-row.reverse .goal-copy { order:1; padding-left:clamp(0px,4vw,70px); }
.goal-media { overflow:hidden; background:#efede7; }
.goal-media img { width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.goal-row:hover .goal-media img { transform:scale(1.025); }
.goal-copy { max-width:510px; }
.goal-no { padding-bottom:18px; border-bottom:1px solid var(--line); color:#77746b; }
.goal-copy h3 { margin-top:30px; font-family:var(--serif-ko); font-size:clamp(30px,3.4vw,51px); font-weight:300; line-height:1.29; letter-spacing:-.035em; }
.goal-copy > p:last-child { margin-top:28px; color:var(--muted); font-size:15px; }
.vision-bridge { margin-top:clamp(105px,13vw,190px); overflow:hidden; }
.vision-bridge img { width:100%; height:clamp(260px,35vw,560px); object-fit:cover; }

.capabilities { position:relative; min-height:760px; overflow:hidden; color:#f5f2e9; background:var(--dark); }
.cap-bg { position:absolute; inset:0; background:
  linear-gradient(90deg,rgba(29,30,28,.99) 0%,rgba(29,30,28,.90) 35%,rgba(29,30,28,.34) 73%,rgba(29,30,28,.16) 100%),
  url("../images/capabilities_texture_1920x1080.jpg") center/cover no-repeat; }
.cap-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.24)); }
.cap-inner { position:relative; z-index:1; padding-top:clamp(100px,11vw,155px); padding-bottom:clamp(100px,11vw,145px); }
.cap-heading { display:grid; grid-template-columns:2fr 7fr 3fr; gap:24px; align-items:end; }
.cap-heading h2 { grid-column:2/3; font-family:var(--serif-en); font-size:clamp(58px,8vw,118px); font-weight:300; line-height:.82; letter-spacing:-.035em; }
.cap-heading h2 span { font-style:italic; }
.cap-heading > p:last-child { grid-column:3/4; max-width:285px; padding-bottom:4px; color:var(--dark-muted); font-size:13px; }
.cap-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:clamp(78px,9vw,128px); border-top:1px solid var(--dark-line); border-bottom:1px solid var(--dark-line); backdrop-filter:blur(3px); }
.cap-grid article { min-height:225px; padding:28px 24px; border-right:1px solid var(--dark-line); }
.cap-grid article:last-child { border-right:0; }
.cap-grid span { color:#a8a59d; font-size:8px; letter-spacing:.16em; }
.cap-grid h3 { margin-top:70px; font-family:var(--serif-en); font-size:31px; font-weight:300; }
.cap-grid p { margin-top:10px; color:var(--dark-muted); font-size:12px; }

.brands { padding-block:clamp(115px,13vw,185px); }
.brands-heading { margin-bottom:clamp(70px,9vw,120px); }
.brand-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px; }
.brand-card { grid-column:span 2; display:flex; flex-direction:column; min-width:0; border:1px solid var(--line); background:#f7f5ef; transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease; }
.brand-card.wide { grid-column:span 3; }
.brand-card:not(.is-static):hover { transform:translateY(-5px); border-color:#c9c2b4; box-shadow:0 20px 45px rgba(52,48,39,.08); }
.brand-image { position:relative; overflow:hidden; aspect-ratio:25/23; border-bottom:1px solid var(--line); }
.brand-image img { width:100%; height:100%; object-fit:cover; object-position:center; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.brand-card:not(.is-static):hover .brand-image img { transform:scale(1.025); }


.brand-info { min-height:235px; display:flex; flex-direction:column; padding:25px 25px 27px; }
.brand-no { color:#8b887f; }
.brand-info h3 { margin-top:28px; font-family:var(--serif-en); font-size:clamp(28px,2.8vw,41px); font-weight:300; line-height:1; letter-spacing:.005em; }
.brand-info > p:not(.brand-no) { margin-top:14px; color:var(--muted); font-size:13px; }
.visit { display:inline-flex; width:fit-content; margin-top:auto; padding-top:34px; }
.visit.muted { color:#aaa69d; font-size:8px; }

.closing { position:relative; min-height:74svh; display:grid; place-items:center; overflow:hidden; background:#faf9f5; text-align:center; }
.closing-bg { position:absolute; inset:0; background:url("../images/closing_convergence_20x9.jpg") center/cover no-repeat; opacity:.86; transform:scale(1.04); }
.closing-inner { position:relative; z-index:1; padding-block:105px; }
.closing h2 { max-width:1100px; margin:28px auto 0; font-family:var(--serif-en); font-size:clamp(52px,7.5vw,112px); line-height:.86; letter-spacing:-.035em; }
.closing-inner > p:last-child { max-width:600px; margin:34px auto 0; color:var(--muted); font-size:14px; }

.site-footer { padding-block:54px; border-top:1px solid var(--line); background:#f1efe9; }
.footer-grid { display:grid; grid-template-columns:2.2fr 5.6fr 2.2fr; gap:40px; align-items:start; }
.footer-brand > p:last-child { margin-top:11px; color:var(--muted); font-size:11px; }
.footer-info dl { display:grid; grid-template-columns:1fr 1fr; gap:8px 30px; }
.footer-info dl div { display:grid; grid-template-columns:92px 1fr; gap:12px; font-size:10px; }
.footer-info dt { color:#8d8a82; }
.footer-info dd { color:#5f5d57; }
.footer-meta { display:flex; flex-direction:column; align-items:flex-end; gap:26px; color:#77746d; font-size:8px; letter-spacing:.11em; text-align:right; }

.js .reveal { opacity:0; transform:translateY(25px); transition:opacity .75s ease,transform .75s ease; }
.js .reveal.is-visible { opacity:1; transform:none; }


/* v0.6 · official identity and approved brand photography */
.brand-image::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(250,249,245,.02),rgba(178,138,81,.035));
  mix-blend-mode:multiply;
}
.footer-brandmark { width:min(220px,100%); }
.footer-brandmark img { display:block; width:100%; height:auto; }
@media (max-width:720px) {
  .brandmark-link { width:180px; }
  .footer-brandmark { width:205px; }
}

@media (max-width:1040px) {
  .desktop-nav { display:none; }
  .menu-toggle { display:block; }
  .about-grid { grid-template-columns:1fr 0.8fr; gap:55px; }
  .section-heading,.cap-heading { grid-template-columns:1fr; }
  .section-heading h2,.section-heading .heading-note,.cap-heading h2,.cap-heading > p:last-child { grid-column:auto; }
  .section-heading .section-index { padding-top:0; }
  .heading-note,.cap-heading > p:last-child { margin-top:22px; }
  .goal-row { grid-template-columns:1fr 1fr; gap:42px; }
  .cap-grid { grid-template-columns:repeat(2,1fr); }
  .cap-grid article:nth-child(2) { border-right:0; }
  .cap-grid article:nth-child(-n+2) { border-bottom:1px solid var(--dark-line); }
  .brand-card { grid-column:span 3; }
  .brand-card:nth-child(5) { grid-column:2/span 4; }
  .footer-grid { grid-template-columns:1fr 2fr; }
  .footer-meta { grid-column:1/-1; flex-direction:row; justify-content:space-between; align-items:center; text-align:left; }
}

@media (max-width:720px) {
  :root { --pad:22px; }
  .site-header { height:68px; }
  .mobile-nav { inset-block-start:68px; }
  .hero-inner { align-items:flex-end; padding-top:106px; padding-bottom:96px; }
  .hero-video { object-position:61% center; }
  .hero-scrim { background:linear-gradient(180deg,rgba(250,249,245,.20) 0%,rgba(250,249,245,.44) 42%,rgba(250,249,245,.96) 76%,rgba(250,249,245,1) 100%); }
  .hero h1 { margin-top:20px; font-size:clamp(42px,13vw,62px); }
  .hero-lead { margin-top:23px; font-size:14px; line-height:1.75; }
  .desktop-only { display:none; }
  .hero-actions { gap:22px; margin-top:28px; }
  .scroll-cue { display:none; }

  .about-grid { grid-template-columns:1fr; }
  .about-visual { width:88%; margin:12px 0 0 auto; }
  .value-list > div { grid-template-columns:34px 118px 1fr; gap:9px; }
  .value-list p { font-size:11px; }

  .goal-stack { gap:84px; margin-top:72px; }
  .goal-row,.goal-row.reverse { grid-template-columns:1fr; gap:30px; }
  .goal-row.reverse .goal-media,.goal-row.reverse .goal-copy { order:initial; padding-left:0; }
  .goal-copy h3 { margin-top:22px; font-size:34px; }
  .vision-bridge img { height:230px; }

  .capabilities { min-height:auto; }
  .cap-bg { background-position:64% center; }
  .cap-heading h2 { font-size:70px; }
  .cap-grid { grid-template-columns:1fr; }
  .cap-grid article,.cap-grid article:nth-child(2) { min-height:175px; border-right:0; border-bottom:1px solid var(--dark-line); }
  .cap-grid article:last-child { border-bottom:0; }
  .cap-grid h3 { margin-top:43px; }

  .brand-grid { grid-template-columns:1fr; }
  .brand-card,.brand-card.wide,.brand-card:nth-child(5) { grid-column:auto; }
  .brand-info { min-height:210px; }

  .closing { min-height:68svh; }
  .closing h2 { font-size:58px; }
  .footer-grid { grid-template-columns:1fr; gap:30px; }
  .footer-info dl { grid-template-columns:1fr; }
  .footer-meta { grid-column:auto; flex-direction:column; align-items:flex-start; gap:12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .hero-video { display:none; }
  .scroll-cue i { animation:none; }
  .js .reveal { opacity:1; transform:none; transition:none; }
  .goal-media img,.brand-image img,.brand-card { transition:none; }
}

/* =========================================================
   v0.5 · content freeze / production-readiness refinements
   ========================================================= */
:root {
  --muted: #6f6d66;
  --focus: #9a6c2d;
}

body.menu-open { overflow: hidden; }
section[id] { scroll-margin-top: 86px; }

:where(a, button):focus-visible {
  outline: 1px solid var(--focus);
  outline-offset: 5px;
}

.desktop-nav a[aria-current="location"]::after { right: 0; }
.mobile-nav a[aria-current="location"] { color: var(--gold); }

.mobile-nav[aria-hidden="true"] { pointer-events: none; }
.mobile-nav.is-open[aria-hidden="false"] { pointer-events: auto; }

.hero-video.is-disabled { display: none; }

.brand-card:focus-visible {
  outline: 1px solid var(--focus);
  outline-offset: 5px;
}

.brand-card.is-static { cursor: default; }
.brand-card.is-static .brand-info { padding-bottom: 32px; }
.footer-meta { line-height: 1.7; }

@media (hover: none) {
  .goal-row:hover .goal-media img,
  .brand-card:not(.is-static):hover .brand-image img {
    transform: none;
  }
  .brand-card:not(.is-static):hover {
    transform: none;
    box-shadow: none;
  }
}

@media (max-width: 720px) {
  .hero-video { display: none; }
  .hero-poster {
    background-image: url("../images/hero_poster_mobile_1080x1350.jpg");
    background-position: center center;
  }
  .hero-scrim {
    background:
      linear-gradient(180deg,
        rgba(250,249,245,.10) 0%,
        rgba(250,249,245,.24) 34%,
        rgba(250,249,245,.74) 61%,
        rgba(250,249,245,.98) 82%,
        rgba(250,249,245,1) 100%);
  }
  .hero-copy { max-width: 100%; }
  .hero-actions { flex-wrap: wrap; }
  .mobile-nav { max-height: calc(100svh - 68px); overflow-y: auto; }
}


/* v0.8 · responsive high-resolution B-upgrade, preserving approved A compositions */
.brand-image { background:#eee9df; }


/* v0.8 high-resolution brand image delivery */
.brand-image img { image-rendering:auto; backface-visibility:hidden; }


/* =========================================================
   v0.9 · compact brand gallery
   Native-detail images at smaller rendered size to avoid
   artificial super-resolution artifacts and label distortion.
   ========================================================= */
.brands { padding-block:clamp(90px,10vw,145px); }
.brands-heading { margin-bottom:clamp(44px,6vw,72px); }
.brand-grid {
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.brand-card,
.brand-card.wide,
.brand-card:nth-child(5) {
  grid-column:auto;
}
.brand-image {
  aspect-ratio:5/4;
  background:#eee9df;
}
.brand-image img {
  object-fit:cover;
  object-position:center;
  transform:none !important;
  image-rendering:auto;
}
.brand-card:nth-child(1) .brand-image img { object-position:50% 56%; }
.brand-card:nth-child(2) .brand-image img { object-position:50% 51%; }
.brand-card:nth-child(3) .brand-image img { object-position:50% 56%; }
.brand-card:nth-child(4) .brand-image img { object-position:50% 50%; }
.brand-card:nth-child(5) .brand-image img { object-position:50% 51%; }
.brand-card:not(.is-static):hover .brand-image img { transform:none; }
.brand-info {
  min-height:166px;
  padding:18px 18px 20px;
}
.brand-no { display:none; }
.brand-info h3 {
  margin-top:0;
  font-family:var(--sans);
  font-size:clamp(17px,1.45vw,22px);
  font-weight:400;
  line-height:1.25;
  letter-spacing:.005em;
}
.brand-info > p:not(.brand-no) {
  margin-top:10px;
  font-size:11px;
  line-height:1.65;
}
.visit {
  padding-top:20px;
  font-size:8px;
}
.brand-card.is-static .brand-info { padding-bottom:20px; }

@media (max-width:1180px) {
  .brand-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
  .brand-card:nth-child(4) { grid-column:1/2; }
  .brand-card:nth-child(5) { grid-column:2/3; }
}
@media (max-width:820px) {
  .brand-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .brand-card:nth-child(4),
  .brand-card:nth-child(5) { grid-column:auto; }
  .brand-card:nth-child(5) { grid-column:1/-1; width:calc(50% - 7px); justify-self:center; }
}
@media (max-width:560px) {
  .brand-grid { grid-template-columns:1fr; gap:16px; }
  .brand-card:nth-child(5) { grid-column:auto; width:auto; }
  .brand-image { aspect-ratio:4/3; }
  .brand-info { min-height:154px; }
}


/* =========================================================
   v0.10 · About balance + verified GATZMEN product visual
   ========================================================= */
.about-grid {
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.72fr);
  gap:clamp(48px,7vw,108px);
}
.about-visual {
  width:100%;
  max-width:480px;
}
.about-visual img {
  aspect-ratio:4/3;
  height:auto;
  object-fit:cover;
  object-position:center;
}
.brand-card:nth-child(5) .brand-image img {
  object-position:50% 50%;
}
@media (max-width:900px) {
  .about-grid { grid-template-columns:1fr; }
  .about-visual {
    width:min(100%,560px);
    max-width:560px;
    margin:40px 0 0 auto;
  }
}
@media (max-width:560px) {
  .about-visual { width:100%; margin-top:30px; }
}


/* v0.11 · footer contact layout */
.footer-info dl .footer-address { grid-column:1 / -1; }