@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Jost:wght@300;400;500&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;scroll-behavior:smooth;}
body{background:#f2ede6;color:#1a1714;font-family:'Jost',sans-serif;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:#1a1714;text-decoration:none;}
a:hover{color:#a8855a;}
img{max-width:100%;display:block;}
::selection{background:#1a1714;color:#f2ede6;}

/* ── Nav ── */
.nav{position:fixed;top:0;left:0;right:0;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,48px);background:#f2ede6;border-bottom:1px solid #e8e0d5;z-index:100;}
.nav-logo-img img{height:22px;width:auto;filter:invert(1) brightness(0.15);opacity:.85;display:block;}
.nav-links{display:flex;gap:clamp(16px,3vw,32px);list-style:none;}
.nav-links a{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#6b6258;transition:color .2s;}
.nav-links a:hover{color:#1a1714;}
.page-content{padding-top:52px;}

/* ── Mission block ── */
.mission{padding:clamp(20px,3vw,32px) clamp(16px,4vw,48px) 0;}
.mission-list{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
@media(max-width:700px){.mission-list{grid-template-columns:repeat(2,1fr);}}
@media(max-width:400px){.mission-list{grid-template-columns:1fr;}}
.mission-list li{padding:clamp(12px,2vw,18px) clamp(12px,2vw,20px);border-left:1px solid #e8e0d5;display:flex;flex-direction:column;gap:6px;}
.mission-list li:first-child{border-left:none;}
@media(max-width:700px){
  .mission-list li:nth-child(odd){border-left:none;}
  .mission-list li:nth-child(3),.mission-list li:nth-child(4){border-top:1px solid #e8e0d5;}
}
.mission-num{font-size:9px;letter-spacing:.2em;color:#a8855a;}
.mission-item-title{font-family:'Cormorant Garamond',serif;font-size:clamp(14px,1.5vw,16px);font-weight:400;color:#1a1714;line-height:1.3;}
.mission-item-desc{font-family:'Cormorant Garamond',serif;font-size:12px;font-weight:300;color:#6b6258;line-height:1.65;}
.mission-divider{height:1px;background:#e8e0d5;margin-top:clamp(12px,2vw,20px);}

/* ── Portfolio section ── */
.portfolio-section{padding:0 0 clamp(60px,8vw,100px);scroll-margin-top:64px;}

/* ── Filter bar ── */
.filter-bar{display:flex;gap:6px;padding:clamp(16px,3vw,24px) clamp(16px,4vw,48px);flex-wrap:wrap;border-bottom:1px solid #e8e0d5;}
.filter-btn{font-family:'Jost',sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:7px 14px;border:1px solid #e8e0d5;background:transparent;color:#6b6258;cursor:pointer;transition:all .2s;}
.filter-btn:hover{border-color:#a8855a;color:#a8855a;}
.filter-btn.active{border-color:#1a1714;color:#1a1714;background:rgba(26,23,20,.04);}

/* ── Tiles grid ── */
.tiles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:2px;}
@media(max-width:720px){.tiles-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:440px){.tiles-grid{grid-template-columns:1fr;}}

.tile{display:block;text-decoration:none;background:#f2ede6;transition:background .2s;}
.tile:hover{background:#ede5da;}

.tile-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#e8e0d5;}
.tile-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,filter .4s;}
.tile:hover .tile-img img{transform:scale(1.04);}
.tile-img-placeholder{width:100%;height:100%;background:#e8e0d5;}

.tile-badge{position:absolute;top:10px;left:10px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;background:rgba(242,237,230,.9);color:#6b6258;padding:3px 8px;}
.tile-badge--stub{background:rgba(242,237,230,.9);color:#b0a89e;}

.tile-body{padding:10px 12px 14px;border-top:1px solid #e8e0d5;}
.tile-cat{font-size:9px;letter-spacing:.08em;color:#b0a89e;margin-bottom:3px;line-height:1.5;}
.tile-title{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:300;color:#1a1714;}

/* Grayed tiles */
.tile--grayed{opacity:.5;}
.tile--grayed:hover{opacity:.7;}
.tile--stub{opacity:.4;}
.tile--stub:hover{opacity:.6;}

/* Divider between above/below line */
.tiles-divider{display:flex;align-items:center;gap:16px;padding:24px clamp(16px,4vw,48px) 8px;}
.tiles-divider::before,.tiles-divider::after{content:'';flex:1;height:1px;background:#e8e0d5;}
.tiles-divider-label{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#b0a89e;white-space:nowrap;}

/* ── About page ── */
.about-wrap{max-width:680px;margin:0 auto;padding:clamp(40px,7vw,72px) clamp(24px,5vw,48px) clamp(60px,8vw,100px);}
.about-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,5vw,3.5rem);font-weight:300;color:#1a1714;margin-bottom:24px;}
.about-body{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:300;line-height:1.85;color:#6b6258;margin-bottom:18px;}
.about-body em{font-style:italic;color:#1a1714;}
.about-link{color:#a8855a;border-bottom:1px solid #c4a882;padding-bottom:1px;text-decoration:none;transition:color .2s,border-color .2s;}
.about-link:hover{color:#1a1714;border-color:#1a1714;}
.about-section-divider{height:1px;background:#e8e0d5;margin:36px 0;}
.about-section-title{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:400;letter-spacing:.1em;color:#1a1714;text-transform:uppercase;margin-bottom:14px;}
.editor-note{background:#f5e9cc;border-left:3px solid #b8954a;padding:12px 14px;margin:16px 0;font-family:'Jost',sans-serif;font-size:11px;line-height:1.7;color:#7a5c30;}
.editor-note strong{display:block;font-weight:500;color:#5c4020;margin-bottom:3px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;}
.editor-note ul{margin:8px 0 2px 14px;}
.editor-note ul li{margin-bottom:4px;}

/* ── Breadcrumb ── */
.breadcrumb{padding:12px clamp(16px,4vw,48px);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#b0a89e;border-bottom:1px solid #e8e0d5;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.breadcrumb a{color:#a8855a;text-decoration:none;}
.breadcrumb a:hover{color:#1a1714;}
.bc-sep{color:#e8e0d5;}

/* ── Series page ── */
.series-head{padding:clamp(20px,3vw,36px) clamp(24px,5vw,64px);border-bottom:1px solid #e8e0d5;}
.series-meta{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:#a8855a;margin-bottom:8px;}
.series-title{font-family:'Cormorant Garamond',serif;font-size:clamp(22px,5vw,38px);font-weight:300;color:#1a1714;margin-bottom:8px;line-height:1.1;}
.series-desc{font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:300;color:#6b6258;line-height:1.7;}
.series-desc-detail{font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:300;color:#6b6258;line-height:1.7;margin-top:6px;}
.img-hero{width:100%;}
.img-hero img{width:100%;height:auto;display:block;}
.img-pair{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:2px;}
.img-pair img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;}
.img-single{margin-top:2px;}
.img-single img{width:100%;display:block;}
.video-embed-wrap{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;background:#111;}
.video-embed-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;}
.credits-wrap{padding:clamp(20px,3vw,36px) clamp(24px,5vw,64px);border-top:1px solid #e8e0d5;margin-top:2px;}
.credits-dl{max-width:560px;}
.credits-dl dt{font-family:'Jost',sans-serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#b0a89e;font-weight:300;margin-top:14px;margin-bottom:2px;}
.credits-dl dt:first-child{margin-top:0;}
.credits-dl dd{font-family:'Cormorant Garamond',serif;font-size:15px;font-weight:300;color:#6b6258;line-height:1.6;margin-left:0;}

/* ── Footer ── */
footer{border-top:1px solid #e8e0d5;padding:clamp(16px,2.5vw,28px) clamp(16px,4vw,48px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;}
.footer-left,.footer-right{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#6b6258;}
.footer-right{text-align:right;}
.footer-ext{color:#6b6258;text-decoration:none;transition:color .2s;}
.footer-ext:hover{color:#a8855a;}
.footer-copy{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#b0a89e;text-align:center;}

/* ── About two-column layout ─────────────────────────────── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 680px) {
  .about-grid { grid-template-columns: 1fr; }
  .about-col--right { border-left: none; border-top: 1px solid var(--parchment-dark); }
}
.about-col {
  padding: clamp(32px, 5vw, 56px) clamp(24px, 4vw, 48px);
}
.about-col--right {
  border-left: 1px solid var(--parchment-dark);
}
.about-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 22px;
  letter-spacing: -.01em;
}
.about-body {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.85;
  color: var(--ink-light);
  margin-bottom: 14px;
}
.about-body em { font-style: italic; color: var(--ink); }
.about-link {
  color: var(--gold);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  font-weight: 400;
  transition: color .2s, text-decoration-color .2s;
}
.about-link:hover { color: var(--ink); text-decoration-color: var(--ink); }
.about-section-divider { height: 1px; background: var(--parchment-dark); margin: 20px 0; }
.about-section-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: .9rem;
  font-weight: 400;
  letter-spacing: .1em;
  color: var(--ink);
  text-transform: uppercase;
  margin-bottom: 10px;
}
.about-closing {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  font-weight: 400;
  font-style: italic;
  line-height: 1.85;
  color: var(--ink);
  margin-top: 22px;
}

/* ── Series role credit (under description) ──────────────────────── */
.series-credit-label {
  font-family: 'Jost', sans-serif;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin-top: 18px;
  margin-bottom: 4px;
}
.series-credit-role {
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  font-weight: 300;
  color: var(--ink-light);
  line-height: 1.5;
}

/* ── About single column ─────────────────────────────────────────── */
.about-single {
  max-width: 620px;
  margin: 0 auto;
  padding: clamp(40px, 6vw, 80px) clamp(24px, 5vw, 48px);
}


/* ── Echoes: show full (uncropped) cover + posters ──────────────────── */
.tile-img--full img{object-fit:contain;}
.img-poster{margin-top:2px;display:flex;justify-content:center;background:#ede5da;}
.img-poster img{max-height:88vh;max-width:100%;width:auto;height:auto;display:block;}


/* ── About: image + text split ──────────────────────────────────────── */
.about-band{display:flex;gap:1px;max-width:1100px;margin:0 auto;padding:clamp(32px,5vw,56px) clamp(24px,5vw,48px) 0;}
.about-band .ab-cell{flex:1;aspect-ratio:4/5;overflow:hidden;background:#e8e0d5;}
.about-band img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in;}
.about-band img[src*="about-sand"]{object-position:20% center;}
.about-textblock{max-width:1100px;margin:0 auto;padding:clamp(32px,5vw,56px) clamp(24px,5vw,48px) clamp(60px,8vw,100px);}
.about-textblock .about-body:last-child{margin-bottom:0;}
.about-text{display:flex;flex-direction:column;gap:16px;}


/* ── Lightbox (series images, tap to expand) ─────────────────────────── */
.img-hero img,.img-pair img,.img-single img,.img-poster img,.about-photo img{cursor:zoom-in;}
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(26,23,20,0.92);display:none;align-items:center;justify-content:center;padding:20px;}
.lightbox.open{display:flex;}
.lightbox img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;box-shadow:0 12px 48px rgba(0,0,0,0.45);cursor:zoom-out;}
.lightbox-close{position:fixed;top:12px;right:16px;background:none;border:none;color:#f2ede6;font-size:34px;line-height:1;cursor:pointer;padding:6px 10px;z-index:1001;font-family:inherit;}