.controller-guide {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: #20252b;
}
.controller-guide-hero { background: #101315; color: #f6f6f2; padding: 28px 0 64px; }
.controller-guide-hero .breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px 12px; color: #b4bac0; margin-bottom: 48px; font-size: 14px; }
.controller-guide-hero .breadcrumbs a:hover { color: #e0c48d; }
.controller-guide-hero .section-label { color: #e0c48d; }
.controller-guide-hero h1 { max-width: 1050px; font-size: clamp(32px, 4.4vw, 58px); line-height: 1.12; letter-spacing: -.035em; margin-bottom: 24px; text-wrap: pretty; }
.controller-guide-meta { color: #b4bac0; font-size: 14px; margin: 0; }
.controller-guide-meta span { margin-inline: 10px; }
.controller-guide-layout { display: grid; grid-template-columns: 235px minmax(0, 780px); gap: 64px; align-items: start; padding-block: 56px 80px; }
.controller-guide-sidebar { position: sticky; top: 120px; }
.controller-guide-sidebar h2 { font-size: 15px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 18px; }
.controller-guide-sidebar ol { margin: 0 0 22px; padding-left: 20px; font-size: 14px; color: #59616b; }
.controller-guide-sidebar li { padding: 5px 0 5px 4px; }
.controller-guide-sidebar a:hover { color: #72551f; text-decoration: underline; text-underline-offset: 4px; }
.controller-guide-sidebar-cta { font-weight: 650; font-size: 14px; color: #72551f; }
.controller-guide-body { min-width: 0; font-size: 17px; line-height: 1.8; }
.controller-guide-body p { margin-bottom: 22px; }
.controller-guide-intro { font-size: 20px; line-height: 1.65; color: #172532; }
.controller-guide-body section { margin-top: 44px; scroll-margin-top: 110px; }
.controller-guide-body h2 { font-size: clamp(24px, 2.5vw, 30px); line-height: 1.25; letter-spacing: -.025em; text-wrap: pretty; margin-bottom: 20px; }
.controller-guide-body a:not(.button) { color: #72551f; text-decoration: underline; text-underline-offset: 3px; }
.controller-guide-body a:not(.button):hover { color: #493309; }
.controller-guide-body ul { padding-left: 24px; margin: 0 0 24px; }
.controller-guide-body li { padding-left: 4px; margin-bottom: 8px; }
.controller-guide-example { background: #f6f4ee; border-left: 3px solid #c5a462; padding: 24px 28px; margin-bottom: 24px; border-radius: 0 10px 10px 0; }
.controller-guide-example p:last-child { margin-bottom: 0; }
.controller-guide-table { overflow-x: auto; margin: 24px 0; border: 1px solid #dce0e4; border-radius: 10px; }
.controller-guide-table table { width: 100%; min-width: 580px; border-collapse: collapse; font-size: 15px; line-height: 1.6; text-align: left; }
.controller-guide-table th, .controller-guide-table td { padding: 18px; vertical-align: top; border-bottom: 1px solid #dce0e4; }
.controller-guide-table thead { background: #142633; color: #fff; }
.controller-guide-table tbody th { width: 26%; background: #f6f8f9; font-weight: 600; }
.controller-guide-table tbody tr:last-child > * { border-bottom: 0; }
.controller-guide-contact { background: #f3f5f7; padding: 32px; border: 1px solid #e0e5e9; border-radius: 12px; }
.controller-guide-contact .button { white-space: normal; text-align: center; line-height: 1.5; max-width: 100%; }
.controller-guide-related { margin-top: 40px; padding-top: 30px; border-top: 1px solid #dce0e4; }
.controller-guide-related h2 { font-size: 21px; }
.controller-guide a:focus-visible, .controller-guide-table:focus-visible { outline: 3px solid #9c742f; outline-offset: 5px; }
@media (max-width: 900px) {
  .controller-guide-layout { grid-template-columns: 1fr; gap: 32px; padding-top: 32px; }
  .controller-guide-sidebar { position: static; background: #f6f8f9; padding: 24px; border-radius: 10px; }
  .controller-guide-sidebar ol { columns: 2; column-gap: 32px; }
  .controller-guide-sidebar li { break-inside: avoid; }
}
@media (max-width: 560px) {
  .controller-guide-hero { padding-bottom: 40px; }
  .controller-guide-hero .breadcrumbs { margin-bottom: 32px; font-size: 12px; }
  .controller-guide-body { font-size: 16px; }
  .controller-guide-intro { font-size: 18px; }
  .controller-guide-sidebar ol { columns: 1; }
  .controller-guide-example, .controller-guide-contact { padding: 22px 18px; }
  .controller-guide-body section { margin-top: 34px; }
}
@media print {
  .controller-guide-sidebar, .controller-guide-related, .controller-guide-contact .button { display: none; }
  .controller-guide-layout { display: block; }
  .controller-guide-hero { background: white; color: black; }
  .controller-guide-body { font-size: 11pt; }
}
