/* Editorial typography, using the existing locally hosted Anton and system fonts.
   Load after the scene styles. Geometry, photo treatment and motion live there. */
.fullframe-site {
  --type-white: #f5f2e9;
  --type-secondary: #d9d9d2;
  --type-rule: #ffffff35;
  color: var(--type-white);
  font-kerning: normal;
}

/* One quiet scale for navigation, scene labels and actionable text. */
.scene-header .artist-home {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .115em;
  line-height: 1.2;
  text-shadow: 0 1px 6px #0007;
}
.scene-header .artist-home > span {
  font-size: 8px;
  font-weight: 400;
  letter-spacing: .16em;
  line-height: 1.5;
}
.scene-header .main-nav a {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.25;
  text-shadow: 0 1px 6px #0007;
}
.header-listen {
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .11em;
  text-shadow: 0 1px 6px #0007;
}
.fullframe-site .eyebrow,
.pendant-v4-heading > p,
.pendant-v4-gallery-heading {
  color: var(--type-secondary);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .15em;
  line-height: 1.5;
}
.fullframe-site .section-heading .eyebrow {
  margin-bottom: 16px;
}
.ff-scene-footer {
  font-size: 9px;
  letter-spacing: .13em;
  line-height: 1.5;
  text-shadow: 0 1px 6px #0008;
}
.scene-actions a,
.fullframe-site .ff-text-link,
.fullframe-site .text-link,
.ff-platforms a,
.clip-link {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .045em;
  line-height: 1.4;
}
.scene-actions a,
.ff-text-link {
  text-shadow: 0 1px 5px #0006;
}
.fullframe-site .clip-link,
.fullframe-site .text-link {
  color: var(--type-white);
}

/* Condensed display type establishes the hierarchy; italics stay an accent. */
.fullframe-site h1,
.fullframe-site h2,
.ff-record-copy h3 {
  font-weight: 400;
  letter-spacing: -.022em;
}
.fullframe-site h2 {
  line-height: .98;
}
.fullframe-site h2 em {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: 1.06;
}
.ff-arrival h1 {
  letter-spacing: -.018em;
  line-height: .97;
}
.ff-arrival-copy,
.ff-arrival-line,
.ff-music-title,
.ff-watch-title,
.social-section .section-heading,
.pendant-v4-heading {
  text-shadow: 0 2px 12px #0006;
}
.ff-signature {
  font-size: 13px;
  line-height: 1.35;
  letter-spacing: .015em;
}
.ff-signature em {
  font-size: 29px;
  line-height: 1.2;
  letter-spacing: -.025em;
}
.ff-arrival-line {
  letter-spacing: -.015em;
  line-height: 1.02;
}
.ff-arrival-line em {
  letter-spacing: -.035em;
}
.ff-music-title h2,
.ff-watch-title h2 {
  font-size: clamp(62px, 6.6vw, 100px);
}
.ff-record-copy h3 {
  margin-block: 14px 16px;
  line-height: .98;
}
.ff-record-copy h3 em {
  font-weight: 400;
  letter-spacing: -.04em;
}
.ff-record-copy > p:not(.eyebrow) {
  color: var(--type-secondary);
  font-size: 12px;
  line-height: 1.5;
}
.fullframe-site .ff-studio-title {
  font-family: var(--display);
  font-size: clamp(72px, 9.1vw, 132px);
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: .99;
  text-shadow: 0 2px 12px #0006;
}
.fullframe-site .ff-studio-title em {
  font: italic .78em/1.06 Georgia, 'Times New Roman', serif;
  letter-spacing: -.045em;
}
.ff-studio-note {
  max-width: 24ch;
  color: var(--type-secondary);
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: .015em;
  text-shadow: 0 1px 6px #0007;
}
.ff-watch-lead h3 {
  font-size: clamp(46px, 4.8vw, 74px);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: 1.08;
  margin-block: 13px 14px;
}
.ff-watch-lead > p:not(.eyebrow) {
  color: var(--type-secondary);
  font-size: 12px;
  line-height: 1.5;
}
.ff-watch-actions .feature-play > span + span {
  font-size: 11px;
  letter-spacing: .025em;
}
.fullframe-site .pendant-v4-heading h2 {
  font: italic clamp(48px, 5.3vw, 78px)/1.06 Georgia, 'Times New Roman', serif;
  letter-spacing: -.045em;
}

/* Shared quiet rules give the catalogs and captions a consistent reading order. */
.ff-catalog,
.ff-video-catalog,
.social-layout {
  border-width: 1px 0 0;
  border-style: solid;
  border-color: var(--type-rule);
  background: #080b0bc4;
}
.music-catalog-row strong {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -.01em;
  line-height: 1.35;
}
.music-catalog-row small,
.music-catalog-row > span:first-child,
.video-card-caption .track-number {
  color: var(--type-secondary);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}
.video-card-caption h3 {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: -.005em;
  line-height: 1.4;
}
.pendant-v4-gallery-heading a {
  font-size: 11px;
  letter-spacing: .025em;
}
.pendant-v4-photo > span {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.45;
}
.pendant-v4-photo > span > span:first-child {
  color: var(--type-secondary);
  font-size: 9px;
  font-variant-numeric: tabular-nums;
}
.social-section h2 {
  font-size: clamp(62px, 7.5vw, 106px);
}
.social-copy > p {
  color: var(--type-white);
  font-size: clamp(28px, 2.8vw, 40px);
  line-height: 1.22;
  letter-spacing: -.025em;
}
.social-directory a {
  font-size: 12px;
  letter-spacing: .015em;
}
.clip-copy h3 {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -.015em;
  line-height: 1.3;
}
.fullframe-site .clip-copy .eyebrow {
  font-size: 10px;
  letter-spacing: .08em;
}
.clip-credit {
  color: var(--type-secondary);
  font-size: 10px;
  line-height: 1.55;
  letter-spacing: .01em;
}
.booking-grid h2 {
  letter-spacing: -.02em;
  line-height: 1;
}
.booking-grid h2 em {
  color: var(--type-white);
}
.booking-grid > .booking-contact > p:first-child {
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: -.01em;
}
.booking-email {
  font-size: clamp(19px, 2.1vw, 30px);
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.35;
}
.booking-management > .eyebrow {
  display: block;
  margin-bottom: 6px;
}
.booking-hint {
  color: var(--type-secondary);
  font-size: 12px;
  line-height: 1.65;
}
.site-footer > div p {
  font-size: 11px;
  letter-spacing: .1em;
  line-height: 1.5;
}
.site-footer > div span,
.site-footer > a:not(.home-mark) {
  font-size: 11px;
  line-height: 1.5;
}
.site-footer > div span {
  color: var(--type-secondary);
}
.fullframe-site .dialog-header h2 {
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: -.015em;
}
.lightbox-footer p {
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 1000px) {
  .music-catalog-row strong { font-size: 12px; }
}
@media (max-width: 700px) {
  .scene-header .artist-home { font-size: 11px; }
  .scene-header .artist-home > span { font-size: 8px; letter-spacing: .12em; }
  .scene-header .main-nav a { font-size: 11px; letter-spacing: .015em; }
  .fullframe-site .eyebrow,
  .pendant-v4-heading > p,
  .pendant-v4-gallery-heading { font-size: 9px; letter-spacing: .13em; }
  .ff-arrival-copy > .eyebrow { font-size: 9px; letter-spacing: .14em; }
  .ff-signature { font-size: 11px; }
  .ff-signature em { font-size: 21px; }
  .ff-scene-footer { font-size: 8px; letter-spacing: .1em; }
  .scene-actions a { font-size: 11px; letter-spacing: .015em; }
  .ff-music-title h2,
  .ff-watch-title h2 { font-size: clamp(48px, 13.8vw, 64px); }
  .ff-record-copy h3 { font-size: 44px; margin-block: 12px 13px; }
  .ff-record-copy .eyebrow { font-size: 8px; letter-spacing: .08em; }
  .ff-record-copy > p:not(.eyebrow) { font-size: 11px; }
  .fullframe-site .ff-record-copy .ff-text-link { font-size: 9px; letter-spacing: .015em; }
  .music-catalog-row strong { font-size: 11px; }
  .music-catalog-row small { font-size: 9px; }
  .ff-platforms { gap: 16px; }
  .ff-platforms a { font-size: 10px; letter-spacing: .005em; }
  .fullframe-site .ff-studio-title { font-size: clamp(64px, 18vw, 84px); }
  .ff-studio-note { font-size: 11px; line-height: 1.5; }
  .ff-watch-lead h3 { font-size: 47px; }
  .ff-watch-lead > p:not(.eyebrow) { font-size: 11px; }
  .ff-watch-actions .ff-text-link { font-size: 10px; letter-spacing: .005em; }
  .video-card-caption h3 { font-size: 12px; }
  .fullframe-site .pendant-v4-heading h2 { font-size: 45px; }
  .pendant-v4-gallery-heading a { font-size: 10px; }
  .pendant-v4-photo > span { font-size: 10px; line-height: 1.4; }
  .social-section h2 { font-size: clamp(46px, 13.8vw, 64px); }
  .social-copy > p { font-size: 28px; }
  .social-directory a { font-size: 11px; }
  .clip-copy h3 { font-size: 16px; }
  .fullframe-site .clip-copy .eyebrow { font-size: 9px; }
  .clip-link { font-size: 11px; }
  .booking-grid > .booking-contact > p:first-child { font-size: 16px; }
  .booking-email { font-size: clamp(16px, 4.8vw, 21px); }
  .booking-hint { font-size: 12px; }
  .site-footer > div p,
  .site-footer > div span,
  .site-footer > a:not(.home-mark) { font-size: 10px; }
  .fullframe-site .dialog-header h2 { font-size: 24px; }
  .lightbox-footer p { font-size: 12px; }
}