.portfolio-page{max-width:1600px;margin:auto;padding:calc(var(--header-height,80px) + 64px) 6vw 80px}
.portfolio-intro{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:end;padding-bottom:48px;border-bottom:1px solid var(--line,#ffffff26)}
.portfolio-intro h1{font-size:clamp(64px,10vw,148px);font-weight:400;letter-spacing:-.075em;line-height:1;margin:20px 0 0}
.portfolio-intro p{max-width:440px;color:var(--muted,#b6aea3);font-size:17px;line-height:1.65;margin:0 0 4px}
.portfolio-index{display:flex;flex-wrap:wrap;gap:12px 30px;padding:22px 0 0;font-size:14px}.portfolio-index a{padding:10px 0;border-bottom:1px solid var(--line,#ffffff26)}
.portfolio-section{padding-top:64px;scroll-margin-top:110px}.portfolio-section-title{display:flex;gap:20px;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--line,#ffffff26);padding-bottom:20px;margin-bottom:28px}
.portfolio-section-title h2{font-size:clamp(26px,3vw,42px);font-weight:400;letter-spacing:-.045em;margin:0}.portfolio-section-title span{font-size:12px;color:var(--muted,#b6aea3)}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px}.portfolio-card{min-width:0}.portfolio-card>a{display:block}.portfolio-cover{position:relative;aspect-ratio:16/10;background:#191a1b;margin:0;overflow:hidden;border:1px solid var(--line,#ffffff26)}
.portfolio-cover img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .4s}.portfolio-card a:hover img{transform:scale(1.025)}
.portfolio-arrow{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--paper,#f5f4ef);color:var(--ink,#08090b);font-size:22px}
.portfolio-card-meta{display:flex;align-items:start;justify-content:space-between;gap:14px;padding-top:18px}.portfolio-card h3{font-size:clamp(21px,2.4vw,32px);letter-spacing:-.04em;line-height:1.2;font-weight:400;margin:8px 0 0}.portfolio-kind{font-size:10px;letter-spacing:.1em;color:var(--orange,#c6c6be)}
.portfolio-card p{max-width:560px;color:var(--muted,#b6aea3);font-size:14px;line-height:1.65;margin:12px 0 0}.portfolio-card .portfolio-open{display:block;font-size:13px;margin-top:15px;text-decoration:underline;text-underline-offset:5px}
.portfolio-note{font-size:13px;line-height:1.7;color:var(--muted,#b6aea3);max-width:760px;margin:48px 0 0;padding-top:24px;border-top:1px solid var(--line,#ffffff26)}
.portfolio-page a:focus-visible{outline:2px solid var(--orange,#fff);outline-offset:6px}
@media(max-width:760px){.portfolio-page{padding:104px 6vw 56px}.portfolio-intro{grid-template-columns:1fr;gap:24px;padding-bottom:30px}.portfolio-intro h1{font-size:clamp(56px,15vw,90px);margin-top:15px}.portfolio-intro p{font-size:16px}.portfolio-section{padding-top:44px;scroll-margin-top:90px}.portfolio-grid{grid-template-columns:1fr;gap:36px}.portfolio-section-title{gap:14px}.portfolio-section-title span{text-align:right;max-width:120px}.portfolio-card h3{font-size:25px}.portfolio-card p{font-size:15px}.portfolio-index{gap:12px 24px}.portfolio-note{margin-top:36px}}
@media(prefers-reduced-motion:reduce){.portfolio-cover img{transition:none}.portfolio-card a:hover img{transform:none}}

.service-detail{max-width:850px}.service-detail h2{font-size:clamp(30px,4vw,54px);font-weight:400;letter-spacing:-.045em;line-height:1.1}.service-detail p{font-size:17px;line-height:1.75;color:var(--muted,#b6aea3);margin-bottom:28px}.service-detail .text-link{display:inline-block;min-height:44px}

.service-detail ul{padding-left:22px;color:var(--muted,#b6aea3);font-size:17px;line-height:1.75}.service-detail li{margin-bottom:12px}
