/* ===== Редизайн «Реализованные проекты» (тест) — по макету Figma «Фрейм Хаус» ===== */
.po-page{background:#f5f5f4;padding:20px 0 80px;font-family:'Gilroy',Arial,sans-serif;color:#202020}
.po-container{max-width:1620px;margin:0 auto;padding:0 20px}
@media(min-width:1660px){.po-container{padding:0}}

/* кнопки */
.po-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:20px 40px;background:#5ebb01;color:#fff !important;font:600 14px/1.2 'Gilroy',sans-serif;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;border:1px solid #5ebb01;cursor:pointer;transition:background .25s,color .25s;white-space:nowrap}
.po-btn:hover{background:#4ea300}
.po-btn--outline{background:transparent;color:#202020 !important;border-color:#c9c9c7}
.po-btn--outline:hover{background:#fff;border-color:#5ebb01}
.po-btn--sm{padding:12px 20px;font-size:14px}
.po-btn--full{width:100%}

/* крошки */
.po-crumbs{font:400 14px/1.2 'Gilroy',sans-serif;margin:16px 0 20px}
.po-crumbs a{color:#5ebb01;text-decoration:none}
.po-crumbs span{color:#b2b2b2;margin:0 7px}
.po-crumbs em{color:#b2b2b2;font-style:normal}

/* 1 экран */
.po-hero{display:flex;gap:30px;align-items:stretch;margin-bottom:40px}
.po-hero__content{flex:1 1 46%;min-width:0}
.po-hero h1{font:700 60px/1.2 'Gilroy',sans-serif;text-transform:uppercase;margin:0 0 10px;color:#202020}
.po-hero__text{font:600 18px/1.25 'Gilroy',sans-serif;margin:0 0 40px;max-width:795px}
.po-facts{display:flex;gap:30px;margin-bottom:40px;flex-wrap:wrap}
.po-fact b{display:block;font:400 26px/1.2 'Gilroy',sans-serif;text-transform:uppercase}
.po-fact i{display:block;width:120px;height:1px;background:#5ebb01;margin:8px 0}
.po-fact span{font:400 14px/1.2 'Gilroy',sans-serif}
.po-hero__cta{display:flex;gap:20px;flex-wrap:wrap}
.po-hero__img{flex:1 1 54%;min-width:0}
.po-hero__img img{width:100%;height:100%;min-height:380px;object-fit:cover;display:block}

/* фильтры */
.po-filter{background:#fff;padding:20px 40px;margin-bottom:30px}
.po-filter__tabs{display:flex;align-items:center;gap:0;border-bottom:1px solid #edebe9;padding-bottom:0}
.po-filter__tab{font:400 18px/1.2 'Gilroy',sans-serif;color:#202020;background:none;border:0;padding:8px 20px;cursor:pointer}
.po-filter__tab.is-active{background:#ecebe9}
.po-filter__reset{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font:600 14px/1.2 'Gilroy',sans-serif;background:none;border:0;color:#202020;cursor:pointer;padding:8px 0}
.po-filter__reset:hover,.po-filter__tab:hover{color:#5ebb01}
.po-filter__row{display:flex;gap:10px;flex-wrap:wrap;padding-top:10px}
.po-chip{font:500 14px/1 'Gilroy',sans-serif;color:#202020;background:#fff;border:1px solid #82c650;padding:8px 20px;cursor:pointer;transition:background .2s}
.po-chip:hover{background:#e9f5dd}
.po-chip.is-active{background:#82c650;border-color:#82c650}

/* сетка карточек */
.po-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.po-card{background:#fff;display:flex;flex-direction:column;text-decoration:none;color:#202020;overflow:hidden}
.po-card.po-hidden{display:none}
.po-card__img{position:relative;aspect-ratio:383/300;overflow:hidden}
.po-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.po-card:hover .po-card__img img{transform:scale(1.06)}
.po-card__hover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(32,32,32,.5);opacity:0;transition:opacity .3s}
@media(hover:hover){.po-card:hover .po-card__hover{opacity:1}}
.po-card__body{padding:20px;display:flex;flex-direction:column;gap:8px}
.po-card__name{font:400 20px/1.2 'Gilroy',sans-serif;text-transform:uppercase}
.po-card__row{display:flex;gap:20px;flex-wrap:wrap}
.po-card__prop{display:inline-flex;align-items:flex-start;gap:8px;font:400 14px/1.25 'Gilroy',sans-serif}
.po-card__prop svg{flex:0 0 auto;margin-top:-1px}

/* ФОС в сетке */
.po-fos{grid-column:span 3;background:url('img/calc-block.png') center/cover,linear-gradient(180deg,#edebe9 0%,#f6f6f6 100%);position:relative;display:flex;gap:40px;align-items:center;padding:40px;min-height:400px}
.po-fos::before{content:'';position:absolute;inset:0;background:rgba(245,245,244,.55)}
.po-fos>*{position:relative}
.po-fos__txt{flex:1 1 45%}
.po-fos__over{font:400 24px/1.2 'Gilroy',sans-serif;margin-bottom:6px}
.po-fos__title{font:700 40px/1.2 'Gilroy',sans-serif;text-transform:uppercase;margin-bottom:14px}
.po-fos__txt p{font:400 14px/1.25 'Gilroy',sans-serif;max-width:490px}
.po-fos__form{flex:1 1 55%;display:flex;flex-direction:column;gap:10px}
.po-fos__line{display:flex;gap:10px}
.po-fos__form input[type=text],.po-fos__form input[type=tel],.po-fos__form textarea{flex:1;width:100%;background:#fff;border:0;padding:14px 16px;font:600 14px/1.2 'Gilroy',sans-serif;color:#202020;resize:none}
.po-fos__form textarea{height:90px}
.po-fos__agree{display:flex;align-items:flex-start;gap:10px;font:400 14px/1.25 'Gilroy',Arial,sans-serif;color:#202020;cursor:pointer}
.po-fos__agree input{width:16px;height:16px;flex:0 0 auto;margin-top:1px;accent-color:#5ebb01}
.po-fos__agree a{color:#202020}
.po-fos__answ{font:600 14px 'Gilroy',sans-serif;color:#2e7d32;min-height:1em}

/* пусто / ещё */
.po-empty{background:#fff;padding:50px;text-align:center;font:400 18px 'Gilroy',sans-serif;margin-top:10px}
.po-empty__reset{background:none;border:0;color:#5ebb01;font:600 16px 'Gilroy',sans-serif;cursor:pointer;text-decoration:underline}
.po-more-wrap{text-align:center;margin-top:34px}
.po-more-wrap .po-btn{padding:20px 40px}

/* направления */
.po-dirs{background:#edebe9;padding:60px 0}
.po-dirs__title{font:700 40px/1.2 'Gilroy',sans-serif;text-transform:uppercase;margin-bottom:40px}
.po-dirs__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.po-dir{position:relative;display:block;height:250px;overflow:hidden;text-decoration:none}
.po-dir img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.po-dir:hover img{transform:scale(1.05)}
.po-dir::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 40%,rgba(0,0,0,.65))}
.po-dir__body{position:absolute;left:20px;right:20px;bottom:18px;z-index:1}
.po-dir__body span{display:block;color:#fff;font:400 20px/1.2 'Gilroy',sans-serif;text-transform:uppercase}
.po-dir__body .po-btn{margin-top:10px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.po-dir:hover .po-btn{opacity:1;transform:none}
@media(hover:none){.po-dir__body .po-btn{display:none}}

/* ===== детальная ===== */
.po-hero--detail h1{margin-bottom:24px}
.pod-meta{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.pod-meta__item{display:inline-flex;align-items:center;gap:8px;font:400 20px/1.2 'Gilroy',sans-serif;color:#202020}
.pod-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-bottom:60px}
.pod-ph{display:block;aspect-ratio:383/300;overflow:hidden;background:#fff}
.pod-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.pod-ph:hover img{transform:scale(1.05)}
.pod-videos{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-bottom:60px}
.pod-video{position:relative;aspect-ratio:520/400;background:#202020;cursor:pointer;overflow:hidden}
.pod-video img{width:100%;height:100%;object-fit:cover;display:block}
.pod-video__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:transform .25s}
.pod-video:hover .pod-video__play{transform:scale(1.08)}
.pod-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pod-other__title{font:700 40px/1.2 'Gilroy',sans-serif;text-transform:uppercase;margin-bottom:40px}
.po-grid--other{grid-template-columns:repeat(3,1fr)}
.pod-other__more{text-align:center;margin-top:34px}

/* lightbox */
.pod-lb{position:fixed;inset:0;z-index:9999;background:rgba(32,32,32,.9);display:flex;flex-direction:column;align-items:center;justify-content:center}
.pod-lb[hidden]{display:none}
.pod-lb__close{position:absolute;top:40px;right:40px;background:none;border:0;cursor:pointer;z-index:3;opacity:.9}
.pod-lb__close:hover{opacity:1}
.pod-lb__stage{flex:1 1 auto;display:flex;align-items:center;justify-content:center;width:100%;padding:60px 90px 20px;box-sizing:border-box;min-height:0}
.pod-lb__stage img{max-width:100%;max-height:100%;object-fit:contain;display:block;box-shadow:0 10px 60px rgba(0,0,0,.5)}
.pod-lb__nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(32,32,32,.5);border:0;cursor:pointer;padding:14px 10px;z-index:3}
.pod-lb__nav:hover{background:rgba(32,32,32,.8)}
.pod-lb__nav--prev{left:24px}
.pod-lb__nav--next{right:24px}
.pod-lb__thumbs{flex:0 0 auto;display:flex;gap:30px;padding:20px;max-width:100%;overflow-x:auto;justify-content:safe center}
.pod-lb__thumbs img{width:176px;height:120px;object-fit:cover;cursor:pointer;border:1px solid transparent;opacity:.75;transition:opacity .2s;flex:0 0 auto}
.pod-lb__thumbs img:hover{opacity:1}
.pod-lb__thumbs img.is-active{border-color:#5ebb01;opacity:1}

@media(max-width:1100px){
	.pod-gallery{grid-template-columns:repeat(3,1fr);gap:20px}
	.pod-videos{grid-template-columns:repeat(2,1fr)}
	.po-grid--other{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
	.pod-meta{gap:12px;margin-bottom:24px}
	.pod-meta__item{font-size:16px}
	.pod-gallery{grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:40px}
	.pod-videos{grid-template-columns:1fr;margin-bottom:40px}
	.pod-other__title{font-size:26px}
	.po-grid--other{grid-template-columns:1fr}
	.pod-lb__stage{padding:56px 10px 10px}
	.pod-lb__close{top:12px;right:12px}
	.pod-lb__nav{display:none}
	.pod-lb__thumbs{gap:10px;padding:12px}
	.pod-lb__thumbs img{width:96px;height:66px}
	.pod-other__more .po-btn{width:100%}
}

/* ===== адаптив ===== */
@media(max-width:1400px){
	.po-hero h1{font-size:46px}
	.po-grid{grid-template-columns:repeat(3,1fr)}
	.po-fos{grid-column:span 3}
}
@media(max-width:1100px){
	.po-grid{grid-template-columns:repeat(2,1fr)}
	.po-fos{grid-column:span 2;flex-direction:column;align-items:stretch}
	.po-dirs__grid{grid-template-columns:repeat(2,1fr)}
	.po-hero{flex-direction:column}
	.po-hero__img img{min-height:280px}
	.po-hero h1{font-size:38px}
}
@media(max-width:700px){
	.po-page{padding-top:10px}
	.po-hero h1{font-size:28px}
	.po-hero__text{font-size:15px;margin-bottom:24px}
	.po-facts{gap:18px;margin-bottom:24px}
	.po-fact b{font-size:20px}
	.po-hero__cta{flex-direction:column}
	.po-hero__cta .po-btn{width:100%}
	.po-filter{padding:14px 16px}
	.po-filter__tabs{flex-wrap:wrap}
	.po-filter__tab{font-size:15px;padding:6px 12px}
	.po-filter__reset{font-size:13px}
	.po-grid{grid-template-columns:1fr;gap:20px}
	.po-fos{grid-column:span 1;padding:24px 16px}
	.po-fos__title{font-size:26px}
	.po-fos__line{flex-direction:column}
	.po-dirs{padding:40px 0}
	.po-dirs__title{font-size:26px}
	.po-dirs__grid{grid-template-columns:1fr;gap:16px}
	.po-more-wrap .po-btn{width:100%}
}
