/* Sections 40-45 (dark violet "cosmic" family): 40 advice card with floating quote cards (quote mark is an SVG icon, not an image),
   41 six feature cards, 42 two-ways cards with a legend in the border, 43 "what you get" panel, 44 text + photo, 45 glowing box.
   Sizes, colours, radii measured on the reference at 1440; copy, photos and icons are PLACEHOLDERS. Font: Noto Sans Hebrew.
   Colours are variables on .c-sn (page #050020, card #080226, violet #aa3df2). */
.c-sn { --sn-bg: #050020; --sn-card: #080226; --sn-violet: #aa3df2; --sn-line: #7a3fd1;
  background: var(--sn-bg); color: #fff; direction: rtl; font-family: "Noto Sans Hebrew", Arial, sans-serif; overflow-x: clip; }
.c-sn :where(h2, h3, p) { margin: 0; }
.c-sn-violet { color: var(--sn-violet); }
/* gradient border: a ::before layer with a 1px padding, masked so only the ring shows; violet on the left/right edges, transparent in the middle */
.c-sn-advice__card, .c-sn-card, .c-sn-get__item, .c-sn-glow__box { position: relative; isolation: isolate; }
.c-sn-advice__card::before, .c-sn-card::before, .c-sn-get__item::before, .c-sn-glow__box::before { content: ""; position: absolute; inset: 0; z-index: -1; padding: 1px; border-radius: 25px;
  background: linear-gradient(to right, #aa3df2 0%, #aa3df2 8%, #0000 35%, #0000 65%, #aa3df2 92%, #aa3df2 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude; pointer-events: none; }

/* -- 40 advice -- */
.c-sn-advice__section { position: relative; isolation: isolate; min-height: 1006px; padding: 114px 16px 0;
  background-image: radial-gradient(60% 40% at 50% 100%, #3b1f6a99 0%, #3b1f6a00 100%), radial-gradient(40% 30% at 20% 85%, #2a1a5266 0%, #0000 100%), radial-gradient(40% 30% at 85% 90%, #35205e66 0%, #0000 100%); }
.c-sn-advice__card { position: relative; z-index: 1; box-sizing: border-box; width: min(855px, 100%); min-height: 444px; margin: 0 auto; padding: 75px 15px 25px; border-radius: 25px; background: var(--sn-card); text-align: center; }
.c-sn-advice__title { font-size: 35px; font-weight: 700; line-height: 35px; margin-bottom: 26px; }
.c-sn-advice__card p { margin: 0 auto; font-size: 17px; font-weight: 400; line-height: 28.9px; }
.c-sn-advice__card .c-sn-advice__accent { margin-top: 22px; color: var(--sn-violet); font-size: 40px; font-weight: 600; line-height: 40px; }
.c-sn-advice__after { position: relative; z-index: 1; width: min(539px, 100%); margin: 48px auto 0; text-align: center; }
.c-sn-advice__after p { font-size: 17px; font-weight: 400; line-height: 28.9px; margin-bottom: 4px; }
.c-sn-advice__after b { font-weight: 700; }
.c-sn-qcard { position: absolute; z-index: 2; display: none; align-items: center; justify-content: center; box-sizing: border-box; width: 224px; height: 125px; padding: 16px 20px; border: 1px solid #8a2be2; border-radius: 22px 40px 40px 0; background: #1a0f4a; box-shadow: 0 0 18px #aa3df29e, 0 0 4px #c06cff80; font-size: 15px; font-weight: 700; line-height: 22px; text-align: center; overflow: hidden; }
.c-sn-qcard span { position: relative; z-index: 1; }
.c-sn-qcard__mark { position: absolute; left: 50%; top: 50%; width: 76px; height: 58px; color: #2d1672; transform: translate(-42%, -52%); }
.c-sn-qcard--tl { left: 163px; top: 30px; }
.c-sn-qcard--tr { right: 164px; top: 153px; }
.c-sn-qcard--bl { left: 152px; top: 397px; }
.c-sn-qcard--br { right: 153px; top: 520px; }
@media (min-width: 1280px) { .c-sn-qcard { display: flex; } }

/* -- 41 reality -- */
.c-sn-reality__section { padding: 50px 16px 60px; }
.c-sn-reality__title { font-size: 45px; font-weight: 600; line-height: 45px; text-align: center; }
.c-sn-reality__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 25px 20px; width: min(1140px, 100%); margin: 55px auto 0; }
.c-sn-card { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; box-sizing: border-box; width: 360px; max-width: 100%; padding: 15px; border-radius: 25px; background: var(--sn-card); text-align: center; }
.c-sn-card--tall { min-height: 230px; padding-top: 28px; }
.c-sn-card--short { min-height: 172px; padding-top: 28px; }
.c-sn-card__icon { width: 64px; height: 64px; margin-bottom: 14px; }
.c-sn-card p { font-size: 17px; font-weight: 300; line-height: 28.9px; }

/* -- 42 two ways -- */
.c-sn-ways__section { display: flex; flex-direction: column; align-items: center; padding: 60px 16px 70px; }
.c-sn-ways__title { font-size: 45px; font-weight: 600; line-height: 45px; text-align: center; }
.c-sn-ways__box { position: relative; box-sizing: border-box; width: min(399px, 100%); margin-top: 60px; padding: 28px 15px 15px; border: .8px solid; border-radius: 25px; text-align: center; }
.c-sn-ways__box--red { border-color: #ff0c0c; }
.c-sn-ways__box--green { border-color: #00e400; }
.c-sn-ways__legend { position: absolute; top: 0; left: 50%; padding: 0 10px; background: var(--sn-bg); font-size: 25px; font-weight: 500; line-height: 25px; white-space: nowrap; transform: translate(-50%, -50%); }
.c-sn-ways__box--red .c-sn-ways__legend { color: #e40000; }
.c-sn-ways__box--green .c-sn-ways__legend { color: #00e400; }
.c-sn-ways__box p { font-size: 17px; font-weight: 300; line-height: 28.9px; }
.c-sn-ways__or { margin-top: 20px; font-size: 45px; font-weight: 600; line-height: 45px; }
.c-sn-ways__or + .c-sn-ways__box { margin-top: 40px; }

/* -- 43 what you get -- */
.c-sn-get__section { padding: 51px 16px 60px; }
.c-sn-get__panel { box-sizing: border-box; width: min(1140px, 100%); margin: 0 auto; padding: 26px 15px 30px; border: .8px solid var(--sn-violet); border-radius: 25px; }
.c-sn-get__title { color: var(--sn-violet); font-size: 45px; font-weight: 600; line-height: 45px; text-align: center; }
.c-sn-get__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 20px; }
.c-sn-get__item { display: flex; flex-direction: column; align-items: center; box-sizing: border-box; min-height: 312px; padding: 30px 15px 15px; border-radius: 25px; background: var(--sn-card); text-align: center; }
.c-sn-get__img { display: grid; place-items: center; width: 100%; max-width: 200px; height: 123px; border-radius: 12px; background: linear-gradient(150deg, #241a52, #3a2a7a); color: #ffffff99; font-size: 14px; }
.c-sn-get__item h3 { margin-top: 22px; color: var(--sn-violet); font-size: 21px; font-weight: 600; line-height: 21px; }
.c-sn-get__item p { margin-top: 16px; font-size: 16px; font-weight: 300; line-height: 27.2px; }

/* -- 44 awakening -- */
.c-sn-awake__section { padding: 35px 16px 55px; }
.c-sn-awake__inner { display: flex; flex-direction: column; gap: 32px; width: min(1120px, 100%); margin: 0 auto; }
.c-sn-awake__photo { position: relative; width: min(540px, 100%); aspect-ratio: 1; margin-inline: auto; overflow: hidden; }
.c-sn-awake__glow { position: absolute; inset: 0; background: radial-gradient(closest-side at 50% 38%, #b04ff6 0%, #a63fea 38%, #aa3df280 66%, #aa3df200 100%); -webkit-mask-image: radial-gradient(closest-side at 50% 45%, #000 70%, #0000 100%); mask-image: radial-gradient(closest-side at 50% 45%, #000 70%, #0000 100%); }
.c-sn-awake__head { position: absolute; left: 50%; top: 5%; width: 18%; height: 22%; border-radius: 50%; background: #1c2233; transform: translateX(-50%); }
.c-sn-awake__body { position: absolute; left: 50%; top: 26%; width: 66%; height: 60%; border-radius: 36% 36% 0 0; background: linear-gradient(#141a2b, #0b0f1c); transform: translateX(-50%); }
.c-sn-awake__base { position: absolute; left: 12%; right: 12%; bottom: 0; height: 26%; background: linear-gradient(#08022600 0%, #080226 28%); }
.c-sn-awake__text { max-width: 540px; margin-inline: auto; text-align: right; }
.c-sn-awake__title { margin-bottom: 18px; font-size: 38px; font-weight: 600; line-height: 38px; }
.c-sn-awake__text p { margin-top: 12px; font-size: 17px; font-weight: 300; line-height: 28.9px; }
@media (min-width: 900px) {
  .c-sn-awake__section { padding: 35px 0 0; }
  .c-sn-awake__inner { direction: ltr; flex-direction: row; align-items: center; justify-content: space-between; gap: 40px; height: 540px; }
  .c-sn-awake__inner > * { direction: rtl; }
  .c-sn-awake__photo { margin: 0; order: 1; }
  .c-sn-awake__text { flex: none; width: 540px; margin: 0; order: 2; }
}

/* -- 45 glowing box -- */
.c-sn-glow__section { padding: 60px 16px 70px; }
.c-sn-glow__box { position: relative; isolation: isolate; box-sizing: border-box; width: min(855px, 100%); margin: 0 auto; padding: 8px 16px 30px; border-radius: 25px; background: var(--sn-card); text-align: center; }
.c-sn-glow__title { display: inline-block; margin-top: 20px; color: var(--sn-violet); font-size: 40px; font-weight: 600; line-height: 40px; }
.c-sn-glow__text { width: min(619px, 100%); margin: 10px auto 0; font-size: 17px; font-weight: 300; line-height: 28.9px; }
.c-sn-glow__btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; box-sizing: border-box; min-width: 260px; margin-top: 22px; padding: 8px 28px 8px 8px; border: 0; border-radius: 999px; background: linear-gradient(90deg, #aa3df2, #7a3fd1); color: #fff; font: inherit; font-size: 18px; font-weight: 700; line-height: 26px; cursor: pointer; box-shadow: 0 10px 30px rgba(170, 61, 242, .4); transition: transform .2s; }
.c-sn-glow__btn:hover { transform: translateY(-2px); }
.c-sn-glow__arr { flex: none; width: 44px; height: 44px; border-radius: 50%; background: #fff; position: relative; }
.c-sn-glow__arr::after { content: ""; position: absolute; inset: 12px; background: #7a3fd1; -webkit-mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; }
.c-sn-glow__dlg { box-sizing: border-box; width: min(400px, calc(100vw - 32px)); padding: 0; border: 1px solid #7a3fd1; border-radius: 25px; background: var(--sn-card); color: #fff; direction: rtl; font-family: "Noto Sans Hebrew", Arial, sans-serif; box-shadow: 0 0 60px rgba(170, 61, 242, .45); }
.c-sn-glow__dlg::backdrop { background: rgba(5, 0, 32, .78); backdrop-filter: blur(4px); }
.c-sn-glow__form { text-align: start; position: relative; display: flex; flex-direction: column; padding: 44px 28px 28px; margin: 0; }
.c-sn-glow__dt { text-align: center; margin: 0 0 8px; color: var(--sn-violet); font-size: 30px; font-weight: 600; line-height: 1.2; text-align: center; }
.c-sn-glow__lbl { margin: 14px 0 6px; font-size: 17px; font-weight: 400; }
.c-sn-glow__in { box-sizing: border-box; width: 100%; height: 52px; padding: 0 16px; border: 1px solid #7a3fd1; border-radius: 14px; background: #0d0538; color: #fff; font: inherit; font-size: 18px; }
.c-sn-glow__in:focus { outline: 2px solid var(--sn-violet); outline-offset: 2px; }
.c-sn-glow__btn--full { width: 100%; margin-top: 26px; }
.c-sn-glow__x { position: absolute; top: 14px; inset-inline-start: 14px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #1a0b4a; cursor: pointer; }
.c-sn-glow__x::after { content: ""; position: absolute; inset: 10px; background: #fff; -webkit-mask: url(../assets/icons/ph-x-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-x-bold.svg) center / contain no-repeat; }
.c-sn-glow__price { width: min(619px, 100%); margin: 20px auto 0; font-size: 17px; font-weight: 300; line-height: 28.9px; }

/* -- tablet / phone -- */
@media (max-width: 1023px) {
  .c-sn-get__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .c-sn-advice__section { min-height: 0; padding-top: 40px; padding-bottom: 50px; }
  .c-sn-advice__card { padding: 40px 12px 24px; }
  .c-sn-advice__title { font-size: 28px; line-height: 32px; }
  .c-sn-advice__card .c-sn-advice__accent { font-size: 30px; line-height: 34px; }
  .c-sn-advice__card br { display: none; }
  .c-sn-reality__title, .c-sn-ways__title, .c-sn-ways__or, .c-sn-get__title { font-size: 34px; line-height: 38px; }
  .c-sn-get__grid { grid-template-columns: 1fr; }
  .c-sn-awake__title { font-size: 30px; line-height: 34px; }
  .c-sn-glow__title { font-size: 32px; line-height: 36px; }
  .c-sn-ways__legend { font-size: 21px; }
}
