.photo-intro { font-size: 18px; line-height: 1.55; max-width: 62ch; margin: 0 0 12px; }
.photo-guide { margin: 0 0 28px; border-bottom: 1px solid var(--line); }
.photo-guide > summary { display: flex; align-items: center; gap: 16px; width: 100%; box-sizing: border-box; cursor: pointer; list-style: none; padding: 20px; border: 1px solid var(--red); border-left-width: 5px; border-radius: 4px; background: var(--deep); font: 700 clamp(22px, 3.4vw, 28px)/1.3 var(--font-label); }
.photo-guide > summary > span:first-child { flex: 1; min-width: 0; }
.photo-guide > summary strong { padding: 1px 6px; border-radius: 2px; background: var(--red); color: #fff; }
.photo-guide > summary::-webkit-details-marker { display: none; }
.photo-guide-link { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.photo-guide-toggle { display: inline-grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border: 1px solid var(--red); border-radius: 50%; font-size: 24px; transition: transform .15s; }
.photo-guide[open] .photo-guide-toggle { transform: rotate(45deg); }
.photo-guide-content { padding: 28px 0 32px; border-top: 1px solid var(--line); }
.photo-guide-heading { max-width: 700px; margin: 0 0 30px; }
.photo-guide h3 { font: 800 clamp(38px, 5vw, 58px)/1.04 var(--font-display); max-width: 19ch; margin: 0 0 18px; text-wrap: balance; }
.photo-guide-tips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 30px; padding: 26px; background: var(--deep); border-left: 3px solid var(--red); }
.photo-guide h4 { font: 700 26px/1.15 var(--font-display); margin: 0 0 10px; }
.photo-guide-tips p, .photo-guide-ready p, .photo-guide-section-heading p { margin: 0; font-size: 18px; line-height: 1.55; color: var(--ink); }
.photo-guide-section-heading { margin: 38px 0 22px; max-width: 64ch; }
.photo-guide-section-heading h4 { font-size: 34px; }
.photo-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
.photo-guide-grid figure { min-width: 0; margin: 0; }
.photo-guide-grid figure > a { display: block; background: var(--deep); border-radius: 4px; overflow: hidden; }
.photo-guide-grid img { display: block; width: 100%; height: auto; }
.photo-guide-grid figcaption { padding: 16px 2px 0; }
.photo-guide-grid h5 { font: 700 25px/1.2 var(--font-display); margin: 0 0 9px; }
.photo-guide-grid figcaption p { font-size: 18px; line-height: 1.5; margin: 0; color: var(--ink); }
.photo-guide-front { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; }
.photo-guide-front figcaption { padding-top: 0; }
.photo-guide-badges { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; }
.photo-guide-badges > a { max-width: 290px; width: 100%; justify-self: center; }
.photo-guide-badges figcaption { padding-top: 0; }
.photo-guide-ready { margin-top: 32px; border-top: 1px solid var(--line); padding: 28px 0 0; }
.photo-guide-ready p + p { margin-top: 12px; }
.photo-guide-ready button { margin-top: 22px; }
.photo-guide :focus-visible { outline: 3px solid var(--amber); outline-offset: 5px; }
@media (max-width: 620px) {
  .photo-guide-tips, .photo-guide-grid { grid-template-columns: minmax(0, 1fr); }
  .photo-guide-tips { padding: 20px; gap: 24px; }
  .photo-guide-front, .photo-guide-badges { grid-column: auto; display: block; }
  .photo-guide-front figcaption, .photo-guide-badges figcaption { padding-top: 16px; }
  .photo-guide-badges > a { max-width: none; }
  .photo-guide-content { padding-top: 24px; }
}
@media (prefers-reduced-motion: reduce) { .photo-guide-toggle { transition: none; } }