/* ===== Proje detay sayfası ===== */
.p-hero { position: relative; min-height: 78vh; display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: var(--navy-deep); }
.p-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.p-hero-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18, 23, 63, .55) 0%, rgba(18, 23, 63, .2) 35%, rgba(28, 35, 97, .95) 100%), radial-gradient(ellipse at 80% 100%, rgba(173, 68, 130, .45), transparent 60%); }
.p-hero-content { position: relative; padding-top: 140px; padding-bottom: 64px; }
.p-back { display: block; width: fit-content; color: rgba(255,255,255,.8); text-decoration: none; font-size: 14px; margin-bottom: 28px; }
.p-back:hover { color: #fff; }
.p-hero .kicker { color: #f0a8d2; }
.p-title { font-size: clamp(34px, 6vw, 76px); font-weight: 800; max-width: 18ch; margin-bottom: 18px; }
.p-summary { font-size: clamp(17px, 1.6vw, 21px); max-width: 640px; color: rgba(255,255,255,.88); margin: 0; }

.p-body { background: #fff; }
.p-grid { display: grid; grid-template-columns: 4fr 8fr; gap: clamp(32px, 6vw, 90px); margin-bottom: 80px; }
.p-meta { margin: 0; background: var(--lilac); border-radius: var(--radius); padding: 28px; display: grid; gap: 18px; align-self: start; }
.p-meta div { border-bottom: 1px solid rgba(28, 35, 97, .12); padding-bottom: 14px; }
.p-meta div:last-child { border-bottom: 0; padding-bottom: 0; }
.p-meta dt { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--magenta); }
.p-meta dd { margin: 4px 0 0; font-family: var(--font-head); font-weight: 500; color: var(--navy); font-size: 17px; }
.p-text .lead { font-size: clamp(18px, 1.7vw, 22px); color: #2c3060; }
.p-sample { font-size: 14px; background: #fff6e0; border-left: 4px solid #e0a500; padding: 12px 16px; border-radius: 8px; color: #6b5200; }

.p-gal-title { font-size: clamp(24px, 3vw, 34px); }
.p-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.p-shot { border: 0; padding: 0; background: var(--lilac); border-radius: var(--radius-sm); overflow: hidden; aspect-ratio: 4 / 3; cursor: zoom-in; }
.p-shot:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
.p-shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.p-shot:hover img { transform: scale(1.05); }

.p-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-bottom: 80px; }
.p-pg { display: flex; flex-direction: column; gap: 6px; text-decoration: none; background: var(--lilac); border-radius: var(--radius); padding: 24px 28px; transition: background .25s, color .25s; }
.p-pg span { font-size: 13px; font-weight: 600; color: var(--magenta); }
.p-pg strong { font-family: var(--font-head); font-weight: 700; color: var(--navy); font-size: 18px; }
.p-pg:hover { background: var(--navy); }
.p-pg:hover strong { color: #fff; }
.p-pg-next { text-align: right; }

.p-cta { background: radial-gradient(ellipse at 15% 0%, rgba(173, 68, 130, .5), transparent 55%), var(--purple); color: #fff; padding: 80px 0; }
.p-cta-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.p-cta .h2 { color: #fff; margin: 0; max-width: 20ch; }

.footer-contact { display: flex; flex-direction: column; gap: 6px; text-align: right; }
.footer-contact a { color: #fff; text-decoration: none; }
.footer-contact a:hover { color: #f0a8d2; }

.lightbox { position: fixed; inset: 0; z-index: 80; background: rgba(10, 12, 35, .94); display: grid; place-items: center; padding: 60px 70px; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; }
.lb-close, .lb-nav { position: absolute; border: 0; background: rgba(255,255,255,.12); color: #fff; border-radius: 50%; width: 52px; height: 52px; font-size: 30px; line-height: 1; display: grid; place-items: center; }
.lb-close:hover, .lb-nav:hover { background: var(--magenta); }
.lb-close { top: 16px; right: 16px; }
.lb-prev { left: 12px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 12px; top: 50%; transform: translateY(-50%); }

@media (max-width: 820px) {
  .p-grid { grid-template-columns: 1fr; margin-bottom: 56px; }
  .p-gallery { grid-template-columns: 1fr 1fr; }
  .p-pager { grid-template-columns: 1fr; }
  .p-pg-next { text-align: left; }
  .footer-contact { text-align: left; }
  .lightbox { padding: 60px 12px; }
  .lb-nav { top: auto; bottom: 16px; transform: none; }
}