/* ═══════════════════════════════════════
   PROJECT PAGE CSS — Editorial, dramatic
   ═══════════════════════════════════════ */

/* ── Project Hero — full bleed cinema ── */
.ph{position:relative;height:100svh;min-height:640px;display:grid;align-items:flex-end;overflow:hidden}
.ph__bg{position:absolute;inset:0}
.ph__bg img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06)}
.ph__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,18,28,.12) 0%,rgba(8,18,28,.55) 60%,rgba(8,18,28,.82) 100%)}
.ph__content{position:relative;z-index:2;padding-bottom:80px}
.ph__text{max-width:720px}
.ph__kicker{font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:16px;display:block}
.ph__title{font-family:'Einstein','Heebo',sans-serif;font-size:clamp(56px,9vw,120px);color:#fff;letter-spacing:-.048em;line-height:.88;margin-bottom:14px}
.ph__sub{font-size:clamp(16px,2vw,20px);color:rgba(255,255,255,.72);font-weight:300;letter-spacing:.02em}

/* ── Project sticky nav ── */
.pnav{position:sticky;top:84px;z-index:40;background:rgba(250,248,245,.86);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid rgba(12,63,81,.08)}
/* Offset anchor targets so tab-clicks don't scroll content under fixed header + sticky tabs */
.pnav ~ section[id],section[id]{scroll-margin-top:156px}
.pnav__inner{width:min(var(--container),calc(100% - 40px));margin-inline:auto;display:flex;gap:6px;padding:12px 0;overflow-x:auto;scrollbar-width:none}
.pnav__inner::-webkit-scrollbar{display:none}
.pnav__tab{display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;border-radius:999px;background:rgba(255,255,255,.72);border:1.5px solid rgba(12,63,81,.10);white-space:nowrap;color:var(--teal);font-size:12.5px;font-weight:700;letter-spacing:.02em;transition:all .24s ease;flex-shrink:0;cursor:pointer;text-decoration:none}
.pnav__tab:hover{background:rgba(255,255,255,.95);border-color:rgba(12,63,81,.2);box-shadow:0 4px 16px rgba(12,63,81,.08)}
.pnav__tab.active{background:var(--teal);color:#fff;border-color:var(--teal);box-shadow:0 6px 20px rgba(12,63,81,.22)}

/* ── Split layout — editorial ── */
.ps-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.ps-split--flip{direction:ltr}
.ps-split--flip .ps-split__text{direction:rtl}
.ps-split__visual{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 32px 80px rgba(12,63,81,.12)}
.ps-img{width:100%;height:100%;object-fit:cover;aspect-ratio:1.05;display:block;transition:transform 1.4s cubic-bezier(.22,.61,.36,1)}
.ps-split__visual:hover .ps-img{transform:scale(1.04)}
.ps-split__text{padding:8px 0}
.ps-quote{font-family:'Einstein','Heebo',sans-serif;font-size:clamp(19px,2.2vw,26px);color:rgba(12,63,81,.72);line-height:1.45;margin-top:24px;padding-right:22px;border-right:2.5px solid rgba(12,63,81,.2);background:rgba(12,63,81,.03);padding:18px 22px;border-radius:0 14px 14px 0;letter-spacing:-.015em}
.font-tag{margin-top:24px;display:inline-flex;align-items:center;gap:10px;padding:12px 18px;background:rgba(12,63,81,.05);border-radius:12px;border:1px solid rgba(12,63,81,.08)}
.font-tag__label{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(12,63,81,.44)}
.font-tag__value{font-size:14px;font-weight:600;color:var(--teal)}

/* ── Editorial full-width image ── */
.ph-editorial{height:clamp(320px,50vw,680px);overflow:hidden;position:relative}
.ph-editorial img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 1.6s cubic-bezier(.22,.61,.36,1)}
.ph-editorial:hover img{transform:scale(1.03)}

/* ── Swatches — premium ── */
.swatches-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;margin-bottom:32px}
.swatch-item{display:flex;flex-direction:column;align-items:center;gap:8px;cursor:default;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.swatch-item:hover{transform:translateY(-6px)}
.swatch-block{width:88px;height:88px;border-radius:20px;box-shadow:0 8px 24px rgba(12,63,81,.10),inset 0 1px 0 rgba(255,255,255,.3);transition:box-shadow .3s ease}
.swatch-item:hover .swatch-block{box-shadow:0 16px 40px rgba(12,63,81,.18)}
.swatch-hex{font-size:12px;font-weight:700;color:var(--teal);letter-spacing:.04em}
.swatch-name{font-size:11px;color:var(--muted);letter-spacing:.06em}
.photo-caption{margin-top:16px;padding:20px 24px;background:rgba(12,63,81,.04);border-radius:16px;border:1px solid rgba(12,63,81,.07)}

/* ── Editorial gallery — broken grid ── */
.editorial-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.gc{border-radius:22px;overflow:hidden;box-shadow:0 6px 24px rgba(12,63,81,.07);border:1px solid rgba(255,255,255,.3);transition:transform .38s cubic-bezier(.34,1.56,.64,1),box-shadow .32s ease}
.gc:hover{transform:translateY(-8px);box-shadow:0 24px 60px rgba(12,63,81,.13)}
.gc img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,.61,.36,1)}
.gc:hover img{transform:scale(1.05)}
.gc-1{grid-column:span 7;aspect-ratio:1.4}
.gc-2{grid-column:span 5;aspect-ratio:.9}
.gc-3{grid-column:span 4;aspect-ratio:1}
.gc-4{grid-column:span 8;aspect-ratio:1.6}

/* ── Closing CTA ── */
.pc-cta{padding:120px 0;text-align:center}
.pc-cta__quote{font-family:'Einstein','Heebo',sans-serif;font-size:clamp(28px,4.5vw,56px);color:#fff;max-width:860px;margin:0 auto 36px;line-height:1.18;letter-spacing:-.028em}

/* ── Responsive ── */
@media(max-width:1100px){.ps-split{grid-template-columns:1fr;gap:28px}.ps-split--flip{direction:rtl}.ph__title{font-size:clamp(48px,10vw,80px)}}
@media(max-width:640px){
  .ph{height:90svh;min-height:520px}
  .ph__content{padding-bottom:52px}
  .ph__title{font-size:clamp(44px,13vw,64px)}
  .swatches-row{gap:10px}
  .swatch-block{width:68px;height:68px;border-radius:16px}
  .editorial-grid{grid-template-columns:1fr 1fr;gap:10px}
  .gc-1,.gc-2,.gc-3,.gc-4{grid-column:span 1!important;aspect-ratio:1!important}
  .pc-cta{padding:80px 0}
}