.portfolio-page .site-header a[aria-current=page]{color:var(--pink-dark);border-bottom:2px solid var(--pink);padding-block:8px}
.portfolio-hero{min-height:680px;grid-template-columns:1fr 1fr;padding-bottom:60px}
.portfolio-hero h1{font-size:clamp(3rem,6.1vw,6rem);line-height:1.05;margin-bottom:30px}
.portfolio-hero .hero-description{font-size:21px;line-height:1.6}
.portfolio-intro{font-size:16px;max-width:440px;line-height:1.7;margin-block:20px 28px}
.portfolio-collage{padding-bottom:100px}
.portfolio-collage .hero-main-image{border-radius:47% 48% 44% 42%;height:430px;object-fit:cover;object-position:center;transform:rotate(-4deg)}
.portfolio-collage .hero-note{right:-4px;bottom:0;min-height:175px;display:flex;flex-direction:column;align-items:center;justify-content:center;--note-angle:9deg}
.portfolio-collage .hero-note .ink-underline{white-space:nowrap}
.project-cover-caption{display:block;max-width:270px;font-size:12px;margin:28px 140px 0 20px;color:#555}
.portfolio-work{border-top:1px solid var(--line);padding-top:75px}
.projects-grid{display:grid;grid-template-columns:1fr 1fr;gap:85px 65px;align-items:start}
.project-card:nth-child(even){margin-top:85px}
.project-card:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;margin-top:15px}
.project-photo{position:relative;margin:0 0 30px;border-radius:8px 60px 8px 8px;isolation:isolate}
.project-photo>img{width:100%;aspect-ratio:1.48;object-fit:cover;border-radius:inherit;transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .7s;box-shadow:0 7px 20px #2222220d}
.project-card:nth-child(even) .project-photo{border-radius:60px 8px 8px 8px}
.project-photo:hover>img{transform:rotate(-2deg) translateY(-8px);box-shadow:0 18px 28px #22222218}
.project-index{position:absolute;bottom:-12px;left:-12px;min-width:65px;height:65px;display:grid;place-items:center;background:var(--note-yellow);font-size:32px;color:var(--ink);rotate:-8deg;box-shadow:1px 5px 7px #2222}
.project-card:nth-child(3n+2) .project-index{background:var(--note-pink);rotate:7deg}
.project-card:nth-child(3n+3) .project-index{background:var(--note-blue);rotate:-5deg}
.project-info{padding:8px 4px 0}
.project-client{font-size:12px;font-weight:600;color:var(--pink-dark);line-height:1.6;margin-bottom:13px;letter-spacing:.025em}
.project-info h2{font-size:clamp(1.5rem,2.25vw,2.2rem);letter-spacing:-.04em;line-height:1.18;margin-bottom:18px}
.project-intro{font-size:16px;line-height:1.7;color:#555;max-width:540px}
.project-details{margin-top:24px;border-top:1px solid #c9c9c9;border-bottom:1px solid #c9c9c9}
.project-details summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;cursor:pointer;font-weight:600;font-size:14px;transition:color .2s}
.project-details summary::-webkit-details-marker{display:none}
.project-details summary:hover{color:var(--pink-dark)}
.detail-plus{width:33px;height:33px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:400;line-height:1;transition:rotate .3s}
.project-details[open] .detail-plus{rotate:45deg}
.project-details .label-open,.project-details[open] .label-closed{display:none}
.project-details[open] .label-open{display:inline}
.project-description{padding:12px 0 28px;font-size:16px;line-height:1.8}
.project-description h3{font-size:16px;letter-spacing:0;line-height:1.4;margin-bottom:12px}
.project-description .text-link{margin-top:24px;line-height:1.5}
.project-date{display:inline-block;margin-bottom:22px;background:var(--pink-light);padding:6px 12px;font-size:12px;color:#6b163c;border-radius:2px}
@media(prefers-reduced-motion:no-preference){.project-details[open] .project-description{animation:caseOpen .45s ease both}@keyframes caseOpen{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}}
@media(max-width:1000px){.projects-grid{gap:55px 35px}.project-card:nth-child(even){margin-top:55px}.portfolio-collage .hero-main-image{height:350px}.portfolio-collage .hero-note{width:165px;min-height:160px}.project-cover-caption{margin-left:0;max-width:180px}.project-card:last-child:nth-child(odd){gap:35px}}
@media(max-width:800px){.portfolio-hero{grid-template-columns:1fr;min-height:0;gap:35px}.portfolio-hero h1{font-size:clamp(3.3rem,9vw,5rem)}.portfolio-hero .hero-description{font-size:19px}.portfolio-collage{width:90%;padding-bottom:95px}.portfolio-collage .hero-main-image{height:400px}.project-info h2{font-size:24px}.project-intro{font-size:15px}.projects-grid{gap:45px 30px}.project-card:last-child:nth-child(odd){grid-column:auto;display:block}.project-cover-caption{max-width:230px;margin-right:130px}}
@media(max-width:600px){.projects-grid{grid-template-columns:1fr;gap:55px}.project-card:nth-child(even){margin-top:0}.project-info h2{font-size:28px}.project-info{padding-top:2px}.project-photo{margin-bottom:27px}.project-photo>img{aspect-ratio:1.35}.portfolio-work{padding-top:55px}.portfolio-collage{width:95%}.portfolio-collage .hero-main-image{height:300px}.portfolio-collage .hero-note{width:145px;min-height:140px;font-size:24px}.project-cover-caption{font-size:12px;max-width:150px;line-height:1.6;margin-top:25px}.project-intro{font-size:16px}.project-index{left:-7px;width:60px;height:60px}.project-description .text-link{font-size:13px}}
@media(prefers-reduced-motion:reduce){.project-photo:hover>img{transform:none}.project-photo>img,.detail-plus{transition:none}}
