/* Contact Us forms (MyRunTime Website V1). Scoped to .cf-page; generic rules use
   :where(.cf-page) to keep their original specificity. */
:where(.cf-page){font-family:"DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;font-size:16px;line-height:1.5;color:rgb(43, 47, 51);letter-spacing:normal;font-weight:400;font-style:normal;text-rendering:auto;-webkit-font-smoothing:antialiased;font-feature-settings:normal}
:where(.cf-page) *,:where(.cf-page) *::before,:where(.cf-page) *::after{box-sizing:border-box}
:where(.cf-page) *,*:where(.cf-page),:where(.cf-page) ::before,:where(.cf-page) ::after{box-sizing: border-box;}
:where(.cf-page) button{font-family: inherit; cursor: pointer;}
:where(.cf-page) button,:where(.cf-page) select,:where(.cf-page) label[for]{touch-action: manipulation; -webkit-tap-highlight-color: rgba(5, 41, 65, 0.12);}
.cf-wrap{max-width: 1000px; margin: 0px auto;}
.cf{display: grid; grid-template-columns: 0.85fr 1.15fr; background: rgb(255, 255, 255); border: 0.8px solid rgb(211, 222, 231); border-radius: 10px; box-shadow: rgba(5, 41, 65, 0.08) 0px 8px 24px; overflow: hidden; font-family: inherit; color: rgb(5, 41, 65);}
.cf-side{background: radial-gradient(60% 80% at 90% 0px, rgba(30, 78, 101, 0.9), transparent 70%), rgb(4, 36, 58); color: rgb(255, 255, 255); padding: 40px 32px;}
.cf-eb{margin: 0px 0px 8px; font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(252, 107, 37);}
.cf-side h1{margin: 0px 0px 14px; font-size: 32px; line-height: 40px; font-weight: 700; color: rgb(255, 255, 255);}
.cf-sp{margin: 0px 0px 24px; color: rgb(207, 219, 228); line-height: 26px;}
.cf-side ul{list-style: none; margin: 0px; padding: 0px; display: grid; gap: 12px; font-weight: 700;}
.cf-side li{display: flex; gap: 10px;}
.cf-side li span{color: rgb(252, 107, 37);}
.cf-main{padding: 36px 32px;}
.cf-f{margin: 0px 0px 18px; min-width: 0px;}
.cf-g2{display: grid; grid-template-columns: 1fr 1fr; gap: 0px 18px;}
.cf-l{display: block; margin: 0px 0px 8px; font-size: 14px; font-weight: 700; color: rgb(5, 41, 65);}
.cf .req{color: rgb(252, 107, 37); margin-left: 2px;}
.cf-in{display: block; width: 100%; height: 46px; padding: 0px 14px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; color: rgb(5, 41, 65); background: rgb(255, 255, 255); border: 1px solid rgb(207, 219, 228); border-radius: 8px; box-sizing: border-box;}
textarea.cf-in{height: auto; min-height: 92px; padding: 12px 14px; resize: vertical; line-height: 1.5;}
.cf-in::placeholder{color: rgb(169, 186, 198); opacity: 1;}
.cf-in:focus{outline: none; border-color: rgb(5, 41, 65); box-shadow: rgba(5, 41, 65, 0.15) 0px 0px 0px 3px;}
.cf .is-invalid{border-color: rgb(198, 40, 40) !important;}
.cf-err{margin: 6px 0px 0px; font-size: 13px; font-weight: 600; color: rgb(198, 40, 40);}
.cf-err:empty{display: none;}
.cf-sms{display: flex; gap: 8px;}
.cf-cc{position: relative; display: flex; align-items: center; gap: 6px; height: 46px; padding: 0px 12px; border: 1px solid rgb(207, 219, 228); border-radius: 8px; background: rgb(255, 255, 255); font-weight: 700; font-size: 14px; flex: 0 0 auto; cursor: pointer;}
.cf-cc select{position: absolute; inset: 0px; width: 100%; height: 100%; opacity: 0; cursor: pointer;}
.cf-caret{font-size: 11px;}
.cf-chips{display: flex; flex-wrap: wrap; gap: 8px;}
.cf-chip{position: relative; cursor: pointer;}
.cf-chip input{position: absolute; opacity: 0; inset: 0px; width: 100%; height: 100%; margin: 0px; cursor: pointer;}
.cf-chip span{display: inline-flex; align-items: center; min-height: 44px; padding: 0px 16px; border: 1.5px solid rgb(207, 219, 228); border-radius: 999px; font-weight: 700; font-size: 14px; background: rgb(255, 255, 255); color: rgb(5, 41, 65); transition: background-color 0.15s, color 0.15s, border-color 0.15s;}
.cf-chip input:checked + span{background: rgb(5, 41, 65); color: rgb(255, 255, 255); border-color: rgb(5, 41, 65);}
.cf-chip input:focus-visible + span{outline: rgb(252, 107, 37) solid 2px; outline-offset: 2px;}
.cf-submit{display: inline-flex; align-items: center; background: rgb(5, 41, 65); color: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 700; font-size: 15px; padding: 0px 0px 0px 22px; border: 0px; border-radius: 8px; overflow: hidden; cursor: pointer; margin-top: 6px;}
.cf-submit i{display: grid; place-items: center; width: 52px; height: 52px; background: rgb(252, 107, 37); margin-left: 16px;}
.cf-ok{text-align: center; padding: 40px 8px;}
.cf-ok h2{margin: 0px 0px 10px; font-size: 26px;}
.cf-ok p{margin: 0px 0px 22px; color: rgb(30, 78, 101);}
@media (max-width: 860px){.cf{grid-template-columns: 1fr;}
.cf-side{padding: 28px 22px;}
.cf-side h1{font-size: 26px; line-height: 32px;}
.cf-main{padding: 26px 20px;}
.cf-g2{grid-template-columns: 1fr;}
}
/* ---- page wrapper (the mockup's .events-bg / .events containers) ---- */
.cf-page{background:#EFF4F8;padding:32px 16px 48px;min-height:calc(100vh - 5rem)}
/* ---- Brevo submission states (not in the mockup) ---- */
.cf-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-submit[disabled]{opacity:.7;cursor:progress}
.cf-alert{margin:0 0 18px;padding:12px 14px;border:1px solid #f3c2c2;border-radius:8px;background:#fdecec;color:#c62828;font-size:14px;font-weight:600}
.cf-alert[hidden]{display:none}