body { margin: 0; font-family: 'Segoe UI', sans-serif; background: #fff; color: #1D1D1F; line-height: 1.6; }
    .layout { display: flex; justify-content: center; align-items: flex-start; gap: 2rem; max-width: 1200px; margin: 0 auto; padding: 2rem 1rem; }
    .article { flex: 0 0 70%; max-width: 70%; }
    .faq { flex: 0 0 30%; max-width: 30%; position: sticky; top: 2rem; align-self: flex-start; }
    h1 { font-size: 2.2rem; color: #0071CE; font-weight: 700; margin-bottom: 0.5rem; }
    h2 { font-size: 1.4rem; color: #0071CE; font-weight: 600; margin-top: 0.5rem; margin-bottom: 2rem; }
    h3 { font-size: 1.2rem; font-weight: 600; margin-top: 1.5rem; color: #000; }
    p { margin-bottom: 1.2rem; font-size: 1rem; }
    em { font-style: italic; }
    a { color: #0056b3; text-decoration: none; }
    a:hover { text-decoration: underline; }
    strong { color: #0071CE; }
    .highlight { background-color: #FFF6D8; padding: 1.5rem 1.5rem; margin: 2rem 0; border-left: 4px solid #FFD35A; border-radius: 4px; }
    .highlight p { margin: 0.6rem 0; font-size: 1rem; }
    details { background-color: #E7F2FB; padding: 1rem 1.25rem; margin: 1rem 0; border-left: 4px solid #0071CE; border-radius: 4px; }
    summary { font-size: 1rem; font-weight: 600; cursor: pointer; color: #000; }
    summary::-webkit-details-marker { color: #0071CE; }
    details p { margin-top: 0.8rem; font-size: 0.95rem; }
    @media (max-width: 950px) { .layout { flex-direction: column; } .article, .faq { max-width: 100%; flex: 0 0 100%; } .faq { position: static; } }