.guide-hero {
  display: grid; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr);
  gap: 26px; align-items: end; padding: 30px; border: 1px solid var(--line);
  border-radius: 17px; background: linear-gradient(135deg,var(--surface),color-mix(in srgb,var(--accent) 5%,var(--surface)));
}
.guide-hero h2 { max-width: 780px; margin: 10px 0; font: 500 clamp(29px,4vw,52px)/1.02 Georgia,serif; letter-spacing: -.045em; }
.guide-hero h2 em { color: var(--accent); font-style: normal; }
.guide-hero p { max-width: 720px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.guide-summary { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }
.guide-summary div { padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }
.guide-summary strong,.guide-summary span { display: block; }
.guide-summary strong { font-size: 21px; color: var(--accent); }
.guide-summary span { margin-top: 4px; color: var(--faint); font-size: 7px; text-transform: uppercase; letter-spacing: .09em; }
.guide-group { margin-top: 28px; }
.guide-group-head { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin-bottom: 11px; }
.guide-group-head h3 { margin: 0; font: 600 20px Georgia,serif; }
.guide-group-head p { margin: 4px 0 0; color: var(--muted); font-size: 9px; }
.guide-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.guide-card { display: flex; min-height: 188px; flex-direction: column; padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); transition: transform .18s,border-color .18s; }
.guide-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb,var(--accent) 30%,var(--line)); }
.guide-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.guide-card-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: var(--accent-soft); color: var(--accent); font: 800 8px ui-monospace,monospace; }
.guide-card h4 { margin: 20px 0 6px; font-size: 12px; }
.guide-card p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
.guide-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 15px; }
.guide-audience { color: var(--faint); font-size: 7px; }
.guide-open { color: var(--accent); font-size: 8px; font-weight: 800; }
.guide-note { margin-top: 24px; padding: 16px; border-left: 2px solid var(--accent); background: var(--accent-soft); border-radius: 0 10px 10px 0; }
.guide-note strong { display: block; font-size: 9px; }
.guide-note p { margin: 5px 0 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
@media(max-width:1100px){.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-hero{grid-template-columns:1fr}}
@media(max-width:650px){.guide-grid{grid-template-columns:1fr}.guide-hero{padding:22px}.guide-card{min-height:165px}.guide-group-head{align-items:flex-start;flex-direction:column}}