/* Hallmark · genre: editorial · macrostructure: Split Studio · diptych: alternating, gutter-divided · design-system: design.md · designed-as-app
 * Hallmark · pre-emit critique: P5 H4 E5 S4 R5 V5 */

section{padding:var(--space-3xl) 0;position:relative}
.section-flush{padding-top:0}

/* ---------- legacy strip (inside dark .page-head — hairline cells, no cards) ---------- */
.legacy{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:var(--space-2xl);position:relative;
  border-top:1px solid oklch(from var(--color-accent-ink) l c h / 0.25);
}
.leg{padding:var(--space-md) var(--space-lg) 0 0;min-width:0}
.leg + .leg{
  border-left:1px solid oklch(from var(--color-accent-ink) l c h / 0.25);
  padding-left:var(--space-lg);
}
.leg .no{color:var(--color-accent-bright);display:flex;align-items:center;gap:14px}
.leg .no::after{content:"";width:30px;height:1px;background:oklch(from var(--color-accent-ink) l c h / 0.35)}
.leg h2{
  font-family:var(--font-display);font-weight:700;font-size:var(--text-md);
  line-height:1.3;margin:var(--space-xs) 0 var(--space-2xs);color:var(--color-paper);
}
.leg p{color:oklch(from var(--color-paper) l c h / 0.72);font-size:var(--text-sm)}

/* ---------- label register (Noto Sans 600 · letter-spaced · uppercase) ---------- */
.leg .no,.reason .no,.spec-head .no,.final-card .no,.end-card .no{
  font-size:var(--text-xs);font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--color-accent);
}
.leg .no{color:var(--color-accent-bright)}

/* ---------- Split Studio diptych (gutter-divided, alternating) ---------- */
.dip{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--space-xl) var(--space-2xl);align-items:center;
}
.dip > *{min-width:0}
.dip-pyr{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
@media(min-width:981px){.dip-rev .dip-proof{order:-1}}
.dip .sec-head{margin-bottom:0}
.dips{display:flex;flex-direction:column;gap:var(--space-3xl)}
figure.dip-proof{margin:0}
.dip-proof img{
  width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover;
  border:1px solid var(--color-rule-strong);
}

/* ---------- reasons (two per text half, hairline-index markers) ---------- */
.reason{padding:var(--space-lg) 0}
.reason:first-child{padding-top:0}
.reason:last-child{padding-bottom:0}
.reason + .reason{border-top:1px solid var(--color-rule)}
.reason .no{display:flex;align-items:center;gap:14px}
.reason .no::after{content:"";flex:1;height:1px;background:var(--color-rule)}
.reason h3{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  letter-spacing:-0.01em;font-size:var(--text-md);line-height:1.15;
  margin:var(--space-sm) 0 var(--space-2xs);
}
.reason p{color:var(--color-muted)}

/* ---------- competition model (hairline-ruled spec list) ---------- */
.model{border-top:1px solid var(--color-rule-strong)}
.spec-row{
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:var(--space-sm) var(--space-2xl);
  padding:var(--space-xl) 0;border-bottom:1px solid var(--color-rule);
}
.spec-head{min-width:0}
.spec-head h3{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  letter-spacing:-0.01em;font-size:var(--text-lg);line-height:1.12;
  margin-top:var(--space-sm);
}
.spec-list{list-style:none}
.spec-list li{
  position:relative;color:var(--color-muted);
  padding:var(--space-xs) 0 var(--space-xs) var(--space-md);
  border-top:1px solid var(--color-rule);
}
.spec-list li:first-child{border-top:none;padding-top:0}
.spec-list li::before{content:"—";position:absolute;left:0;color:var(--color-accent)}

/* ---------- pyramids — zoned stepped bands (signature proof visual) ---------- */
.pyr{display:flex;flex-direction:column;gap:var(--space-md);align-items:stretch}
.pyr-zone{display:flex;align-items:center;gap:var(--space-md)}
.zone-age{
  flex:0 0 96px;text-align:right;
  font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--color-accent);
}
.zone-rows{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;min-width:0}
.pyr-row{
  display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;
  background:var(--color-surface);border:1px solid var(--color-rule);text-align:center;
  padding:var(--space-2xs) var(--space-sm);
  transition:transform var(--dur-short) var(--ease-out),background-color var(--dur-short) var(--ease-out);
}
.pyr-row:hover{transform:translateY(-2px);background:oklch(from var(--color-accent) l c h / 0.07)}
.pyr-row .lv{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  letter-spacing:-0.01em;font-size:var(--text-sm);line-height:1.15;color:var(--color-ink);
}
.pyr-row .ms{
  font-size:var(--text-xs);font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--color-muted);
}
.pyr-row .big{
  font-family:var(--font-display);font-weight:800;font-size:var(--text-md);line-height:1.1;
  color:var(--color-accent);font-variant-numeric:tabular-nums;
}
.pyr-row .big span{
  font-size:var(--text-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--color-muted);
}
.pyr-7 .pyr-zone:nth-child(1) .pyr-row:nth-child(1){width:56%}
.pyr-7 .pyr-zone:nth-child(1) .pyr-row:nth-child(2){width:64%}
.pyr-7 .pyr-zone:nth-child(2) .pyr-row:nth-child(1){width:72%}
.pyr-7 .pyr-zone:nth-child(2) .pyr-row:nth-child(2){width:80%}
.pyr-7 .pyr-zone:nth-child(3) .pyr-row:nth-child(1){width:88%}
.pyr-7 .pyr-zone:nth-child(3) .pyr-row:nth-child(2){width:94%}
.pyr-7 .pyr-zone:nth-child(3) .pyr-row:nth-child(3){width:100%}
.pyr-3 .pyr-row:nth-child(1){width:60%}
.pyr-3 .pyr-row:nth-child(2){width:80%}
.pyr-3 .pyr-row:nth-child(3){width:100%}

/* ---------- global finals (diptych pair, gutter-divided) ---------- */
.finals{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-xl) var(--space-2xl)}
.final-card{border-top:1px solid var(--color-rule-strong);padding-top:var(--space-lg);min-width:0}
.final-card h3{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  letter-spacing:-0.01em;font-size:var(--text-lg);line-height:1.12;
  margin:var(--space-sm) 0 var(--space-md);
}
.final-card dl{display:flex;flex-direction:column}
.final-card .row{display:flex;gap:var(--space-md);padding:var(--space-xs) 0;border-top:1px solid var(--color-rule)}
.final-card dt{
  font-size:var(--text-xs);font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--color-muted);width:96px;flex-shrink:0;padding-top:3px;
}
.final-card dd{color:var(--color-muted)}

/* ---------- endorsements (hairline-separated row) ---------- */
.endorse{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--color-rule-strong);padding-top:var(--space-xl);
}
.end-card{padding:0 var(--space-lg);min-width:0}
.end-card:first-child{padding-left:0}
.end-card:last-child{padding-right:0}
.end-card + .end-card{border-left:1px solid var(--color-rule)}
.end-card h3{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  letter-spacing:-0.01em;font-size:var(--text-md);line-height:1.15;
  margin:var(--space-sm) 0 var(--space-md);
}
.end-card ul{list-style:none}
.end-logos{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-md) var(--space-lg)}
.end-logos img{max-height:44px;max-width:150px;width:auto;height:auto;object-fit:contain}
/* the NRL file has baked-in top padding — let it run taller to balance */
.end-logos img[alt^="NRL"]{max-height:68px}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .dip,.dip-pyr{grid-template-columns:1fr}
  .dip-rev .dip-proof{order:0}
  .dips{gap:var(--space-2xl)}
  .spec-row{grid-template-columns:1fr}
  .finals{grid-template-columns:1fr}
  .endorse{grid-template-columns:1fr}
  .end-card{padding:var(--space-lg) 0}
  .end-card:first-child{padding-left:0}
  .end-card:last-child{padding-right:0}
  .end-card + .end-card{border-left:none;border-top:1px solid var(--color-rule)}
  .contact-grid{grid-template-columns:1fr}
  .page-head .ph-grid{grid-template-columns:1fr;gap:var(--space-xl)}
  .ph-city{max-width:420px}
}
@media(max-width:640px){
  section{padding:var(--space-2xl) 0}
  .legacy{grid-template-columns:1fr}
  .leg{padding:var(--space-md) 0}
  .leg + .leg{
    border-left:none;padding-left:0;
    border-top:1px solid oklch(from var(--color-accent-ink) l c h / 0.25);
  }
  .pyr-zone{flex-direction:column;align-items:flex-start;gap:var(--space-2xs)}
  .zone-age{text-align:left}
  .pyr-7 .pyr-row:nth-child(n),.pyr-3 .pyr-row:nth-child(n){width:100%}
}

/* ---------- zh register: CJK takes looser tracking, no case transform ---------- */
:lang(zh) .leg .no,:lang(zh) .reason .no,:lang(zh) .spec-head .no,:lang(zh) .final-card .no,
:lang(zh) .end-card .no,
:lang(zh) .pyr-row .ms,:lang(zh) .zone-age,:lang(zh) .pyr-row .big span,
:lang(zh) .final-card dt{
  letter-spacing:.06em;text-transform:none;
}
:lang(zh) .reason h3,:lang(zh) .spec-head h3,:lang(zh) .final-card h3,
:lang(zh) .end-card h3,:lang(zh) .pyr-row .lv{letter-spacing:0}
:lang(zh) .reason h3,:lang(zh) .spec-head h3,:lang(zh) .final-card h3,
:lang(zh) .end-card h3{line-height:1.35}
:lang(zh) .pyr-row .lv{line-height:1.2}