@font-face{font-family:'MI Sans';src:url('assets/fonts/Pretendard-SemiBold.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:MI About Myeongjo;src:url('assets/fonts/NanumMyeongjo-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:MI Serif;src:url('assets/fonts/Tinos-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}

/* ABOUT keeps its approved layout and uses the homepage type scale. */
.about-page{--about-green:#064b16;--green:var(--about-green);--about-rule:var(--block-rule);--about-gutter:var(--page-gutter)}
.about-main{margin-inline:var(--about-gutter)}
.about-section{padding-inline:calc(.75 * var(--layout-unit))}
.about-eyebrow{margin:0;color:var(--about-green);font-family:var(--serif);font-weight:700;font-size:var(--type-eyebrow);line-height:1.4;letter-spacing:.15em}
.about-heading{font-size:var(--type-title);margin:calc(1.45 * var(--layout-unit)) 0 0;font-family:'MI About Myeongjo',serif;font-weight:700;font-synthesis:none;line-height:1.32;letter-spacing:-.035em;word-break:keep-all;overflow-wrap:break-word}
.about-heading-line{display:block}
.about-accent{color:var(--about-green)}
.about-copy{margin:0;color:#4a4a4a;font-size:var(--type-body);line-height:1.75;letter-spacing:-.025em;word-break:keep-all;overflow-wrap:break-word}
.about-copy-line{display:block}
.about-intro{padding-top:calc(5.35 * var(--layout-unit));padding-bottom:calc(4.25 * var(--layout-unit))}
.about-intro .about-heading{line-height:1.23}
.about-intro .about-copy{margin-top:calc(2.45 * var(--layout-unit))}
/* Approved opening: two messages share one unbroken section and the site type scale. */
.about-legacy{margin-top:clamp(56px,calc(7 * var(--layout-unit)),90px)}
.about-legacy .about-heading{margin-top:0}
.about-legacy .about-copy p{margin:0}
.about-legacy .about-copy p+p{margin-top:clamp(16px,calc(1.4 * var(--layout-unit)),22px)}
.about-work{padding-top:calc(3.7 * var(--layout-unit));padding-bottom:calc(5.55 * var(--layout-unit));border-top:1px solid var(--about-rule);border-bottom:1px solid var(--about-rule)}

.about-work .about-copy{margin-top:calc(2.05 * var(--layout-unit))}
/* Approved photo cards: title and description share one stable, centered cell. */
.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,calc(1.4 * var(--layout-unit)),18px);list-style:none;margin:calc(2.2 * var(--layout-unit)) 0 0;padding:0}
.process-step{min-width:0}
.process-card{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;width:100%;aspect-ratio:430/271;min-height:190px;margin:0;padding:clamp(20px,calc(2 * var(--layout-unit)),26px);overflow:hidden;border:0;border-radius:0;background:#26382c;color:#fff;text-align:center;cursor:pointer;appearance:none;touch-action:manipulation}
.process-photo,.process-shade{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.process-photo{z-index:-2;display:block;overflow:hidden;transition:transform 700ms cubic-bezier(.2,.7,.2,1)}
.process-shade{z-index:-1;background:rgba(0,0,0,.32);transition:background 440ms ease}
.process-number{position:absolute;top:clamp(16px,calc(1.6 * var(--layout-unit)),21px);left:clamp(17px,calc(1.65 * var(--layout-unit)),22px);font-family:var(--serif);font-size:var(--type-subtitle);font-weight:400;line-height:1}
.process-title,.process-description{grid-area:1/1;min-width:0;max-width:100%;text-shadow:0 1px 8px rgba(0,0,0,.25);word-break:keep-all;overflow-wrap:break-word;pointer-events:none}
.process-title{font-family:var(--sans);font-weight:600;font-synthesis:none;font-size:calc(var(--type-subtitle) * .75);line-height:1.4;letter-spacing:-.04em}
.process-number,.process-title{opacity:1;visibility:visible;transform:translateY(0);transition:opacity 200ms ease 140ms,transform 300ms ease 140ms,visibility 0s}
.process-description{font-family:var(--sans);font-size:var(--type-body);font-weight:400;line-height:1.75;letter-spacing:-.025em;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity 240ms ease,transform 440ms cubic-bezier(.2,.7,.2,1),visibility 0s linear 240ms}
.process-description>span{display:block}
.process-card[aria-expanded=true] .process-number,.process-card[aria-expanded=true] .process-title{opacity:0;visibility:hidden;transform:translateY(-4px);transition-delay:0s,0s,200ms}
.process-card[aria-expanded=true] .process-description{opacity:1;visibility:visible;transform:translateY(0);transition-delay:180ms,180ms,0s}
.process-card[aria-expanded=true] .process-shade{background:rgba(6,75,22,.7)}
.process-card[aria-expanded=true] .process-photo{transform:scale(1.025)}
.process-card:focus-visible{outline:2px solid var(--about-green);outline-offset:4px}
@media(max-width:900px){.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.process-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){
 .process-photo,.process-shade,.process-number,.process-title,.process-description{transition:none;transform:none!important}
}
@media(forced-colors:active){
 .process-card{border:1px solid ButtonText;background:ButtonFace;color:ButtonText}
 .process-photo,.process-shade{display:none}
 .process-title,.process-description{text-shadow:none}
}
.about-experts{padding-block:calc(3.4 * var(--layout-unit))}
.about-experts .about-heading{line-height:1.3;margin-top:calc(1.3 * var(--layout-unit))}
.about-experts .about-copy{margin-top:calc(3.9 * var(--layout-unit))}
.about-experts .about-copy p{margin:0}
.about-experts .about-copy p+p{margin-top:calc(1.15 * var(--layout-unit))}

@media(max-width:700px){
 .about-section{padding-inline:0}
 .about-eyebrow{font-size:var(--type-eyebrow);line-height:1.5;letter-spacing:.13em}
 .about-intro{padding-block:40px 34px}
 .about-heading{margin-top:16px;letter-spacing:-.055em}
 .about-intro .about-heading{line-height:1.35}
 .about-copy{font-size:var(--type-body);line-height:1.8}
 .about-copy-line{display:inline}
 .about-intro .about-copy{margin-top:23px}
 .about-legacy{margin-top:48px}
 .about-work{padding-block:30px 36px}
 .about-work .about-heading{line-height:1.45}
 .about-work .about-copy{margin-top:23px}
 .process-grid{gap:14px;margin-top:26px}
 .about-experts{padding-block:30px}
 .about-experts .about-heading{margin-top:16px;line-height:1.45}
 .about-experts .about-copy{margin-top:28px}
 .about-experts .about-copy p+p{margin-top:18px}
}
