/* FAQ: three questions first, then an accessible native disclosure. */
.faq-list>details>summary,.faq-extra>details>summary{gap:16px;padding:12px 0;line-height:1.5}
.faq-list summary::after{flex:none}
.faq-list p a{color:var(--blue);text-underline-offset:3px}
.faq-list .faq-more{border-bottom:0}
.faq-list .faq-more-toggle{justify-content:center;gap:8px;min-height:48px;margin-top:12px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--pale);color:var(--blue);font-size:14px}
.faq-list .faq-more-toggle::after{content:none}
.faq-more-toggle .faq-more-open{display:none}
.faq-more[open]>.faq-more-toggle .faq-more-closed{display:none}
.faq-more[open]>.faq-more-toggle .faq-more-open{display:inline}
.faq-more[open]>.faq-more-toggle svg{transform:rotate(180deg)}
.faq-extra{margin-top:12px;border-top:1px solid var(--line)}
.feature-card .feature-no { color: #073c82; font-size: 34px; font-weight: 800; line-height: 1.15; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.feature-card ul { margin: 16px 0 0; padding: 0; list-style: none; }
.feature-card .notification-benefit { margin-top: 16px; padding: 12px 14px; border-left: 3px solid #d99416; background: #f7faff; color: #40546a; }
.feature-card .notification-title { font-size: 24px; line-height: 1.4; }
.notification-title strong { color: #073c82; font-size: 30px; font-weight: 800; }
.feature-card .notification-subtitle { margin: 8px 0 12px; color: #40546a; font-weight: 700; }
.feature-card .value-title { font-size: 24px; line-height: 1.4; }
.value-title strong { color: #073c82; font-size: 30px; font-weight: 800; }
.feature-card .value-subtitle { margin: 8px 0 12px; color: #40546a; font-weight: 700; }
.feature-card .value-benefit { margin-top: 16px; padding: 12px 14px; border-left: 3px solid #d99416; background: #f7faff; color: #40546a; }
.value-billing { margin-top: 16px; padding-top: 14px; border-top: 1px solid #dce6f0; color: #40546a; font-size: 14px; }
.value-billing strong, .value-billing span { display: block; }
.value-billing { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.value-billing strong { color: #073c82; font-size: 16px; }
.value-billing small { margin-top: 4px; color: #65758a; font-size: 12px; }
.feature-card li { position: relative; padding: 5px 0 5px 17px; font-size: 14px; color: #40546a; line-height: 1.6; }
.feature-card li::before { content: ""; position: absolute; top: 14px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #1b66ad; }
.feature-note { display: block; margin-top: 13px; font-size: 12px; color: #65758a; line-height: 1.6; }
.feature-demo-link { display: block; width: fit-content; padding: 10px 0; margin-top: 5px; color: #073c82; font-weight: 700; font-size: 14px; text-underline-offset: 4px; }
.feature-next { margin-top: 32px; text-align: center; padding: 26px 18px; border-top: 1px solid #dce6f0; }
.feature-next p { margin: 0 0 14px; color: #062d62; font-weight: 700; }
.feature-next small { display: block; margin-top: 10px; color: #65758a; }
.section.benefit-section { padding-bottom: 0; }
.benefit-section + .closing { padding-top: 24px; }
.admin-screenshot { display: block; width: 100%; max-width: 620px; margin: auto; overflow: hidden; border: 1px solid #dce6f0; border-radius: 14px; background: #fff; box-shadow: 0 12px 30px #073c8214; text-decoration: none; }
#admin-sample .admin-demo { grid-template-columns: 1fr 266px; gap: 100px; padding: 0; }
#admin-sample .admin-demo-copy { min-width: 0; text-align: center; }
#admin-sample .admin-demo-copy p { margin-left: auto; margin-right: auto; }
.admin-phone-wrap { margin: auto; max-width: 100%; text-align: center; }
.phone.admin-phone { margin: auto; }
.hero .phone iframe { width: 312px; height: 624px; transform: scale(.75); }
.admin-phone-screen img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: left top; }
.admin-phone-caption { margin: 14px 0 0; color: #65758a; font-size: 12px; }
#admin-sample .admin-demo-copy h2 { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.5; letter-spacing: -.025em; font-weight: 700; word-break: keep-all; overflow-wrap: break-word; margin-bottom: 14px; }
.admin-screenshot-label { display: block; padding: 10px 16px; color: #40546a; font-size: 12px; font-weight: 700; border-bottom: 1px solid #dce6f0; }
.admin-screenshot img { display: block; width: 100%; height: auto; }
.admin-screenshot-caption { display: block; padding: 12px 16px; background: #073c82; color: #fff; text-align: center; font-size: 14px; font-weight: 700; }
.admin-screenshot:hover .admin-screenshot-caption { background: #062d62; }

/* Compact, readable service-flow illustrations */
.feature-card .feature-icon { display: block; width: 100%; height: auto; margin: 12px 0 16px; padding: 8px; border-radius: 12px; background: #eef6fd; color: inherit; }
.feature-card .feature-icon svg { display: block; width: 100%; height: auto; max-height: 130px; fill: none; stroke: none; }
.admin-visual-new { display: grid; place-items: center; padding: 14px; transform: rotate(1.5deg); }
.admin-visual-new svg { display: block; width: 100%; max-width: 420px; height: auto; }
@media (max-width: 760px) {
  .hero .phone iframe { width: 300px; height: 600px; transform: scale(.65); }
  #admin-sample .admin-demo { grid-template-columns: 1fr; gap: 24px; }
  .feature-card .feature-icon { padding: 6px; margin-bottom: 14px; }
  .feature-card .feature-icon svg { max-height: none; }
  .admin-visual-new { padding: 11px; }
}