/* ══════════════════════════════════════
   BORNE PROJECT PAGE — page-specific styles
   Loaded only on single-project.php
   (auto-synced from borne-project.html)
══════════════════════════════════════ */

/* ── Project-page body overrides ── */
body{font-size:15px;line-height:19.5px;}
img{display:block;width:100%;height:100%;object-fit:cover;}

/* ── Additional :root vars for project layout ── */
:root{
  --gap:40px;
  --section:150px;
}

/* ══ NAV — always visible on project pages ══ */
nav,nav.sticky{
  background:var(--white);
  border-bottom-color:var(--rule);
}
.nav-links{font-size:17px;color:var(--mid);}
.nav-cta{font-size:17px;font-weight:400;}

/* ══ HERO ══ */
.hero{padding-top:var(--section);}
.hero-meta{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:0 var(--pad);
}
.hero-content-type{font-size:17px;font-weight:400;color:var(--black);}
.hero-heading{
  font-family:var(--serif);
  font-size:clamp(48px,7.8vw,110px);
  font-weight:400;line-height:1.05;letter-spacing:-0.02em;
  color:var(--black);padding:20px var(--pad);
}
.hero-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:20px;padding:0 var(--pad) var(--section);
}
.hero-grid-label{font-size:17px;font-weight:400;color:var(--mid);margin-bottom:4px;}
.hero-grid-value{font-size:17px;font-weight:400;color:var(--black);}
.hero-image{
  width:100%;aspect-ratio:2000/1258;overflow:hidden;
  background:var(--sky);
  display:flex;align-items:center;justify-content:center;
}
.hero-image span{font-size:12px;color:rgba(255,255,255,.3);letter-spacing:.1em;text-transform:uppercase;}
.hero-caption{
  padding:72px var(--pad);
  display:flex;align-items:flex-start;gap:16px;
}
.hero-caption-text{
  font-family:var(--serif);
  font-size:clamp(22px,3.8vw,56px);
  font-weight:400;letter-spacing:-0.02em;line-height:1.18;color:var(--black);
}

/* ══ PITCH ══ */
.pitch{padding:var(--section) var(--pad);}
.pitch-inner{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.pitch-label{font-size:28px;font-weight:400;color:var(--black);padding-top:4px;}
.pitch-body{font-size:28px;font-weight:400;line-height:1.3;letter-spacing:-0.01em;color:var(--black);}
.pitch-body p+p{margin-top:24px;}

/* ══ GALLERY ══ */
.media-full{
  width:100%;overflow:hidden;background:var(--sky);
  display:flex;align-items:center;justify-content:center;
}
.media-full.ratio-wide   {aspect-ratio:2000/1258;}
.media-full.ratio-square {aspect-ratio:1/1;}
.media-full.ratio-tall   {aspect-ratio:2000/2838;}
.media-full.ratio-16-9   {aspect-ratio:16/9;}
.media-full span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}
.media-block{margin:var(--gap) 0;}
.media-block:first-child{margin-top:0;}
.media-padded-group{padding:var(--gap);display:flex;flex-direction:column;gap:var(--gap);}
.media-2col{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);}
.media-2col .media-item{overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;}
.media-2col .media-item.portrait {aspect-ratio:2000/2838;}
.media-2col .media-item.landscape{aspect-ratio:2000/1406;}
.media-2col .media-item.square   {aspect-ratio:1/1;}
.media-2col .media-item span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}
.media-2col-equal{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);}
.media-2col-equal .media-item{overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;aspect-ratio:2000/1265;}
.media-2col-equal .media-item span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}
.media-split{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);}
.media-split-left{overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;aspect-ratio:2000/2838;}
.media-split-left span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}
.media-split-right{display:flex;flex-direction:column;gap:var(--gap);}
.media-split-right .media-item{flex:1;overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;}
.media-split-right .media-item span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}
.media-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.media-3col .media-item{overflow:hidden;background:var(--sky);display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;}
.media-3col .media-item span{font-size:12px;color:rgba(0,0,0,.15);letter-spacing:.1em;text-transform:uppercase;}

/* ══ CREDITS ══ */
.credits{padding:0 var(--pad);margin-top:var(--section);}
.credits-head{display:flex;justify-content:space-between;align-items:baseline;padding:56px 0 20px;}
.credits-title{font-family:var(--serif);font-size:clamp(44px,5.5vw,76px);font-weight:400;letter-spacing:-0.02em;line-height:1;}
.credits-rule{border:none;border-top:1px solid var(--black);}
.credit-row{
  display:grid;grid-template-columns:1fr 1fr;
  padding:14px 0;border-bottom:1px solid rgba(0,0,0,.06);align-items:baseline;
}
.credit-role{font-size:17px;color:var(--mid);}
.credit-name{font-size:17px;color:var(--black);}

/* ══ NEXT PROJECT ══ */
.work-next{border-top:1px solid var(--black);margin-top:var(--section);}
.work-next-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px var(--pad);border-bottom:1px solid var(--rule);
}
.work-next-label{font-size:17px;color:var(--mid);}
.work-next-scroll{display:flex;align-items:center;gap:16px;font-size:17px;color:var(--black);transition:opacity .2s;}
.work-next-scroll:hover{opacity:.45;}
.work-next-image{
  width:100%;aspect-ratio:2880/1660;overflow:hidden;
  background:var(--sky);
  display:flex;align-items:center;justify-content:center;position:relative;
}
.work-next-image span{font-size:12px;color:rgba(255,255,255,.3);letter-spacing:.1em;text-transform:uppercase;}
.work-next-cta{
  position:absolute;bottom:32px;left:var(--pad);
  font-size:17px;color:var(--white);
  border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:2px;transition:opacity .2s;
}
.work-next-cta:hover{opacity:.6;}

/* ══ RESPONSIVE ══ */
@media(max-width:1100px){
  :root{--section:100px;--gap:28px;}
}
@media(max-width:900px){
  :root{--section:80px;--gap:24px;}
  .hero-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .pitch-inner{grid-template-columns:1fr;gap:24px;}
  .pitch-label{font-size:clamp(18px,3vw,26px);}
  .pitch-body{font-size:clamp(18px,3vw,26px);}
  .media-split{grid-template-columns:1fr 1fr;}
  .credits-title{font-size:clamp(36px,6vw,60px);}
}
@media(max-width:768px){
  :root{--section:72px;--gap:20px;}
  .hero-heading{font-size:clamp(40px,8vw,72px);}
  .hero-grid{grid-template-columns:repeat(2,1fr);gap:16px;padding-bottom:72px;}
  .media-2col{grid-template-columns:1fr;}
  .media-2col-equal{grid-template-columns:1fr;}
  .media-split{grid-template-columns:1fr;}
  .media-split-left{aspect-ratio:2000/2838;} /* keep portrait like desktop */
  .media-3col{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  :root{--section:56px;--gap:16px;}
  .hero{padding-top:80px;}
  .hero-heading{font-size:clamp(32px,9vw,56px);padding:16px var(--pad);}
  .hero-grid{grid-template-columns:1fr 1fr;gap:12px;padding-bottom:56px;}
  .hero-grid-label,.hero-grid-value{font-size:13px;}
  .hero-caption{padding:48px var(--pad);}
  .pitch{padding:56px var(--pad);}
  .pitch-inner{grid-template-columns:1fr;gap:20px;}
  .pitch-label,.pitch-body{font-size:clamp(16px,5vw,22px);}
  .media-padded-group{padding:var(--gap) var(--pad);gap:var(--gap);}
  .media-3col{grid-template-columns:1fr;}
  .media-3col .media-item{aspect-ratio:3/2;}
  .media-split{grid-template-columns:1fr;}
  .credits{margin-top:56px;}
  .credits-title{font-size:clamp(28px,8vw,48px);}
  .credit-row{grid-template-columns:1fr;gap:2px;padding:12px 0;}
  .credit-role{font-size:13px;}
  .credit-name{font-size:14px;}
  .work-next{margin-top:56px;}
  .work-next-bar{padding:14px var(--pad);}
  .work-next-cta{font-size:13px;bottom:20px;}
}
@media(max-width:420px){
  :root{--gap:14px;}
  .hero-heading{font-size:clamp(28px,9.5vw,48px);}
  .hero-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .media-padded-group{padding:var(--gap) var(--pad);}
}

/* ══════════════════════════════════════
   ACF MEDIA HELPERS — uploaded images & videos
   fill their blocks identically to placeholders
══════════════════════════════════════ */
.sy-img>img,.sy-img>video,
.about-img>img,.about-img>video,
.store-img>img,.store-img>video,
.trip-img>img,.trip-img>video,
.value-photo>img,.value-photo>video,
.hero-image>img,.hero-image>video,
.media-full>img,.media-full>video,
.media-item>img,.media-item>video,
.media-split-left>img,.media-split-left>video,
.work-next-image>img,.work-next-image>video{
  width:100%;height:100%;object-fit:cover;display:block;
}
.media-full,.hero-image,.value-photo,.trip-img,
.media-item,.media-split-left,.work-next-image,
.store-img,.sy-img,.about-img{position:relative;}
.borne-embed{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  min-width:100%;min-height:100%;width:auto;height:auto;
  aspect-ratio:16/9;border:0;pointer-events:none;
}
