.guide-hero { padding: 96px 0 72px; }
.guide-hero h1 { max-width: 820px; font-size: clamp(44px, 6.4vw, 78px); }
.guide-hero .lede { max-width: 620px; }
.guide-note { max-width: 620px; margin: 22px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.guide-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; padding-bottom: 120px; }
.guide-card { grid-column: span 2; padding: 34px 30px 36px; border: 1px solid rgba(103,142,195,.36); border-radius: 24px; background: linear-gradient(118deg, #222a39, #18202c); }
.guide-card h2 { margin: 0 0 6px; font-size: 30px; letter-spacing: -.045em; line-height: 1.1; }
.guide-card .guide-sub { margin: 0 0 26px; color: var(--muted); font-size: 14px; }
.guide-steps { margin: 0; padding: 0; list-style: none; counter-reset: guide; display: grid; gap: 18px; }
.guide-steps li { position: relative; padding-left: 42px; color: var(--body); font-size: 15.5px; line-height: 1.55; counter-increment: guide; }
.guide-steps li::before { content: counter(guide); position: absolute; left: 0; top: 1px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #2a3347; color: #93c5fd; font-size: 13px; font-weight: 650; }
.guide-steps strong { color: var(--text); font-weight: 650; }
.guide-tip { margin: 26px 0 0; padding-top: 20px; border-top: 1px solid var(--border); color: var(--muted); font-size: 13.5px; line-height: 1.55; }
.guide-card-wide { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 40px; align-items: start; }
.guide-card-wide ~ .guide-card:not(.guide-card-wide) { grid-column: span 3; }
.guide-shots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.guide-shots-two { grid-template-columns: repeat(2, 1fr); max-width: 520px; }
.guide-shots figure { margin: 0; }
.guide-shots img { display: block; width: 100%; height: auto; border: 1px solid rgba(103,142,195,.36); border-radius: 18px; }
.guide-shots figcaption { margin-top: 12px; color: var(--body); font-size: 13.5px; line-height: 1.45; }
.guide-shots figcaption b { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 6px; border-radius: 50%; background: #2a3347; color: #93c5fd; font-size: 11.5px; font-weight: 650; }
.guide-shots figcaption strong { color: var(--text); font-weight: 650; }
.guide-working { min-height: 0; }
.guide-working .data-inner { min-height: 0; padding: 84px 0; }
.guide-working ul { margin: 0; padding: 0; list-style: none; color: var(--body); font-size: 17px; line-height: 1.65; display: grid; gap: 14px; }
.guide-working li span { color: var(--teal); margin-right: 10px; }

@media (max-width: 960px) {
  .guide-grid { grid-template-columns: 1fr; padding-bottom: 80px; }
  .guide-card, .guide-card-wide ~ .guide-card:not(.guide-card-wide) { grid-column: auto; }
  .guide-card-wide { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 760px) {
  .guide-hero { padding: 56px 0 48px; }
  .guide-card { padding: 28px 22px 30px; }
  .guide-shots { gap: 10px; }
  .guide-shots figcaption { font-size: 12.5px; }
  .guide-working .data-inner { padding: 64px 0; }
}