/* Glilot site — blog family styles (archive, and the shared card + emblem that
   page-blog-category.php and page-blog-single.php also enqueue).
   Generated from validation/blog/css-src/blog.src.css: every D(px) is px / 1920 * 100vw
   (desktop frame 16587:1756), every M(px) is px / 390 * 100vw (mobile frame 16687:3055).
   Values are measured from the node named in each comment. */

/* Inline treatment (Figma colored-bold ranges): #537b88 / 700. The parent owns size. */
.glilot-blog-page .lp-text-highlight { color: var(--glilot-text-accent); font-weight: 700; }
.glilot-blog-page { background: #fff; color: var(--glilot-dark); }

/* ---------- Shared article card — desktop 16587:1876 (500 x 600) ---------- */
.glilot-blog-card {
  position: relative;
  display: flex;
  flex: none;
  flex-direction: column;
  align-items: flex-end;            /* counter axis MAX = physical right */
  justify-content: space-between;
  width: 26.041667vw;
  height: 31.25vw;
  padding: 2.083333vw;
  overflow: hidden;
  border-radius: var(--glilot-radius-card);
  direction: ltr;
  isolation: isolate;
}
.glilot-blog-card__image {          /* 16587:1877: 1486 x 836 at -34, -226 (FILL of 16:9) */
  position: absolute;
  z-index: 0;
  top: -11.770833vw;
  left: -1.770833vw;
  width: 77.395833vw;
  height: 43.541667vw;
  max-width: none;
  object-fit: cover;
}
.glilot-blog-card__shade {          /* 16587:1880: 526 x 406 at -8, 204; black 0 -> 1 at 20.32% / 96.675%, opacity .61 */
  position: absolute;
  z-index: 1;
  top: 10.625vw;
  left: -0.416667vw;
  width: 27.395833vw;
  height: 21.145833vw;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 20.32%, #000 96.675%);
  opacity: 0.61;
  pointer-events: none;
}
.glilot-blog-card__tag {            /* 16587:1878: h32, px20, r71, #fff; text 16/1.5 Bold #044c5f */
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  height: 1.666667vw;
  padding: 0 1.041667vw;
  border-radius: 3.697917vw;
  background: #fff;
  color: var(--glilot-accent);
  font-size: 0.833333vw;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}
.glilot-blog-card__body {           /* 16587:1881: 420 wide, vertical, gap 32, MAX */
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.666667vw;
  width: 21.875vw;
}
.glilot-blog-card__title {          /* 16587:1882: 28/1.3 Bold #fff */
  width: 100%;
  margin: 0;
  color: #fff;
  font-size: 1.458333vw;
  font-weight: 700;
  line-height: 1.285714;          /* derived: 28 x 1.3 = 36.4, Figma lays lines on whole px (36; 16587:1882 = 3 x 36) */
  text-align: right;
}
.glilot-blog-card .glilot-blog-card__cta {  /* 16587:1883: h44, 4/20, gap 32, 1px #fff, r500 (site CTA) */
  position: relative;
  top: auto;
  left: auto;
  flex: none;
  justify-content: flex-start;
  padding: 0.208333vw 1.041667vw;
  gap: 1.666667vw;
  border: 0;                        /* Figma strokes sit inside the frame: inset ring, padding unchanged */
  box-shadow: inset 0 0 0 0.052083vw #fff;
  color: #fff;
  text-decoration: none;
}
.glilot-blog-card__cta img {        /* 16587:1884: 19.392 frame, arrow on the physical left */
  width: 1.01vw;
  height: 1.01vw;
}
.glilot-blog-card__cta span {       /* 16587:1886: 139 x 26, 18/1.18 Medium, ls 5% */
  font-size: 0.9375vw;
  font-weight: 500;
  line-height: 1.444444;            /* derived: single-line text box 26 / 18 (Figma 1.18 centred in a 26 box) */
  letter-spacing: 0.05em;
  text-align: right;
  white-space: nowrap;
}

/* ---------- Shared emblem (photo + ring) — archive desktop 16690:3836 ---------- */
.glilot-blog-emblem {
  position: absolute;
  top: 7.307813vw;
  left: 7.552083vw;
  width: 37.864583vw;
  height: 37.519896vw;
  pointer-events: none;
}
.glilot-blog-emblem__art {          /* BL4: the default glass book (or an image chosen in the admin, e.g. a
                                       category's), whole, never cropped or mirrored, multiply on white. */
                                    /* The book's farthest pixel is 0.489 of the image from its centre (measured);
                                       The book's farthest pixel is 0.489 of the image from its centre (measured);
                                       at 80% of the emblem that is r 0.39 of 727, inside the lettering (r 306.5). */
  position: absolute;
  inset: 0;
  width: 72%;                      /* user 2026-10-11: 10% smaller on desktop (80% -> 72%) */
  height: auto;
  aspect-ratio: 1;
  margin: auto;
  mix-blend-mode: multiply;
}
.glilot-blog-emblem__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.glilot-blog-emblem__ring {         /* 16587:1813: 727 x 720.382 at 0, 0 */
  position: absolute;
  top: 0;
  left: 0;
  width: 37.864583vw;
  height: 37.519896vw;
  max-width: none;
}

/* ---------- Archive hero — 16587:1757 (1920 x 920) ---------- */
.glilot-blog-hero {
  position: relative;
  height: 47.916667vw;
  overflow: hidden;
  background: #fff;
}
.glilot-blog-hero__copy {           /* 16587:1807: 746 x 317 at 1078, 326 (right 96), gap 30, MAX */
  position: absolute;
  top: 16.979167vw;
  right: 5vw;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.5625vw;
  width: 38.854167vw;
  direction: ltr;
}
.glilot-blog-hero__head {           /* 16587:1808: 746 x 241, gap 0, MAX */
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
}
.glilot-blog-hero__breadcrumb {     /* 16587:1809: 668 wide, 18/1.3, ls 3%, #537b88 */
  width: 34.791667vw;
  margin: 0;
  color: var(--glilot-text-accent);
  font-size: 0.9375vw;
  font-weight: 400;
  line-height: 1.277778;          /* derived: 18 x 1.3 = 23.4 -> Figma whole-px pitch 23 (16587:1809 box 23) */
  letter-spacing: 0.03em;
  text-align: right;
}
.glilot-blog-hero__title {          /* 16587:1810: 746 wide, 110/0.99 Bold */
  width: 38.854167vw;
  margin: 0;
  color: var(--glilot-dark);
  font-size: 5.729167vw;
  font-weight: 700;
  line-height: 0.990909;          /* derived: 110 x 0.99 = 108.9 -> 109 (16587:1810 = 2 x 109) */
  text-align: right;
}
.glilot-blog-hero__body {           /* 16587:1811: 668 wide, 18/1.3, ls 3% */
  width: 34.791667vw;
  margin: 0;
  color: var(--glilot-dark);
  font-size: 0.9375vw;
  font-weight: 400;
  line-height: 1.277778;          /* derived: 23 px pitch (16587:1811 = 2 x 23) */
  letter-spacing: 0.03em;
  text-align: right;
}

/* ---------- Articles — 16587:1863 (1920 x 2356) ---------- */
.glilot-blog-articles {
  padding: 4.947917vw 0 1.71875vw;           /* content 1015 - 920; bottom 2356 - 95 - 2228 */
  background: #fff;
}
.glilot-blog-articles__title {      /* 16587:1865: 70/1 Bold #537b88, centered */
  width: 89.583333vw;
  margin: 0 auto;
  color: var(--glilot-text-accent);
  font-size: 3.645833vw;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
.glilot-blog-filters {              /* 16587:1866: hug x 78, pad 10, gap 60, #fafafa, r500 */
  display: flex;
  width: max-content;
  margin: 3.125vw auto 0;
  padding: 0.520833vw;
  gap: 3.125vw;
  border-radius: 26.041667vw;
  background: var(--glilot-surface); /* BL3 / CT2 / G10: the visible light grey surface token */
  direction: rtl;                   /* row 1 = "all" at the physical right (16587:1873) */
}
.glilot-blog-filters__item {        /* 16587:1867: h58, 10/20, r500; 28/1.3 Medium #044c5f */
  display: flex;
  flex: none;
  align-items: center;
  height: 3.020833vw;
  padding: 0.520833vw 1.041667vw;
  border-radius: 26.041667vw;
  color: var(--glilot-accent);
  font-size: 1.458333vw;
  font-weight: 500;
  line-height: 1.285714;          /* derived: 36 px pitch */
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 180ms ease, color 180ms ease;
}
.glilot-blog-filters__item.is-active { background: var(--glilot-text-accent); color: #fff; }  /* 16587:1873 */
.glilot-blog-filters__item:not(.is-active):hover,
.glilot-blog-filters__item:not(.is-active):focus-visible { background: #fff; }
.glilot-blog-filters__item:focus-visible { outline: 0.104167vw solid var(--glilot-accent); outline-offset: 0.104167vw; }
.glilot-blog-grid {                 /* 16587:1875: 1720 wide, wrap, gap 80 / 80, CENTER */
  display: flex;
  flex-wrap: wrap;
  /* User rule (2026-10-10): an incomplete last row starts at the right. Full rows stay where Figma's
     centred 1720 frame puts them (3 x 500 + 2 x 80 = 1660, 30 px in from each side), so the box
     is 1660 wide, centred, and the cards pack from its right edge (flex-start in RTL). */
  justify-content: flex-start;
  gap: 4.166667vw;
  width: 86.458333vw;
  margin: 3.125vw auto 0;
  direction: rtl;                   /* list row 1 = physical right card (16587:1898) */
}
.glilot-blog-articles__more { display: none; }
.glilot-blog-card[hidden],
.glilot-blog-articles__more[hidden] { display: none !important; }   /* blog filter (assets/js/blog.js) */

/* ---------- Categories — 16587:1850 (1920 x 640) ---------- */
.glilot-blog-categories {
  padding: 8.541667vw 5.208333vw 8.125vw;    /* 3440 - 3276; 640 - 164 - 320 */
  background: #fff;
}
.glilot-blog-categories__title {    /* 16587:1852: 70/1 Medium #022d38 + highlight */
  margin: 0;
  color: var(--glilot-dark);
  font-size: 3.645833vw;
  font-weight: 500;
  line-height: 1;
  text-align: center;
}
.glilot-blog-categories__list {     /* 16587:1853: 1720, SPACE_BETWEEN */
  /* Three columns with Figma's space-between positions ((1720 - 3 x 457) / 2 = 174.5 between),
     so a fourth category wraps instead of overflowing, and an incomplete row starts at the right
     (user rule 2026-10-10). Row gap: the article grid's 80. */
  display: grid;
  grid-template-columns: repeat(3, 23.802083vw);
  gap: 4.166667vw 9.088542vw;
  margin-top: 2.604167vw;
  direction: rtl;                   /* row 1 = physical right card (16587:1860) */
}
.glilot-blog-category-card {        /* 16587:1854: 457 x 200, pad 40, gap 12, #fafafa, r20, MAX */
  display: flex;
  flex: none;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.625vw;
  width: 23.802083vw;
  height: 10.416667vw;
  padding: 2.083333vw;
  border-radius: var(--glilot-radius-card);
  background: var(--glilot-surface);
  color: var(--glilot-accent);
  text-decoration: none;
  direction: ltr;
  transition: background-color 180ms ease;
}
.glilot-blog-category-card:hover,
.glilot-blog-category-card:focus-visible { background: var(--glilot-surface-hover); }
.glilot-blog-category-card:focus-visible { outline: 0.104167vw solid var(--glilot-accent); outline-offset: 0.104167vw; }
.glilot-blog-category-card h3, .glilot-blog-category-card [data-h="h3"] {     /* 16587:1855: 28/1.3 Bold */
  margin: 0;
  font-size: 1.458333vw;
  font-weight: 700;
  line-height: 1.285714;          /* derived: 36 px pitch (16587:1855 box 36) */
  text-align: right;
}
.glilot-blog-category-card p {      /* 16587:1856: 377 wide, 18/1.3 Regular */
  width: 19.635417vw;
  margin: 0;
  font-size: 0.9375vw;
  font-weight: 400;
  line-height: 1.277778;          /* derived: 23 px pitch (16587:1856 = 3 x 23) */
  text-align: right;
}
@media (prefers-reduced-motion: reduce) {
  .glilot-blog-filters__item,
  .glilot-blog-category-card { transition: none; }
}

/* =================== Mobile — frame 16687:3055 (390) =================== */
@media (max-width: 767px) {
  .glilot-blog-emblem__art { width: 64%; } /* user 2026-10-11: the book 20% smaller on phones (80% -> 64%) */
  /* Shared card — 16688:3290 (350 x 377) */
  .glilot-blog-card {
    width: 89.74359vw;
    height: 96.666667vw;
    padding: 5.128205vw;
    border-radius: var(--glilot-radius-card);
  }
  .glilot-blog-card__image {        /* 16688:3291: box 350 x 468 at 0, -91; image 246.92% x 103.93% at -3.77%, -1.87% */
    top: -25.577436vw;
    left: -3.383333vw;
    width: 221.594872vw;
    height: 124.715385vw;
  }
  .glilot-blog-card__shade {        /* 16688:3292: 368 x 279 at -8, 98 */
    top: 25.128205vw;
    left: -2.051282vw;
    width: 94.358974vw;
    height: 71.538462vw;
  }
  .glilot-blog-card__tag {          /* 16688:3293: h32, px20, r71; 14/1.35 Bold */
    height: 8.205128vw;
    padding: 0 5.128205vw;
    border-radius: 18.205128vw;
    font-size: 3.589744vw;
    line-height: 1.357143;        /* derived: 14 x 1.35 = 18.9 -> 19 (16688:3294 box 19) */
  }
  .glilot-blog-card__body {         /* 16688:3295: 310 wide, gap 20 */
    gap: 5.128205vw;
    width: 79.487179vw;
  }
  .glilot-blog-card__title {        /* 16688:3296: 20/1.3 Bold (26 px pitch, 2 x 26 = 52) */
    font-size: 5.128205vw;
    line-height: 1.3;
  }
  .glilot-blog-card .glilot-blog-card__cta {  /* 16688:3306: h34, 2.558/12.789, gap 24.299, 0.639 #fff, r319.72 */
    padding: 0.655846vw 3.279179vw;
    gap: 6.230462vw;
    box-shadow: inset 0 0 0 0.163949vw #fff;
  }
  .glilot-blog-card__cta img {      /* 16688:3307: 12.4 */
    width: 3.179487vw;
    height: 3.179487vw;
  }
  .glilot-blog-card__cta span {     /* 16688:3309: 144 x 26, 18/1.18 Medium, ls 5% */
    font-size: 4.615385vw;
    line-height: 1.444444;          /* derived: 26 / 18 text box */
  }

  /* Emblem — 16687:3082 (369.36 x 375.02 at 10, 149.98) */
  .glilot-blog-emblem {
    top: 38.45641vw;
    left: 2.564103vw;
    width: 94.707692vw;
    height: 96.158974vw;
  }
  .glilot-blog-emblem__ring {       /* 16687:3084: 343.37 x 340.25 at 12.76, 17.40 */
    top: 4.461538vw;
    left: 3.271795vw;
    width: 88.04359vw;
    height: 87.24359vw;
  }

  /* Hero — 16687:3056 (390 x 920) */
  .glilot-blog-hero {
    height: auto;
    padding: 146.410256vw 0 29.74359vw;       /* copy 16687:3075 at y 571, 233 tall; 920 - 804 */
  }
  /* Archive only (BM1, user feedback 2026-10-10): less air between the hero copy and "מאמרים".
     Figma: 116 (hero bottom) + 103 (articles top) = 219; now 0 + 64 (the mobile card gap, 16687:3239). */
  .glilot-blog-archive .glilot-blog-hero { padding-bottom: 0; }
  .glilot-blog-archive .glilot-blog-articles { padding-top: 16.410256vw; }
  .glilot-blog-hero__copy {         /* 16687:3075: 350 at 20, pad 10/0, gap 10, MAX */
    position: relative;
    top: auto;
    right: auto;
    gap: 2.564103vw;
    width: 89.74359vw;
    margin: 0 5.128205vw;
    padding: 2.564103vw 0;
  }
  .glilot-blog-hero__head {         /* 16687:3076: 314 wide, gap 2 */
    gap: 0.512821vw;
    width: 80.512821vw;
  }
  .glilot-blog-hero__breadcrumb {   /* 16687:3077: 314, 16/1.3, ls 3% */
    width: 80.512821vw;
    font-size: 4.102564vw;
    line-height: 1.3125;            /* derived: 16 x 1.3 = 20.8 -> 21 (16687:3077 box 21) */
  }
  .glilot-blog-hero__title {        /* 16687:3079: 314, 46/1 Bold */
    width: 80.512821vw;
    font-size: 11.794872vw;
    line-height: 1;
  }
  /* 16687:3079 carries a hard line break (U+2028) before the highlighted range;
     desktop 16587:1810 wraps naturally. */
  .glilot-blog-archive .glilot-blog-hero__title .lp-text-highlight { display: block; }
  .glilot-blog-hero__body {         /* 16687:3081: 342, 16/1.35, ls 0 */
    width: 87.692308vw;
    font-size: 4.102564vw;
    line-height: 1.375;           /* derived: 16 x 1.35 = 21.6 -> 22 (16687:3081 = 4 x 22) */
    letter-spacing: 0;
  }

  /* Articles — 16687:3277 (390 x 2097) */
  .glilot-blog-articles {
    padding: 26.410256vw 5.128205vw 4.102564vw;    /* 3239 padding 103; visible bottom 2097 - 2081 */
  }
  .glilot-blog-articles__title {    /* 16687:3243: 350, 36/1 Bold #537b88, right */
    width: 100%;
    font-size: 9.230769vw;
    text-align: right;
  }
  .glilot-blog-filters {            /* 16687:3280: 350 x 64, pad 10, gap 32, r500, clip, MAX */
    width: 89.74359vw;
    height: 16.410256vw;
    margin: 6.153846vw 0 0;
    padding: 2.564103vw;
    gap: 8.205128vw;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }
  .glilot-blog-filters::-webkit-scrollbar { display: none; }
  .glilot-blog-filters__item {      /* 16687:3281: h44, 10/20; 18/1.18 Medium ls 5% */
    height: 11.282051vw;
    padding: 2.564103vw 5.128205vw;
    font-size: 4.615385vw;
    line-height: 1.166667;        /* derived: 18 x 1.18 = 21.24 -> 21 */
    letter-spacing: 0.05em;
  }
  .glilot-blog-filters__item:focus-visible { outline-offset: -0.512821vw; }
  .glilot-blog-grid {               /* 16687:3239 children: 350 x 377 cards, gap 64 */
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    gap: 16.410256vw;
    width: 100%;
    margin: 16.410256vw 0 0;
  }
  .glilot-blog-grid:not(.is-expanded) > .glilot-blog-card.is-more { display: none; }   /* after the 4th visible card (blog.js / page-blog.php) */
  .glilot-blog-articles__more {     /* 16712:1178: 390 x 26, 20/1.3 Bold #022d38, centered */
    display: block;
    width: 100%;
    height: 6.666667vw;
    margin: 16.410256vw 0 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--glilot-dark);
    font: 700 5.128205vw / 1.3 var(--glilot-font);
    text-align: center;
    cursor: pointer;
  }
  .glilot-blog-articles__more[aria-expanded="true"] { display: none; }

  /* Categories — 16687:3121 (390 x 631) */
  .glilot-blog-categories {
    padding: 26.410256vw 5.128205vw 0;
  }
  .glilot-blog-categories__title {  /* 16687:3125: 350, 36/1 Medium + highlight, right */
    font-size: 9.230769vw;
    text-align: right;
  }
  .glilot-blog-categories__list {   /* 16687:3238: gap 40 */
    display: flex;
    flex-direction: column;
    gap: 10.25641vw;
    margin-top: 9.74359vw;
  }
  .glilot-blog-category-card {      /* 16687:3128: 350, pad 20, gap 12, r20 */
    gap: 3.076923vw;
    width: 89.74359vw;
    height: auto;
    padding: 5.128205vw;
    border-radius: var(--glilot-radius-card);
  }
  .glilot-blog-category-card h3, .glilot-blog-category-card [data-h="h3"] {   /* 16687:3130: 24/1.3 Bold #044c5f */
    font-size: 6.153846vw;
    line-height: 1.291667;          /* derived: 24 x 1.3 = 31.2 -> 31 (16687:3130 box 31) */
    white-space: nowrap;
  }
  .glilot-blog-category-card p {    /* 16687:3133: 316, 16/1.35 Regular #022d38 */
    width: 81.025641vw;
    color: var(--glilot-dark);
    font-size: 4.102564vw;
    line-height: 1.375;           /* derived: 22 px pitch (16687:3133 = 2 x 22) */
  }
}