@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Serif+SC:wght@400;500&display=swap');

:root { --ink:#111; --paper:#f5f4f0; --line:rgba(17,17,17,.24); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Mono",monospace; }
.site-header { min-height:19rem; padding:1.5rem 2rem; display:grid; grid-template-columns:1fr 1fr 1fr; align-items:start; font-size:.73rem; line-height:1.5; letter-spacing:.02em; }
.mark { color:inherit; text-decoration:none; font-size:1rem; line-height:.92; font-weight:500; letter-spacing:-.07em; }
.descriptor { margin:0; justify-self:center; }
.index-link { justify-self:end; color:inherit; text-decoration:none; }
.index-link span { margin-left:.3rem; }
.intro { padding:0 2rem 9rem; max-width:68rem; }
.eyebrow { margin:0 0 1.25rem; font-size:.68rem; }
h1 { margin:0; font-family:"Noto Serif SC",serif; font-size:clamp(2.7rem,6.8vw,6.5rem); font-weight:400; letter-spacing:-.08em; line-height:1.12; }
h1 em { font-style:normal; color:#a12c21; }
.intro-note { max-width:23rem; margin:2rem 0 0; font-family:"Noto Serif SC",serif; font-size:1rem; line-height:1.8; }
.gallery { display:grid; grid-template-columns:repeat(12,1fr); gap:1.5rem; padding:0 2rem 7rem; }
.work { margin:0; }
.work img { display:block; width:100%; height:100%; object-fit:cover; background:#d7d4ce; }
.work-a { grid-column:1 / span 7; aspect-ratio:1/1; }
.work-j { grid-column:9 / span 4; aspect-ratio:1/1; }
.slideshow { position:relative; background:#e2dfd8; overflow:hidden; }
.slideshow.work-a { overflow:visible; }
.slideshow img { object-fit:contain; }
.work-j, .work-b { padding:clamp(.6rem,1vw,.9rem); background:#fff; }
.work-j, .work-b, .pet-secondary, .daily-secondary { overflow:visible; }
.work-slogan { position:absolute; z-index:2; top:calc(100% + 2.6rem); left:0; width:min(31rem,90%); color:var(--ink); pointer-events:none; }
.work-slogan p { margin:0; font-family:"Noto Serif SC",serif; font-size:.84rem; line-height:1.85; letter-spacing:.045em; }
.work-slogan p[lang="en"] { margin-top:.7rem; font-family:Georgia,"Times New Roman",serif; font-size:.69rem; font-style:italic; line-height:1.55; letter-spacing:.055em; color:rgba(17,17,17,.68); }
.slide-control { position:absolute; top:50%; transform:translateY(-50%); width:2.7rem; height:2.7rem; border:1px solid rgba(17,17,17,.32); border-radius:50%; background:rgba(245,244,240,.88); color:var(--ink); font:400 1.2rem/1 "DM Mono",monospace; cursor:pointer; opacity:0; transition:opacity .2s ease, background .2s ease; }
.slideshow:hover .slide-control, .slide-control:focus-visible { opacity:1; }
.slide-control:hover { background:#fff; }
.previous { left:1rem; }
.next { right:1rem; }
.work-b { grid-column:9 / span 4; align-self:end; aspect-ratio:1/1; margin-bottom:4.8rem; transform:translateY(-17rem); }
.work-c { position:relative; grid-column:3 / span 6; aspect-ratio:3/4; margin-top:3.5rem; transform:translateX(-13vw); }
.pet-slideshow { width:100%; height:100%; padding:clamp(.6rem,1vw,.9rem); background:#fff; }
.work-d { grid-column:3 / span 6; aspect-ratio:1/1; margin-top:5rem; padding:clamp(.6rem,1vw,.9rem); background:#fff; overflow:visible; transform:translateX(-25%); }
.work-d img { width:100%; height:100%; object-fit:contain; }
.home-goods { position:absolute; z-index:1; left:calc(100% + 2.5rem); top:12%; width:66.667%; aspect-ratio:1/1; padding:clamp(.6rem,1vw,.9rem); background:#fff; overflow:visible; }
.home-goods img { width:100%; height:100%; object-fit:contain; }
.pet-secondary { position:absolute; z-index:1; left:calc(100% + 2.5rem); top:12%; width:66.667%; aspect-ratio:1/1; padding:clamp(.6rem,1vw,.9rem); background:#fff; transform:translate(33.333%,-33.333%); }
.pet-secondary img { width:100%; height:100%; object-fit:contain; }
.daily-secondary { position:absolute; z-index:1; left:calc(100% + 2.5rem); top:58%; width:66.667%; aspect-ratio:1/1; padding:clamp(.6rem,1vw,.9rem); background:#fff; transform:translateX(33.333%); }
.daily-secondary img { width:100%; height:100%; object-fit:contain; }
.postcard { position:absolute; z-index:2; bottom:calc(100% + 4rem); left:0; width:133.333%; height:13rem; display:grid; grid-template-columns:38% 62%; background:#fff; border:1px solid rgba(17,17,17,.14); box-shadow:0 .75rem 2.5rem rgba(17,17,17,.06); transform:translateY(-14.286%); }
.postcard-visual { min-width:0; overflow:hidden; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:.25rem; padding:.25rem; background:#f5f4f0; }
.postcard .postcard-visual img { width:100%; height:100%; min-width:0; min-height:0; object-fit:contain; background:#fff; }
.postcard-copy { position:relative; padding:1.55rem 1.7rem 1.35rem; border-left:1px solid rgba(17,17,17,.14); }
.postcard-kicker { margin:0 0 1rem; font-size:.62rem; letter-spacing:.18em; }
.postcard-title { margin:0; font-family:"Noto Serif SC",serif; font-size:1.16rem; line-height:1.55; letter-spacing:.04em; }
.postcard-text { max-width:22rem; margin:1rem 0 0; font-family:"Noto Serif SC",serif; font-size:.72rem; line-height:1.8; color:rgba(17,17,17,.66); }
.postcard-sign { position:absolute; right:1.7rem; bottom:1.2rem; margin:0; font-size:.56rem; letter-spacing:.14em; color:rgba(17,17,17,.48); }
.postcard-quote { position:absolute; z-index:2; bottom:calc(100% + 4rem); left:calc(133.333% + 2rem); width:min(22rem,30vw); height:13rem; display:flex; align-items:center; overflow:hidden; transform:translateY(-14.286%); }
.postcard-quote::before { content:""; position:absolute; top:0; left:0; width:3.8rem; border-top:1px solid rgba(17,17,17,.28); }
.postcard-quote blockquote { position:relative; margin:0; padding:1.35rem 0 0 1.25rem; font-family:Georgia,"Times New Roman",serif; font-size:clamp(.9rem,1.25vw,1.28rem); font-style:italic; line-height:1.55; letter-spacing:.035em; color:rgba(17,17,17,.78); }
.postcard-quote blockquote::before { content:"“"; position:absolute; left:0; top:.75rem; font-size:2rem; line-height:1; color:#a12c21; }
.postcard-quote blockquote::after { content:"”"; margin-left:.12em; color:#a12c21; }
figcaption, .panel-caption { border-top:1px solid var(--line); padding-top:.55rem; margin-top:.65rem; display:flex; justify-content:space-between; font-size:.64rem; text-transform:uppercase; }
.panel-caption { position:absolute; top:calc(100% + .65rem); left:0; width:100%; margin:0; }
.bottom-blank { position:relative; width:100%; overflow:hidden; background:var(--paper); }
.editorial-card { position:absolute; top:7%; left:50%; width:min(58rem,calc(100% - 4rem)); margin:0; padding:clamp(1.25rem,3vw,3rem); transform:translateX(-50%); background:#fff; border:1px solid rgba(17,17,17,.12); }
.editorial-media { position:relative; width:100%; aspect-ratio:2.45/1; background:#efefed; }
.editorial-media::before { content:""; position:absolute; z-index:1; pointer-events:none; inset:-.75rem -1rem; border-top:1px solid rgba(17,17,17,.2); border-bottom:1px solid rgba(17,17,17,.2); }
.editorial-media::after { content:""; position:absolute; z-index:1; pointer-events:none; inset:-1rem -.75rem; border-left:1px solid rgba(17,17,17,.2); border-right:1px solid rgba(17,17,17,.2); }
.editorial-card-image { display:block; width:100%; height:100%; object-fit:contain; }
.editorial-media .slide-control { z-index:2; }
.editorial-media:hover .slide-control { opacity:1; }
.editorial-credit { margin:clamp(1.1rem,2.2vw,1.8rem) 0 0; text-align:center; font-size:.64rem; letter-spacing:.18em; color:rgba(17,17,17,.64); }
.editorial-card-body { padding-top:clamp(1.2rem,2.5vw,2.6rem); }
.editorial-card-body > p { max-width:48rem; margin:0; font-family:"Noto Serif SC",serif; font-size:.78rem; line-height:2; color:rgba(17,17,17,.72); }
.editorial-card-actions { margin-top:1.7rem; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.editorial-card-actions > a { min-width:13.8rem; padding:1.05rem 1.4rem; border:1px solid rgba(17,17,17,.16); color:var(--ink); text-align:center; text-decoration:none; font-family:Georgia,"Times New Roman",serif; font-size:1.08rem; font-style:italic; letter-spacing:.14em; }
.editorial-card-actions > p { margin:0; display:flex; gap:1.7rem; font-size:.56rem; letter-spacing:.14em; color:rgba(17,17,17,.58); }
.editorial-card-actions > p span + span { position:relative; }
.editorial-card-actions > p span + span::before { content:""; position:absolute; left:-.9rem; top:50%; width:1px; height:.7rem; background:rgba(17,17,17,.14); transform:translateY(-50%); }
footer { border-top:1px solid var(--line); padding:1.3rem 2rem 1.7rem; display:flex; justify-content:space-between; font-size:.68rem; }
footer p { margin:0; }
@media (max-width:650px) { .site-header{ min-height:13rem; padding:1.2rem; grid-template-columns:1fr 1fr; }.descriptor{ display:none; }.intro{ padding:0 1.2rem 5rem; }.gallery{ grid-template-columns:repeat(6,1fr); gap:1rem; padding:0 1.2rem 4rem; }.work-a{grid-column:1 / span 6;}.work-j{grid-column:2 / span 5; margin-top:1.5rem;}.work-b{grid-column:3 / span 4; margin:0; margin-top:1.5rem; transform:none;}.work-c{grid-column:1 / span 5; margin-top:1.5rem; transform:none;}.work-d{grid-column:1 / span 5; margin-top:4rem; transform:none;} .postcard{bottom:calc(100% + 2rem); height:9rem; grid-template-columns:42% 58%;}.postcard-copy{padding:.8rem .9rem;}.postcard-kicker{margin-bottom:.5rem;font-size:.5rem}.postcard-title{font-size:.8rem}.postcard-text{font-size:.58rem;line-height:1.55;margin-top:.5rem}.postcard-sign{display:none}.slide-control{opacity:1; width:2.35rem; height:2.35rem;} .previous{left:.7rem}.next{right:.7rem}.editorial-card{top:4%;width:calc(100% - 2rem);padding:1rem}.editorial-media{aspect-ratio:16/7}.editorial-card-body{padding-top:1rem}.editorial-card-body>p{font-size:.68rem;line-height:1.75}.editorial-card-actions{margin-top:1rem;gap:.8rem;align-items:flex-end}.editorial-card-actions>a{min-width:8rem;padding:.8rem;font-size:.56rem}.editorial-card-actions>p{gap:.9rem;font-size:.48rem}.editorial-card-actions>p span+span::before{left:-.48rem} footer{padding:1.2rem;} }
@media (max-width:650px) { .postcard-quote{bottom:calc(100% + 2rem);left:calc(133.333% + 1rem);width:10rem;height:9rem}.postcard-quote blockquote{padding:.85rem 0 0 .85rem;font-size:.62rem;line-height:1.45}.postcard-quote blockquote::before{top:.45rem;font-size:1.35rem} }