/* 202-203 pain zebra brand sections (brand colour = section background). Prefixes c-pnf, c-png. */
/* 202 F: zebra red. bg #c8403f (white text 4.9:1), secondary text #fde8e8 (4.2:1), glass rows rgba(255,255,255,.14) + hairline rgba(255,255,255,.38), house type scale */
.c-pnf { position: relative; isolation: isolate; direction: rtl; font-family: "Noto Sans Hebrew", sans-serif; font-weight: 400; letter-spacing: 0; overflow: clip; background: #c8403f; color: #fff; }
.c-pnf :where(h2, ul, li, p) { margin: 0; padding: 0; list-style: none; }
.c-pnf b { font-weight: 800; }
.c-pnf::before { content: ""; position: absolute; z-index: -1; top: -140px; right: 50%; width: 520px; height: 440px; transform: translateX(50%); border-radius: 50%; background: rgba(255, 255, 255, .15); filter: blur(90px); }
.c-pnf__h { font-size: clamp(28px, 7.4vw, 36px); font-weight: 900; line-height: 1.18; text-wrap: balance; color: #fff; }
.c-pnf__mk { background: linear-gradient(180deg, transparent 62%, rgba(255, 255, 255, .3) 62% 92%, transparent 92%); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.c-pnf__mark { flex: none; border-radius: 50%; background: #fff; }
.c-pnf__sec { box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: 24px; width: min(1080px, 100%); margin-inline: auto; padding: 56px 20px 64px; text-align: center; }
.c-pnf__lead { font-size: 18px; line-height: 1.55; color: #fde8e8; }
.c-pnf__rows { display: flex; flex-direction: column; gap: 16px; width: 100%; }
.c-pnf__row { box-sizing: border-box; display: flex; align-items: center; gap: 16px; padding: 20px 20px; border: 1px solid rgba(255, 255, 255, .38); border-radius: 20px; background: rgba(255, 255, 255, .14); text-align: right; box-shadow: 0 8px 22px rgba(80, 10, 10, .28); }
.c-pnf__x { flex: none; width: 38px; height: 38px; border-radius: 50%; background: #fff; -webkit-mask: url(../assets/icons/ph-x-bold.svg) center / 19px 19px no-repeat, linear-gradient(#000, #000); -webkit-mask-composite: xor; mask: url(../assets/icons/ph-x-bold.svg) center / 19px 19px no-repeat, linear-gradient(#000, #000); mask-composite: exclude; }
.c-pnf__txt { font-size: 18px; line-height: 1.55; color: #fff; }
.c-pnf__but { font-size: 18px; line-height: 1.55; color: #fde8e8; }
.c-pnf__but b { color: #fff; }
.c-pnf__stuck { font-size: 24px; font-weight: 900; line-height: 1.3; color: #fff; }
@media (min-width: 900px) { .c-pnf__sec { gap: 28px; padding: 96px 32px 104px; } .c-pnf__h { font-size: clamp(38px, 3.3vw, 52px); } .c-pnf__lead { font-size: 22px; } .c-pnf__rows { flex-direction: row; gap: 24px; } .c-pnf__row { flex: 1 1 0; flex-direction: column; justify-content: center; gap: 20px; padding: 32px 26px; text-align: center; } .c-pnf__x { width: 48px; height: 48px; -webkit-mask-size: 24px 24px, auto; mask-size: 24px 24px, auto; } .c-pnf__txt { font-size: 20px; } .c-pnf__but { font-size: 20px; } .c-pnf__stuck { margin-top: 8px; font-size: 32px; } }

/* 203 G: zebra teal. bg #0f766e (white text 5.5:1), secondary #e0f5f1 (4.9:1), hairline rgba(255,255,255,.38), house type scale */
.c-png { position: relative; isolation: isolate; direction: rtl; font-family: "Noto Sans Hebrew", sans-serif; font-weight: 400; letter-spacing: 0; overflow: clip; background: #0f766e; color: #fff; }
.c-png :where(h2, ul, li, p) { margin: 0; padding: 0; list-style: none; }
.c-png b { font-weight: 800; }
.c-png::before { content: ""; position: absolute; z-index: -1; top: -140px; right: 50%; width: 520px; height: 440px; transform: translateX(50%); border-radius: 50%; background: rgba(255, 255, 255, .15); filter: blur(90px); }
.c-png__h { font-size: clamp(28px, 7.4vw, 36px); font-weight: 900; line-height: 1.18; text-wrap: balance; color: #fff; }
.c-png__mk { background: linear-gradient(180deg, transparent 62%, rgba(255, 255, 255, .3) 62% 92%, transparent 92%); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.c-png__mark { flex: none; border-radius: 50%; background: #fff; }
.c-png__sec { padding: 56px 20px 64px; }
.c-png__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; width: min(1160px, 100%); margin-inline: auto; }
.c-png__h { text-align: center; }
.c-png__list { display: flex; flex-direction: column; }
.c-png__p { padding: 22px 4px; font-size: 18px; line-height: 1.7; color: #e0f5f1; }
.c-png__p + .c-png__p, .c-png__stuck { border-top: 1px solid rgba(255, 255, 255, .38); }
.c-png__stuck { padding: 24px 4px 0; font-size: 22px; font-weight: 900; line-height: 1.3; color: #fff; }
@media (min-width: 900px) { .c-png__sec { padding: 96px 32px 104px; } .c-png__grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr); gap: 80px; align-items: center; } .c-png__h { font-size: clamp(38px, 3.3vw, 52px); text-align: right; } .c-png__p { padding: 26px 6px; font-size: 20px; } .c-png__stuck { padding: 30px 6px 0; font-size: 28px; } }
