.portfolio { background:#f5f2ec; color:#28241f; padding:82px max(5vw,24px) 86px; }
.portfolio__intro { display:flex; justify-content:space-between; align-items:flex-end; gap:48px; margin-bottom:43px; }
.portfolio .eyebrow { margin-bottom:21px; }
.portfolio h2 { font:500 clamp(38px,4.5vw,64px)/1.02 'Cormorant Garamond',Georgia,serif; margin:0; letter-spacing:-.025em; }
.portfolio__intro>p { max-width:310px; margin:0 0 4px; color:#8b8072; font-size:13px; line-height:1.9; }
.portfolio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 30px; }
.portfolio-card { min-width:0; }
.portfolio-card__photo { display:block; position:relative; width:100%; aspect-ratio:3/2; padding:0; border:0; background:#d7d1c6; overflow:hidden; cursor:pointer; color:#fff; text-align:left; }
.portfolio-card__photo>img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.portfolio-card__photo:hover>img { transform:scale(1.035); }
.portfolio-card__photo::after { content:''; position:absolute; inset:60% 0 0; background:linear-gradient(transparent,#20180e42); pointer-events:none; }
.portfolio-card__count { position:absolute; left:18px; bottom:18px; z-index:1; padding:7px 10px; border:1px solid #ffffff59; background:#30271c57; backdrop-filter:blur(8px); border-radius:4px; font-size:10px; line-height:1.4; letter-spacing:.06em; }
.portfolio-card__arrow { position:absolute; right:18px; bottom:18px; z-index:1; display:grid; place-items:center; width:37px; height:37px; border-radius:50%; border:1px solid #ffffffa6; background:#30271c57; backdrop-filter:blur(8px); font-size:21px; transition:background .2s; }
.portfolio-card__photo:hover .portfolio-card__arrow { background:#74624e; }
.portfolio-card__caption { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding-top:21px; }
.portfolio-card__meta { margin:0 0 10px; font-size:10px; line-height:1.6; color:#8f8070; letter-spacing:.1em; text-transform:uppercase; }
.portfolio-card__meta span { margin:0 6px; }
.portfolio-card h3 { font:500 clamp(24px,2.45vw,32px)/1.12 'Cormorant Garamond',Georgia,serif; letter-spacing:-.015em; margin:0; }
.portfolio-card__index { flex-shrink:0; font:italic 300 27px/1 'Cormorant Garamond',Georgia,serif; color:#998c7a; padding-top:26px; }
.portfolio-card__description { max-width:490px; color:#807466; font-size:12px; line-height:1.8; margin:12px 30px 0 0; }
.portfolio__end { display:flex; align-items:center; justify-content:space-between; gap:30px; padding-top:37px; margin-top:53px; border-top:1px solid #d9d0c3; }
.portfolio__end>p { margin:0; font:500 31px/1.2 'Cormorant Garamond',Georgia,serif; }
.portfolio__cta { background:transparent; border:0; border-bottom:1px solid #aa997f; padding:9px 0; font-size:12px; line-height:1.6; color:#72614b; cursor:pointer; }
.portfolio__cta:hover { color:#2b2116; border-color:#2b2116; }
.portfolio__cta span { margin-left:25px; }
body.gallery-open { overflow:hidden; }
.project-gallery { padding:0; border:1px solid #ffffff24; border-radius:12px; width:min(1320px,calc(100% - 48px)); max-width:none; height:calc(100dvh - 48px); max-height:none; background:#201e1a; color:#f4f0e9; box-shadow:0 30px 100px #0008; }
.project-gallery[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.project-gallery::backdrop { background:#17130fee; backdrop-filter:blur(5px); }
.project-gallery__header { position:relative; padding:21px 65px 18px 28px; }
.project-gallery__meta { margin:0 0 6px; color:#bbae9b; font-size:10px; letter-spacing:.1em; line-height:1.5; text-transform:uppercase; }
.project-gallery__title { margin:0; font:500 clamp(23px,2.7vw,34px)/1.12 'Cormorant Garamond',Georgia,serif; }
.project-gallery__close { position:absolute; top:20px; right:20px; width:35px; height:35px; display:grid; place-items:center; background:transparent; border:1px solid #ffffff50; border-radius:50%; color:#f4f0e9; font-size:25px; cursor:pointer; }
.project-gallery__stage { position:relative; min-height:0; background:#151411; overflow:hidden; }
.project-gallery__image { width:100%; height:100%; display:block; object-fit:contain; }
.project-gallery__nav { position:absolute; top:calc(50% - 22px); width:44px; height:44px; display:grid; place-items:center; border:1px solid #ffffff70; border-radius:50%; background:#1a1712b3; color:#fff; font-size:24px; cursor:pointer; }
.project-gallery__nav:hover,.project-gallery__close:hover { background:#74624e; }
.project-gallery__previous { left:18px; }
.project-gallery__next { right:18px; }
.project-gallery__footer { padding:15px 24px 18px; }
.project-gallery__caption { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-bottom:12px; }
.project-gallery__caption p { margin:0; font-size:11px; line-height:1.6; color:#cec3b4; }
.project-gallery__counter { white-space:nowrap; font-size:11px; color:#d6c6af; }
.project-gallery__thumbs { display:flex; justify-content:center; gap:9px; overflow-x:auto; padding:3px; scrollbar-width:thin; }
.project-gallery__thumb { flex:0 0 74px; padding:0; height:49px; background:#353027; border:2px solid transparent; opacity:.6; cursor:pointer; }
.project-gallery__thumb img { width:100%; height:100%; display:block; object-fit:cover; }
.project-gallery__thumb[aria-pressed=true] { border-color:#d4b78c; opacity:1; }
.project-gallery__thumb:hover { opacity:1; }
@media(max-width:760px) {
 .portfolio { padding:55px 24px 58px; }
 .portfolio__intro { flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:29px; }
 .portfolio__intro>p { max-width:100%; font-size:12px; }
 .portfolio-grid { grid-template-columns:1fr; gap:37px; }
 .portfolio-card__photo { aspect-ratio:1.4; }
 .portfolio-card__caption { padding-top:17px; }
 .portfolio-card h3 { font-size:29px; }
 .portfolio-card__meta { margin-bottom:8px; }
 .portfolio-card__description { margin-right:0; }
 .portfolio__end { align-items:flex-start; flex-direction:column; gap:20px; margin-top:37px; padding-top:29px; }
 .project-gallery { width:100%; height:100dvh; border:0; border-radius:0; }
 .project-gallery__header { padding:19px 54px 16px 20px; }
 .project-gallery__title { font-size:25px; }
 .project-gallery__close { top:17px; right:12px; width:31px; height:31px; }
 .project-gallery__nav { width:36px; height:36px; top:calc(50% - 18px); font-size:21px; }
 .project-gallery__previous { left:9px; } .project-gallery__next { right:9px; }
 .project-gallery__footer { padding:13px 16px 17px; }
 .project-gallery__caption { gap:12px; margin-bottom:10px; }
 .project-gallery__caption p { font-size:10px; }
 .project-gallery__thumbs { gap:7px; justify-content:flex-start; }
 .project-gallery__thumb { flex-basis:54px; height:39px; }
}
@media(prefers-reduced-motion:reduce) { .portfolio-card__photo>img { transition:none; } }