.service-accordion { --service-navy: #071d3a; --service-panel: #102e52; --service-yellow: #ffdc32; --service-text: #f2f7ff; --service-muted: #b3c9e4; display: grid; gap: 12px; width: 100%; overflow-anchor: none; }
.service-accordion, .service-accordion * { box-sizing: border-box; }
.service-accordion [hidden] { display: none !important; }
.service-item { min-width: 0; overflow: hidden; border: 1px solid #a2c8ff26; border-radius: 17px; background: var(--service-panel); color: var(--service-text); transition: border-color 600ms cubic-bezier(.4, 0, .2, 1), background-color 600ms cubic-bezier(.4, 0, .2, 1); }
.service-item.is-expanded { border-color: #82b7ff73; background: #12345c; }
.service-item.is-selected { border-color: #ffdc3280; }
.service-heading { margin: 0; font: inherit; }
.service-toggle { display: flex; align-items: center; width: 100%; min-width: 0; gap: 17px; padding: 23px 24px; border: 0; text-align: left; color: inherit; background: transparent; font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.service-toggle:hover { background: #ffffff04; }
.service-toggle:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--service-yellow); outline-offset: -4px; border-radius: 16px; }
.service-icon { display: grid; flex: 0 0 46px; place-items: center; width: 46px; height: 46px; border: 1px solid #ffdc3236; border-radius: 13px; background: #ffdc3209; color: var(--service-yellow); }
.service-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.service-heading-text { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-width: 0; gap: 6px; }
.service-title-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 9px; }
.service-title { font-size: 17px; font-weight: 650; line-height: 1.3; letter-spacing: -.018em; }
.service-tag { padding: 3px 6px; border: 1px solid #ffdc324d; border-radius: 5px; color: var(--service-yellow); font-size: 9px; font-weight: 500; line-height: 1.2; letter-spacing: .01em; }
.service-description { color: var(--service-muted); font-size: 12px; font-weight: 400; line-height: 1.55; }
.service-selection-label { display: flex; align-items: center; gap: 6px; margin-top: 2px; color: var(--service-yellow); font-size: 10px; font-weight: 600; line-height: 1.5; }
.service-selection-label::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.service-chevron { display: grid; place-items: center; flex: 0 0 26px; width: 26px; height: 26px; color: #adc8e9; transform: rotate(0deg); transition: transform 600ms cubic-bezier(.4, 0, .2, 1), color 600ms cubic-bezier(.4, 0, .2, 1); }
.service-chevron svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.service-item.is-expanded .service-chevron { transform: rotate(180deg); color: var(--service-yellow); }
.service-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 600ms cubic-bezier(.4, 0, .2, 1); }
.service-item.is-expanded > .service-panel { grid-template-rows: 1fr; }
.service-panel-inner { min-height: 0; overflow: hidden; opacity: 0; transition: opacity 600ms cubic-bezier(.4, 0, .2, 1); }
.service-item.is-expanded > .service-panel > .service-panel-inner { opacity: 1; }
.service-panel-content { margin: 0 24px; padding: 19px 0 22px; border-top: 1px solid #a2c8ff26; }
.service-choice { display: flex; align-items: flex-start; min-width: 0; gap: 11px; padding: 11px 0; font-size: 13px; font-weight: 400; line-height: 1.55; cursor: pointer; }
.service-choice input { flex: 0 0 18px; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--service-yellow); cursor: pointer; }
.service-choice input:focus-visible { outline: 2px solid var(--service-yellow); outline-offset: 4px; }
.service-choice span { min-width: 0; overflow-wrap: anywhere; }
.service-detail-list { padding: 0 3px; }
.service-note { margin: 0 0 16px; color: var(--service-muted); font-size: 12px; line-height: 1.7; }
.service-hint { margin: 12px 0 0; color: #8faed2; font-size: 10px; line-height: 1.6; }
@media (max-width: 600px) {
  .service-accordion { gap: 10px; }
  .service-item { border-radius: 14px; }
  .service-toggle { gap: 12px; padding: 19px 17px; }
  .service-icon { flex-basis: 40px; width: 40px; height: 40px; border-radius: 11px; }
  .service-icon svg { width: 22px; height: 22px; }
  .service-title { font-size: 15px; }
  .service-description { font-size: 11px; }
  .service-chevron { flex-basis: 20px; width: 20px; }
  .service-panel-content { margin-right: 17px; margin-left: 17px; padding-top: 17px; padding-bottom: 19px; }
  .service-choice { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-item, .service-chevron, .service-panel, .service-panel-inner { transition: none !important; }
}
