/*
 * RAMON College brand layer (2026-09-30).
 * Loaded after main.css / latest-main-redesign.css (see inc/assets.php).
 * Palette: brand book v1.0 + client codes. Hierarchy (v4f): white bg, original BLUE #125B9A leads; mint + cyan as visible touches.
 */
:root {
  --ramon-blue: #125B9A;
  --ramon-cyan: #00A6FF;
  --ramon-mint: #00D9A6;
  --ramon-bg: #FFFFFF;
  --ramon-text: #111827;
  --ramon-text-2: #556274;
  --ramon-blue-light: #E7EFF5;
  --ramon-cyan-light: #E6F6FF;
  --ramon-mint-light: #E6FBF6;
  --ramon-blue-dark: #0D4474;
  --ramon-cyan-dark: #00649A;
  --ramon-mint-dark: #006D53;
  --ramon-blue-mid: #B8CEDF;
  --ramon-mint-mid: #B3F4E4;
  --swiper-theme-color: var(--ramon-blue);
}

/* ---------- Logo: header ---------- */
/* The logo file is cropped to its visible artwork (no empty margins),
   so the box size below is the size the logo actually appears. */
.header .logo img {
  position: static;
  top: auto;
  left: auto;
  display: block;
  width: auto;
  max-width: none;
  -o-object-fit: contain;
  object-fit: contain;
}

@media screen and (min-width: 1025px) {
  /* Right edge of the logo = right edge of the page content column
     (.container has 10rem inline padding, the header container 4.25rem). */
  .header .logo {
    width: 11rem;
    height: 3.375rem;
    -webkit-margin-start: 5.75rem;
    margin-inline-start: 5.75rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  .header .logo img {
    height: 3.125rem;
  }
  .header.fixed .logo {
    height: 3.375rem;
  }
  .header.fixed .logo img {
    top: auto;
    width: auto;
    height: 2.625rem;
  }
}

@media screen and (max-width: 1024px) {
  .header .logo {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
  .header .logo img {
    top: auto;
    height: 2.25rem;
  }
  .header.fixed .logo img {
    top: auto;
    width: auto;
    height: 2rem;
  }
}

/* ---------- Logo: footer + FAQ ---------- */
/* Explicit ratio of the cropped logo file (1741x494) so the box has a
   height before the lazy image loads. */
.footer-logo .logo img,
.faq-section .logo img {
  aspect-ratio: 1741 / 494;
  height: auto;
}
@media screen and (min-width: 1025px) {
  .footer-logo .logo,
  .footer-logo .logo img {
    width: 16rem;
  }
}


/* ---------- Typography colours ---------- */
/* Main headings and body stay dark; selected titles and links in deep blue. */
:where(.item__title, .post-item__title, .career-modal__title) {
  color: var(--ramon-blue);
}
.editor-area a:not(.btn) {
  color: var(--ramon-blue);
}
.editor-area a:not(.btn):hover {
  color: var(--ramon-blue-dark);
}
@media screen and (min-width: 1025px) {
  .main-menu > li > a:hover,
  .main-menu > li.current-menu-item > a {
    color: var(--ramon-blue);
  }
}

/* ---------- Button system (v4f: blue-led) ----------
   CTA fill = original blue #125B9A with a graded, lighter blue towards both ends and a soft
   white light that sits mainly at the SIDES (outside the label), plus a faint top sheen.
   The centre band behind the label stays solid #125B9A-range blue: white text >= 4.5:1
   from 13px inside each edge (only the arrow icon comes that close; graphics need 3:1). Hover/focus: the side lights drift slightly,
   shadow deepens, 2px lift, one 250ms transition — no flicker, no text opacity change. */
:root {
  --cta-blue-base: linear-gradient(90deg, #2F77B6 0px, #125B9A 16px, #125B9A calc(100% - 16px), #2F77B6 100%);
  --cta-blue-glow-l: radial-gradient(16px 130% at 0% 50%, rgba(255, 255, 255, 0.40) 0%, rgba(255, 255, 255, 0) 100%);
  --cta-blue-glow-r: radial-gradient(16px 130% at 100% 50%, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 100%);
  --cta-blue-sheen: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 50%);
  --btn-light-glow: radial-gradient(55% 140% at 50% -15%, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0) 70%);
  --btn-light-base: linear-gradient(135deg, #FFFFFF 0%, #F4FAFE 55%, #E6F6FF 100%);
  --btn-ease: 250ms cubic-bezier(0.25, 0.8, 0.25, 1);
  --btn-shadow-blue: 0 4px 12px -6px rgba(13, 68, 116, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.22);
  --btn-shadow-blue-up: 0 10px 22px -8px rgba(13, 68, 116, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.26);
  --btn-shadow-light: 0 3px 10px -6px rgba(17, 24, 39, 0.25), inset 0 1px 0 #FFFFFF;
  --btn-shadow-light-up: 0 9px 20px -8px rgba(17, 24, 39, 0.3), inset 0 1px 0 #FFFFFF;
}

/* shared mechanics */
.btn, .new_da, .wpcf7-submit, .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept,
.swiper-btn-next, .swiper-btn-prev, .course-item .btns span, .play-btn, .course-tag,
.courses-tags .switcher button {
  background-repeat: no-repeat !important;
  transition: background-position var(--btn-ease), box-shadow var(--btn-ease), transform var(--btn-ease), border-color var(--btn-ease) !important;
}
:is(.btn, .new_da, .wpcf7-submit, .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept,
    .swiper-btn-next, .swiper-btn-prev, .course-item .btns span, .play-btn, .course-tag,
    .courses-tags .switcher button):is(:hover, :focus-visible) {
  transform: translateY(-2px);
}

/* 1) Blue CTAs: contact, lead/register, forms, floating button, learning-system login, cookie, active tabs */
.btn.primary-btn, .btn.secondary-btn, .wpcf7-submit.btn, .footer button[type="submit"].btn,
.sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept, .new_da,
.courses-tags .switcher button.isActive, .blog-section .switcher .btn.isActive, .courses-list__head .btn.isActive {
  background-color: #125B9A !important;
  background-image: var(--cta-blue-glow-l), var(--cta-blue-glow-r), var(--cta-blue-sheen), var(--cta-blue-base) !important;
  background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100% !important;
  background-position: 0 0, 0 0, 0 0, 0 0 !important;
  border-color: rgba(13, 68, 116, 0.5) !important;
  color: #FFFFFF !important;
  box-shadow: var(--btn-shadow-blue);
}
:is(.btn.primary-btn, .btn.secondary-btn, .wpcf7-submit.btn, .footer button[type="submit"].btn,
    .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept, .new_da,
    .courses-tags .switcher button.isActive, .blog-section .switcher .btn.isActive, .courses-list__head .btn.isActive):is(:hover, :focus-visible) {
  background-color: #125B9A !important;
  background-image: var(--cta-blue-glow-l), var(--cta-blue-glow-r), var(--cta-blue-sheen), var(--cta-blue-base) !important;
  background-position: 0 -6px, 0 6px, 0 0, 0 0 !important;  /* side lights drift gently */
  color: #FFFFFF !important;
  box-shadow: var(--btn-shadow-blue-up);
}
:is(.btn.primary-btn, .btn.secondary-btn, .wpcf7-submit.btn, .new_da) i { color: inherit !important; }

/* 2) Light / outline buttons: "עוד על הקורס", inactive tabs, slider arrows, course tags */
.btn:not(.primary-btn):not(.secondary-btn):not(.wpcf7-submit):not([type="submit"]):not(.isActive),
.swiper-btn-next, .swiper-btn-prev, .course-tag, .courses-tags .switcher button:not(.isActive) {
  background-color: #FFFFFF !important;
  background-image: var(--btn-light-glow), var(--btn-light-base) !important;
  background-size: 200% 100%, 100% 100% !important;
  background-position: 100% 0, 0 0 !important;
  box-shadow: var(--btn-shadow-light);
}
:is(.btn:not(.primary-btn):not(.secondary-btn):not(.wpcf7-submit):not([type="submit"]):not(.isActive),
    .swiper-btn-next, .swiper-btn-prev, .course-tag, .courses-tags .switcher button:not(.isActive)):is(:hover, :focus-visible) {
  background-color: #FFFFFF !important;
  background-image: var(--btn-light-glow), var(--btn-light-base) !important;
  background-position: 0% 0, 0 0 !important;
  color: var(--ramon-text) !important;
  border-color: var(--ramon-blue);
  box-shadow: var(--btn-shadow-light-up);
}
.swiper-btn-next:is(:hover, :focus-visible), .swiper-btn-prev:is(:hover, :focus-visible) { color: var(--ramon-blue) !important; }
.course-tag:is(:hover, :focus-visible) i, .course-tag:is(:hover, :focus-visible) i::before { color: var(--ramon-cyan) !important; }

/* 3) Small accent buttons keep their accent colours (mint / cyan touches) with a soft light */
.course-item .btns span {
  background-image: radial-gradient(60% 120% at 30% 0%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%), linear-gradient(135deg, #00D9A6, #6FEACB) !important;
  color: var(--ramon-text) !important;
}
.play-btn {
  background-image: radial-gradient(60% 120% at 30% 0%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%), linear-gradient(135deg, #00A6FF, #5CC6FF) !important;
  color: var(--ramon-text) !important;
}

/* keyboard focus ring on every button */
:is(.btn, .new_da, .wpcf7-submit, .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept,
    .swiper-btn-next, .swiper-btn-prev, .course-item .btns span, .play-btn, .course-tag,
    .courses-tags .switcher button,
    .burger-btn, .close-menu):focus-visible {
  outline: 3px solid var(--ramon-cyan-dark) !important;
  outline-offset: 3px;
}

/* ---------- Blue blocks: soft transitions blue -> light blue -> white ---------- */
/* process-step cards: header band (text sits on the solid-blue side, RTL start) */
.step-item {
  background-color: #125B9A !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 38%),
    linear-gradient(to left, #125B9A 0%, #1F6AAA 45%, #3E82BF 75%, #5E98CC 100%) !important;
  border-color: #1F6AAA !important;
  box-shadow: 0 6px 18px -12px rgba(13, 68, 116, 0.5);
  transition: box-shadow var(--btn-ease);
  cursor: default; /* not clickable */
}
@media (hover: hover) {
  .step-item:hover { box-shadow: 0 12px 26px -12px rgba(13, 68, 116, 0.55); }
}
/* small blue discs and chips */
.contact-page .info i, .contact-page .info .item i, .components .item span, .card-item .img, .student-item .photo::after {
  background-image: radial-gradient(60% 90% at 30% 0%, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0) 70%), linear-gradient(135deg, #125B9A, #2A71B0) !important;
}
.course-item__label {
  background-image: radial-gradient(60% 140% at 30% -20%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%), linear-gradient(135deg, #00D9A6, #6FEACB) !important;
}
/* large light areas: static, gentle */
.faq-section::before, .leaders-section .content-part-1, .current-course .content-part-1, .student-item, .quote__inner {
  background-image: linear-gradient(160deg, #E6F6FF 0%, #F2FAFF 55%, #FFFFFF 100%) !important;
}
.career-section::before { background-image: linear-gradient(160deg, #E6FBF6 0%, #F2FDF9 55%, #FFFFFF 100%) !important; }
@media screen and (max-width: 1024px) {
  .faq-section, .courses-tags .content, .courses-tags__tabs, .current-course .content-part-2 {
    background-image: linear-gradient(160deg, #E6F6FF 0%, #F2FAFF 55%, #FFFFFF 100%) !important;
  }
}
.folders-section .item, .components .item { cursor: default; }

/* ---------- "חותמות האיכות שלנו — הדרך להצלחה שלך" ----------
   Clear blue zone behind the heading, fading to light blue and white; white cards,
   blue titles, dark body text. Stops are in rem, so the heading always sits on blue. */
.quality-section { color: var(--ramon-text) !important; }
@media screen and (min-width: 1025px) {
  .quality-section::before {
    background-color: #FFFFFF !important;
    background-image:
      radial-gradient(45% 38% at 88% 0%, rgba(0, 166, 255, 0.35), rgba(0, 166, 255, 0) 70%),
      linear-gradient(180deg, #125B9A 0rem, #1A63A2 20.5rem, #4C89C1 27rem, #A9CDEB 33rem, #E6F2FB 38rem, #FFFFFF 46rem) !important;
  }
}
@media screen and (max-width: 1024px) {
  .quality-section {
    background-color: #FFFFFF !important;
    background-image:
      radial-gradient(70% 22% at 90% 0%, rgba(0, 166, 255, 0.35), rgba(0, 166, 255, 0) 70%),
      linear-gradient(180deg, #125B9A 0rem, #1A63A2 11rem, #4C89C1 15rem, #A9CDEB 19rem, #E6F2FB 23rem, #FFFFFF 28rem) !important;
  }
}
.quality-section h2 { color: #FFFFFF !important; }
.quality-section h2 i { color: #B3F4E4 !important; }  /* mint touch on blue: 5.7:1 */
.quality-section .item {
  background-color: #FFFFFF;
  background-image: linear-gradient(180deg, #FFFFFF 0%, #F5FAFE 100%);
  border-color: #CFE3F3 !important;
  box-shadow: 0 8px 22px -14px rgba(13, 68, 116, 0.35);
  color: var(--ramon-text) !important;
}
.quality-section .item h3 { color: var(--ramon-blue) !important; }
.quality-section .item p { color: var(--ramon-text) !important; }
.quality-section .item::before { background: #E6F6FF !important; }
.quality-section .item:hover { color: var(--ramon-text) !important; }

/* ---------- Forms and focus ---------- */
.form-item input:not(.btn):focus,
.form-item textarea:focus,
.select-wrapper select:focus {
  border-bottom-color: var(--ramon-blue);
  outline: none;
  box-shadow: 0 1px 0 0 var(--ramon-blue);
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--ramon-cyan-dark);
  outline-offset: 2px;
}

/* ---------- Small accents (mint / cyan touches) ---------- */
.editor-area li::marker, .faq-item__content.editor-area li::marker { color: var(--ramon-mint); }
.leaders-section .content-part-2 ul li::before { background: var(--ramon-mint); }

/* reduced motion: keep colours, focus rings and shadows; drop drifting and lifting */
@media (prefers-reduced-motion: reduce) {
  .btn, .new_da, .wpcf7-submit, .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept,
  .swiper-btn-next, .swiper-btn-prev, .course-item .btns span, .play-btn, .course-tag,
  .courses-tags .switcher button, .step-item {
    transition: none !important;
    animation: none !important;
  }
  :is(.btn, .new_da, .wpcf7-submit, .sticky_form__submit, .sticky_form__button, #cookie-consent-acf-accept,
      .swiper-btn-next, .swiper-btn-prev, .course-item .btns span, .play-btn, .course-tag,
      .courses-tags .switcher button):is(:hover, :focus-visible) {
    transform: none !important;
  }
}

/* ---------- Home: "Your Next Chapter" graphic (courses intro, image column only; 2026-10-04) ----------
   The supplied graphic already contains the headline, so the old "High Tech" text title is no longer output.
   Keep the whole image inside its column (the old photo was pushed past the viewport edge and cropped). */
@media screen and (min-width: 1025px) {
  .page-id-8 .courses-slider .content-part-1 .media-wrapper {
    width: 100%;
    max-width: 41.3125rem;
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-8 .courses-slider .content-part-1 {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.page-id-8 .courses-slider .content-part-1 .media-wrapper img {
  display: block;
  height: auto;
}
/* courses intro heading (home only): show the full two-line title, no 2-line clamp / ellipsis */
.page-id-8 .courses-slider .titles-box .title-md {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
  text-overflow: clip;
}

/* ---------- Home: "האישורים וההכרות שלנו" (quality-section, home page only; 2026-10-04) ----------
   Content starts at the top of each card: logo > title > description. Uniform logo band; titles share the
   tallest title's height per row (CSS subgrid) so descriptions start on one line; equal card height, no clipping.
   Scoped to .page-id-8 .quality-section - nothing here can match the external lead launcher. */
.page-id-8 .quality-section .item, .page-id-351 .quality-section .item {
  height: auto;
  justify-content: flex-start;
}
.page-id-8 .quality-section .item .logos, .page-id-351 .quality-section .item .logos {
  height: 5rem;
  margin: 0 0 20px;
  align-items: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.page-id-8 .quality-section .item .logos img, .page-id-351 .quality-section .item .logos img {
  width: auto;
  height: 100%;
  max-width: 100%;
  aspect-ratio: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.page-id-8 .quality-section .item h3, .page-id-351 .quality-section .item h3 {
  margin: 0 0 16px;
}
.page-id-8 .quality-section .item p, .page-id-351 .quality-section .item p {
  margin: 0 !important;
  position: static;
  font-family: "Heebo", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.6;
  color: #111111 !important;
  -webkit-text-fill-color: #111111;
  opacity: 1;
  background: none;
  text-shadow: none;
  text-align: right;
  direction: rtl;
}
@media screen and (min-width: 1025px) {
  .page-id-8 .quality-section .items,   .page-id-351 .quality-section .items {
    grid-template-rows: auto auto auto;
  }
  .page-id-8 .quality-section .item,   .page-id-351 .quality-section .item {
    display: grid;
    grid-row: span 3;
    grid-template-rows: subgrid;
    row-gap: 0;
    align-content: start;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-8 .quality-section .item .logos,   .page-id-351 .quality-section .item .logos {
    height: 4rem;
    margin-bottom: 20px;
  }
  .page-id-8 .quality-section .item p,   .page-id-351 .quality-section .item p {
    font-size: max(16px, 1rem);
  }
}

/* ---------- Home: courses carousel card descriptions shown in full (2026-10-04) ----------
   main.css clamps .course-item__description to 3 lines; the home card texts must not be cut.
   Scoped to the home courses carousel only. */
.page-id-8 .courses-slider .course-item__description {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
}

/* ---------- Home: learning method & advantages (folders-section, home page only; 2026-10-04) ----------
   Heading: regular line at 400 (was 300), bold line unchanged. Card descriptions: Heebo 400, #111111, opaque, RTL.
   Scoped to .page-id-8 .folders-section only. */
.page-id-8 .folders-section .content-part-2 h2 {
  font-weight: 400;
}
.page-id-8 .folders-section .content-part-2 h2 b {
  font-weight: 600;
}
.page-id-8 .folders-section .item p {
  font-family: "Heebo", sans-serif;
  font-weight: 400;
  color: #111111 !important;
  -webkit-text-fill-color: #111111;
  opacity: 1;
  text-align: right;
  direction: rtl;
}
.page-id-8 .folders-section .item h3 {
  font-weight: 600;
  text-align: right;
  direction: rtl;
}
/* balanced line breaks for the section heading (same wording, fewer orphan words) */
.page-id-8 .folders-section .content-part-2 h2,
.page-id-8 .folders-section .content-part-2 h2 p {
  text-wrap: balance;
}

/* ---------- Home: prep & enrichment courses (.ramon-tags-home, rendered by inc/ramon-course-tags-home.php; 2026-10-04) ----------
   Heebo texts, LMS link removed, frameless icon list in two rows: slow CSS marquee on desktop (paused on hover/focus,
   off for reduced motion), manual swipe on mobile. Duplicate tracks are aria-hidden. Scoped to this section only. */
.ramon-tags-home .titles-box h2,
.ramon-tags-home .special-title,
.ramon-tags-home .content p {
  font-family: "Heebo", sans-serif;
  direction: rtl;
}
.ramon-tags-home .titles-box h2 { font-weight: 400; text-align: right; text-wrap: balance; }
.ramon-tags-home .titles-box h2 b { font-weight: 700; }
.ramon-tags-home .special-title {
  font-size: 4.5rem;
  line-height: 1.15;
  font-weight: 700;
  color: #125B9A;
  text-wrap: balance;
}
.ramon-tags-home .content p { color: #111111; text-align: right; }
@media screen and (max-width: 1024px) {
  .ramon-tags-home .special-title { font-size: 2.5rem; }
  .ramon-tags-home .titles-box h2 { text-align: center; }
}

.ramon-tags-home .ramon-tags {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.ramon-tags-home .ramon-tags__row {
  display: flex;
  direction: ltr;           /* physical layout for the loop; items themselves are RTL */
  overflow: hidden;
}
.ramon-tags-home .ramon-tags__track {
  display: flex;
  flex-shrink: 0;
  gap: 2.75rem;
  padding: 0.25rem 2.75rem 0.25rem 0;  /* trailing gap = item gap, so the two copies join seamlessly */
  margin: 0;
  list-style: none;
}
.ramon-tags-home .ramon-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  direction: rtl;
  white-space: nowrap;
  font-family: "Heebo", sans-serif;
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.4;
  color: #111111;
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
}
.ramon-tags-home .ramon-tag__icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
  color: #125B9A;
}
.ramon-tags-home .ramon-tags__row--2 .ramon-tag__icon { color: #00A889; } /* mint, darkened for 3:1 on light blue */

@media screen and (min-width: 1025px) {
  .ramon-tags-home .ramon-tags__track { animation: ramon-tags-marquee 70s linear infinite; }
  .ramon-tags-home .ramon-tags__row--2 .ramon-tags__track { animation-direction: reverse; animation-duration: 80s; }
  .ramon-tags-home .ramon-tags:hover .ramon-tags__track,
  .ramon-tags-home:focus-within .ramon-tags__track { animation-play-state: paused; }
}
@keyframes ramon-tags-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}
/* mobile: manual horizontal swipe inside the row only; no duplicate copy */
@media screen and (max-width: 1024px) {
  .ramon-tags-home .ramon-tags__row {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    direction: rtl;
    padding-inline: 1rem;
  }
  .ramon-tags-home .ramon-tags__row::-webkit-scrollbar { display: none; }
  .ramon-tags-home .ramon-tags__track { padding: 0.25rem 0; gap: 1.75rem; }
  .ramon-tags-home .ramon-tags__track[aria-hidden="true"] { display: none; }
  .ramon-tags-home .ramon-tag { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .ramon-tags-home .ramon-tags__track { animation: none !important; }
  .ramon-tags-home .ramon-tags__row { overflow-x: auto; direction: rtl; }
  .ramon-tags-home .ramon-tags__track[aria-hidden="true"] { display: none; }
}

/* ---------- Home: 10 steps as a vertical timeline (.ramon-steps-home, rendered by inc/ramon-steps-home.php; 2026-10-04) ----------
   Numbered circles on a thin line at the right (inline-start), 3 colour groups (blue / cyan / mint).
   Numbers: white on blue (7.0:1), #0B1F33 on cyan (6.4:1) and on mint (10:1). Texts black on white. Scoped to this section. */
.ramon-steps-home .label-elem { gap: 0; }
.ramon-steps-home .ramon-steps {
  --rs-num: 2.75rem;
  --rs-gap: 1.25rem;
  position: relative;
  z-index: 2;
  direction: rtl;
}
@media screen and (min-width: 1025px) {
  .ramon-steps-home .ramon-steps { flex: 1; max-width: 42rem; padding-top: 1rem; }
}
@media screen and (max-width: 1024px) {
  .ramon-steps-home .ramon-steps { width: 100%; margin-top: 2rem; --rs-num: 2.5rem; --rs-gap: 1rem; }
}
.ramon-steps-home .ramon-steps__group {
  --rs-color: #125B9A; --rs-ink: #FFFFFF;
  position: relative;
  padding-bottom: 2rem;
}
.ramon-steps-home .ramon-steps__group--2 { --rs-color: #00A6FF; --rs-ink: #0B1F33; }
.ramon-steps-home .ramon-steps__group--3 { --rs-color: #00D9A6; --rs-ink: #0B1F33; padding-bottom: 0; }
/* the line: through the circle centres, continuous across groups */
.ramon-steps-home .ramon-steps__group::before {
  content: "";
  position: absolute;
  inset-inline-start: calc(var(--rs-num) / 2 - 1px);
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--rs-color);
  border-radius: 2px;
}
.ramon-steps-home .ramon-steps__group--3::before { bottom: auto; height: calc(100% - 1.5rem); }
.ramon-steps-home .ramon-steps__group-title {
  position: relative;
  margin: 0 0 1.25rem;
  padding: 0.25rem 0.875rem;
  margin-inline-start: calc(var(--rs-num) / 2 - 0.4375rem);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #FFFFFF;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.4;
  color: #111111;
}
.ramon-steps-home .ramon-steps__group-title::before { /* small marker sitting on the line */
  content: "";
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 50%;
  border: 3px solid var(--rs-color);
  background: #FFFFFF;
  margin-inline-start: -0.875rem;
  flex-shrink: 0;
}
.ramon-steps-home .ramon-steps__list { list-style: none; margin: 0; padding: 0; }
.ramon-steps-home .ramon-step {
  display: flex;
  align-items: flex-start;
  gap: var(--rs-gap);
  position: relative;
}
.ramon-steps-home .ramon-step + .ramon-step { margin-top: 1.5rem; }
.ramon-steps-home .ramon-step__num {
  flex: 0 0 var(--rs-num);
  width: var(--rs-num);
  height: var(--rs-num);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rs-color);
  color: var(--rs-ink);
  box-shadow: 0 0 0 4px #FFFFFF;   /* white ring separates the circle from the line */
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  direction: ltr;
}
.ramon-steps-home .ramon-step__body { flex: 1; min-width: 0; padding-top: 0.25rem; text-align: right; }
.ramon-steps-home .ramon-step__title {
  margin: 0 0 0.375rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.35;
  color: #111111;
}
.ramon-steps-home .ramon-step__text {
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  color: #111111;
}
@media screen and (max-width: 1024px) {
  .ramon-steps-home .ramon-step__title { font-size: 1.125rem; }
  .ramon-steps-home .ramon-step + .ramon-step { margin-top: 1.25rem; }
}
/* timeline refinements: line ends at the last circle; larger group titles and step texts */
.ramon-steps-home .ramon-steps__group--3::before { bottom: 0; height: auto; }
.ramon-steps-home .ramon-step__num { position: relative; z-index: 1; }
.ramon-steps-home .ramon-steps__group--3 .ramon-step:last-child::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: calc(var(--rs-num) / 2);
  bottom: -1px;
  width: var(--rs-num);
  background: #FFFFFF;
}
.ramon-steps-home .ramon-steps__group-title { font-size: 1.125rem; }
.ramon-steps-home .ramon-step__title { font-size: 1.375rem; }
.ramon-steps-home .ramon-step__text { font-size: 1.125rem; }
@media screen and (max-width: 1024px) {
  .ramon-steps-home .ramon-steps__group-title { font-size: 1rem; }
  .ramon-steps-home .ramon-step__title { font-size: 1.125rem; }
  .ramon-steps-home .ramon-step__text { font-size: 1rem; }
}

/* ---------- Home: placement intro heading + paragraph (.ramon-int-titles, home only; 2026-10-04) ----------
   One uniform bold weight (no thin/bold mix), existing heading colour kept, two balanced lines on desktop;
   paragraph black, regular, comfortable line height. Scoped to this titles box only - logos/slider untouched. */
.integrations-logos .ramon-int-titles h2 {
  font-weight: 700;
  text-wrap: balance;
  text-align: right;
}
.integrations-logos .ramon-int-titles p {
  color: #111111;
  font-weight: 400;
  line-height: 1.65;
  text-align: right;
  margin: 0;
}
@media screen and (min-width: 1025px) {
  .integrations-logos .ramon-int-titles { align-items: center; }
  .integrations-logos .ramon-int-titles h2 { width: 30rem; margin-inline-end: 6rem; margin-bottom: 0; }
  .integrations-logos .ramon-int-titles p { flex: 1; max-width: 40rem; font-size: 1.125rem; }
}
@media screen and (max-width: 1024px) {
  .integrations-logos .ramon-int-titles h2 { margin-bottom: 0.75rem; }
  .integrations-logos .ramon-int-titles p { font-size: 1rem; }
}

/* ---------- Home: FAQ (.ramon-faq-home, rendered by inc/ramon-faq-home.php; 2026-10-04) ----------
   Uniform bold heading, questions in brand blue as real buttons (keyboard), answers as black paragraphs. Scoped to this section. */
.ramon-faq-home .titles-box h2 { font-weight: 700; }
.ramon-faq-home .ramon-faq__btn {
  all: unset;
  display: block;
  width: 100%;
  cursor: pointer;
  font: inherit;
  color: #125B9A;
  text-align: right;
  direction: rtl;
}
.ramon-faq-home .ramon-faq__btn:focus-visible {
  outline: 2px solid #00649A;
  outline-offset: 4px;
  border-radius: 4px;
}
.ramon-faq-home .faq-item__head .title-sm { color: #125B9A; flex: 1; }
.ramon-faq-home .faq-item__content p {
  margin: 0;
  color: #111111;
  font-weight: 400;
  line-height: 1.65;
  text-align: right;
}

/* ---------- Footer (site-wide; 2026-10-04): small logo + credits removed, two social icons ----------
   Scoped to footer.footer classes only - nothing here can match the external lead launcher. */
.footer .ramon-footer-text p,
.footer .ramon-footer-form-text {
  color: #111111;
  font-weight: 400;
  line-height: 1.6;
}
.footer .ramon-footer-text p { margin-top: 0; }
/* social list keeps the existing even gap (1.375rem) */
.footer .ramon-footer-social li { margin: 0; }
/* mobile: keep the two social icons above the (unchanged, fixed) external lead button at the page end */
@media screen and (max-width: 1024px) {
  footer.footer { padding-bottom: 5.5rem; }
}

/* ---------- Approved course-page design (body.ramon-course-v2 = cyber 541, AI 539; 2026-10-05) ----------
   Uniform heading weight (no thin/bold mix), Heebo body text in black, even section rhythm
   (desktop 64px / mobile 36px between sections), no fixed gaps. Shared sections on other pages are not affected. */
.ramon-course-v2 main h1,
.ramon-course-v2 main h2,
.ramon-course-v2 main .title-md,
.ramon-course-v2 main .cards-section .card-item__title,
.ramon-course-v2 main .integrations-logos h2 {
  font-family: "Heebo", sans-serif;
  font-weight: 600;
  text-wrap: balance;
}
.ramon-course-v2 main h1 b, .ramon-course-v2 main h2 b, .ramon-course-v2 main .title-md b { font-weight: 600; }
.ramon-course-v2 main .course-hero .course-description p,
.ramon-course-v2 main .content-section .editor-area,
.ramon-course-v2 main .content-section .editor-area p,
.ramon-course-v2 main .cards-section .row p,
.ramon-course-v2 main .cards-section .card-item p,
.ramon-course-v2 main .integrations-logos .titles-box p {
  font-family: "Heebo", sans-serif;
  font-weight: 400;
  color: #111111;
  font-size: max(16px, 1.0625rem);
  line-height: 1.65;
}
.ramon-course-v2 main .cards-section .card-item__title { color: #111111; }
.ramon-course-v2 main .integrations-logos .titles-box { margin-bottom: 0; }
/* hero intro is short now: show it fully (no 4vw crop / "show more") */
.ramon-course-v2 .course-hero .course-description__inner { max-height: none !important; }
@media screen and (min-width: 1025px) {
  .ramon-course-v2 main > section:not(.course-hero) { margin-top: 64px; margin-bottom: 64px; }
  .ramon-course-v2 main > section.course-hero { margin-bottom: 64px; }
  .ramon-course-v2 main .integrations-logos .titles-box { align-items: flex-start; }
}
@media screen and (max-width: 1024px) {
  .ramon-course-v2 main > section:not(.course-hero) { margin-top: 36px; margin-bottom: 36px; }
  .ramon-course-v2 main > section.course-hero { margin-bottom: 36px; }
  .ramon-course-v2 main .integrations-logos .titles-box h2 { margin-bottom: 16px; }
  /* program cards: natural height, top-aligned, readable sequence */
  .ramon-course-v2 main .cards-section .card-item { height: auto; min-height: 0; justify-content: flex-start; }
}
.ramon-course-v2 main .cards-section .card-item { justify-content: flex-start; }
/* cyber page: paragraph rhythm, right alignment, program cards grow with their text (folder shape scales with the card) */
.ramon-course-v2 main .content-section .editor-area p { margin: 0 0 20px; }
.ramon-course-v2 main .content-section .editor-area p:last-child { margin-bottom: 0; }
.ramon-course-v2 main .content-section .editor-area h2 { margin-bottom: 20px; }
.ramon-course-v2 main .integrations-logos .titles-box p,
.ramon-course-v2 main .content-section .editor-area { text-align: right; }
.ramon-course-v2 main .cards-section.layout-2 .card-item {
  height: auto;
  min-height: 14.8125rem;
  background-size: 100% 100%;
}
@media screen and (max-width: 1024px) {
  .ramon-course-v2 main .cards-section.layout-2 .card-item { min-height: 0; padding-bottom: 1.75rem; }
}

/* ===== DESIGN TRIAL (2026-10-05) - course content sections 6-12 (.ramon-int-trial on .ramon-course-v2) - APPROVED on cyber, applied to AI =====
   Not yet approved for other course pages. Remove this block + meta _ramon_int_trial to undo (see STATUS "תוכן 18"). */
.ramon-course-v2 main .integrations-logos.ramon-int-trial {
  margin-block: 0;
  padding-block: 44px;
  background: #FFFFFF;
}
.ramon-course-v2 main .integrations-logos.ramon-int-trial:nth-child(even of .ramon-int-trial) {
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(0, 166, 255, 0.05) 100%);
}
.ramon-course-v2 main .integrations-logos.ramon-int-trial:nth-child(1 of .ramon-int-trial) { margin-top: 64px; padding-top: 0; }
.ramon-course-v2 main .integrations-logos.ramon-int-trial:nth-last-child(1 of .ramon-int-trial) { margin-bottom: 64px; padding-bottom: 0; }
.ramon-course-v2 main .ramon-int-trial .titles-box {
  display: flex;
  align-items: flex-start;
  gap: 48px;
  margin: 0 10rem;
  padding: 0;
}
/* 1px separator inside the content width, only between consecutive trial sections (no doubles) */
.ramon-course-v2 main .ramon-int-trial + .ramon-int-trial .titles-box {
  border-top: 1px solid rgba(0, 166, 255, 0.16);
  padding-top: 44px;
  margin-top: -44px;
}
.ramon-course-v2 main .ramon-int-trial .titles-box h2 {
  flex: 0 0 36%;
  width: auto;
  max-width: none;
  margin: 0;
  color: #111111;
  font-family: "Heebo", sans-serif;
  font-weight: 600;
  font-size: clamp(34px, 2.5vw, 38px);
  line-height: 1.25;
}
.ramon-course-v2 main .ramon-int-trial .ramon-int-body {
  flex: 1 1 0;
  min-width: 0;
  max-width: 44rem;
  text-align: right;
}
.ramon-course-v2 main .ramon-int-trial .ramon-int-body p,
.ramon-course-v2 main .ramon-int-trial .ramon-int-list li {
  margin: 0;
  font-family: "Heebo", sans-serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.7;
  color: #111111;
  text-align: right;
}
.ramon-course-v2 main .ramon-int-trial .ramon-int-body > p,
.ramon-course-v2 main .ramon-int-trial .ramon-int-body > ul { margin: 0 0 18px; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-body > :last-child { margin-bottom: 0; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-body > p.ramon-int-lead { margin-bottom: 10px; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-list { list-style: none; padding: 0; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-list li { display: flex; align-items: flex-start; gap: 12px; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-list li + li { margin-top: 10px; }
.ramon-course-v2 main .ramon-int-trial .ramon-int-ico {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  margin-top: 2px;
  background-position: center;
  background-size: 24px 24px;
  background-repeat: no-repeat;
}
.ramon-int-ico--terminal { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='16' rx='2.5' stroke='%23125B9A'/%3E%3Cpath d='M7 10l3 2.5L7 15' stroke='%2300A6FF'/%3E%3Cpath d='M12.5 15.5h4.5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--network { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7.5v4M12 11.5l-5.5 5M12 11.5l5.5 5' stroke='%23125B9A'/%3E%3Ccircle cx='12' cy='5' r='2.5' stroke='%23125B9A'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5' stroke='%2300A6FF'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--code { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 7l-5 5 5 5M16 7l5 5-5 5' stroke='%23125B9A'/%3E%3Cpath d='M13.5 5l-3 14' stroke='%2300A6FF'/%3E%3C/svg%3E"); }
.ramon-int-ico--scan { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' stroke='%23125B9A'/%3E%3Cpath d='M15.5 15.5L21 21' stroke='%23125B9A'/%3E%3Cpath d='M10.5 7.5v6M7.5 10.5h6' stroke='%2300A6FF'/%3E%3Ccircle cx='10.5' cy='10.5' r='1' fill='%2300D9A6' stroke='none'/%3E%3C/svg%3E"); }
.ramon-int-ico--shield { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8l7.5 3v5.6c0 4.6-3.1 8.4-7.5 9.8-4.4-1.4-7.5-5.2-7.5-9.8V5.8z' stroke='%23125B9A'/%3E%3Cpath d='M8.6 12.2l2.4 2.4 4.4-4.6' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
@media screen and (max-width: 1024px) {
  .ramon-course-v2 main .integrations-logos.ramon-int-trial { padding-block: 30px; }
  .ramon-course-v2 main .integrations-logos.ramon-int-trial:nth-child(1 of .ramon-int-trial) { margin-top: 36px; }
  .ramon-course-v2 main .integrations-logos.ramon-int-trial:nth-last-child(1 of .ramon-int-trial) { margin-bottom: 36px; }
  .ramon-course-v2 main .ramon-int-trial .titles-box { flex-direction: column; gap: 14px; margin: 0 20px; }
  .ramon-course-v2 main .ramon-int-trial + .ramon-int-trial .titles-box { padding-top: 30px; margin-top: -30px; }
  .ramon-course-v2 main .ramon-int-trial .titles-box h2 { flex: none; max-width: none; font-size: 27px; line-height: 1.3; margin: 0; }
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body { max-width: none; width: 100%; }
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body p,
  .ramon-course-v2 main .ramon-int-trial .ramon-int-list li { font-size: 16px; line-height: 1.7; }
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body > p,
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body > ul { margin-bottom: 16px; }
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body > p.ramon-int-lead { margin-bottom: 10px; }
  .ramon-course-v2 main .ramon-int-trial .ramon-int-body > :last-child { margin-bottom: 0; }
}
/* ===== end DESIGN TRIAL ===== */
/* extra line icons for course tool lists (same stroke style/colours as the cyber set) - AI course */
.ramon-int-ico--chart { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 3.5v17h17' stroke='%23125B9A'/%3E%3Cpath d='M7 15l4-4.5 3 3 5.5-6' stroke='%2300A6FF'/%3E%3Ccircle cx='19.5' cy='7.5' r='1.2' fill='%2300D9A6' stroke='none'/%3E%3C/svg%3E"); }
.ramon-int-ico--neural { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l6 6M6 12h6M6 18l6-6M12 12l6-6M12 12h6M12 12l6 6' stroke='%23125B9A'/%3E%3Ccircle cx='5' cy='6' r='1.8' stroke='%2300A6FF'/%3E%3Ccircle cx='5' cy='12' r='1.8' stroke='%2300A6FF'/%3E%3Ccircle cx='5' cy='18' r='1.8' stroke='%2300A6FF'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%23FFFFFF' stroke='%23125B9A'/%3E%3Ccircle cx='19' cy='6' r='1.8' stroke='%2300D9A6'/%3E%3Ccircle cx='19' cy='12' r='1.8' stroke='%2300D9A6'/%3E%3Ccircle cx='19' cy='18' r='1.8' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--text { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5h16v10.5H10l-4.5 3.5V16H4z' stroke='%23125B9A'/%3E%3Cpath d='M8 9.5h8' stroke='%2300A6FF'/%3E%3Cpath d='M8 12.5h5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
/* extra line icons for course tool lists - digital marketing course (same stroke style/colours) */
.ramon-int-ico--ads { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10v4h3l7 4.5v-13L7 10z' stroke='%23125B9A'/%3E%3Cpath d='M17.5 9.5a3.5 3.5 0 0 1 0 5' stroke='%2300A6FF'/%3E%3Cpath d='M7 14l1.2 4.5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--report { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2' stroke='%23125B9A'/%3E%3Cpath d='M8 16v-3M12 16v-6M16 16v-4.5' stroke='%2300A6FF'/%3E%3Cpath d='M8 7h5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
/* extra line icons for course tool lists - QA course (same stroke style/colours) */
.ramon-int-ico--web { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='15' rx='2' stroke='%23125B9A'/%3E%3Cpath d='M3 9h18' stroke='%2300A6FF'/%3E%3Cpath d='M9 14.5l2 2 4-4' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--api { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h12M13 5l3 3-3 3' stroke='%23125B9A'/%3E%3Cpath d='M20 16H8M11 13l-3 3 3 3' stroke='%2300A6FF'/%3E%3Ccircle cx='19.5' cy='8' r='1.2' fill='%2300D9A6' stroke='none'/%3E%3C/svg%3E"); }
.ramon-int-ico--mobile { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.5' width='11' height='19' rx='2.2' stroke='%23125B9A'/%3E%3Cpath d='M10.5 18.5h3' stroke='%2300A6FF'/%3E%3Cpath d='M9.5 10.5l1.8 1.8 3.2-3.3' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--pipeline { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5' cy='12' r='2.2' stroke='%23125B9A'/%3E%3Ccircle cx='12' cy='12' r='2.2' stroke='%2300A6FF'/%3E%3Ccircle cx='19' cy='12' r='2.2' stroke='%2300D9A6'/%3E%3Cpath d='M7.2 12h2.6M14.2 12h2.6' stroke='%23125B9A'/%3E%3Cpath d='M17 6.5a8 8 0 0 0-10 0' stroke='%2300A6FF'/%3E%3C/svg%3E"); }
/* QA course (542): its program cards have short texts, so on mobile the card became wider than the folder frame SVG
   (360x255) and the frame shrank inside it. Keep at least the frame's proportions; the card still grows with its text. */
.postid-542.ramon-course-v2 main .cards-section.layout-2 .card-item,
.postid-543.ramon-course-v2 main .cards-section.layout-2 .card-item,
.postid-7333.ramon-course-v2 main .cards-section.layout-2 .card-item { aspect-ratio: 360 / 255; min-height: auto; height: auto; }   /* + Full Stack (2026-10-06): card 3 is short on mobile */
/* course content sections: optional sub-headings inside a section (Full Stack curriculum) - black, same weight as the headings, body size */
.ramon-course-v2 main .ramon-int-trial .ramon-int-body > h3.ramon-int-sub {
  margin: 0 0 6px;
  font-family: "Heebo", sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.4;
  color: #111111;
  text-align: right;
}
@media screen and (max-width: 1024px) { .ramon-course-v2 main .ramon-int-trial .ramon-int-body > h3.ramon-int-sub { font-size: 17px; } }
/* extra line icons for course tool lists - Full Stack course (same stroke style/colours) */
.ramon-int-ico--layout { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2' stroke='%23125B9A'/%3E%3Cpath d='M3 9h18M9 9v11' stroke='%2300A6FF'/%3E%3Cpath d='M12.5 13h5.5M12.5 16.5h3.5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--cursor { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4l11 6.5-4.8 1.3L10 16.5z' stroke='%23125B9A'/%3E%3Cpath d='M12.2 11.8l4.3 6.2' stroke='%2300A6FF'/%3E%3Cpath d='M4 13.5a6 6 0 0 0 4 5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }
.ramon-int-ico--server { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='7' rx='1.6' stroke='%23125B9A'/%3E%3Crect x='4' y='13' width='16' height='7' rx='1.6' stroke='%23125B9A'/%3E%3Cpath d='M7.5 7.5h4M7.5 16.5h4' stroke='%2300A6FF'/%3E%3Ccircle cx='16.5' cy='7.5' r='1' fill='%2300D9A6' stroke='none'/%3E%3Ccircle cx='16.5' cy='16.5' r='1' fill='%2300D9A6' stroke='none'/%3E%3C/svg%3E"); }
.ramon-int-ico--database { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5.5' rx='7' ry='2.5' stroke='%23125B9A'/%3E%3Cpath d='M5 5.5v13c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5v-13' stroke='%23125B9A'/%3E%3Cpath d='M5 10c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5' stroke='%2300A6FF'/%3E%3Cpath d='M5 14.5c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5' stroke='%2300D9A6'/%3E%3C/svg%3E"); }

/* ---------- About page only (.page-id-351; 2026-10-06) ----------
   Same language as the approved course pages: Heebo, black text, one heading weight, thin light-blue separator
   inside the content width, tighter rhythm (desktop 56px / mobile 36px). The certifications block below is the
   approved home component (shared rules above, .page-id-351 added there). */
.page-id-351 main .inner-hero h1,
.page-id-351 main .content-section h2 {
  font-family: "Heebo", sans-serif;
  font-weight: 600;
  color: #111111;
  text-wrap: balance;
}
.page-id-351 main .inner-hero p,
.page-id-351 main .content-section .editor-area,
.page-id-351 main .content-section .editor-area p {
  font-family: "Heebo", sans-serif;
  font-weight: 400;
  color: #111111;
  font-size: max(16px, 1.0625rem);
  line-height: 1.65;
  text-align: right;
}
.page-id-351 main .content-section .editor-area h2 { margin-bottom: 16px; }
.page-id-351 main .content-section .editor-area p { margin: 0 0 18px; }
.page-id-351 main .content-section .editor-area p:last-child { margin-bottom: 0; }
.page-id-351 main .content-section {
  margin-block: 0;
  padding-block: 56px;
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(0, 166, 255, 0.05) 100%);
}
.page-id-351 main .content-section > .container::before {
  content: "";
  position: absolute;
  top: -56px;
  inset-inline: 17.0625rem;
  height: 1px;
  background: rgba(0, 166, 255, 0.16);
}
.page-id-351 main .content-section > .container { align-items: center; }
.page-id-351 main .inner-hero { padding-bottom: 56px; }
.page-id-351 main .quality-section { margin-top: 56px; }
@media screen and (max-width: 1024px) {
  .page-id-351 main .content-section { padding-block: 36px; }
  .page-id-351 main .content-section > .container::before { top: -36px; inset-inline: 16px; }
  .page-id-351 main .content-section .media-wrapper { margin-top: 28px; }
  .page-id-351 main .inner-hero { padding-bottom: 36px; }
  .page-id-351 main .inner-hero h1 { margin-bottom: 16px; }
  .page-id-351 main .inner-hero picture { margin-top: 0; }
  .page-id-351 main .quality-section { margin-top: 0; }
}
.page-id-351 main .content-section h2 { font-size: clamp(30px, 2.5vw, 36px); line-height: 1.25; }
@media screen and (max-width: 1024px) { .page-id-351 main .content-section h2 { font-size: 27px; line-height: 1.3; } }

/* ---------- Placement page only (.page-id-420; 2026-10-06) ----------
   Uses the approved course-page system (body.ramon-course-v2 via page flag) + an open three-focus block
   (.ramon-focus) instead of the folder frames. Nothing here matches the external lead launcher. */
.page-id-420 main > section.inner-hero { margin-top: 0; }
.page-id-420 main .inner-hero .page-title { font-family: "Heebo", sans-serif; font-weight: 600; color: #111111; }
.page-id-420 main .inner-hero .titles-box p {
  font-family: "Heebo", sans-serif; font-weight: 400; color: #111111;
  font-size: max(16px, 1.0625rem); line-height: 1.65; text-align: right; margin: 0 0 24px;
}
.page-id-420 main .inner-hero .media-wrapper img { width: 100%; height: auto; object-fit: contain; }
.page-id-420 main .ramon-focus { margin-block: 0; padding-block: 56px; background: linear-gradient(180deg, #FFFFFF 0%, rgba(0, 166, 255, 0.05) 100%); }
.page-id-420 main .ramon-focus .container { display: block; }
.page-id-420 main .ramon-focus__head { max-width: 48rem; margin: 0 0 36px; }
.page-id-420 main .ramon-focus__head h2 { margin: 0 0 16px; color: #111111; font-family: "Heebo", sans-serif; font-weight: 600; font-size: clamp(34px, 2.5vw, 38px); line-height: 1.25; }
.page-id-420 main .ramon-focus__head p { margin: 0; font-family: "Heebo", sans-serif; font-size: 17px; line-height: 1.7; color: #111111; text-align: right; }
.page-id-420 main .ramon-focus__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start;
}
.page-id-420 main .ramon-focus__item { padding: 4px 32px 0; border-inline-start: 1px solid rgba(0, 166, 255, 0.22); }
.page-id-420 main .ramon-focus__item:first-child { padding-inline-start: 0; border-inline-start: 0; }
.page-id-420 main .ramon-focus__item:last-child { padding-inline-end: 0; }
.page-id-420 main .ramon-focus__num {
  display: inline-block; margin-bottom: 12px; padding-bottom: 6px;
  font-family: "Heebo", sans-serif; font-weight: 700; font-size: 18px; line-height: 1; letter-spacing: 0.04em;
  color: #125B9A; border-bottom: 2px solid #00D9A6;
}
.page-id-420 main .ramon-focus__item h3 { margin: 0 0 10px; font-family: "Heebo", sans-serif; font-weight: 600; font-size: 21px; line-height: 1.35; color: #111111; }
.page-id-420 main .ramon-focus__item p { margin: 0; font-family: "Heebo", sans-serif; font-size: 17px; line-height: 1.7; color: #111111; text-align: right; }
@media screen and (max-width: 1024px) {
  .page-id-420 main .ramon-focus { padding-block: 36px; }
  .page-id-420 main .ramon-focus .container { padding-inline: 20px; }
  .page-id-420 main .ramon-focus__head { margin-bottom: 20px; }
  .page-id-420 main .ramon-focus__head h2 { font-size: 27px; line-height: 1.3; }
  .page-id-420 main .ramon-focus__head p, .page-id-420 main .ramon-focus__item p { font-size: 16px; }
  .page-id-420 main .ramon-focus__list { grid-template-columns: 1fr; }
  .page-id-420 main .ramon-focus__item,
  .page-id-420 main .ramon-focus__item:first-child { padding: 20px 0; border-inline-start: 0; border-top: 1px solid rgba(0, 166, 255, 0.22); }
  .page-id-420 main .ramon-focus__item:last-child { padding-bottom: 0; }
  .page-id-420 main .ramon-focus__item h3 { font-size: 19px; }
}
/* small check marks for the profile list (placement) */
.ramon-int-ico--check { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5' stroke='%2300A6FF' stroke-opacity='.45'/%3E%3Cpath d='M8.2 12.3l2.6 2.6 5-5.4' stroke='%23125B9A'/%3E%3C/svg%3E"); }
/* placement: hero -> focus -> industry rhythm (no stacked margin + padding) */
.page-id-420 main > section.inner-hero { margin-bottom: 0; padding-bottom: 40px; }
.page-id-420 main .ramon-focus { margin-block: 0; }
.page-id-420 main .ramon-focus + .integrations-logos.ramon-int-trial { margin-top: 0; padding-top: 56px; }
@media screen and (max-width: 1024px) {
  .page-id-420 main > section.inner-hero { padding-bottom: 28px; }
  .page-id-420 main .ramon-focus + .integrations-logos.ramon-int-trial { padding-top: 36px; }
}
.page-id-420 main > section.ramon-focus { margin-block: 0; }
.page-id-420 main > section.ramon-focus + section.integrations-logos.ramon-int-trial { margin-top: 0; }

/* ---------- Press page only (.page-id-8568; 2026-10-06) ----------
   Compact hero (no image/button) + 7 static press cards (no links, no hover). White, Heebo, black text, thin light frames. */
.page-id-8568 main .inner-hero { padding-bottom: 8px; }
.page-id-8568 main .inner-hero .container { justify-content: flex-start; }
.page-id-8568 main .inner-hero .titles-box { width: 100%; max-width: none; }
.page-id-8568 main .inner-hero .page-title { font-family: "Heebo", sans-serif; font-weight: 600; color: #111111; margin-bottom: 12px; }
.page-id-8568 main .inner-hero .page-title b { font-weight: 600; }
.page-id-8568 main .inner-hero .titles-box p { margin: 0; font-family: "Heebo", sans-serif; font-weight: 400; font-size: max(16px, 1.0625rem); line-height: 1.6; color: #111111; }
.page-id-8568 main .content-section { margin-block: 32px 72px; }
.page-id-8568 main .content-section .container { padding-inline: 10rem; }
.page-id-8568 main .content-section .content { width: 100%; max-width: none; }
.page-id-8568 main .content-section .media-wrapper { display: none; }
.page-id-8568 .ramon-press { direction: rtl; }
.page-id-8568 .ramon-press__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; align-items: stretch;
}
.page-id-8568 .ramon-press__card {
  grid-column: span 2; margin: 0; padding: 24px 24px 26px;
  display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start;
  background: #FFFFFF; border: 1px solid rgba(0, 166, 255, 0.22); border-top: 3px solid #00A6FF; border-radius: 12px;
  text-align: right; cursor: default; list-style: none;
}
.page-id-8568 .ramon-press__card:nth-child(2n) { border-top-color: #00D9A6; }
.page-id-8568 .ramon-press__card:last-child:nth-child(3n + 1) { grid-column: 3 / span 2; }
.page-id-8568 .ramon-press__logo { height: 56px; display: flex; align-items: center; justify-content: flex-start; margin: 0 0 14px; }
.page-id-8568 .ramon-press__logo img { display: block; width: auto; height: auto; max-height: 44px; max-width: 170px; object-fit: contain; }
.page-id-8568 .ramon-press__card--bizportal .ramon-press__logo img { max-height: 40px; }
.page-id-8568 .ramon-press__card--arutz7 .ramon-press__logo img { max-height: 52px; }
.page-id-8568 .ramon-press__card--timeout .ramon-press__logo img,
.page-id-8568 .ramon-press__card--walla .ramon-press__logo img { max-height: 40px; }
.page-id-8568 .ramon-press__outlet { margin: 0 0 8px; font-family: "Heebo", sans-serif; font-weight: 500; font-size: 14px; line-height: 1.4; color: #125B9A; }
.page-id-8568 .ramon-press__title { margin: 0 0 10px; font-family: "Heebo", sans-serif; font-weight: 700; font-size: 20px; line-height: 1.35; color: #111111; }
.page-id-8568 .ramon-press__quote { margin: 0; font-family: "Heebo", sans-serif; font-weight: 400; font-size: 16px; line-height: 1.65; color: #111111; text-align: right; }
@media screen and (max-width: 1024px) {
  .page-id-8568 main .content-section { margin-block: 24px 48px; }
  .page-id-8568 main .content-section .container { padding-inline: 20px; }
  .page-id-8568 .ramon-press__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .page-id-8568 .ramon-press__card, .page-id-8568 .ramon-press__card:last-child:nth-child(3n + 1) { grid-column: auto; }
}
@media screen and (max-width: 640px) {
  .page-id-8568 .ramon-press__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .page-id-8568 .ramon-press__card { padding: 20px 20px 22px; }
  .page-id-8568 .ramon-press__title { font-size: 19px; }
}
@media screen and (max-width: 1024px) { .page-id-8568 main .inner-hero .titles-box { margin-bottom: 0; } }

/* ---------- Contact page only (.page-id-88; 2026-10-06) ----------
   Heebo/black hero, larger illustration (whole image, no crop), compact rhythm with a thin separator,
   decoration kept but smaller. The site-wide CF7/footer forms and the external lead launcher are not targeted. */
.page-id-88 main .inner-hero .page-title { font-family: "Heebo", sans-serif; font-weight: 700; color: #111111; text-wrap: balance; }
.page-id-88 main .inner-hero .titles-box p { font-family: "Heebo", sans-serif; font-weight: 400; font-size: max(16px, 1.0625rem); line-height: 1.65; color: #111111; text-align: right; }
.page-id-88 main .inner-hero .media-wrapper img { width: 100%; height: auto; object-fit: contain; }
@media screen and (min-width: 1025px) {
  .page-id-88 main .inner-hero { padding-bottom: 40px; }
  .page-id-88 main .inner-hero .container { align-items: center; }
  .page-id-88 main .inner-hero .media-wrapper { width: 36rem; max-width: 42%; height: auto; }
  .page-id-88 main .contact-page { padding-top: 48px; padding-bottom: 64px; }
  .page-id-88 main .contact-page .media-wrapper img { width: 22rem; height: auto; }
}
.page-id-88 main .contact-page > .container::before {
  content: ""; position: absolute; top: -48px; inset-inline: 10rem; height: 1px; background: rgba(0, 166, 255, 0.16);
}
.page-id-88 main .contact-page .form-wrapper h2 { font-family: "Heebo", sans-serif; font-weight: 600; }
.page-id-88 main .contact-page .wpcf7-not-valid-tip { font-family: "Heebo", sans-serif; font-size: 14px; }
@media screen and (max-width: 1024px) {
  .page-id-88 main .inner-hero { padding-bottom: 28px; }
  .page-id-88 main .inner-hero .titles-box { margin-bottom: 20px; }
  .page-id-88 main .contact-page { padding-top: 32px; padding-bottom: 40px; }
  .page-id-88 main .contact-page > .container::before { top: -32px; inset-inline: 16px; }
  .page-id-88 main .contact-page .media-wrapper { margin-top: 28px; }
  .page-id-88 main .contact-page .media-wrapper img { width: 55%; height: auto; margin-inline: auto; display: block; }
}

/* ---------- Header: "לימודי הייטק" course items, Hebrew line + smaller English line (labels set in the menu data; 2026-10-06) ---------- */
.main-menu .sub-menu .ramon-menu-he,
.mobile-menu .sub-menu .ramon-menu-he { display: block; font-family: "Heebo", sans-serif; font-weight: 600; color: #111111; line-height: 1.3; }
.main-menu .sub-menu .ramon-menu-en,
.mobile-menu .sub-menu .ramon-menu-en { display: block; font-family: "Heebo", sans-serif; font-weight: 400; color: #111111; opacity: 0.72; line-height: 1.3; direction: ltr; text-align: right; unicode-bidi: isolate; }
@media screen and (min-width: 1025px) {
  .main-menu .sub-menu { width: auto; min-width: 16rem; padding: 0.5rem; background: #FFFFFF; box-shadow: 0 0.5rem 1.5rem rgba(18, 91, 154, 0.12); border: 1px solid rgba(0, 166, 255, 0.14); }
  .main-menu .sub-menu a { padding: 0.55rem 0.85rem; white-space: nowrap; transition: background-color 0.2s ease; }
  .main-menu .sub-menu a:hover, .main-menu .sub-menu a:focus-visible { background: rgba(0, 166, 255, 0.08); }
  .main-menu .sub-menu a:hover .ramon-menu-he, .main-menu .sub-menu a:focus-visible .ramon-menu-he { color: #125B9A; }
  .main-menu .sub-menu .ramon-menu-he { font-size: 15px; }
  .main-menu .sub-menu .ramon-menu-en { font-size: 12.5px; margin-top: 2px; }
}
@media screen and (max-width: 1024px) {
  .mobile-menu .sub-menu a { opacity: 1; padding-block: 0.5rem; }
  .mobile-menu .sub-menu li:not(:last-child) { margin-bottom: 0.35rem; }
  .mobile-menu .sub-menu .ramon-menu-he { font-size: 16px; }
  .mobile-menu .sub-menu .ramon-menu-en { font-size: 13px; margin-top: 1px; }
}

/* ---------- Footer after removing "עולם תוכן" + "פרטי התקשרות" (2026-10-06): one compact links row ----------
   Scoped to footer.footer .footer-menus / .footer__main - nothing here can match the external lead launcher. */
.footer .footer-menus > ul { display: block; }
.footer .footer-menus .menu-item-has-children > a { font-family: "Heebo", sans-serif; font-weight: 600; font-size: 16px; color: #111111; }
.footer .footer-menus .sub-menu { display: flex; flex-wrap: wrap; gap: 10px 24px; padding-top: 12px; }
.footer .footer-menus .sub-menu li { margin: 0 !important; }
.footer .footer-menus .sub-menu a { font-family: "Heebo", sans-serif; font-weight: 400; font-size: 16px; line-height: 1.4; color: #111111; }
@media screen and (min-width: 1025px) {
  .footer .footer__main { gap: 32px; }
  .footer .footer-menus { width: auto; padding-top: 0; }
  .footer .footer-menus .sub-menu a:hover { color: #125B9A; }
}
@media screen and (max-width: 1024px) {
  .footer .footer__main { gap: 28px; }
  .footer .footer-menus .menu-item-has-children > a { pointer-events: none; }
  .footer .footer-menus .menu-item-has-children > a::after { display: none; }
  .footer .footer-menus .sub-menu { display: flex !important; justify-content: center; gap: 10px 20px; }
}

/* ===================== Mobile fixes round (2026-10-07) - all rules inside max-width:1024px unless noted =====================
   Desktop approved design unchanged. Nothing here targets the lead widget. */

/* course cards (all widths): no -webkit-box on the title - iOS Safari can mis-size -webkit-box text inside the
   flex column and let the next line overlap; the description already uses display:block on home */
.courses-slider .course-item__title { display: block; }
.courses-slider .course-item .content > * { flex-shrink: 0; }

@media screen and (max-width: 1024px) {
  /* 1. home: industry partners - larger heading in readable lines, light brand frame (slider mechanics untouched) */
  .page-id-8 .logos-section {
    margin: 12px 16px 0;
    padding: 18px 0 14px;
    border: 1px solid rgba(0, 166, 255, 0.28);
    border-radius: 16px;
    background: #FFFFFF;
    overflow: hidden;
  }
  .page-id-8 .logos-section h2 {
    font-family: "Heebo", sans-serif;
    font-size: 16.5px;
    font-weight: 500;
    line-height: 1.5;
    color: #111111;
    padding-inline: 18px;
    margin-bottom: 14px;
    text-wrap: balance;
  }

  /* 3. certifications (home + about): larger logo band, centred at the top of each card */
  .page-id-8 .quality-section .item .logos,
  .page-id-351 .quality-section .item .logos { height: 6rem; justify-content: center; margin-bottom: 18px; }
  .page-id-8 .quality-section .item .logos img,
  .page-id-351 .quality-section .item .logos img { height: 100%; max-width: 78%; object-fit: contain; }

  /* 4. enrichment tools (home + course pages, same component): wrapped grid instead of a sideways row */
  .ramon-tags-home .ramon-tags__row { overflow: visible; direction: rtl; padding-inline: 16px; }
  .ramon-tags-home .ramon-tags__track {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px 16px;
    width: 100%;
    flex-shrink: 1;
    padding: 0;
  }
  .ramon-tags-home .ramon-tags__track[aria-hidden="true"] { display: none; }
  .ramon-tags-home .ramon-tag { white-space: normal; align-items: flex-start; min-width: 0; font-size: 15.5px; }
  .ramon-tags-home .ramon-tag span { min-width: 0; overflow-wrap: anywhere; }
  .ramon-tags-home .ramon-tags { gap: 12px; }

  /* 5. mobile menu: course items with thin separators and an even, comfortable tap area */
  .mobile-menu .sub-menu li { margin: 0 !important; border-bottom: 1px solid rgba(0, 166, 255, 0.16); }
  .mobile-menu .sub-menu li:last-child { border-bottom: 0; }
  .mobile-menu .sub-menu a { display: block; padding-block: 10px; min-height: 44px; }
}

/* 6. mobile whitespace (2026-10-07): measured slack only, per component; decorative images kept */
@media screen and (max-width: 1024px) {
  /* FAQ -> footer: ~120px empty under the last question (+36px margin on course pages) */
  main > section.faq-section.ramon-faq-home { padding-bottom: 40px; }
  .ramon-course-v2 main > section.faq-section.ramon-faq-home,
  .page-id-420 main > section.faq-section.ramon-faq-home { margin-bottom: 0; }
  /* footer: logo box was 186px tall for a ~100px logo; 57px gaps between logo, text and form */
  /* main.css sets .footer__img height 11.625rem !important on mobile - same strength needed here */
  .footer .footer__img { height: 6.75rem !important; } /* img is absolute + contain: box height = logo height (~101px at 358px width) */
  .footer .footer__form { gap: 28px; }
  .footer .footer__inner { gap: 24px; }
  /* certifications (home + about): 113px bottom padding under the last card */
  .page-id-8 main > section.quality-section,
  .page-id-351 main > section.quality-section { padding-bottom: 56px; }
  /* home: large margins between hero text block / learning-method folders and the next section */
  .page-id-8 main > section.content-section.layout-3 { margin-bottom: 56px; }
  .page-id-8 main > section.folders-section { margin-bottom: 56px; }
}

/* ---------- Certifications: new logo files (2026-10-07, home + about, all widths) ----------
   Display copies (uploads/2026/10/, WebP since 2026-10-09) are trimmed of transparent margins only and sized for 3x screens.
   aspect-ratio is required: WordPress gives these images sizes="auto", and Chrome then sizes them with contain:size, so width:auto collapses to 0 without it. Each logo gets its own height
   (proportions kept, object-fit: contain); the standards-institute source is 192px tall, so it stays at max 96px (sharp at 2x). */
.page-id-8 .quality-section .item .logos,
.page-id-351 .quality-section .item .logos {
  height: 112px;
  justify-content: center;
  align-items: center;
  margin: 0 0 18px;
}
.page-id-8 .quality-section .item .logos img,
.page-id-351 .quality-section .item .logos img {
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
.page-id-8 .quality-section .item .logos img[src*="ministry-of-defense-recognized-supplier"],
.page-id-351 .quality-section .item .logos img[src*="ministry-of-defense-recognized-supplier"] { height: 104px; aspect-ratio: 315 / 312; }
.page-id-8 .quality-section .item .logos img[src*="ministry-of-labor-placement-license"],
.page-id-351 .quality-section .item .logos img[src*="ministry-of-labor-placement-license"] { height: 96px; aspect-ratio: 438 / 251; }
.page-id-8 .quality-section .item .logos img[src*="standards-institution-of-israel-iso-9001"],
.page-id-351 .quality-section .item .logos img[src*="standards-institution-of-israel-iso-9001"] { height: 96px; aspect-ratio: 172 / 192; }
.page-id-8 .quality-section .item .logos img[src*="ariel-university-external-studies"],
.page-id-351 .quality-section .item .logos img[src*="ariel-university-external-studies"] { height: 112px; aspect-ratio: 539 / 348; }

/* ---------- Home fixes (2026-10-12) ----------
   1. Courses intro (.courses-slider): the paragraph under "העתיד שלכם מתחיל בבחירה" was removed in the ACF field
      (the template prints no <p> when it is empty). Desktop: the title moves 3rem down and the slider 3rem up (same total),
      so the title sits closer to the light-blue panel; +2.625rem bottom padding keeps the panel's background-size:contain
      at its full width, as before. Mobile: no CSS change (the removed paragraph and its margin are simply gone).
   2. Certifications (.quality-section, desktop only, every page that shows it - home and about): main.css builds a
      5-column grid for 4 cards, which left an empty column on the left. With exactly 4 cards: 4 equal columns, same 2rem
      gap, same container padding on both sides. Mobile unchanged.
   Nothing here can match the external lead launcher. */
@media screen and (min-width: 1025px) {
  .page-id-8 .courses-slider .titles-box { padding-top: 7.125rem; }
  .page-id-8 .courses-slider .swiper-container { margin-top: 0; padding-top: 6.25rem; }
  .page-id-8 .courses-slider .content-part-2 { padding-bottom: 4.3125rem; }
  .quality-section .items:has(> .item:nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- Lecturers: shared cards (home + course pages, 2026-10-12) ----------
   parts/ramon-lecturers-list.php. Compact square photos (~200-220px desktop at 1440, 190px phone, centred),
   live name + role text in black, a small brand-gradient bar under the photo. Cards are not links.
   Everything hangs on .ramon-lecturers-* / .ramon-lecturer - nothing here can match the external lead launcher. */
.ramon-lecturers-section { position: relative; color: #111111; scroll-margin-top: 96px; }
.ramon-lecturers-section__title { color: #111111; margin: 0; }
.ramon-lecturers-list { list-style: none; margin: 0; padding: 0; direction: rtl; }
.ramon-lecturer { margin: 0; padding: 0; min-width: 0; cursor: default; text-align: right; }
.ramon-lecturer__photo { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 6px; background: #EEF6FC; }
.ramon-lecturer__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ramon-lecturer__accent {
  display: block;
  width: 36px;
  height: 5px;
  margin: 14px 0 10px;
  border-radius: 1px;
  background: linear-gradient(90deg, var(--ramon-mint) 0%, var(--ramon-cyan) 55%, var(--ramon-blue) 100%);
}
.ramon-lecturer__name { margin: 0 0 4px; font-family: "Heebo", sans-serif; font-weight: 700; line-height: 1.3; color: #111111; letter-spacing: 0; }
.ramon-lecturer__role { margin: 0; font-family: "Heebo", sans-serif; font-weight: 400; line-height: 1.45; color: #111111; overflow-wrap: break-word; }
.ramon-lecturers-home__text p { margin: 0 0 1em; font-family: "Heebo", sans-serif; font-weight: 400; color: #111111; line-height: 1.65; }
.ramon-lecturers-home__text p:last-child { margin-bottom: 0; }
.ramon-lecturers-home__text strong { font-weight: 700; color: #111111; }
.ramon-lecturers-home__intro .label-elem { background: var(--ramon-mint-light); color: #111111; }
.ramon-lecturers-home__intro .ramon-lecturers-section__title { margin-bottom: 1.25rem; }

@media screen and (min-width: 1025px) {
  /* card = 17.5rem (210px at 1440): 3 per row on the home page, one row on the course pages */
  .ramon-lecturers-list { display: flex; flex-wrap: wrap; justify-content: flex-start; column-gap: 3rem; row-gap: 2.5rem; }
  .ramon-lecturer { flex: 0 0 17.5rem; width: 17.5rem; }
  .ramon-lecturer__name { font-size: max(1.625rem, 16px); }
  .ramon-lecturer__role { font-size: max(1.375rem, 14px); min-height: 2.9em; } /* room for a 2-line role: even cards */
  .ramon-lecturers-list--grid3 { width: calc(3 * 17.5rem + 2 * 3rem); }

  /* home: intro on the right, 3x3 cards on the left (like the folders section above it) */
  .ramon-lecturers-home .container { display: flex; justify-content: space-between; align-items: flex-start; gap: 5rem; }
  .ramon-lecturers-home__intro { flex: 1 1 auto; max-width: 34rem; }
  .ramon-lecturers-home__text p { font-size: max(1.5rem, 15px); }
  .ramon-lecturers-home .ramon-lecturers-list { flex: 0 0 auto; }
  .page-id-8 main > section.ramon-lecturers-home { margin-block: -4rem 0; padding-block: 0; } /* the folders section ends in ~10rem of padding + margin */
  .page-id-8 main > section.ramon-lecturers-home + section.courses-tags { margin-top: 5rem; }

  /* course pages: title, then the course's cards in one row from the right */
  .ramon-lecturers-course { margin-block: 5rem; }
  .ramon-lecturers-course .ramon-lecturers-section__title { margin-bottom: 2.5rem; }
  /* 1-3 lecturers: title in the right column, cards from the content column (x of the content sections below) */
  .ramon-lecturers-course--side .container { display: flex; align-items: flex-start; }
  .ramon-lecturers-course--side .ramon-lecturers-section__title { flex: 0 0 40rem; margin-bottom: 0; }
}

@media screen and (max-width: 1024px) {
  /* phones: one card per row, photo centred at 190px (not full width); tablets: same, 2 per row */
  .ramon-lecturers-list { display: grid; grid-template-columns: minmax(0, 220px); justify-content: center; row-gap: 32px; margin-top: 28px; }
  .ramon-lecturer { text-align: center; }
  .ramon-lecturer__photo { width: 190px; max-width: 100%; margin-inline: auto; }
  .ramon-lecturer__accent { margin-inline: auto; }
  .ramon-lecturer__name { font-size: 19px; }
  .ramon-lecturer__role { font-size: 16px; }
  .ramon-lecturers-home__intro .label-elem { font-size: min(0.875rem, 15px); padding: 6px 10px 6px 12px; gap: 4px; margin-bottom: 12px; }
  .ramon-lecturers-section__title { font-size: min(2rem, 32px); }
  .ramon-lecturers-home__text p { font-size: 17px; }
  .page-id-8 main > section.ramon-lecturers-home { margin-block: -32px 0; padding-block: 0; }
  .page-id-8 main > section.ramon-lecturers-home + section.courses-tags { margin-top: 48px; }
  .ramon-lecturers-course { margin-block: 48px; }
}
@media screen and (min-width: 600px) and (max-width: 1024px) {
  .ramon-lecturers-list { grid-template-columns: repeat(2, minmax(0, 220px)); column-gap: 32px; }
  .ramon-lecturers-list--n1 { grid-template-columns: minmax(0, 220px); }
}