/* ==========================================================================
   Article template (Post Single, Elementor 650), doors-starter 1.15.0
   Approved design: D3 article prototype, 2026-10-15.
   Tokens only (tokens.css). Logical properties only. Loaded on single posts.

   Elementor container classes used by the template:
     .ds-article-hero    navy hero (title, sub_title, meta)
     .ds-article-body    row: .ds-article-main (post content) + .ds-article-aside (TOC + card)
     .ds-article-faq-wrap, .ds-article-cta-wrap
   ========================================================================== */

.ds-article {
    --ds-header-h: 64px;
    --ds-aside-w: 18rem;
}
@media (min-width: 768px) {
    .ds-article { --ds-header-h: 80px; }
}

/* ---- shared ---------------------------------------------------------- */
.ds-article .ds-eyebrow {
    margin: 0 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--weight-medium);
    letter-spacing: var(--tracking-eyebrow);
    line-height: 1.3;
    color: var(--color-brand-deep);
}
.ds-article .ds-btn {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 48px;
    padding-inline: var(--space-6);
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--color-brand);
    color: var(--color-on-brand);
    font-family: var(--font-body);
    font-weight: var(--weight-display);
    font-size: var(--text-base);
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.ds-article .ds-btn:hover,
.ds-article .ds-btn:focus-visible {
    background: var(--color-brand-hover);
    color: var(--color-on-brand);
}
.ds-article :where(.ds-article-cta, .ds-article-sticky, .ds-toc) :focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}
.ds-article :where(.ds-article-cta--aside, .ds-article-cta--band) :focus-visible {
    outline-color: var(--color-accent);
}
.ds-article .headline-key { color: var(--color-brand-deep); }
.ds-article :where(.ds-article-hero, .ds-article-cta-wrap, .ds-article-cta--aside) .headline-key { color: var(--color-brand); }
.ds-article .headline-rule {
    display: inline-block;
    padding-block-end: var(--space-1);
    border-block-end: 2px solid var(--color-line-strong);
}

/* ---- hero ------------------------------------------------------------ */
.ds-article .ds-article-title {
    margin: 0;
    max-inline-size: 30ch;
    font-family: var(--font-display);
    font-size: var(--text-4xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-display);
    color: var(--color-ink-on-dark);
    text-wrap: balance;
}
.ds-article .ds-article-hero .elementor-heading-title { color: var(--color-ink-on-dark-muted); }
.ds-article .ds-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--text-xs);
    color: var(--color-ink-on-dark-muted);
}
.ds-article .ds-article-meta li + li {
    border-inline-start: 1px solid var(--color-line-on-dark);
    padding-inline-start: var(--space-4);
}
.ds-article .ds-article-meta strong {
    color: var(--color-ink-on-dark);
    font-weight: var(--weight-medium);
}
.ds-article .ds-article-hero .rank-math-breadcrumb,
.ds-article .ds-article-hero .rank-math-breadcrumb a { color: var(--color-ink-on-dark-muted); font-size: var(--text-xs); }
.ds-article .ds-article-hero .rank-math-breadcrumb a { color: var(--color-ink-on-dark); text-decoration: none; }
.ds-article .ds-article-hero .rank-math-breadcrumb a:hover { text-decoration: underline; }

/* ---- "בקצרה" --------------------------------------------------------- */
.ds-article .ds-article-summary {
    box-sizing: border-box;
    max-inline-size: 100%;
    padding: var(--space-5);
    background: var(--color-brand-tint);
    border-inline-start: 2px solid var(--color-line-strong);
}
.ds-article .ds-article-summary p:not(.ds-eyebrow) {
    margin: 0;
    font-size: var(--text-lg);
    line-height: 1.6;
    color: var(--color-ink);
}

/* ---- body: content + sidebar ----------------------------------------- */
.ds-article .ds-article-main {
    min-inline-size: 0;
}
.ds-article .ds-article-aside {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}
@media (min-width: 1025px) {
    .ds-article .e-con.ds-article-main {
        --width: auto;
        flex: 1 1 0;
        max-inline-size: none;
    }
    .ds-article .e-con.ds-article-aside {
        --width: var(--ds-aside-w);
        flex: 0 0 var(--ds-aside-w);
        align-self: flex-start;
        position: sticky;
        inset-block-start: calc(var(--ds-header-h) + var(--space-5));
    }
}

/* table of contents */
.ds-article .ds-toc {
    border: 1px solid var(--color-line);
    background: var(--color-surface-raised);
}
.ds-article .ds-toc summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-block-size: 52px;
    padding-inline: var(--space-4);
    list-style: none;
    cursor: pointer;
    font-weight: var(--weight-display);
    color: var(--color-ink);
}
.ds-article .ds-toc summary::-webkit-details-marker { display: none; }
.ds-article .ds-toc summary::after {
    content: "";
    inline-size: 9px;
    block-size: 9px;
    border-inline-end: 1.5px solid currentColor;
    border-block-end: 1.5px solid currentColor;
    transform: rotate(45deg);
}
.ds-article .ds-toc[open] summary::after { transform: rotate(-135deg); }
.ds-article .ds-toc.is-pinned summary { cursor: default; }
.ds-article .ds-toc.is-pinned summary::after { display: none; }
.ds-article .ds-toc ol {
    margin: 0;
    padding: 0 0 var(--space-3);
    list-style: none;
    counter-reset: ds-toc;
}
.ds-article .ds-toc li { counter-increment: ds-toc; margin: 0; }
.ds-article .ds-toc a {
    display: flex;
    gap: var(--space-3);
    align-items: baseline;
    min-block-size: 44px;
    padding-block: var(--space-2);
    padding-inline: var(--space-4);
    border-inline-start: 2px solid transparent;
    color: var(--color-ink-body);
    font-size: var(--text-sm);
    line-height: 1.4;
    text-decoration: none;
}
.ds-article .ds-toc a::before {
    content: counter(ds-toc, decimal-leading-zero);
    font-size: var(--text-2xs);
    color: var(--color-ink-muted);
    font-variant-numeric: tabular-nums;
}
.ds-article .ds-toc a:hover { color: var(--color-ink); background: var(--color-surface); }
.ds-article .ds-toc a[aria-current="true"] {
    border-inline-start-color: var(--color-line-strong);
    background: var(--color-brand-tint);
    color: var(--color-ink);
    font-weight: var(--weight-medium);
}

/* sidebar consultation card: desktop only (the sticky bar covers mobile) */
.ds-article .ds-article-cta--aside {
    display: none;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-5);
    background: var(--color-secondary);
    color: var(--color-ink-on-dark);
}
@media (min-width: 1025px) {
    .ds-article .ds-article-cta--aside { display: flex; }
}
.ds-article .ds-article-cta--aside .ds-eyebrow { margin: 0; color: var(--color-accent); }
.ds-article .ds-article-cta--aside p { margin: 0; }
.ds-article .ds-article-cta--aside .ds-article-cta__title {
    font-size: var(--text-lg);
    font-weight: var(--weight-display);
    line-height: 1.3;
    color: var(--color-ink-on-dark);
}
.ds-article .ds-article-cta--aside .ds-article-cta__text {
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-ink-on-dark-muted);
}
.ds-article .ds-article-cta--aside .ds-btn { inline-size: 100%; }
.ds-article .ds-article-cta__tel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 44px;
    color: var(--color-brand);
    font-weight: var(--weight-display);
    text-decoration: none;
}
.ds-article .ds-article-cta__tel:hover { color: var(--color-brand-hover); }
.ds-article .ds-article-cta--aside .ds-catalog-download { margin: 0; }
.ds-article .ds-article-cta--aside .ds-catalog-btn {
    inline-size: 100%;
    min-block-size: 44px;
    background: transparent;
    border: 1px solid var(--color-line-on-dark);
    border-radius: var(--radius-sm);
    color: var(--color-ink-on-dark);
}

/* ---- post content: headings, lists, tips, tables ---------------------- */
.ds-article .ds-article-content {
    max-inline-size: none;
    color: var(--color-ink-body);
}
.ds-article .ds-article-content > * + * { margin-block-start: var(--space-4); }
.ds-article .ds-article-content :where(p, li) { text-wrap: pretty; }
.ds-article .ds-article-content h2 {
    margin-block: var(--space-7) 0;
    font-size: var(--text-2xl);
    line-height: 1.25;
    color: var(--color-ink);
    scroll-margin-block-start: calc(var(--ds-header-h) + var(--space-5));
}
.ds-article .ds-article-content > h2:first-child { margin-block-start: 0; }
.ds-article .ds-article-content h3 {
    margin-block: var(--space-5) 0;
    font-size: var(--text-lg);
    line-height: 1.3;
    color: var(--color-ink);
    scroll-margin-block-start: calc(var(--ds-header-h) + var(--space-5));
}
.ds-article .ds-article-content h4 {
    margin-block: var(--space-4) 0;
    font-size: var(--text-base);
    color: var(--color-ink);
}
.ds-article .ds-article-content :where(ul, ol) {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding-inline-start: var(--space-5);
    padding-inline-end: 0;
}
.ds-article .ds-article-content li::marker { color: var(--color-brand-deep); }
.ds-article .ds-article-content strong { color: var(--color-ink); }
.ds-article .ds-article-content a { color: var(--color-brand-deep); text-underline-offset: .2em; }

/* tip box: auto-detected ("טיפ:", "המלצת הזהב:" …), [ds_tip], or the Gutenberg "טיפ" block style */
.ds-article .ds-tip,
.ds-article .is-style-ds-tip {
    max-inline-size: none;
    padding: var(--space-4);
    background: var(--color-surface-subtle);
    border-inline-start: 2px solid var(--color-line-strong);
    color: var(--color-ink-body);
}
.ds-article .ds-tip > :first-child,
.ds-article .is-style-ds-tip > :first-child { margin-block-start: 0; }
.ds-article .ds-tip > :last-child,
.ds-article .is-style-ds-tip > :last-child { margin-block-end: 0; }

/* tables */
.ds-article .ds-table-wrap,
.ds-article .ds-article-content .wp-block-table {
    overflow-x: auto;
    border: 1px solid var(--color-line);
    margin-inline: 0;
}
.ds-article .ds-article-content table {
    inline-size: 100%;
    margin: 0;
    border: 0;
    border-collapse: collapse;
    background: var(--color-surface-raised);
    font-size: var(--text-sm);
}
.ds-article .ds-article-content :where(th, td) {
    padding: var(--space-3) var(--space-4);
    border: 0;
    border-block-end: 1px solid var(--color-line);
    text-align: start;
    vertical-align: top;
}
.ds-article .ds-article-content th,
.ds-article .ds-article-content thead td,
.ds-article .ds-article-content tr:first-child > th,
.ds-article .ds-article-content table:not(:has(th, thead)) tr:first-child > td {
    background: var(--color-surface-subtle);
    color: var(--color-ink);
    font-weight: var(--weight-display);
}
.ds-article .ds-article-content tr:last-child > td { border-block-end: 0; }
.ds-article .ds-article-content tbody tr:nth-child(odd) > td { background: none; }
.ds-article .ds-article-content figcaption {
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-xs);
    color: var(--color-ink-muted);
}

/* ---- FAQ: the category / city design (frontend.css) is used as is ----- */
.ds-article .ds-article-faq { margin-block: 0; scroll-margin-block-start: calc(var(--ds-header-h) + var(--space-5)); }

/* ---- CTA band ---------------------------------------------------------- */
.ds-article .ds-article-cta--band {
    display: grid;
    gap: var(--space-5);
    align-items: center;
    color: var(--color-ink-on-dark);
}
@media (min-width: 768px) {
    .ds-article .ds-article-cta--band { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
}
.ds-article .ds-article-cta--band .ds-article-cta__title {
    margin: 0 0 var(--space-3);
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-display);
    color: var(--color-ink-on-dark);
    text-wrap: balance;
}
.ds-article .ds-article-cta--band .ds-article-cta__text {
    margin: 0;
    max-inline-size: var(--measure);
    color: var(--color-ink-on-dark-muted);
}
.ds-article .ds-article-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3) var(--space-5);
    align-items: center;
}
.ds-article .ds-article-cta--band .ds-article-cta__tel { font-size: var(--text-xl); }
@media (max-width: 767.98px) {
    .ds-article .ds-article-cta--band .ds-btn { inline-size: 100%; }
}

/* ---- mobile sticky bar -------------------------------------------------- */
.ds-article .ds-article-sticky {
    position: fixed;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 90;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--color-line);
    box-shadow: var(--shadow-2);
}
.ds-article .ds-article-sticky[hidden] { display: none; }
.ds-article .ds-article-sticky > a {
    display: grid;
    place-items: center;
    min-block-size: 56px;
    border-radius: 0;
    white-space: nowrap;
}
.ds-article .ds-article-sticky__tel {
    background: var(--color-surface);
    color: var(--color-ink);
    font-weight: var(--weight-medium);
    text-decoration: none;
}
@media (max-width: 767.98px) {
    body.ds-article.has-ds-sticky { padding-block-end: 56px; }
}
@media (min-width: 768px) {
    .ds-article .ds-article-sticky { display: none !important; }
}

/* empty Elementor sections (no excerpt, no FAQ) collapse */
.ds-article .e-con.ds-article-summary-wrap:not(:has(.ds-article-summary)),
.ds-article .e-con.ds-article-faq-wrap:not(:has(.ds-article-faq, .ds-article-bio)) { display: none; }

/* layout guard: whatever the container settings, sidebar beside the content from 1025px,
   above it (TOC first) below that */
@media (min-width: 1025px) {
    .ds-article .e-con.ds-article-body,
    .ds-article .e-con.ds-article-body > .e-con-inner {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-start;
        justify-content: space-between;
    }
}
@media (max-width: 1024.98px) {
    .ds-article .e-con.ds-article-body,
    .ds-article .e-con.ds-article-body > .e-con-inner { flex-direction: column; align-items: stretch; }
    .ds-article .e-con.ds-article-aside { order: -1; }
}

/* the category FAQ sets a viewport-based width; inside the article container it follows the container */
.ds-article .ds-article-faq,
.ds-article .ds-article-faq .faq-item {
    width: 100% !important;
    max-width: 100% !important;
}

/* ==========================================================================
   1.15.1
   ========================================================================== */

/* hero: the site header (template 33) is position:fixed and 86px tall, so the hero
   starts under it; taller hero, content sits at the bottom, featured image behind
   a navy scrim (background-image is added inline from the post thumbnail) */
.ds-article { --ds-header-h: 72px; --ds-admin-bar: 0px; }
@media (min-width: 768px) { .ds-article { --ds-header-h: 86px; } }
.admin-bar.ds-article { --ds-admin-bar: 32px; }
@media (max-width: 782px) { .admin-bar.ds-article { --ds-admin-bar: 46px; } }
body.ds-article .e-con.ds-article-hero {
    min-block-size: 480px;
    padding-block-start: calc(var(--ds-header-h) + var(--space-7));
    padding-block-end: var(--space-7);
    justify-content: flex-end;
}
body.ds-article .e-con.ds-article-hero > .e-con-inner { justify-content: flex-end; }
@media (max-width: 1024.98px) { body.ds-article .e-con.ds-article-hero { min-block-size: 420px; } }
@media (max-width: 767.98px) {
    body.ds-article .e-con.ds-article-hero {
        min-block-size: 380px;
        padding-block-start: calc(var(--ds-header-h) + var(--space-6));
        padding-block-end: var(--space-6);
    }
}
.ds-article .ds-article-subtitle {
    margin: 0;
    max-inline-size: 60ch;
    font-size: var(--text-lg);
    line-height: 1.5;
    color: var(--color-ink-on-dark-muted);
}
.ds-article .ds-article-content h2,
.ds-article .ds-article-content h3,
.ds-article .ds-article-faq { scroll-margin-block-start: calc(var(--ds-header-h) + var(--ds-admin-bar) + var(--space-5)); }
@media (min-width: 1025px) {
    .ds-article .e-con.ds-article-aside { inset-block-start: calc(var(--ds-header-h) + var(--ds-admin-bar) + var(--space-5)); }
    /* "בקצרה" lines up with the content column (sidebar 18rem + 48px gap) */
    .ds-article .ds-article-summary { max-inline-size: calc(100% - var(--ds-aside-w) - var(--space-7)); }
}
/* long lines: keep paragraphs readable inside the wider column */
.ds-article .ds-article-content > :where(p, ul, ol) { max-inline-size: 85ch; }

/* a tip inside a tip box ([ds_tip] around a "label:" paragraph) gets one frame only */
.ds-article .ds-tip .ds-tip,
.ds-article .is-style-ds-tip .ds-tip {
    padding: 0;
    border: 0;
    background: none;
}

/* bio under the FAQ */
.ds-article .ds-article-bio {
    box-sizing: border-box;
    display: flex;
    gap: var(--space-5);
    align-items: flex-start;
    inline-size: 100%;
    margin-block-start: var(--space-7);
    padding: var(--space-5);
    background: var(--color-surface-raised);
    border: 1px solid var(--color-line);
}
.ds-article .ds-article-bio__media { flex: 0 0 80px; }
.ds-article .ds-article-bio__img { display: block; inline-size: 80px; block-size: 80px; object-fit: cover; border-radius: var(--radius-sm); }
.ds-article .ds-article-bio__mark {
    display: grid;
    place-items: center;
    inline-size: 80px;
    block-size: 80px;
    background: var(--color-secondary);
    color: var(--color-brand);
    font-weight: var(--weight-display);
    font-size: var(--text-lg);
}
.ds-article .ds-article-bio__mark img { display: block; inline-size: 64px; block-size: auto; max-block-size: 64px; object-fit: contain; }
.ds-article .ds-article-bio__body { display: flex; flex-direction: column; gap: var(--space-1); min-inline-size: 0; }
.ds-article .ds-article-bio__body p { margin: 0; }
.ds-article .ds-article-bio .ds-eyebrow { margin: 0; }
.ds-article .ds-article-bio__name { font-size: var(--text-lg); font-weight: var(--weight-display); color: var(--color-ink); }
.ds-article .ds-article-bio__role { font-size: var(--text-xs); color: var(--color-ink-muted); }
.ds-article .ds-article-bio__text { margin-block-start: var(--space-2) !important; max-inline-size: 75ch; color: var(--color-ink-body); }
.ds-article .ds-article-bio__link {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    min-block-size: 44px;
    color: var(--color-brand-deep);
    font-weight: var(--weight-medium);
    text-underline-offset: .2em;
}
@media (max-width: 767.98px) {
    .ds-article .ds-article-bio { flex-direction: column; gap: var(--space-4); }
}