/* DJLINO.KR / ABOUT / 2026-10-13
   Page-local styles. Shared main.css and other pages remain unchanged. */
body[data-page="about"] .about-premium {
  --ap-max: 1440px;
  --ap-text: #595b54;
  background: var(--lino-bg, #f7f4ee);
  color: var(--lino-ink, #171816);
}
body[data-page="about"] .ap-shell {max-width:var(--ap-max);margin-inline:auto}
body[data-page="about"] .ap-hero,
body[data-page="about"] .ap-story,
body[data-page="about"] .ap-archive {padding-inline:var(--pad)}
body[data-page="about"] .ap-hero {padding-top:142px;padding-bottom:clamp(84px,9vw,144px)}
body[data-page="about"] .ap-eyebrow-row,
body[data-page="about"] .ap-section-label {display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--lino-line);padding-top:18px;font-size:10px;line-height:1.5;letter-spacing:.16em;color:var(--ap-text)}
body[data-page="about"] .ap-title-row {display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding:38px 0 42px}
body[data-page="about"] .ap-title-row h1 {margin:0 0 -.035em -.045em;font-size:clamp(106px,15.1vw,222px);font-weight:500;line-height:.8;letter-spacing:-.075em}
body[data-page="about"] .ap-title-meta {min-width:250px;padding-bottom:3px;font-size:11px;line-height:1.5;letter-spacing:.13em}
body[data-page="about"] .ap-title-meta p {margin:0 0 5px}
body[data-page="about"] .ap-title-meta p:nth-child(2) {color:var(--ap-text)}
body[data-page="about"] .ap-title-meta a {display:flex;justify-content:space-between;gap:30px;padding-top:24px;margin-top:20px;border-top:1px solid var(--lino-line);font-size:10px}
body[data-page="about"] .ap-title-meta a span {font-size:18px;line-height:1}
body[data-page="about"] .about-premium figure {margin:0;min-width:0}
body[data-page="about"] .ap-photo-link {display:block;position:relative;background:var(--lino-bg-2);cursor:zoom-in}
body[data-page="about"] .ap-photo-link picture {display:block}
/* Natural dimensions preserve every composition, including faces and photo credits. */
body[data-page="about"] .ap-photo-link img {display:block;width:100%;height:auto;object-fit:contain}
body[data-page="about"] .ap-photo-open {position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:32px;height:32px;background:rgba(247,244,238,.9);color:#171816;font-size:19px;line-height:1;opacity:.9;transition:opacity .2s ease}
body[data-page="about"] .ap-photo-link:hover .ap-photo-open {opacity:1}
body[data-page="about"] .about-premium figcaption {display:flex;justify-content:space-between;gap:16px;padding-top:14px;color:var(--ap-text);font-size:9px;line-height:1.6;letter-spacing:.12em}
body[data-page="about"] .ap-story {padding-bottom:clamp(96px,10vw,152px)}
body[data-page="about"] .ap-story-grid {display:grid;grid-template-columns:1.18fr 1fr;gap:clamp(36px,6vw,100px);align-items:start;margin-top:54px}
body[data-page="about"] .ap-performance {padding-top:8px}
body[data-page="about"] .ap-story-copy h2 {margin:0 0 34px;font-size:clamp(42px,4.4vw,67px);font-weight:450;line-height:1.02;letter-spacing:-.045em}
body[data-page="about"] .ap-story-copy h2 em,
body[data-page="about"] .ap-archive-heading h2 em {font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.055em}
body[data-page="about"] .ap-story-copy p {margin:0;font-size:16px;line-height:1.75;color:var(--ap-text)}
body[data-page="about"] .ap-story-copy .ap-story-lead {font-size:clamp(21px,1.9vw,28px);line-height:1.46;letter-spacing:-.02em;color:var(--lino-ink)}
body[data-page="about"] .ap-story-copy p+p {margin-top:25px}
body[data-page="about"] .ap-facts {margin:70px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--lino-line)}
body[data-page="about"] .ap-facts div {padding:27px 28px;border-right:1px solid var(--lino-line)}
body[data-page="about"] .ap-facts div:first-child {padding-left:0}
body[data-page="about"] .ap-facts div:last-child {padding-right:0;border-right:0}
body[data-page="about"] .ap-facts dt {font-size:9px;letter-spacing:.15em;color:var(--ap-text);margin-bottom:13px}
body[data-page="about"] .ap-facts dd {margin:0;font-size:12px;line-height:1.6;letter-spacing:.075em}
body[data-page="about"] .ap-archive {padding-bottom:80px;scroll-margin-top:108px}
body[data-page="about"] .ap-archive-heading {display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin:46px 0 76px}
body[data-page="about"] .ap-archive-heading h2 {margin:0;font-size:clamp(56px,7.5vw,112px);font-weight:420;line-height:.98;letter-spacing:-.06em}
body[data-page="about"] .ap-archive-heading p {margin:0 0 8px;font-size:10px;line-height:1.9;letter-spacing:.13em;color:var(--ap-text)}
body[data-page="about"] .ap-gallery {display:grid;gap:clamp(58px,7.3vw,110px)}
body[data-page="about"] .ap-archive-pair {display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);column-gap:8.6%;align-items:start}
body[data-page="about"] .ap-archive-pair--reverse {grid-template-columns:minmax(0,1fr) minmax(0,1.75fr)}
body[data-page="about"] .ap-moment--small {padding-top:clamp(52px,7vw,104px)}
body[data-page="about"] .ap-archive-pair--reverse .ap-moment--small {align-self:end;padding-top:0;padding-bottom:32px}
body[data-page="about"] .ap-archive-pair--quiet .ap-moment--original {width:80%;max-width:400px;justify-self:center;align-self:center;padding:0}
body[data-page="about"] .ap-explore {display:flex;justify-content:space-between;gap:28px;align-items:center;margin-top:100px;padding-top:30px;border-top:1px solid var(--lino-line)}
body[data-page="about"] .ap-explore>span {font-size:9px;letter-spacing:.15em;color:var(--ap-text)}
body[data-page="about"] .ap-explore>div {display:flex;gap:46px}
body[data-page="about"] .ap-explore a {display:flex;align-items:center;gap:38px;min-height:44px;font-size:12px;letter-spacing:.11em}
body[data-page="about"] .ap-explore a span {font-size:22px}
body[data-page="about"] #contact {scroll-margin-top:90px}
body[data-page="about"] .ap-skip-link {position:fixed;z-index:200;top:12px;left:12px;padding:13px 18px;background:#171816;color:#fff;transform:translateY(-160%)}
body[data-page="about"] .ap-skip-link:focus {transform:none}
/* Native dialog supplies focus containment and makes the background inert. */
body[data-page="about"].about-gallery-open {overflow:hidden}
body[data-page="about"] .about-photo-dialog {position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100%;height:100dvh;margin:0;padding:0;border:0;background:#111210;color:#f7f4ee;overflow:hidden}
body[data-page="about"] .about-photo-dialog:not([open]) {display:none}
body[data-page="about"] .about-photo-dialog::backdrop {background:rgba(12,13,11,.97)}
body[data-page="about"] .ap-viewer {height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:20px clamp(18px,3vw,50px);gap:14px}
body[data-page="about"] .ap-viewer-top,
body[data-page="about"] .ap-viewer-bottom {display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0}
body[data-page="about"] .ap-viewer-top h2 {margin:0;font-size:10px;font-weight:500;line-height:1.5;letter-spacing:.12em}
body[data-page="about"] .ap-viewer button {background:transparent;border:0;color:inherit;cursor:pointer;min-height:44px;padding:8px;font-size:11px;letter-spacing:.12em;display:inline-flex;align-items:center;gap:14px}
body[data-page="about"] .ap-viewer button:hover {color:#c9bca4}
body[data-page="about"] .ap-viewer-top button span {font-size:28px;font-weight:300;line-height:1}
body[data-page="about"] .ap-viewer-stage {display:flex;align-items:center;justify-content:center;min-height:0;position:relative}
body[data-page="about"] .ap-viewer-stage img {width:100%;height:100%;object-fit:contain}
body[data-page="about"] .ap-viewer-stage img[hidden] {display:none}
body[data-page="about"] .ap-viewer-stage[aria-busy="true"] img {opacity:0}
body[data-page="about"] .ap-viewer-stage[aria-busy="true"]::after {content:"LOADING PHOTOGRAPH";position:absolute;font-size:10px;letter-spacing:.15em;color:#d5d1c8}
body[data-page="about"] .ap-viewer-error {text-align:center;font-size:14px;line-height:1.8}
body[data-page="about"] .ap-viewer-error a {display:block;text-decoration:underline}
body[data-page="about"] .ap-viewer-bottom p {margin:0;text-align:center;font-size:10px;line-height:1.5;letter-spacing:.07em;color:#dad5cb;max-width:70ch}
@media (max-width:1100px) {
  body[data-page="about"] .ap-story-grid {gap:36px}
  body[data-page="about"] .ap-story-copy h2 {font-size:48px}
  body[data-page="about"] .ap-story-copy p {font-size:15px}
  body[data-page="about"] .ap-story-copy .ap-story-lead {font-size:22px}
}
@media (max-width:900px) {
  body[data-page="about"] .ap-hero {padding-top:108px}
  body[data-page="about"] .ap-title-meta {min-width:205px;font-size:10px}
  body[data-page="about"] .ap-title-meta a {font-size:9px;margin-top:12px;padding-top:18px}
  body[data-page="about"] .ap-facts div {padding:22px 18px}
  body[data-page="about"] .ap-facts dd {font-size:10px}
}
@media (max-width:900px) {
  body[data-page="about"] .ap-story-grid {grid-template-columns:1fr;gap:38px;margin-top:34px}
  body[data-page="about"] .ap-performance {padding-top:0}
  body[data-page="about"] .ap-story-copy {max-width:590px}
  body[data-page="about"] .ap-story-copy h2 {font-size:52px;margin-bottom:26px}
  body[data-page="about"] .ap-story-copy p {font-size:16px}
  body[data-page="about"] .ap-story-copy .ap-story-lead {font-size:24px}
  body[data-page="about"] .ap-facts {margin-top:42px}
  body[data-page="about"] .ap-facts dd {font-size:10px;letter-spacing:.025em}
  body[data-page="about"] .ap-explore>div {gap:26px}
  body[data-page="about"] .ap-explore a {gap:18px}
}
@media (max-width:600px) {
  body[data-page="about"] .ap-hero {padding-top:98px;padding-bottom:72px}
  body[data-page="about"] .ap-eyebrow-row,
  body[data-page="about"] .ap-section-label {font-size:9px;letter-spacing:.1em;padding-top:14px;gap:12px}
  body[data-page="about"] .ap-title-row {display:block;padding:30px 0 26px}
  body[data-page="about"] .ap-title-row h1 {font-size:clamp(116px,30vw,174px)}
  body[data-page="about"] .ap-title-meta {display:grid;grid-template-columns:1fr auto;column-gap:18px;row-gap:5px;margin-top:26px;padding:0;min-width:0}
  body[data-page="about"] .ap-title-meta p {margin:0;font-size:9px;letter-spacing:.08em}
  body[data-page="about"] .ap-title-meta a {grid-column:2;grid-row:1 / 3;align-self:center;align-items:center;gap:14px;padding:8px 0;margin:0;border:0;font-size:8px;letter-spacing:.06em}
  body[data-page="about"] .about-premium figcaption {font-size:8px;letter-spacing:.07em;padding-top:11px;gap:12px}
  body[data-page="about"] .ap-photo-open {width:28px;height:28px;font-size:17px;right:10px;bottom:10px}
  body[data-page="about"] .ap-story {padding-bottom:80px}
  body[data-page="about"] .ap-facts {grid-template-columns:1fr}
  body[data-page="about"] .ap-facts div {display:grid;grid-template-columns:70px 1fr;align-items:baseline;gap:14px;padding:18px 0;border-right:0;border-bottom:1px solid var(--lino-line)}
  body[data-page="about"] .ap-facts div:last-child {border-bottom:0}
  body[data-page="about"] .ap-facts dt {margin:0;font-size:9px}
  body[data-page="about"] .ap-facts dd {font-size:11px;letter-spacing:.06em}
  body[data-page="about"] .ap-archive {padding-bottom:54px;scroll-margin-top:94px}
  body[data-page="about"] .ap-archive-heading {display:block;margin:32px 0 42px}
  body[data-page="about"] .ap-archive-heading h2 {font-size:clamp(60px,14.6vw,84px)}
  body[data-page="about"] .ap-archive-heading p {margin:22px 0 0;font-size:9px;line-height:1.8}
  body[data-page="about"] .ap-gallery {gap:44px}
  body[data-page="about"] .ap-archive-pair,
  body[data-page="about"] .ap-archive-pair--reverse {grid-template-columns:minmax(0,1fr);gap:36px}
  body[data-page="about"] .ap-moment--small,
  body[data-page="about"] .ap-archive-pair--reverse .ap-moment--small {width:76%;justify-self:end;padding:0}
  body[data-page="about"] .ap-archive-pair--reverse .ap-moment--small {justify-self:start}
  body[data-page="about"] .ap-archive-pair--quiet .ap-moment--original {width:66%;max-width:300px;justify-self:center}
  body[data-page="about"] .ap-explore {margin-top:58px;padding-top:22px;display:block}
  body[data-page="about"] .ap-explore>div {justify-content:space-between;margin-top:20px}
  body[data-page="about"] .ap-explore a {font-size:11px}
  body[data-page="about"] .ap-viewer {gap:10px;padding:10px 14px max(10px,env(safe-area-inset-bottom))}
  body[data-page="about"] .ap-viewer-top h2 {max-width:185px;font-size:8px}
  body[data-page="about"] .ap-viewer-top button {font-size:9px;gap:8px}
  body[data-page="about"] .ap-viewer-bottom {gap:8px}
  body[data-page="about"] .ap-viewer-bottom button {font-size:18px}
  body[data-page="about"] .ap-viewer-bottom button span {display:none}
  body[data-page="about"] .ap-viewer-bottom p {font-size:9px;max-width:32ch}
}
@media (prefers-reduced-motion:reduce) {
  body[data-page="about"] .ap-photo-open {transition:none}
}