/* R5 additions are limited to navigation, reading hierarchy and the business brief. */
.glass-surface { -webkit-backdrop-filter:blur(22px) saturate(1.12); backdrop-filter:blur(22px) saturate(1.12); }
.site-header { position:relative; z-index:50; background:#fcfcfaf2; }
.primary-nav { gap:28px; }
.header-actions { gap:24px; }
.nav-group { position:static; }
.nav-group>summary { display:flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; font-size:16px; list-style:none; white-space:nowrap; }
.nav-group>summary::-webkit-details-marker,.mobile-navigation>summary::-webkit-details-marker { display:none; }
.nav-group>summary>.icon { width:15px; height:15px; transition:transform 180ms ease; }
.nav-group[open]>summary>.icon { transform:rotate(180deg); }
.nav-group.is-current>summary,.nav-group[open]>summary { color:var(--green); }
.nav-group[open]>summary { text-decoration:underline; text-underline-offset:10px; text-decoration-color:var(--orange); text-decoration-thickness:2px; }
.nav-panel { display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:34px; position:absolute; top:calc(100% + 8px); left:var(--gutter); right:var(--gutter); padding:32px 34px; max-height:calc(100dvh - 116px); overflow:auto; border:1px solid #dde5dde8; border-radius:18px; background:linear-gradient(145deg,#fffffffa,#f7faf6fc); box-shadow:inset 0 1px 0 #fff,0 22px 45px -24px #153a3045; }
.nav-group[open]>.nav-panel { animation:nav-reveal 180ms cubic-bezier(.2,.7,.3,1) both; }
.nav-column+ .nav-column { border-left:1px solid #e2e8e0; padding-left:30px; }
.nav-column h2 { font-size:11px; line-height:1.5; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 17px; }
.nav-column a { display:flex; gap:10px; align-items:center; justify-content:space-between; min-height:48px; padding:12px 10px; margin:0 -10px 3px; border-radius:9px; color:var(--ink); transition:background 160ms ease,color 160ms ease; }
.nav-column a:hover,.nav-column a:focus-visible { background:#eaf1eaaa; color:var(--green); }
.nav-column a[aria-current=page] { background:#eaf1ea; color:var(--green); }
.nav-column strong { font-size:15px; font-weight:500; line-height:1.35; display:block; }
.nav-column small { display:block; font-size:12px; line-height:1.6; color:var(--muted); margin-top:4px; max-width:270px; }
.nav-column a>.icon { width:16px; height:16px; flex-shrink:0; color:var(--green); }
.mobile-navigation { display:none; }
.breadcrumbs { padding-top:26px; padding-bottom:0; font-size:13px; line-height:1.6; color:var(--muted); }
.breadcrumbs ol { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 12px; padding:0; margin:0; list-style:none; }
.breadcrumbs li+li::before { content:'/'; padding-right:12px; color:#88928b; }
.breadcrumbs a { color:var(--muted); }
.breadcrumbs a:hover { color:var(--green); }
.breadcrumbs [aria-current=page] { color:var(--green); }
.business-section .setup-window .setup-caption { font-size:11px; line-height:1.5; max-width:none; padding:12px 10px 0; border-top:1px solid #dce3dc; margin-top:0; }
.overview-links { display:flex; gap:18px 32px; flex-wrap:wrap; padding-top:8px; padding-bottom:44px; }
.overview-links a { display:flex; align-items:center; gap:9px; min-height:44px; font-size:15px; }
.detail-hero { display:grid; grid-template-columns:1fr 1.05fr; align-items:center; gap:48px; padding-top:50px; padding-bottom:62px; }
.detail-hero h1 { font-size:clamp(34px,3.5vw,52px); line-height:1.1; letter-spacing:-.04em; text-wrap:balance; }
.detail-hero .detail-lead { font-size:18px; line-height:1.7; color:var(--muted); max-width:570px; margin:24px 0; }
.detail-hero .section-label { margin-bottom:18px; }
.detail-hero figure { margin:0; min-width:0; }
.detail-hero img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; mix-blend-mode:multiply; }
.detail-hero figcaption { font-size:11px; color:var(--muted); margin-top:10px; text-align:right; }
.detail-reading { display:grid; grid-template-columns:240px minmax(0,1fr); column-gap:64px; align-items:start; border-top:1px solid var(--line); padding-top:44px; padding-bottom:75px; }
.page-contents { position:sticky; top:116px; max-height:calc(100dvh - 140px); overflow:auto; border-radius:12px; padding:20px 18px; background:#f0f4ef99; border:1px solid #e6ece3; }
.page-contents h2 { font-size:13px; letter-spacing:0; line-height:1.5; font-weight:500; margin-bottom:12px; }
.page-contents a { display:block; font-size:13px; line-height:1.6; padding:10px 0; color:var(--muted); border-top:1px solid #dfe6dc; }
.page-contents a:hover { color:var(--green); }
.detail-body { max-width:760px; }
.detail-body>section { padding-bottom:35px; margin-bottom:35px; border-bottom:1px solid var(--line); scroll-margin-top:116px; }
.detail-body>section:last-child { margin:0; padding:0; border:0; }
.detail-body h2 { font-size:27px; line-height:1.25; letter-spacing:-.02em; margin:0 0 19px; text-wrap:balance; }
.detail-body p,.detail-body li { font-size:16px; line-height:1.85; color:var(--muted); }
.detail-body ul { padding-left:22px; margin-top:19px; }
.detail-body li { padding-left:3px; margin-bottom:7px; }
.detail-body li::marker { color:var(--green); }
.related-reading { border-top:1px solid var(--line); padding-top:35px; padding-bottom:45px; display:grid; grid-template-columns:240px 1fr; gap:64px; }
.related-reading h2 { font-size:18px; letter-spacing:0; }
.related-reading nav { display:flex; flex-wrap:wrap; gap:14px 28px; }
.related-reading a { display:flex; align-items:center; gap:10px; font-size:14px; min-height:44px; }
.footer-directory { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:36px; padding:35px 0 40px; border-top:1px solid var(--line); }
.footer-directory h2 { font-size:14px; letter-spacing:0; margin:0 0 13px; font-weight:600; }
.footer-directory a { display:block; font-size:12px; line-height:1.5; color:var(--muted); padding:8px 0; }
.footer-directory a:hover { color:var(--green); }
@keyframes nav-reveal { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:1200px) { .primary-nav { gap:22px; } .header-actions { gap:18px; } .nav-group>summary { font-size:14px; } .detail-reading,.related-reading { gap:40px; } }
@media(max-width:1050px) {
  .primary-nav,.header-demo,.header-actions .login-link { display:none; }
  .header-actions { margin-left:auto; }
  .mobile-navigation { display:block; }
  .mobile-navigation>.menu-toggle { display:flex; list-style:none; cursor:pointer; min-width:44px; min-height:44px; }
  .mobile-menu { display:block; inset:auto var(--gutter); top:calc(100% + 8px); padding:18px 24px; border:1px solid #dce5dc; border-radius:16px; background:#fcfcfafc; box-shadow:0 18px 38px -20px #13211d44; max-height:calc(100dvh - 112px); overflow:auto; position:absolute; }
  .mobile-menu>.nav-group { border-bottom:1px solid var(--line); }
  .mobile-menu .nav-group>summary { min-height:54px; justify-content:space-between; font-size:17px; }
  .mobile-menu .nav-panel { position:static; display:block; background:transparent; border:0; box-shadow:none; max-height:none; padding:7px 0 20px 12px; overflow:visible; }
  .mobile-menu .nav-column+.nav-column { border:0; padding-left:0; margin-top:20px; }
  .mobile-menu .nav-column h2 { margin:12px 0 7px; }
  .mobile-menu .nav-column a { padding:9px 8px; font-size:14px; margin:0 -8px; }
  .mobile-menu .nav-column small { max-width:none; }
  .mobile-utility { padding-top:12px; }
  .mobile-utility a { display:flex; justify-content:space-between; align-items:center; min-height:44px; padding:10px 0; font-size:15px; }
  .detail-hero { gap:28px; }
  .detail-reading { grid-template-columns:195px minmax(0,1fr); gap:30px; }
  .related-reading { grid-template-columns:195px 1fr; gap:30px; }
}
@media(max-width:700px) {
  .site-header { gap:8px; }
  .header-actions { gap:8px; }
  .mobile-menu { inset:auto 12px; top:calc(100% + 6px); padding:12px 20px; }
  .breadcrumbs { font-size:12px; padding-top:20px; }
  .detail-hero { display:block; padding-top:35px; padding-bottom:34px; }
  .detail-hero h1 { font-size:35px; }
  .detail-hero .detail-lead { font-size:16px; line-height:1.8; margin:20px 0 28px; }
  .detail-hero figure { max-width:500px; margin-inline:auto; }
  .detail-hero figcaption { text-align:center; }
  .detail-reading { display:block; padding-top:25px; padding-bottom:45px; }
  .page-contents { position:static; max-height:none; padding:18px 20px; margin-bottom:38px; }
  .page-contents a { font-size:14px; min-height:44px; }
  .detail-body h2 { font-size:25px; }
  .detail-body p,.detail-body li { font-size:16px; }
  .related-reading { display:block; padding-top:28px; padding-bottom:34px; }
  .related-reading h2 { margin-bottom:18px; }
  .related-reading nav { display:block; }
  .related-reading a { padding-block:8px; }
  .footer-directory { grid-template-columns:1fr 1fr; gap:24px; }
  .footer-directory a { font-size:13px; padding-block:10px; }
}
@media(prefers-reduced-motion:reduce) { .nav-group[open]>.nav-panel { animation:none; } .nav-group>summary>.icon,.nav-column a { transition:none; } }
@media(prefers-reduced-transparency:reduce) { .glass-surface,.site-header { backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--paper); } }
@media(forced-colors:active) {
  .glass-surface,.nav-panel,.page-contents,.site-header,.setup-window { background:Canvas; color:CanvasText; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; border:1px solid CanvasText; }
  .nav-column a,.nav-column small,.page-contents a { color:LinkText; }
  .nav-group[open]>summary { color:LinkText; text-decoration-color:LinkText; }
}
@media print { .breadcrumbs,.page-contents,.related-reading { display:none; } .detail-reading { display:block; } .detail-hero img { max-height:160px; } }
/* Real, declassified software screenshots. Native controls work without JS. */
.product-appearance { padding-block: 76px; }
.appearance-heading { display: grid; grid-template-columns: 1.1fr 1fr; align-items: end; gap: 48px; margin-bottom: 28px; }
.appearance-heading h2 { margin: 14px 0 0; font-size: clamp(32px, 3.3vw, 52px); font-weight: 550; letter-spacing: -.04em; line-height: 1.12; }
.appearance-heading > p { margin: 0; color: var(--muted); max-width: 500px; font-size: 17px; line-height: 1.65; }
.appearance-switch { border: 0; padding: 0; margin: 0; min-width: 0; }
.appearance-switch legend, .appearance-radio { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.appearance-switch > label { display: inline-flex; justify-content: center; min-height: 44px; min-width: 92px; align-items: center; border: 1px solid #d7e1db; border-radius: 999px; padding: 0 22px; margin: 0 6px 22px 0; cursor: pointer; color: #425e50; background: #fff; font-size: 14px; }
.appearance-radio:checked + label { background: #17624c; border-color: #17624c; color: #fff; }
.appearance-radio:focus-visible + label { outline: 3px solid #258166; outline-offset: 4px; }
.appearance-frames { border: 1px solid #d7e1db; border-radius: 22px; overflow: hidden; background: #f2f5f4; box-shadow: 0 16px 48px rgba(22, 43, 34, .06); }
.appearance-frame { margin: 0; }
.appearance-frame img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; }
.appearance-dark { display: none; }
#appearance-dark:checked ~ .appearance-frames .appearance-light { display: none; }
#appearance-dark:checked ~ .appearance-frames .appearance-dark { display: block; }
.appearance-note { color: var(--muted); font-size: 12px; line-height: 1.65; margin: 18px 0; }
.appearance-next { display: inline-flex; align-items: center; gap: 12px; color: #17624c; min-height: 44px; }
@media (forced-colors: active) {
  .appearance-radio:checked + label { outline: 2px solid Highlight; outline-offset: 3px; }
  .appearance-radio:focus-visible + label { outline-style: dashed; }
}
@media (max-width: 760px) {
  .product-appearance { padding-block: 48px; }
  .appearance-heading { grid-template-columns: 1fr; gap: 20px; }
  .appearance-frames { border-radius: 12px; }
  .appearance-heading > p { font-size: 16px; }
}