.ir-newsletter, .ir-newsletter * { box-sizing: border-box; } .ir-newsletter { --ir-navy: #172b2a; --ir-teal: #b23c1c; --ir-teal-dark: #a53519; --ir-bg: #eeeee5; --ir-white: #FFFFFF; --ir-text: #172b2a; --ir-muted: #53605b; --ir-border: #d9dbcf; --ir-teal-pale: #e8ebdf; position: relative; isolation: isolate; overflow: hidden; width: 100%; padding: 78px 24px 64px; color: var(--ir-text); background: var(--ir-bg); font-family: Inter, Arial, sans-serif; } .ir-newsletter::before { content: ""; position: absolute; z-index: -1; top: -190px; right: -120px; width: 570px; height: 570px; border: 52px solid rgba(15, 157, 145, 0.055); border-radius: 50%; box-shadow: inset 0 0 0 52px rgba(15, 157, 145, 0.045), inset 0 0 0 104px rgba(15, 157, 145, 0.03); } .ir-newsletter__inner { width: min(1200px, 100%); margin: 0 auto; } .ir-newsletter__header { max-width: 990px; margin: 0 auto 34px; text-align: center; } .ir-newsletter__eyebrow, .ir-newsletter__form-eyebrow { margin: 0 0 14px; color: var(--ir-teal-dark); font-family: Manrope, Arial, sans-serif; font-size: 13px; font-weight: 800; line-height: 1.35; letter-spacing: 0.18em; text-transform: uppercase; } .ir-newsletter h2, .ir-newsletter h1 { margin: 0; color: var(--ir-navy); font-family: Manrope, Arial, sans-serif; font-size: clamp(36px, 4.4vw, 61px); font-weight: 800; line-height: 1.08; letter-spacing: -0.04em; } .ir-newsletter__intro { max-width: 920px; margin: 18px auto 0; color: var(--ir-muted); font-size: 19px; line-height: 1.62; } .ir-newsletter__panel { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); overflow: hidden; background: var(--ir-white); border: 1px solid var(--ir-border); border-radius: 13px; box-shadow: 0 14px 36px rgba(11, 31, 51, 0.055); } .ir-newsletter__benefits, .ir-newsletter__form-wrap { padding: 42px 46px; } .ir-newsletter__benefits { display: grid; align-content: center; gap: 26px; } .ir-newsletter__benefit { display: grid; grid-template-columns: 76px 1fr; gap: 22px; align-items: center; } .ir-newsletter__icon { display: grid; width: 76px; height: 76px; place-items: center; color: var(--ir-teal); background: var(--ir-teal-pale); border-radius: 50%; } .ir-newsletter__icon svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .ir-newsletter__benefit h3 { margin: 0 0 5px; color: var(--ir-navy); font-family: Manrope, Arial, sans-serif; font-size: 22px; font-weight: 800; line-height: 1.25; } .ir-newsletter__benefit p, .ir-newsletter__promise, .ir-newsletter__microcopy { margin: 0; color: var(--ir-muted); font-size: 15px; line-height: 1.55; } .ir-newsletter__promise { padding-top: 22px; border-top: 1px solid var(--ir-border); } .ir-newsletter__form-wrap { align-self: stretch; border-left: 1px solid var(--ir-border); } .ir-newsletter__form-wrap h3 { margin: 0 0 28px; color: var(--ir-navy); font-family: Manrope, Arial, sans-serif; font-size: clamp(27px, 2.6vw, 36px); font-weight: 800; line-height: 1.18; letter-spacing: -0.025em; } .ir-newsletter__form label.ir-newsletter__label { display: block; margin-bottom: 9px; color: var(--ir-navy); font-family: Manrope, Arial, sans-serif; font-size: 15px; font-weight: 800; } .ir-newsletter__email { display: block; width: 100%; min-height: 58px; padding: 0 18px; color: var(--ir-text); background: var(--ir-white); border: 1px solid #B9CAD8; border-radius: 8px; outline: none; font: inherit; font-size: 16px; transition: border-color 160ms ease, box-shadow 160ms ease; } .ir-newsletter__email::placeholder { color: #8294A6; } .ir-newsletter__email:focus { border-color: var(--ir-teal); box-shadow: 0 0 0 4px rgba(15, 157, 145, 0.12); } .ir-newsletter__consent { display: grid; grid-template-columns: 20px 1fr; gap: 11px; align-items: start; margin: 18px 0 22px; color: var(--ir-muted); font-size: 13px; line-height: 1.5; } .ir-newsletter__consent input { width: 19px; height: 19px; margin: 1px 0 0; accent-color: var(--ir-teal); } .ir-newsletter__consent a { color: var(--ir-teal-dark); text-decoration: underline; text-underline-offset: 2px; } .ir-newsletter__submit { display: inline-flex; width: 100%; min-height: 58px; align-items: center; justify-content: center; gap: 12px; padding: 14px 24px; color: var(--ir-white); background: var(--ir-teal); border: 0; border-radius: 8px; box-shadow: 0 8px 20px rgba(15, 157, 145, 0.16); cursor: pointer; font-family: Manrope, Arial, sans-serif; font-size: 16px; font-weight: 800; transition: background 160ms ease, transform 160ms ease; } .ir-newsletter__submit:hover { background: var(--ir-teal-dark); transform: translateY(-1px); } .ir-newsletter__submit:focus-visible { outline: 3px solid rgba(15, 157, 145, 0.28); outline-offset: 3px; } .ir-newsletter__submit:disabled { cursor: wait; opacity: 0.72; transform: none; } .ir-newsletter__microcopy { margin-top: 13px; text-align: center; font-size: 13px; } .ir-newsletter__info { display: flex; gap: 13px; align-items: center; margin-top: 18px; padding: 16px 22px; color: var(--ir-muted); background: var(--ir-teal-pale); border: 1px solid rgba(15, 157, 145, 0.22); border-radius: 9px; font-size: 14px; line-height: 1.45; } .ir-newsletter__info svg { width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: var(--ir-teal); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .ir-newsletter__honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; } @media (max-width: 860px) { .ir-newsletter { padding: 58px 18px 48px; } .ir-newsletter__panel { grid-template-columns: 1fr; } .ir-newsletter__benefits, .ir-newsletter__form-wrap { padding: 34px 28px; } .ir-newsletter__form-wrap { border-top: 1px solid var(--ir-border); border-left: 0; } } @media (max-width: 520px) { .ir-newsletter { padding-inline: 14px; } .ir-newsletter__header { margin-bottom: 25px; } .ir-newsletter h2, .ir-newsletter h1 { font-size: 36px; } .ir-newsletter__intro { font-size: 16px; } .ir-newsletter__benefits, .ir-newsletter__form-wrap { padding: 28px 20px; } .ir-newsletter__benefit { grid-template-columns: 58px 1fr; gap: 15px; } .ir-newsletter__icon { width: 58px; height: 58px; } .ir-newsletter__icon svg { width: 29px; height: 29px; } .ir-newsletter__benefit h3 { font-size: 18px; } }

@media(max-width:760px){.ir-newsletter__panel{display:flex;flex-direction:column}.ir-newsletter__form-wrap{order:-1}.ir-newsletter__header{margin-bottom:24px}.ir-newsletter__benefits{margin-top:28px}}