/*
 * Module: section-q-photo
 *
 * From TEMPLATE_interpreted.json (annotation "Q: photo section" at y=1301):
 *   - Panel rect 600×188 fill #6F8C4C at y=1217
 *   - Photo column rect 227×188 fill #33441C at y=1217 x=0
 *   - Headline text at x=265 y=1248 w=100 (font outlined → 0px in JSON;
 *     rendered here as Georgia serif bold on white)
 *   - Bracket-above: stroke #33441C 0.76px  x=266 y=1302 w=70
 *   - Bracket-below: stroke #33441C 0.76px  x=266 y=1380 w=70
 *
 * Panel is full-width with photo column on the left (227px) and
 * content stack on the right starting at x=265 (38px gutter from photo).
 *
 * Vertical rhythm from JSON Y-deltas:
 *   31px  panel-top → headline-top   (1248−1217)
 *   54px  headline-top → bracket-above (1302−1248)
 *   78px  bracket-above → bracket-below (1380−1302)
 *   25px  bracket-below → panel-bottom (1405−1380)
 */

.fm-q-photo {
  width: 100%;
  background: var(--fm-color-q-photo-bg);
}

.fm-q-photo-row { width: 100%; }

.fm-q-photo-image-cell {
  width: var(--fm-q-photo-image-w);
  background: var(--fm-color-q-photo-image);
  vertical-align: top;
  padding: 0;
}

.fm-q-photo-image-cell img {
  display: block;
  width: var(--fm-q-photo-image-w);
  height: var(--fm-q-photo-panel-h);
  border: 0;
}

.fm-q-photo-content-cell {
  vertical-align: top;
  padding-top: var(--fm-q-photo-headline-y);
  padding-left: var(--fm-q-photo-content-x);
  padding-right: 24px;
  padding-bottom: 0;
  color: var(--fm-color-white);
}

.fm-q-photo-headline {
  font-family: var(--fm-font-serif);
  font-size: 22px;
  line-height: 1.1;
  color: var(--fm-color-white);
  /* italic/bold mix via inner <span>s in the template — matches the
     "new SECTION" treatment in section-basic for headline consistency */
  margin: 0;
}

.fm-q-photo-rule-above,
.fm-q-photo-rule-below {
  width: var(--fm-q-photo-bracket-w);
  height: 1px;
  background: var(--fm-color-q-photo-image);
  font-size: 1px;
  line-height: 1px;
  margin: 0;
  padding: 0;
}

.fm-q-photo-rule-gap-above { height: 22px; line-height: 1px; font-size: 1px; }
.fm-q-photo-rule-gap-below { height: 22px; line-height: 1px; font-size: 1px; }

.fm-q-photo-subhead {
  font-family: var(--fm-font-serif);
  font-size: 14px;
  line-height: 1.2;
  color: var(--fm-color-white);
  font-weight: 400;
  font-style: italic;
  margin: 0;
}