/* MEDIA — the press kit's own sections. Loaded by site/media/index.html AFTER
   vault.css and show.css, under body.show-page, so the nav, footer, type and
   gold are the home page's own. Nothing here restyles those; every colour is a
   show.css token (--sh-*, --gold) or a brand/README.md value on a swatch. */

.md-hero{padding-top:clamp(28px,5vw,72px);padding-bottom:clamp(36px,4.4vw,56px)}
.md-h1{margin-top:14px;max-width:none}
.md-lede{margin-top:22px;max-width:34em;font-size:clamp(16px,1.35vw,17px);line-height:1.7;color:var(--sh-text)}
.md-lede a,.md-body > p a:not(.btn-solid){color:var(--sh-white);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#5A574F}
.md-lede a:hover,.md-body > p a:not(.btn-solid):hover{text-decoration-color:var(--gold)}
.md-jump{list-style:none;display:flex;flex-wrap:wrap;gap:4px 24px;margin-top:24px}
.md-jump a{display:inline-flex;align-items:center;min-height:36px;font-size:14.5px;color:var(--sh-text)}
.md-jump a:hover{color:var(--sh-white);text-decoration:none}

/* The home page's "And it goes deeper" band: a 278px heading column, then the
   body; rules in --sh-rule; alternate bands raised. */
.md-band{border-top:1px solid var(--sh-rule);scroll-margin-top:8px}
.md-raised{background:var(--sh-raised)}
.md-sec{display:grid;gap:18px;padding-top:clamp(36px,4.4vw,60px);padding-bottom:clamp(36px,4.4vw,60px)}
@media (min-width:900px){ .md-sec{grid-template-columns:278px minmax(0,1fr)} }
.md-sec h2{font-family:var(--sans);font-weight:600;color:var(--sh-white);font-size:clamp(20px,1.9vw,24px);letter-spacing:-.02em;line-height:1.25}
.md-body{min-width:0;max-width:760px}
.md-body > p{font-size:16px;line-height:1.7;color:var(--sh-text)}
.md-body > p + p{margin-top:14px}
.md-body em{font-style:normal;color:var(--sh-white);font-weight:600}
.md-h3{margin-top:38px;margin-bottom:12px;font-weight:400}
.md-all{margin-top:24px !important}

.md-quote{padding:18px 20px;border:1px solid #3A3120;background:#15130E;border-radius:4px;
  font-size:16px;line-height:1.7;color:var(--sh-white)}

.md-rows{margin-top:30px;border-bottom:1px solid var(--sh-rule)}
.md-rows dd a{color:var(--sh-white);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#5A574F}
.md-terms{margin-top:22px}
.md-terms dfn{font-style:normal}
@media (min-width:700px){ .md-rows .sh-row{grid-template-columns:140px 1fr} }

/* Logo tiles. */
.md-tiles{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.md-tiles-2{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.md-swatch{height:116px;border-radius:4px;border:1px solid var(--sh-rule);display:flex;align-items:center;justify-content:center;padding:22px}
.md-swatch img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.md-mono{padding:24px}
.md-icon{padding:14px}
.md-on-ink{background:#0B0B0C}
.md-on-raised{background:var(--sh-raised-2)}
.md-on-cream{background:#F5EFE3;border-color:#F5EFE3}
.md-on-grey{background:#3A3833}
.md-wide{padding:0;overflow:hidden;background:#0B0B0C}
.md-wide img{width:100%;height:100%;object-fit:cover}
.md-name{margin-top:10px;font-weight:600;font-size:14.5px;color:var(--sh-white)}
.md-name span{display:block;font-weight:400;font-size:13px;color:var(--sh-mute)}
.md-dl{margin-top:4px;display:flex;flex-wrap:wrap;gap:0 18px}
.md-dl a{display:inline-flex;align-items:center;min-height:32px;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--gold)}
.md-dl a:hover{color:var(--gold-pale)}

.md-rules{list-style:none;display:grid;gap:8px}
.md-rules li{position:relative;padding-left:20px;font-size:15.5px;line-height:1.65;color:var(--sh-text)}
.md-rules li::before{content:"";position:absolute;left:0;top:13px;width:9px;height:1.5px;background:var(--gold)}

/* Colours. */
.md-colours{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.md-colours li{display:flex;flex-direction:column;gap:3px;min-width:0}
.md-chip{display:block;height:80px;border-radius:4px;border:1px solid var(--sh-rule);margin-bottom:8px}
.md-chip-gold{background:linear-gradient(180deg,#E8C468 0%,#C9A459 52%,#8C6B2F 100%)}
.md-chip-cream{background:#F5EFE3}
.md-chip-ink{background:#0B0B0C;border-color:#3A3833}
.md-colours b{font-weight:600;font-size:15px;color:var(--sh-white)}
.md-colours code{font-family:var(--mono);font-size:13px;color:var(--sh-text);overflow-wrap:anywhere}
.md-colours small{font-size:13px;color:var(--sh-mute)}

/* ═══ PHONE — the home page's breakpoint ═══ */
@media (max-width:899px){
  .md-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .md-tiles-2{grid-template-columns:minmax(0,1fr)}
  .md-swatch{height:92px;padding:16px}
  .md-mono{padding:18px}
  .md-wide{height:auto;aspect-ratio:1200/630}
  .md-colours{grid-template-columns:minmax(0,1fr)}
  .md-colours li{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:14px;align-content:center}
  .md-chip{height:64px;margin:0;grid-row:1 / span 3}
  .md-all .btn-solid{display:block;width:100%}
}