/* Pamodzi project directory and concept pages */

h1,h2,h3,.disp{
  margin:0;
  color:var(--ink);
  font-family:'Bricolage Grotesque','Manrope',sans-serif;
  font-weight:760;
  letter-spacing:-.035em;
  line-height:1.02;
  text-wrap:balance;
}
h1{font-size:clamp(48px,7.5vw,88px)}
h2,.sec{font-size:clamp(34px,5vw,58px)}
h3{font-size:clamp(22px,2.6vw,31px)}
.spec.cy{color:var(--red)}
footer .fgrid{grid-template-columns:1.5fr 1fr 1fr}

.page-hero{
  position:relative;
  margin-top:var(--header-h);
  padding:clamp(76px,10vw,122px) 0 clamp(66px,8vw,98px);
  overflow:hidden;
  background:
    linear-gradient(100deg,rgba(33,15,13,.88),rgba(143,31,25,.72) 58%,rgba(197,43,34,.38)),
    url('../assets/hero/pamodzi-family-hero-desktop.jpg') center 44%/cover no-repeat;
  color:#fff;
}
.page-hero .bp,.page-hero .bp2{
  position:absolute;
  inset:0;
  opacity:.14;
  background-image:
    linear-gradient(rgba(255,255,255,.7) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.7) 1px,transparent 1px);
  background-size:56px 56px;
}
.page-hero .bp2{background-size:280px 280px;opacity:.12}
.page-hero .wrap{position:relative;z-index:2}
.page-hero h1{max-width:13ch;margin-top:22px;color:#fff;text-shadow:0 12px 44px rgba(0,0,0,.22)}
.page-hero .lede{margin-top:24px;color:rgba(255,255,255,.84)}

.prof{
  margin-bottom:18px;
  padding:clamp(28px,5vw,52px);
  box-shadow:none;
}
.prof .top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:20px}
.prof h3{max-width:24ch;margin-top:14px}
.facts{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:30px 0 0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--line);
}
.facts .f{padding:20px;background:var(--paper-2)}
.facts b{display:block;color:var(--red);font-family:'JetBrains Mono',monospace;font-size:16px}
.facts span{display:block;margin-top:7px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}

.tl{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.tlx{
  position:relative;
  min-height:230px;
  padding:28px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--paper-2);
}
.tlx::after{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--line-2)}
.tlx.gold::after{background:linear-gradient(90deg,var(--red-2),var(--red-dark))}
.tlx.ahead{background:var(--ink);color:#fff}
.tlx.ahead::after{background:#ff8d83}
.tlx .d{color:var(--red);font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tlx h3{margin-top:24px}
.tlx p{margin:12px 0 0;color:var(--muted);font-size:14px}
.tlx.ahead h3{color:#fff}
.tlx.ahead p{color:#d7cbc7}

.board{
  margin-top:38px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.board-head,.brow{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 160px 86px;
  gap:18px;
  align-items:center;
}
.board-head{
  padding:13px 22px;
  background:var(--ink);
  color:#cfc4c0;
  font-family:'JetBrains Mono',monospace;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.brow{
  padding:24px 22px;
  border-bottom:1px solid var(--line);
  text-decoration:none;
  transition:background .2s ease;
}
.brow:last-child{border-bottom:0}
.brow:hover{background:var(--red-soft)}
.brow .no{color:var(--red);font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700}
.brow .nm{font-weight:800}
.brow .nm em{display:block;margin-top:5px;color:var(--muted);font-size:13px;font-style:normal;font-weight:400}
.go2{color:var(--red);font-weight:800;font-size:13px;text-align:right}

.st{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-family:'JetBrains Mono',monospace;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.st.live{background:#e5f3eb;color:#1c6540}
.st.open{background:#eee9ff;color:#6245a4}
.st.soon{background:var(--red-soft);color:var(--red-dark)}

.gov{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gc{padding:28px;box-shadow:none}
.gc .n{color:var(--red);font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700}
.gc h3{margin-top:22px}
.gc p{margin:12px 0 0;color:var(--muted);font-size:14px}

.dlist{margin:0;padding:0;list-style:none}
.dlist li{display:grid;grid-template-columns:52px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.dlist .mk2{color:var(--red);font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:700}
.dlist b{display:block}
.dlist span span{display:block;margin-top:4px;color:var(--muted);font-size:14px}

.inq{
  position:relative;
  overflow:hidden;
  border-radius:calc(var(--radius) + 4px);
  background:var(--ink);
  color:#fff;
  box-shadow:var(--shadow);
}
.inq .bpx{
  position:absolute;
  inset:0;
  opacity:.10;
  background-image:
    linear-gradient(rgba(255,255,255,.8) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.8) 1px,transparent 1px);
  background-size:52px 52px;
}
.inq-in{position:relative;z-index:1;padding:clamp(30px,6vw,64px)}
.inq h2{color:#fff}
.inq p{color:#d7cbc7}
.inq form{display:grid;gap:16px;margin-top:30px}
.inq label{color:#e7ddda}
.inq input,.inq select,.inq textarea{border-color:rgba(255,255,255,.18);background:#292624;color:#fff}
.inq input::placeholder,.inq textarea::placeholder{color:#9f9591}

@media(max-width:900px){
  .facts,.gov{grid-template-columns:1fr}
  .tl{grid-template-columns:1fr}
  .board-head{display:none}
  .brow{grid-template-columns:44px 1fr}
  .brow> :nth-child(3),.brow> :nth-child(4){grid-column:2}
  .go2{text-align:left}
  footer .fgrid{grid-template-columns:1fr 1fr}
  footer .fgrid> :first-child{grid-column:1/-1}
}
@media(max-width:600px){
  .prof{border-radius:12px;padding:24px 20px}
  .brow{padding:20px 16px;gap:10px}
  footer .fgrid{grid-template-columns:1fr}
  footer .fgrid> :first-child{grid-column:auto}
}