@layer site {
/* Shared newsletter and client availability notice, maintained for the static site. */
.newsletter-signup { box-sizing: border-box; width: 100%; max-width: 48rem; margin: 2rem auto; padding: clamp(1.5rem, 4vw, 3rem); background: #fff; color: #282828; border-radius: 1rem; font-family: 'IBM Plex Sans', sans-serif; }
.newsletter-signup h3 { color: #a82d60; font-size: clamp(1.6rem, 3vw, 2rem); font-weight: 700; line-height: 1.25; margin: 0 0 1.5rem; }
.newsletter-signup label { display: block; font-weight: 700; margin-bottom: .5rem; }
.newsletter-signup-fields { display: flex; gap: .75rem; }
.newsletter-signup input[type=email] { box-sizing: border-box; min-width: 0; width: 100%; flex: 1; padding: .75rem; border: 2px solid #147d98; border-radius: .75rem; background: #fff; color: #282828; font: inherit; }
.newsletter-signup button, .availability-actions a { border: 0; border-radius: .75rem; background: #147d98; color: #fff; padding: .75rem 1.25rem; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.newsletter-signup p { margin-top: 1.5rem; font-size: .875rem; line-height: 1.6; }
.newsletter-signup :focus-visible, .availability-dialog :focus-visible { outline: 3px solid #a82d60; outline-offset: 4px; }
.availability-note { max-width: 64rem; margin: 1.5rem auto; padding: 1rem 1.5rem; border-left: 5px solid #e66c9b; background: #fff6df; color: #282828; font: 1rem/1.6 'IBM Plex Sans', sans-serif; }
.availability-dialog { box-sizing: border-box; position: fixed; inset: 0; width: min(36rem, calc(100% - 2rem)); max-height: calc(100% - 2rem); margin: auto; padding: clamp(1.5rem, 5vw, 3rem); overflow: auto; border: 0; border-top: .5rem solid #ffd866; border-radius: 1rem; background: #fff; color: #282828; box-shadow: 0 1.5rem 5rem #0006; font: 1.125rem/1.6 'IBM Plex Sans', sans-serif; }
.availability-dialog:not([open]) { display: none; }
.availability-dialog::backdrop { background: rgb(35 35 35 / 72%); }
.availability-dialog h2 { color: #a82d60; margin: 0 0 1rem; font-size: 2rem; line-height: 1.2; font-weight: 700; }
.availability-dialog p { margin: 1rem 0; }
.availability-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; margin-top: 1.5rem; }
.availability-actions button { font: inherit; background: transparent; border: 0; padding: .5rem 0; color: #333; text-decoration: underline; cursor: pointer; }
html:has(.availability-dialog[open]) { overflow: hidden; }
@media (max-width: 480px) { .newsletter-signup-fields { flex-direction: column; } .newsletter-signup button { min-height: 48px; } }

}
