/* Shared shapes for website cards and controls. */
:root{--card-radius:20px;--button-radius:999px}

.visual,
.product-visual,
.home-hero .product-hero.attendance-hero,
.extension-layout,
.field-extensions .extension-slide,
.attendance-risk,
.core-needs-prompt,
.home-expansion-section .process-grid>article>.process-visual-empty,
.service-page .service-overview-panel .product-overview,
.service-page .detail-lead>.product-detail,
.service-page .detail-grid .product-detail,
.review,
.plan-card,
.pricing-page .pricing-plan,
.custom-examples,
.core-menu-grid a,
.mobile-core-menu a,
.menu-extensions-box,
.legal-toc,
dialog{border-radius:var(--card-radius)}

.button,
.button.small,
.menu-consult-button,
.carousel-controls button,
.extension-navigation .carousel-controls button,
.segmented button,
.count-presets button{border-radius:var(--button-radius)}

/* Give the navigation popover a softer outer shape. */
.feature-menu{border-radius:28px}

/* Consistent outlines on gray card surfaces, without changing their size. */
.visual,
.product-visual,
.extension-layout,
.attendance-risk,
.core-needs-prompt,
.home-expansion-section .process-grid>article>.process-visual-empty,
.core-menu-grid a:not(:focus-visible),
.mobile-core-menu a:not(:focus-visible),
.menu-extensions-box:not(:focus-visible),
.legal-toc{
 outline:1px solid rgb(0 0 0 / 12%);
 outline-offset:0;
}

/* Keep the industry panel outline while leaving its inner cards borderless. */
.field-extensions :is(.case-panel,.rr-schedule,.rr-candidates,.sr-schedule,.sr-candidates){border:0}