/* ==========================================================================
   The article's shared parts (Guy 1.11.26, inc/sapir-article.php): share + AI row, the newsletter strip mid-text,
   the webinar banner (dark, Sap), "תכניות הליווי". Loads after blog-soon.css on the article only. Every value a token.
   ========================================================================== */
.barticle__parts { display: grid; gap: var(--space-block); margin-block-start: var(--space-block); }
.barticle__parts > .ashare { max-inline-size: 720px; margin-inline: auto; inline-size: 100%; }

/* share row: "שיתוף" + equal icon buttons (48px, cut-soft tab), a tooltip from data-tip on hover and focus */
.ashare { position: relative; padding-block-start: 32px; border-block-start: 1px solid var(--border-subtle); }
.ashare__t { font-size: var(--fs-h3); line-height: var(--lh-h3); font-weight: var(--fw-semibold); color: var(--wine-950); }
.ashare__row { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ashare__row > li { display: flex; }
.ashare__btn { position: relative; display: inline-flex; align-items: center; justify-content: center; inline-size: 48px; block-size: 48px; padding: 0; border: 0; border-radius: 50%; background: var(--cream-100);
  font: inherit; color: var(--wine-950); text-decoration: none; cursor: pointer; transition: background-color var(--dur-fast) ease, color var(--dur-fast) ease; }
.ashare__ic { flex: none; }
@media (hover: hover) { .ashare__btn:hover { background: var(--wine-950); color: var(--cream-50); } }
.ashare__btn:active { background: var(--wine-950); color: var(--cream-50); }
.ashare__btn:focus-visible { outline: 2px solid var(--ruby-600); outline-offset: 3px; }
.ashare__btn::after { content: attr(data-tip); position: absolute; inset-block-end: calc(100% + 8px); inset-inline-start: 50%; translate: 50% 4px; padding: 6px 10px; background: var(--wine-950); color: var(--cream-50);
  font-size: var(--fs-label); line-height: 1.3; font-weight: var(--fw-medium); white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity var(--dur-fast) ease, translate var(--dur-fast) ease; z-index: 2; }
@media (hover: hover) { .ashare__btn:hover::after { opacity: 1; translate: 50% 0; } }
.ashare__btn:focus-visible::after { opacity: 1; translate: 50% 0; }
.ashare__row > li:first-child .ashare__btn::after { inset-inline-start: 0; translate: 0 4px; }
.ashare__row > li:last-child .ashare__btn::after { inset-inline-start: auto; inset-inline-end: 0; translate: 0 4px; }
@media (hover: hover) { .ashare__row > li:is(:first-child, :last-child) .ashare__btn:hover::after { translate: 0 0; } }
.ashare__row > li:is(:first-child, :last-child) .ashare__btn:focus-visible::after { translate: 0 0; }
/* phones: eight don't fit one line - two even rows of four */
@media (max-width: 479px) { .ashare__row { display: grid; grid-template-columns: repeat(4, 48px); gap: 12px; } }
.ashare__toast { min-block-size: 1.5em; margin-block-start: 16px; font-size: var(--fs-small); line-height: 1.5; font-weight: var(--fw-medium); color: var(--wine-950); }
.ashare__toast:empty { visibility: hidden; }

/* the newsletter strip, inside the text */
.barticle__body .anl { margin-block: var(--space-block); }
.anl { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px 20px; padding: 24px; background: var(--cream-100); border-inline-start: 2px solid var(--ruby-500); }
.anl__ic { display: block; inline-size: 40px; block-size: 40px; }
.anl__t { font-size: var(--fs-body); line-height: var(--lh-body); font-weight: var(--fw-semibold); color: var(--wine-950); text-wrap: balance; }
.anl__copy > * + * { margin-block-start: 4px; }
.barticle__body .anl__line, .anl__line { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--wine-950); text-wrap: pretty; }
.anl__btn { grid-column: 1 / -1; justify-self: start; }
.barticle__body .anl a.btn { color: var(--action-on-primary); text-decoration: none; }
@media (min-width: 768px) {
  .anl { grid-template-columns: auto minmax(0, 1fr) auto; padding: 24px 28px; }
  .anl__btn { grid-column: auto; }
}

/* "תכניות הליווי" */
.aplans { padding-block-start: 48px; border-block-start: 1px solid var(--border-subtle); }
.aplans__t { font-size: var(--fs-h2); line-height: var(--lh-h2); font-weight: var(--fw-semibold); color: var(--wine-950); text-wrap: balance; }
.aplans__line { margin-block-start: 12px; max-inline-size: 36em; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--wine-950); text-wrap: pretty; }
.aplans__cards { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: var(--space-tiles); }
@media (min-width: 768px) { .aplans__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.aplan { --box-cut: var(--cut-md); --box-cut-in: var(--cut-md-in); --box-fill: var(--cream-100); --box-stroke: var(--border-subtle); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 28px 24px 32px; }
.aplan__ic { display: block; inline-size: 48px; block-size: 48px; margin-block-end: 4px; }
.aplan__t { font-size: var(--fs-h3); line-height: var(--lh-h3); font-weight: var(--fw-semibold); color: var(--wine-950); text-wrap: balance; }
.aplan__line { font-size: var(--fs-body); line-height: var(--lh-body); color: var(--wine-950); text-wrap: pretty; }
.aplan__btn { margin-block-start: auto; transform-origin: center; }
@media (min-width: 1200px) { .aplan { padding: 36px 40px 40px; } }

@media (max-width: 480px) { .anl__btn, .aplan__btn { inline-size: 100%; } }
@media (prefers-reduced-motion: reduce) { .ashare__btn, .ashare__btn::after { transition: none; } }