/*
 * AV365 single product page: description + technical specifications.
 * Same card language as the summary panel (hairline border, soft shadow, red accent rule), no tabs.
 * Wide screens continue the two columns of the gallery/summary row above: datasheet under the gallery,
 * description under the summary, sharing the same vertical edge. Narrow screens stack them.
 */
body.av365-product-page.av365-product-has-details .product-entry-wrapper {
    padding-bottom: clamp(26px, 3vw, 40px);
}

.av365-details {
    --av365-details-line: #e4e9ec;
    --av365-details-muted: #687789;
    --av365-details-pad: clamp(22px, 2.6vw, 38px);
    display: grid;
    gap: clamp(20px, 2.4vw, 32px);
    align-items: start;
    margin-bottom: clamp(56px, 6.5vw, 88px);
    color: var(--av365-ink, #171a1f);
}

/*
 * Same flex arithmetic as the Blocksy gallery row (gallery width %, summary the rest, same gap), so both rows break
 * at the same x. --av365-details-gallery comes from the theme setting (inline style in Product_Details).
 */
@media (min-width: 1000px) {
    .av365-details--split {
        display: flex;
        align-items: flex-start;
        gap: clamp(34px, 5vw, 72px);
    }

    .av365-details--split > .av365-details__card--specs {
        order: -1;
        width: var(--av365-details-gallery, 50%);
    }

    .av365-details--split > .av365-details__card--description {
        width: calc(100% - var(--av365-details-gallery, 50%));
    }
}

.av365-details__card {
    display: flex;
    flex-direction: column;
    container-type: inline-size;
    min-width: 0;
    border: 1px solid #dfe5e8;
    border-radius: var(--av365-product-radius, 6px);
    background: #fff;
    box-shadow: 0 16px 42px rgb(21 40 63 / 7%);
    scroll-margin-top: calc(var(--admin-bar, 0px) + var(--av365-header-offset, 0px) + 24px);
}

/* Card header: the red rule + title pattern of the page's section headings, one size down. */
.av365-details__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px 20px;
    padding: var(--av365-details-pad) var(--av365-details-pad) 20px;
    border-bottom: 1px solid var(--av365-details-line);
}

.av365-details__title {
    margin: 0;
    color: var(--av365-ink, #171a1f);
    font-size: clamp(20px, 1.7vw, 24px);
    font-weight: 750;
    line-height: 1.15;
    letter-spacing: -.035em;
}

.av365-details__title::before {
    content: "";
    display: block;
    width: 32px;
    margin-bottom: 14px;
    border-top: 3px solid var(--av365-product-accent, #d90012);
}

.av365-details__meta {
    padding-bottom: 3px;
    color: var(--av365-details-muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .07em;
    text-transform: uppercase;
    font-variant-numeric: tabular-nums;
}

.av365-details__icon {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
}

/* Jump link to the datasheet: only needed while the cards are stacked. */
.av365-details__jump {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid #dce3e8;
    border-radius: 999px;
    color: var(--av365-ink, #171a1f);
    background: #f7f9fa;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease;
}

.av365-details__jump-count {
    color: var(--av365-details-muted);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.av365-details__jump .av365-details__icon {
    color: var(--av365-product-accent, #d90012);
}

.av365-details__jump:is(:hover, :focus-visible) {
    border-color: var(--av365-product-accent, #d90012);
    color: var(--av365-accent-hover, #b00012);
    background: var(--av365-accent-soft, #fff1f2);
}

/* ---- Description ------------------------------------------------------------------------------------------------ */
.av365-details__body {
    flex: 1 1 auto;
    padding: 28px var(--av365-details-pad) var(--av365-details-pad);
}

.av365-prose {
    color: var(--av365-slate, #56616d);
    font-size: 15px;
    line-height: 1.75;
}

.av365-prose > :first-child {
    margin-top: 0;
}

.av365-prose > :last-child {
    margin-bottom: 0;
}

.av365-prose p {
    max-width: 72ch;
    margin: 0 0 14px;
}

/* Sub-sections (Áttekintés, Főbb jellemzők, Alkalmazási területek): small caps label with a hairline rule. */
.av365-prose :is(h2, h3, h4) {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 34px 0 14px;
    color: var(--av365-details-muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.av365-prose :is(h2, h3, h4)::after {
    content: "";
    flex: 1 1 auto;
    border-top: 1px solid var(--av365-details-line);
}

.av365-prose > :is(h2, h3, h4):first-child {
    margin-top: 0;
}

/* The opening paragraph reads as the lead. */
.av365-prose > :is(h2, h3):first-child + p {
    color: #2c343d;
    font-size: 16.5px;
    line-height: 1.7;
}

.av365-prose strong {
    color: var(--av365-ink, #171a1f);
    font-weight: 650;
}

.av365-prose a {
    color: var(--av365-link, #34495e);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.av365-prose a:is(:hover, :focus-visible) {
    color: var(--av365-accent-hover, #b00012);
    text-decoration-color: currentColor;
}

/* Feature lists: check-marked rows on a hairline grid; two columns once the card is wide enough. */
.av365-prose :is(ul, ol) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 32px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.av365-prose li {
    position: relative;
    margin: 0;
    padding: 10px 0 10px 28px;
    border-bottom: 1px solid var(--av365-details-line);
    color: var(--av365-ink, #171a1f);
    font-size: 14.5px;
    line-height: 1.55;
}

.av365-prose ul > li::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0;
    width: 16px;
    height: 16px;
    background: var(--av365-product-accent, #d90012);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.av365-prose ol {
    counter-reset: av365-prose;
}

.av365-prose ol > li {
    counter-increment: av365-prose;
}

.av365-prose ol > li::before {
    content: counter(av365-prose, decimal-leading-zero);
    position: absolute;
    top: 11px;
    left: 0;
    color: var(--av365-product-accent, #d90012);
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

@container (min-width: 760px) {
    .av365-prose :is(ul, ol) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Source link (the imported "Hivatalos terméklap" line) as the card footer. */
.av365-details__foot {
    padding: 16px var(--av365-details-pad);
    border-top: 1px solid var(--av365-details-line);
    border-radius: 0 0 var(--av365-product-radius, 6px) var(--av365-product-radius, 6px);
    background: #f7f9fa;
}

.av365-details__source {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--av365-link, #34495e);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
}

.av365-details__source .av365-details__icon {
    color: var(--av365-product-accent, #d90012);
    transition: transform 160ms ease;
}

.av365-details__source:is(:hover, :focus-visible) {
    color: var(--av365-accent-hover, #b00012);
}

.av365-details__source:is(:hover, :focus-visible) span {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.av365-details__source:is(:hover, :focus-visible) .av365-details__icon {
    transform: translate(2px, -2px);
}

/* ---- Technical specifications (datasheet) ------------------------------------------------------------------------ */
.av365-specs {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 24px;
    margin: 0;
    padding: 14px calc(var(--av365-details-pad) - 12px) calc(var(--av365-details-pad) - 6px);
}

.av365-specs__row {
    display: grid;
    grid-template-columns: minmax(104px, 42%) minmax(0, 1fr);
    gap: 16px;
    margin: 0;
    padding: 11px 12px;
    border-radius: max(2px, calc(var(--av365-product-radius, 6px) - 2px));
}

.av365-specs__row:nth-child(odd) {
    background: #f4f7f8;
}

.av365-specs dt {
    margin: 0;
    color: var(--av365-details-muted);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.av365-specs dd {
    margin: 0;
    color: var(--av365-ink, #171a1f);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

/* Full-width datasheet (no description): two columns, zebra kept per visual row. */
@container (min-width: 760px) {
    .av365-specs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .av365-specs__row:nth-child(odd) {
        background: none;
    }

    .av365-specs__row:is(:nth-child(4n + 1), :nth-child(4n + 2)) {
        background: #f4f7f8;
    }
}

/* Narrow datasheet: label above value. */
@container (max-width: 340px) {
    .av365-specs__row {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }
}

/* ---- Layout breakpoints (match product-page.css) ------------------------------------------------------------------ */
@media (max-width: 999.98px) {
    .av365-details__jump {
        display: inline-flex;
    }
}

@media (max-width: 689.98px) {
    .av365-details {
        --av365-details-pad: 20px;
        gap: 16px;
        margin-bottom: 48px;
    }

    .av365-details__card {
        box-shadow: 8px 8px 0 rgb(21 40 63 / 4%);
    }

    .av365-details__head {
        align-items: center;
        padding-bottom: 16px;
    }

    .av365-details__title::before {
        margin-bottom: 11px;
    }

    .av365-details__body {
        padding-top: 22px;
    }

    .av365-prose {
        font-size: 14.5px;
    }

    .av365-prose > :is(h2, h3):first-child + p {
        font-size: 15.5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .av365-details__jump,
    .av365-details__source .av365-details__icon {
        transition: none;
    }

    .av365-details__source:is(:hover, :focus-visible) .av365-details__icon {
        transform: none;
    }
}
