/* MACKY KAWANA / PORTRAITS V2 — photograph-first, absolutely no cropping */
:root{color-scheme:dark;--bg:#090a0b;--raised:#121315;--ink:#eeeae6;--soft:#b7b1ab;--muted:#817d79;--rule:#30302f;--max:1470px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.9}
[hidden]{display:none!important}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto;object-fit:contain;object-position:center}a:focus-visible,button:focus-visible{outline:2px solid #f7f1de;outline-offset:4px}
.skip{position:absolute;left:18px;top:-100px;background:#fff;color:#111;padding:8px 16px;z-index:40}.skip:focus{top:10px}
.header{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:30px;max-width:var(--max);margin:auto;padding:29px clamp(24px,5.5vw,95px) 23px;border-bottom:1px solid var(--rule)}
.logo{font-family:Arial,Helvetica,sans-serif;letter-spacing:.17em;font-size:clamp(16px,1.8vw,22px);line-height:1.25;white-space:nowrap}.logo small{display:block;font-size:8px;letter-spacing:.32em;color:var(--muted);margin-top:8px}.nav{display:flex;flex-wrap:wrap;gap:clamp(15px,2.5vw,38px)}.nav a{font:10px/1.7 Arial,Helvetica,sans-serif;letter-spacing:.25em;color:#a29f99;text-transform:uppercase;padding:9px 0;position:relative}.nav a[aria-current=page],.nav a:hover{color:#f7f4f0}.nav a[aria-current=page]:after{content:"";height:1px;position:absolute;bottom:3px;left:0;right:0;background:#aaa}
.micro{font:10px/1.65 Arial,Helvetica,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#a6a09b}.muted{color:var(--muted)}.page{overflow:hidden}.page-wrap{max-width:var(--max);margin:auto;padding-inline:clamp(24px,5.5vw,95px)}
.hero{max-width:var(--max);margin:auto;display:grid;grid-template-columns:minmax(270px,.78fr) minmax(0,1.35fr);gap:clamp(28px,5vw,75px);align-items:center;padding:clamp(68px,8vw,145px) clamp(24px,5.5vw,95px) clamp(48px,7vw,105px)}
.hero-copy h1{font-family:Arial,Helvetica,sans-serif;font-size:clamp(51px,6vw,98px);font-weight:300;letter-spacing:.14em;line-height:1.05;margin:27px 0 36px}.hero-copy .ja{font-size:clamp(18px,2vw,28px);letter-spacing:.22em;line-height:1.9;margin:0 0 28px;font-weight:400}.hero-copy .lead{max-width:320px;color:var(--soft);font-size:12px;line-height:2.5;letter-spacing:.065em}.hero-copy .scroll{display:inline-block;margin-top:45px;font:10px Arial,Helvetica,sans-serif;letter-spacing:.3em;border-bottom:1px solid #888;padding-bottom:12px}
.hero-photo{margin:0;min-width:0}.hero-photo img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;box-shadow:0 20px 65px rgba(0,0,0,.13)}.hero-photo figcaption{margin-top:12px;font:9px Arial,Helvetica,sans-serif;letter-spacing:.2em;color:var(--muted);text-align:right}
.chapter{max-width:var(--max);margin:auto;padding:clamp(50px,7vw,120px) clamp(24px,8vw,145px) clamp(68px,7vw,120px);display:flex;align-items:flex-end;justify-content:space-between;gap:65px;border-top:1px solid var(--rule)}.chapter h2{font-size:clamp(25px,3vw,43px);letter-spacing:.2em;font-weight:400;line-height:1.9;margin:27px 0 0}.chapter p{max-width:265px;color:#aaa5a0;font-size:12px;line-height:2.5;margin:0 0 10px}
.gallery{max-width:var(--max);margin:0 auto;padding:0 clamp(24px,8vw,145px) clamp(100px,10vw,190px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(36px,7vw,112px);row-gap:clamp(55px,9vw,148px);align-items:start}
.photo{margin:0;min-width:0;}.photo:nth-child(even){transform:translateY(clamp(45px,10vw,170px))}.photo.wide{grid-column:span 2;width:min(84%,1080px);margin:clamp(20px,4vw,70px) auto;transform:none}.photo.wide+.photo:nth-child(even){transform:none}
.photo-open{display:block;width:100%;padding:0;border:0;background:none;text-align:left}.photo-open img{width:100%;height:auto;object-fit:contain;aspect-ratio:auto;border:0;transition:opacity .3s}.photo-open:hover img{opacity:.88}.photo figcaption{padding-top:14px;display:flex;gap:12px;justify-content:space-between;color:var(--muted);font:10px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.15em}.photo figcaption span:last-child{font-size:9px;letter-spacing:.10em;color:#6c6865}
.endband{max-width:var(--max);margin:auto;padding:50px clamp(24px,8vw,145px) 150px;display:flex;justify-content:space-between;align-items:center;gap:35px}.endband p{font-size:clamp(20px,2.5vw,33px);font-weight:300;letter-spacing:.17em;line-height:2.1}.line-link{font:11px Arial,Helvetica,sans-serif;letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid #8a857d;padding:0 0 14px;white-space:nowrap}.line-link:hover{opacity:.65}.footer{border-top:1px solid var(--rule);max-width:var(--max);margin:auto;padding:32px clamp(24px,5.5vw,95px) 56px;display:flex;justify-content:space-between;align-items:end;gap:30px}.footer-brand{font:16px Arial,Helvetica,sans-serif;letter-spacing:.22em}.footer-brand small{display:block;font-size:9px;color:var(--muted);margin-top:9px}.footer-links{display:flex;flex-wrap:wrap;gap:24px;color:var(--muted);font:10px Arial,Helvetica,sans-serif;letter-spacing:.16em}
.page-heading{max-width:var(--max);margin:auto;padding:clamp(80px,10vw,150px) clamp(24px,8vw,145px) clamp(65px,8vw,125px)}.page-heading h1{font:300 clamp(65px,10vw,160px)/1.2 Arial,Helvetica,sans-serif;letter-spacing:.15em;margin:17px 0 25px}.page-heading p{font-size:clamp(13px,1.45vw,17px);letter-spacing:.14em;line-height:2.3;color:#aaa}
.filter-wrap{max-width:var(--max);margin:0 auto 75px;padding:0 clamp(24px,8vw,145px);display:flex;flex-wrap:wrap;gap:25px;align-items:center}.filter{font:10px Arial,Helvetica,sans-serif;letter-spacing:.15em;color:#898682;background:none;border:0;border-bottom:1px solid transparent;padding:0 0 13px}.filter:hover,.filter[aria-pressed=true]{color:#f3f0ee;border-color:#f3f0ee}
.works-grid{max-width:var(--max);padding:0 clamp(24px,8vw,145px) 170px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(25px,3.1vw,56px);row-gap:clamp(55px,6vw,105px);align-items:start}.works-grid .photo:nth-child(even){transform:none}.works-grid .photo.wide{grid-column:auto;width:100%;margin:0}.works-grid .photo figcaption{font-size:9px}.works-grid .photo img{height:auto;aspect-ratio:auto;object-fit:contain}.works-grid .photo.is-hidden{display:none}
.story{max-width:var(--max);margin:auto;padding:0 clamp(24px,8vw,145px) clamp(100px,10vw,160px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(35px,8vw,140px)}.story-copy{padding-top:20px}.story h2{font-weight:400;letter-spacing:.2em;line-height:1.9;font-size:clamp(24px,3vw,40px);margin:0 0 40px}.story p{max-width:485px;color:#b7b1ab;font-size:13px;line-height:2.8;letter-spacing:.07em;margin-bottom:26px}.story-photos{display:grid;gap:90px}.story-photos img{width:100%;height:auto;object-fit:contain}.story-photos figure{margin:0}.story-photos figure:nth-child(2){width:78%;margin-left:auto}.story-photos figcaption{font:9px Arial,Helvetica,sans-serif;letter-spacing:.18em;color:var(--muted);margin-top:10px}
.contact-cta{display:inline-flex;gap:50px;align-items:center;padding:16px 0;border-bottom:1px solid #aba6a0;font:12px Arial,Helvetica,sans-serif;letter-spacing:.14em;margin-top:35px}.note{font-size:11px!important;color:var(--muted)!important;margin-top:28px!important}.contact-photo img{display:block;width:100%;height:auto;object-fit:contain}.contact-photo figcaption{margin-top:12px;color:var(--muted);font:10px Arial,Helvetica,sans-serif;letter-spacing:.12em}
.lightbox{background:rgba(5,5,6,.985);border:0;color:#fff;position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;padding:20px;z-index:1000}.lightbox:not([open]){display:none}.lightbox[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.lightbox img{width:auto;max-width:calc(100vw - 112px);max-height:calc(100vh - 130px);height:auto;object-fit:contain;flex-shrink:1}.lightbox .caption{font:10px Arial,Helvetica,sans-serif;letter-spacing:.14em;color:#ccc}.lightbox button{position:absolute;background:rgba(0,0,0,.25);border:0;font-size:25px;line-height:1.2;padding:15px}.lightbox .close{top:17px;right:20px}.lightbox .prev{top:50%;left:15px;transform:translateY(-50%)}.lightbox .next{top:50%;right:15px;transform:translateY(-50%)}
@media(max-width:900px){.hero{grid-template-columns:.9fr 1.1fr;gap:30px}.hero-copy h1{font-size:clamp(41px,7vw,65px)}.gallery{gap:75px 37px}.photo:nth-child(even){transform:translateY(70px)}.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 28px}.story{gap:48px}}
@media(max-width:650px){.header{display:block;padding:23px 21px}.logo{font-size:17px}.logo small{font-size:7px}.nav{gap:22px;margin-top:18px}.nav a{padding:5px 0;font-size:9px}.hero{display:flex;flex-direction:column;align-items:stretch;padding:55px 21px 62px;gap:45px}.hero-copy h1{font-size:clamp(49px,12vw,81px);margin:14px 0 23px}.hero-copy .ja{font-size:19px;margin-bottom:12px}.hero-copy .scroll{margin-top:16px}.hero-photo figcaption{text-align:left}.chapter{display:block;padding:65px 24px 55px}.chapter h2{font-size:25px;margin-top:15px}.chapter p{margin-top:25px}.gallery{display:block;padding:0 20px 65px}.gallery .photo,.gallery .photo.wide{width:100%;margin:0 0 65px;transform:none;grid-column:auto}.photo figcaption{padding-top:12px}.endband{display:block;padding:20px 25px 80px}.endband .line-link{display:inline-block;margin-top:25px}.footer{display:block;padding:28px 22px 50px}.footer-links{margin-top:24px;gap:18px}.page-heading{padding:75px 24px 55px}.page-heading h1{font-size:clamp(50px,13vw,85px)}.filter-wrap{gap:16px;padding:0 24px;margin-bottom:45px}.works-grid{padding:0 20px 90px;grid-template-columns:1fr;gap:45px}.story{display:block;padding:0 24px 100px}.story-photos,.contact-photo{margin-top:70px}.story h2{font-size:25px}.lightbox{padding:10px}.lightbox img{max-width:calc(100vw - 20px);max-height:calc(100vh - 170px)}.lightbox .prev,.lightbox .next{top:auto;transform:none;bottom:15px}.lightbox .prev{left:22%}.lightbox .next{right:22%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.photo-open img{transition:none}}


/* ABOUT / 撮り続ける。—— 作品の表示・既存レイアウトには変更なし */
.continuing {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(80px, 9vw, 145px) clamp(24px, 8vw, 145px) clamp(100px, 11vw, 175px);
  border-top: 1px solid var(--rule);
}
.continuing-intro {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  align-items: start;
  column-gap: clamp(40px, 9vw, 150px);
  row-gap: 26px;
  margin-bottom: clamp(40px, 6vw, 90px);
}
.continuing-heading h2 {
  font-size: clamp(27px, 3vw, 42px);
  font-weight: 400;
  letter-spacing: .22em;
  line-height: 1.7;
  margin: 24px 0 0;
}
.continuing-copy p {
  font-size: 13px;
  line-height: 2.8;
  letter-spacing: .06em;
  color: var(--soft);
  margin: 0 0 18px;
}
.continuing-photo { margin: 0; }
.continuing-photo img {
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  aspect-ratio: auto;
}
.continuing-photo figcaption {
  margin-top: 14px;
  text-align: right;
  font: 10px Arial, Helvetica, sans-serif;
  letter-spacing: .18em;
  color: var(--muted);
}
@media (max-width: 650px) {
  .continuing { padding: 70px 24px 100px; }
  .continuing-intro { grid-template-columns: 1fr; margin-bottom: 42px; }
  .continuing-heading h2 { font-size: 27px; }
  .continuing-photo figcaption { text-align: left; }
}
