/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 14 2026 | 04:55:08 */
  /* ===== Jyoti Gurukul directory — scoped design tokens ===== */
  .jg-directory {
    --jg-ink: #2a2118;
    --jg-muted: #8a7f6c;
    --jg-paper: #faf6ee;
    --jg-card: #ffffff;
    --jg-line: #e8ddc7;
    --jg-third: #6e2a33;   /* wine — Third Year */
    --jg-third-tint: #f7ebec;
    --jg-second: #2f5d55;  /* deep teal — Second Year */
    --jg-second-tint: #eaf1ef;
    --jg-first: #8a6a23;   /* antique gold — First Year */
    --jg-first-tint: #f8f1e2;

    margin: 0 auto;
	max-width: 1200px;
/* 	background: var(--jg-paper); */
    padding: 64px 20px;
    color: var(--jg-ink);
  }

  .jg-directory__intro { margin-bottom: 40px; text-align: center; }
  .jg-directory__eyebrow {
    margin: 0 0 6px;
    font-family: "Source Serif 4", Georgia, serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--jg-third);
  }
  .jg-directory__title {
    margin: 0 0 10px;
    font-family: "Fraunces", Georgia, "Times New Roman", serif;
    font-weight: 600;
    font-size: clamp(28px, 4vw, 40px);
    letter-spacing: -0.01em;
  }
  .jg-directory__sub { margin: 0; color: black; font-size: 15.5px; }

  /* ---- Group block ---- */
  .jg-group { margin-bottom: 44px; }
  .jg-group:last-child { margin-bottom: 0; }

  .jg-group__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    margin-bottom: 14px;
    border-bottom: 2px solid var(--jg-accent, var(--jg-third));
  }
  .jg-group--third  { --jg-accent: var(--jg-third); }
  .jg-group--second { --jg-accent: var(--jg-second); }
  .jg-group--first  { --jg-accent: var(--jg-first); }

  .jg-group__title {
    margin: 0;
    font-family: "Fraunces", Georgia, serif;
    font-weight: 600;
    font-size: 22px;
    color: var(--jg-accent);
  }
  .jg-group__count {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12.5px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: black;
  }

  /* ---- Table shell ---- */
  .jg-table-wrap {
    background: var(--jg-card);
    border: 1px solid var(--jg-line);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(42, 33, 24, .04);
  }

  .jg-table { width: 100%; border-collapse: collapse; }

  .jg-table thead th {
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--jg-accent);
    background: color-mix(in srgb, var(--jg-accent) 8%, var(--jg-card));
    padding: 13px 18px;
    border-bottom: 1px solid var(--jg-line);
  }

  .jg-table tbody tr { border-bottom: 1px solid var(--jg-line); transition: background-color .15s ease; }
  .jg-table tbody tr:last-child { border-bottom: none; }
  .jg-table tbody tr:nth-child(even) { background: color-mix(in srgb, var(--jg-accent) 4%, var(--jg-card)); }
  .jg-table tbody tr:hover { background: color-mix(in srgb, var(--jg-accent) 10%, var(--jg-card)); }

  .jg-table td { padding: 12px 18px; vertical-align: middle; font-size: 14.5px; }

  .jg-col-no { width: 56px; }
  .jg-rownum {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px; height: 24px;
    border-radius: 50%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--jg-accent);
    border: 1px solid color-mix(in srgb, var(--jg-accent) 40%, transparent);
  }

  /* ---- Person cell ---- */
  .jg-person { display: flex; align-items: center; gap: 12px; }
  .jg-avatar {
    flex: 0 0 auto;
    width: 34px; height: 34px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: "Fraunces", Georgia, serif;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background: var(--jg-accent);
  }
  .jg-person__text { display: flex; flex-direction: column; line-height: 1.35; }
  .jg-person__name { font-weight: 600; }
  .jg-person__dob {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: black;
  }

  /* ---- Feast pill ---- */
  .jg-feast {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--jg-accent);
    background: color-mix(in srgb, var(--jg-accent) 12%, var(--jg-card));
    white-space: nowrap;
  }
  .jg-feast--none {
    color: var(--jg-muted);
    background: color-mix(in srgb, var(--jg-muted) 12%, var(--jg-card));
  }

  /* ---- Parish / diocese cell ---- */
  .jg-place__parish { display: block; font-weight: 600; }
  .jg-place__diocese {
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: black;
    margin-top: 2px;
  }

  /* ===== Responsive: stack into cards below 700px ===== */
  @media (max-width: 700px) {
    .jg-table thead { display: none; }
    .jg-table, .jg-table tbody, .jg-table tr, .jg-table td { display: block; width: 100%; }
    .jg-table tbody tr {
      padding: 14px 16px;
      border-bottom: 1px solid var(--jg-line);
    }
    .jg-table td {
      padding: 6px 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0px;
      font-size: 14px;
    }
    .jg-table td[data-label]::before {
      content: attr(data-label);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: var(--jg-muted);
      flex: 0 0 auto;
    }
    .jg-col-no { display: none !important; }
    .jg-table td[data-label="Formee"]::before { display: none; }
    .jg-table td[data-label="Formee"] { justify-content: flex-start; }
    .jg-table td[data-label="Parish & Diocese"] { flex-direction: column; align-items: flex-start; }
  }
