/* v0.39.4 Reusable resource guide styling on the canonical shell. */
.lwn-guide {
  --guide-green: #07351f;
  --guide-ink: #173f2b;
  --guide-gold: #b68526;
  --guide-cream: #f7f0df;
  --guide-paper: #fffdf8;
  --guide-line: rgba(20, 58, 42, .18);
  width: var(--lwn-shell-width);
  max-width: var(--lwn-shell-max);
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(4rem, 7vw, 7rem);
}
.lwn-guide * { box-sizing: border-box; }
.lwn-guide-kicker { margin: 0 0 1rem; color: var(--guide-gold); font-size: .76rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 800; }
.lwn-guide-intro { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-bottom: clamp(3.5rem, 7vw, 7rem); }
.lwn-guide-intro h2, .lwn-guide-panel h2, .lwn-guide-next h2 { margin: 0 0 .6em; color: var(--guide-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.6rem, 5vw, 5.8rem); line-height: .96; letter-spacing: -.045em; }
.lwn-guide-lead { font-size: clamp(1.16rem, 1.55vw, 1.45rem); line-height: 1.58; color: var(--guide-ink); }
.lwn-guide p, .lwn-guide li { font-size: 1.05rem; line-height: 1.75; }
.lwn-guide-intro-image { margin: 0; }
.lwn-guide-intro-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; box-shadow: 0 28px 70px rgba(18, 45, 31, .10); }
.lwn-guide-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin-bottom: clamp(3.5rem, 7vw, 7rem); }
.lwn-guide-step { background: var(--guide-paper); border: 1px solid var(--guide-line); padding: clamp(1.25rem, 2vw, 1.8rem); }
.lwn-guide-step span { display: inline-flex; color: var(--guide-gold); font-weight: 800; letter-spacing: .14em; margin-bottom: 1rem; }
.lwn-guide-step h3 { margin: 0 0 .7rem; color: var(--guide-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 2.4vw, 2.65rem); line-height: 1; letter-spacing: -.035em; }
.lwn-guide-step p { margin-bottom: 0; font-size: 1rem; line-height: 1.65; }
.lwn-guide-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.2rem, 2vw, 1.65rem); margin-bottom: clamp(3.5rem, 7vw, 7rem); }
.lwn-guide-panel { background: var(--guide-cream); border: 1px solid var(--guide-line); padding: clamp(1.75rem, 3.5vw, 3.4rem); }
.lwn-guide-panel-dark { background: var(--guide-green); color: #fff8e8; }
.lwn-guide-panel-dark h2, .lwn-guide-panel-dark p, .lwn-guide-panel-dark .lwn-guide-kicker { color: #fff8e8; }
.lwn-guide-panel ul { padding-left: 1.2rem; }
.lwn-guide-panel li + li { margin-top: .7rem; }
.lwn-guide-next { border-top: 1px solid var(--guide-line); padding-top: clamp(2.5rem, 5vw, 5rem); }
.lwn-guide-next-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin-top: 2rem; }
.lwn-guide-next-grid a { display: block; border: 1px solid var(--guide-line); background: var(--guide-paper); color: var(--guide-ink); text-decoration: none; padding: clamp(1.25rem, 2vw, 1.8rem); }
.lwn-guide-next-grid strong { display: block; color: var(--guide-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 2.3vw, 2.55rem); line-height: 1; letter-spacing: -.035em; margin-bottom: .75rem; }
.lwn-guide-next-grid span { display: block; line-height: 1.65; }
@media (max-width: 1100px) {
  .lwn-guide-intro, .lwn-guide-split { grid-template-columns: 1fr; }
  .lwn-guide-steps, .lwn-guide-next-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .lwn-guide-steps, .lwn-guide-next-grid { grid-template-columns: 1fr; }
}