/* Greenland Mines: project page layout (Skaergaard, Sarfartoq). Loads after site.css. */
.phero { position: relative; overflow: hidden; background: var(--gabbro); color: #fff; min-height: min(86vh, 760px); display: flex; align-items: flex-end; }
.phero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.phero-shade { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(23,28,34,0.45) 0%, rgba(23,28,34,0.1) 40%, rgba(23,28,34,0.88) 100%); }
.phero .wrap { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 22px; padding-top: 140px; padding-bottom: 52px; }
.phero-kicker { font-family: var(--sans); font-size: 15px; font-weight: 600; letter-spacing: 0.02em; color: var(--gold); }
.phero h1 { font-size: clamp(48px, 7vw, 104px); line-height: 0.96; letter-spacing: -0.04em; text-shadow: 0 2px 30px rgba(0,0,0,0.4); }
.phero p { font-family: var(--sans); font-size: 20px; line-height: 1.45; color: #DCE2E8; max-width: 48ch; text-wrap: pretty; }
.pstats { display: flex; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,0.2); border-bottom: 1px solid rgba(255,255,255,0.2); }
.pstats div { display: flex; flex-direction: column; gap: 3px; padding: 14px 26px 14px 0; margin-right: 26px; border-right: 1px solid rgba(255,255,255,0.2); max-width: 250px; }
.pstats div:last-child { border-right: 0; margin-right: 0; }
.pstats b { font-family: var(--sans); font-size: 24px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pstats span { font-family: var(--sans); font-size: 12.5px; line-height: 1.35; color: #C8D0D8; }
.phero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }

.pagenav { background: #fff; border-bottom: 1px solid var(--ice-2); }
.pagenav .wrap { display: flex; align-items: center; gap: 28px; height: 56px; overflow-x: auto; font-family: var(--sans); font-size: 15px; font-weight: 500; white-space: nowrap; scrollbar-width: none; }
.pagenav .wrap::-webkit-scrollbar { display: none; }
.pagenav a { color: var(--rock); flex: 0 0 auto; }
.pagenav a:hover { color: var(--gabbro); text-decoration: none; }
.pagenav .crumbs { margin-right: auto; color: var(--slate); }
.pagenav .crumbs a { color: var(--fjord); }
.pagenav .crumbs a:hover { text-decoration: underline; }

.psection { padding: 88px 0; }
.psection.alt { background: #fff; border-top: 1px solid var(--ice-2); border-bottom: 1px solid var(--ice-2); }
.psection.dark { background: var(--gabbro); color: #fff; }
.phead { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 40px; align-items: end; margin-bottom: 40px; }
.phead h2 { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.04; letter-spacing: -0.03em; }
.phead p { font-size: 19px; line-height: 1.5; color: var(--rock); max-width: 52ch; text-wrap: pretty; }
.dark .phead p { color: #C8D0D8; }
.two { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.two.flip { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.prose { display: flex; flex-direction: column; gap: 18px; font-size: 18px; line-height: 1.6; color: var(--rock); max-width: 52ch; text-wrap: pretty; }
.prose strong { color: var(--gabbro); font-weight: 500; }
.dark .prose { color: #C8D0D8; } .dark .prose strong { color: #fff; }

.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 0; border-top: 1px solid var(--ice-2); }
.facts div { display: flex; flex-direction: column; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--ice-2); }
.facts dt { font-family: var(--sans); font-size: 13px; color: var(--slate); }
.facts dd { margin: 0; font-family: var(--sans); font-size: 17px; font-weight: 500; line-height: 1.35; }
.facts dd small { display: block; font-weight: 400; font-size: 14px; color: var(--rock); margin-top: 2px; }
.dark .facts { border-color: rgba(255,255,255,0.15); } .dark .facts div { border-color: rgba(255,255,255,0.15); } .dark .facts dt { color: var(--mist); } .dark .facts dd small { color: #C8D0D8; }

.figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.figs figure, .fig { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.figs img, .fig img { width: 100%; border-radius: 6px; background: #fff; border: 1px solid var(--ice-2); }
.figs figcaption, .fig figcaption { font-family: var(--sans); font-size: 13.5px; line-height: 1.45; color: var(--slate); }
.figs figure.wide { grid-column: 1 / -1; }
.photo img { border: 0; object-fit: cover; aspect-ratio: 4 / 3; }

.rtable-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--ice-2); border-radius: 6px; }
.rtable { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 15px; font-variant-numeric: tabular-nums; min-width: 760px; }
.rtable th, .rtable td { padding: 11px 14px; text-align: right; border-bottom: 1px solid var(--ice-2); white-space: nowrap; }
.rtable th { font-weight: 500; color: var(--slate); font-size: 13px; vertical-align: bottom; }
.rtable th:first-child, .rtable td:first-child, .rtable th.l, .rtable td.l { text-align: left; }
.rtable thead tr:first-child th { border-bottom: 0; padding-bottom: 2px; color: var(--gabbro); font-weight: 600; }
.rtable thead tr:first-child th[colspan] { text-align: center; border-bottom: 1px solid var(--ice-2); }
.rtable tbody th { color: var(--gabbro); font-weight: 600; font-size: 15px; vertical-align: top; text-align: left; }
.rtable .total td, .rtable .total th { font-weight: 600; background: var(--ice); border-top: 1.5px solid var(--gabbro); border-bottom: 1.5px solid var(--gabbro); }
.rtable .total td:first-child { box-shadow: inset 4px 0 0 var(--gold); }
.rtable .sub { color: var(--slate); font-size: 12.5px; font-weight: 400; }
.rtable .eq { background: var(--gold-soft); }
.rtable caption { caption-side: top; text-align: left; font-family: var(--sans); font-size: 14px; color: var(--slate); padding: 14px 16px 6px; }
.notes { margin-top: 20px; border-top: 1px solid var(--ice-2); }
.notes summary { cursor: pointer; font-family: var(--sans); font-size: 15px; font-weight: 600; padding: 14px 0; list-style: none; display: flex; align-items: center; gap: 10px; }
.notes summary::-webkit-details-marker { display: none; }
.notes summary::before { content: "+"; font-weight: 500; width: 20px; color: var(--gold); }
.notes[open] summary::before { content: "–"; }
.notes ol { margin: 0 0 18px; padding-left: 20px; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: var(--rock); display: flex; flex-direction: column; gap: 8px; max-width: 100ch; }
.rlead { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-bottom: 32px; border-top: 1px solid var(--ice-2); border-bottom: 1px solid var(--ice-2); }
.rlead div { display: flex; flex-direction: column; gap: 4px; padding: 20px 24px 20px 0; margin-right: 24px; border-right: 1px solid var(--ice-2); }
.rlead div:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.rlead b { font-family: var(--sans); font-size: 30px; font-weight: 600; letter-spacing: -0.025em; font-variant-numeric: tabular-nums; line-height: 1.1; }
.rlead span { font-family: var(--sans); font-size: 13.5px; color: var(--slate); line-height: 1.35; }
.rlead .delta { color: #1F7A4A; font-weight: 600; }

.route { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; position: relative; }
.route::before { content: ""; position: absolute; left: 0; right: 0; top: 9px; height: 1px; background: var(--mist); }
.route li { position: relative; padding-top: 30px; display: flex; flex-direction: column; gap: 6px; }
.route li::before { content: ""; position: absolute; left: 0; top: 0; width: 19px; height: 19px; border-radius: 50%; background: var(--ice); border: 2px solid var(--gold); }
.route li:last-child::before { background: var(--gold); }
.alt .route li::before { background: #fff; } .alt .route li:last-child::before { background: var(--gold); }
.route b { font-family: var(--sans); font-size: 20px; font-weight: 600; letter-spacing: -0.02em; }
.route span { font-family: var(--sans); font-size: 14.5px; line-height: 1.45; color: var(--rock); }

.cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--ice-2); }
.cols3 > div { padding: 26px 28px 26px 0; margin-right: 28px; border-right: 1px solid var(--ice-2); display: flex; flex-direction: column; gap: 10px; }
.cols3 > div:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.cols3 h3 { font-size: 26px; letter-spacing: -0.025em; }
.cols3 .tag { font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--gold); }
.cols3 ul { margin: 4px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; font-family: var(--sans); font-size: 15px; line-height: 1.45; color: var(--rock); }
.cols3 li { padding-left: 16px; position: relative; }
.cols3 li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 8px; height: 2px; background: var(--gold); }
.dark .cols3 { border-color: rgba(255,255,255,0.16); } .dark .cols3 > div { border-color: rgba(255,255,255,0.16); } .dark .cols3 ul { color: #C8D0D8; }

.points { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 40px; }
.points li { display: flex; flex-direction: column; gap: 6px; padding-top: 16px; border-top: 1px solid var(--ice-2); }
.points b { font-family: var(--sans); font-size: 19px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; }
.points span { font-family: var(--sans); font-size: 15px; line-height: 1.5; color: var(--rock); }
.dark .points li { border-color: rgba(255,255,255,0.16); } .dark .points span { color: #C8D0D8; }

.lic { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 15px; }
.lic th, .lic td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--ice-2); vertical-align: top; }
.lic th { font-size: 13px; font-weight: 500; color: var(--slate); border-bottom-color: var(--gabbro); }
.lic td b { font-weight: 600; white-space: nowrap; }
.lic td.num { white-space: nowrap; }
.lic td small { display: block; color: var(--slate); font-size: 13.5px; margin-top: 2px; }
.lic .num { font-variant-numeric: tabular-nums; }
.lic .ok { color: #1F7A4A; } .lic .warn { color: #8A5A00; }

.docs { display: flex; flex-direction: column; border-top: 1px solid var(--ice-2); }
.docs a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--ice-2); color: var(--gabbro); font-family: var(--sans); }
.docs a:hover { text-decoration: none; color: var(--fjord); }
.docs b { font-weight: 600; font-size: 17px; display: block; }
.docs span { color: var(--slate); font-size: 14px; }
.docs em { font-style: normal; font-size: 14px; color: var(--slate); white-space: nowrap; }

.ask { background: var(--gabbro); color: #fff; padding: 72px 0; }
.ask .wrap { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.ask h2 { color: #fff; font-size: clamp(28px, 3vw, 40px); line-height: 1.1; max-width: 22ch; }
.ask p { font-family: var(--sans); font-size: 15.5px; color: var(--mist); max-width: 44ch; margin-top: 10px; }

.fine { margin-top: 24px; font-family: var(--sans); font-size: 13.5px; color: var(--slate); max-width: 100ch; }

@media (max-width: 1000px) {
  .phead, .two, .two.flip { grid-template-columns: 1fr; gap: 28px; }
  .rlead { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; } .rlead div:nth-child(2n) { border-right: 0; }
  .route { grid-template-columns: 1fr; gap: 28px; } .route::before { left: 9px; right: auto; top: 9px; bottom: 9px; width: 1px; height: auto; }
  .route li { padding-top: 0; padding-left: 40px; } .route li::before { top: 4px; }
  .cols3 { grid-template-columns: 1fr; } .cols3 > div { border-right: 0; margin-right: 0; padding: 22px 0; border-bottom: 1px solid var(--ice-2); }
  .dark .cols3 > div { border-color: rgba(255,255,255,0.16); }
  .ask .wrap { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 720px) {
  .phero { min-height: auto; } .phero .wrap { padding-top: 110px; padding-bottom: 36px; gap: 16px; }
  .phero h1 { font-size: 52px; } .phero p { font-size: 17px; }
  .pstats { flex-direction: column; } .pstats div { max-width: none; margin-right: 0; padding: 12px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.2); } .pstats div:last-child { border-bottom: 0; }
  .pstats b { font-size: 20px; }
  .phero-cta { flex-direction: column; } .phero-cta .btn { width: 100%; justify-content: center; }
  .pagenav .wrap { height: 50px; gap: 20px; font-size: 14px; } .pagenav .crumbs { display: none; }
  .psection { padding: 60px 0; }
  .phead h2 { font-size: 30px; } .phead p { font-size: 17px; }
  .prose { font-size: 17px; }
  .facts, .figs, .points { grid-template-columns: 1fr; }
  .rlead { grid-template-columns: 1fr; } .rlead div { border-right: 0; margin-right: 0; padding: 14px 0; border-bottom: 1px solid var(--ice-2); } .rlead div:last-child { border-bottom: 0; }
  .rlead b { font-size: 26px; }
  .route { grid-template-columns: 1fr; }
  .lic { display: block; } .lic thead { display: none; } .lic tr { display: block; padding: 14px 0; border-bottom: 1px solid var(--ice-2); } .lic td { display: block; border: 0; padding: 2px 0; }
  .docs a { grid-template-columns: 1fr; gap: 6px; }
  .ask .wrap .btn { width: 100%; justify-content: center; }
}
