/* ═══════════════════════════════════════════════
   NAMRATA SHAJWANI — PROJECT PAGE STYLES
   css/project.css
   Loaded on all project case-study pages
   ═══════════════════════════════════════════════ */

/* ── PROJECT HERO ── */
.proj-hero{position:relative;height:88vh;min-height:560px;overflow:hidden}
.proj-hero img{width:100%;height:100%;object-fit:cover;display:block}
.proj-hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,9,8,.18) 0%,rgba(10,9,8,.68) 100%)}
.proj-hero-content{position:absolute;bottom:0;left:0;right:0;padding:52px 64px}
.proj-hero-cat{font-size:10px;letter-spacing:.2em;color:rgba(248,246,241,.55);text-transform:uppercase;margin-bottom:12px}
.proj-hero-title{font-family:'Fraunces',serif;font-size:clamp(36px,5.5vw,72px);font-weight:400;color:#F8F6F1;line-height:1.0;margin-bottom:20px}
.proj-hero-title em{font-style:italic;font-weight:300}
.pill-row{display:flex;gap:8px;flex-wrap:wrap}
.kpill{padding:7px 14px;border-radius:100px;font-size:11px;color:rgba(248,246,241,.85);border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px 1px rgba(255,255,255,.15);letter-spacing:.04em}

/* ── CONTAINER ── */
.proj-container{max-width:900px;margin:0 auto;padding:0 48px}

/* ── META ROW ── */
.meta-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:32px;padding:52px 0;border-bottom:1px solid #E0DDD7}
.meta-label{font-size:10px;letter-spacing:.16em;color:#8A8880;text-transform:uppercase;margin-bottom:8px}
.meta-value{font-size:14px;color:#151412;line-height:1.6}
.meta-value a{color:#C96A4A;text-decoration:none;transition:color .2s}
.meta-value a:hover{text-decoration:underline}

/* ── CONTENT SECTIONS ── */
.proj-section{padding:52px 0;border-bottom:1px solid #E0DDD7}
.proj-section:last-child{border-bottom:none}
.proj-sec-label{font-size:10px;letter-spacing:.16em;color:#8A8880;text-transform:uppercase;margin-bottom:20px}
.proj-sec-headline{font-family:'Fraunces',serif;font-size:clamp(22px,2.8vw,32px);font-weight:400;font-style:italic;color:#151412;line-height:1.2;margin-bottom:20px}
.proj-body{font-size:15px;color:#3a3835;line-height:1.85}
.proj-body p{margin-bottom:16px}
.proj-body p:last-child{margin-bottom:0}
.proj-body strong{color:#151412;font-weight:500}

/* ── VIDEO ── */
.video-wrap{position:relative;width:100%;padding-bottom:56.25%;border-radius:14px;overflow:hidden;background:#0e0e0c;margin-top:8px}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}

/* ── IMAGE GRIDS ── */
.img-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.img-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:28px}
.img-wrap{border-radius:12px;overflow:hidden;background:#EAE8E2}
.img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.img-wrap.wide{aspect-ratio:16/9}
.img-wrap.portrait{aspect-ratio:3/4}
.img-cap{font-size:12px;color:#8A8880;margin-top:8px;line-height:1.5}
.img-credit{font-size:11px;color:#B0ADA8;margin-top:3px}

/* ── COLLAB LINE ── */
.collab-line{font-size:13px;color:#8A8880;margin-top:28px;padding-top:20px;border-top:1px solid #E0DDD7;line-height:1.7}
.collab-line strong{color:#151412;font-weight:500}

/* ── RESPONSIVE — PROJECT ── */
@media(max-width:1024px){
  .proj-hero-content{padding:44px 48px}
  .proj-container{padding:0 32px}
}
@media(max-width:768px){
  .proj-hero{height:70vh;min-height:420px}
  .proj-hero-content{padding:36px 32px}
  .proj-container{padding:0 20px}
  .meta-row{grid-template-columns:1fr;gap:20px;padding:36px 0}
  .img-grid-2{grid-template-columns:1fr}
  .img-grid-3{grid-template-columns:1fr}
  .proj-section{padding:40px 0}
}
@media(max-width:480px){
  .proj-hero{height:60vh;min-height:360px}
  .proj-hero-content{padding:28px 20px}
  .proj-container{padding:0 16px}
  .proj-hero-title{font-size:clamp(28px,8vw,48px)}
  .pill-row{gap:6px}
  .kpill{padding:5px 10px;font-size:10px}
}