/*
Theme Name: WP Black Projects
Author: WP Black
Description: Dark editorial project portfolio theme with automatic Projects, homepage featured project and Next Project navigation.
Version: 2.0.0
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: wp-black
*/

:root{--black:#1d1d1d;--white:#fff;--muted:#999;--line:#343434;--max:1440px;--pad:clamp(18px,3vw,48px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--white);font-family:Arial,Helvetica,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
.container{width:min(calc(100% - 2*var(--pad)),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:100;background:rgba(29,29,29,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.logo{font-size:21px;font-weight:800;letter-spacing:-.06em}
.nav ul{list-style:none;padding:0;margin:0;display:flex;gap:28px}
.nav a{font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.hero-project{min-height:calc(100vh - 78px);display:flex;align-items:flex-end;padding:var(--pad) 0 6vh;border-bottom:1px solid var(--line)}
.hero-project-inner{width:100%}
.project-image{position:relative;overflow:hidden;background:#242424}
.hero-project .project-image{height:72vh;min-height:480px}
.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.project-link:hover img{transform:scale(1.025)}
.project-overlay{position:absolute;inset:auto 0 0;padding:clamp(20px,4vw,60px);background:linear-gradient(transparent,rgba(0,0,0,.78))}
.eyebrow,.project-meta{font-size:11px;color:#ddd;text-transform:uppercase;letter-spacing:.12em}
.project-title{font-size:clamp(42px,7vw,104px);line-height:.9;letter-spacing:-.07em;margin:12px 0 0;max-width:1100px}
.section{padding:clamp(70px,9vw,140px) 0}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:42px;border-bottom:1px solid var(--line);padding-bottom:20px}
.section-heading h2{font-size:clamp(30px,4vw,58px);letter-spacing:-.06em;margin:0}
.project-index{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.project-card{background:var(--black);padding-bottom:28px}
.project-card .project-image{aspect-ratio:16/10}
.project-card .project-title{font-size:clamp(28px,3vw,48px);padding:22px 24px 0}
.project-card .project-meta{padding:0 24px;margin-top:8px;color:var(--muted)}
.next-project{border-top:1px solid var(--line);padding-top:18px}
.next-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;margin-bottom:24px}
.next-project .project-image{height:75vh;min-height:450px}
.next-project .project-title{font-size:clamp(48px,8vw,120px)}
.project-header{padding:90px 0 45px}
.project-header h1{font-size:clamp(52px,9vw,140px);line-height:.88;letter-spacing:-.075em;max-width:1200px;margin:15px 0 28px}
.project-details{display:flex;gap:30px;flex-wrap:wrap;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.project-hero{margin-bottom:60px}
.project-hero img{max-height:82vh;object-fit:cover}
.project-content{max-width:820px;font-size:18px;margin:0 0 90px}
.project-content h2{font-size:38px;line-height:1.05;letter-spacing:-.04em;margin-top:60px}
.project-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:100px}
.project-gallery figure{margin:0;overflow:hidden;background:#242424}
.project-gallery .wide{grid-column:1/-1}
.project-gallery img{height:100%;object-fit:cover}
.breadcrumb{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;padding-top:24px}
.site-footer{border-top:1px solid var(--line);padding:50px 0;color:var(--muted)}
.footer-inner{display:flex;justify-content:space-between;gap:30px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){
 .nav ul{gap:15px}
 .hero-project .project-image{height:68vh;min-height:430px}
 .project-index{grid-template-columns:1fr}
 .project-gallery{grid-template-columns:1fr}
 .project-gallery .wide{grid-column:auto}
 .next-project .project-image{height:65vh}
 .footer-inner{display:block}
}