/* site.css · ניגון י־ה
 * מה שונה מהאתרים הקודמים: הירו שהוא הציור של הלוגו בראש (בלי דיוקן), כרטיסי "מעגלים" עגולים
 * בצבעי הסמל, קו זהב דק כמפריד כמו בלוגו. בלי מסגרת קשת, בלי "שלוש דרכים".
 */

/* השם: "ניגון" באינדיגו, "י־ה" בלבנדר, כמו שסוכם בפגישה 2 */
.yah { color: var(--brand-ink); }

/* הירו: הציור קודם, בכל הרוחבים, עם קצוות שנמסים לרקע */
.hero-stacked .hero-grid { gap: var(--s-text); }
.hero-stacked .hero-media { order: -1; max-width: 46rem; margin-inline: auto; width: 100%; }
.hero-stacked .hero-media img {
  max-height: none; aspect-ratio: 1535 / 1024;
  -webkit-mask-image: radial-gradient(ellipse 72% 78% at 50% 46%, #000 62%, transparent 100%);
          mask-image: radial-gradient(ellipse 72% 78% at 50% 46%, #000 62%, transparent 100%);
}
.hero-stacked .hero-text { text-align: center; max-width: 42rem; margin-inline: auto; }
.hero-stacked .hero-text p { margin-inline: auto; }
.hero-stacked .hero-ctas { justify-content: center; }
.hero h1 { color: var(--ink); }
.hero h1::after {
  content: ""; display: block; width: 5rem; height: 1px; margin: var(--s-text) auto 0;
  background: var(--gold);
}

/* טקסט ותמונה זה לצד זה */
.split { display: grid; gap: var(--s-block); align-items: center; }
.split-text > * + * { margin-top: var(--s-text); }
.split-media img { width: 100%; border-radius: var(--radius-lg); object-fit: cover; aspect-ratio: 4 / 3; }
@media (min-width: 861px) { .split { grid-template-columns: 1.05fr .95fr; } }

/* ציטוט */
.sing .pull { border-inline-start: 2px solid var(--gold); padding-inline-start: var(--s-text); }
.sing .pull p { font-family: var(--ff-head); font-size: var(--fs-h3); color: var(--brand-ink); }
.sing .pull figcaption { color: var(--ink-soft); font-size: var(--fs-small); margin-top: var(--s-pair); }

/* המעגלים: הצבעים של הסמל. עצמי = אינדיגו, חבר = תכלת, אלוהים = סגול */
.rings { display: grid; gap: var(--s-text); grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.ring {
  background: var(--card); border-radius: var(--radius-lg); padding: 2rem 1.5rem 1.75rem;
  text-align: center; border: 1px solid var(--line); position: relative;
}
.ring::before {
  content: ""; display: block; width: 3.25rem; height: 3.25rem; margin: 0 auto var(--s-text);
  border-radius: 50%; border: 2px solid var(--ring, var(--brand));
  box-shadow: 0 0 0 .4rem color-mix(in srgb, var(--ring, var(--brand)) 18%, transparent);
}
.ring h3 { margin-bottom: var(--s-pair); }
.ring p { color: var(--ink-soft); margin: 0; }
.ring-self { --ring: var(--dark); }
.ring-friend { --ring: var(--sky); }
.ring-god { --ring: var(--brand); }

/* קצת עליי: התמונה לרוחב */
.about-media img { aspect-ratio: 4 / 3; }
.sign { font-family: var(--ff-head); font-size: var(--fs-h3); color: var(--brand-ink); }

/* צעדים: השעה בולטת */
.steps h3 { color: var(--brand-ink); }

/* לוגו: PNG שקוף. בפוטר הכהה בלבן */
.brand img { max-width: none; object-fit: contain; }
.site-foot .brand img { filter: brightness(0) invert(1); opacity: .92; }