/* Singular blog articles only. Keep YIWAN's existing fonts and brand assets. */
html:has(body.yiwan-blog-design) { scroll-behavior: auto; }
body.yiwan-blog-design {
    --yiwan-blog-red: #c8392b;
    --yiwan-blog-text: #4d4c4c;
    --yiwan-blog-sticky-top: 112px;
}

body.yiwan-blog-design .elementor-601 > .elementor-element-8542914 {
    min-height: 250px;
    padding: 64px 24px 48px;
}
body.yiwan-blog-design .elementor-601 > .elementor-element-8542914 > .e-con-inner {
    padding: 0;
    min-height: 0;
    align-items: center;
    width: 100%;
    max-width: 1200px;
}
body.yiwan-blog-design .elementor-601 .elementor-element-692152b {
    justify-content: center;
    gap: 14px;
    padding: 0;
}
body.yiwan-blog-design .elementor-601 .elementor-element.elementor-element-93055af {
    width: 100%;
    max-width: 920px;
    margin-inline: auto;
}
body.yiwan-blog-design .elementor-601 .elementor-element-93055af h1 {
    font-size: 32px;
    line-height: 1.25;
    text-wrap: balance;
}
body.yiwan-blog-design .elementor-601 > .elementor-element-ec861bc {
    padding: 40px 24px 48px;
}
body.yiwan-blog-design .elementor-601 .elementor-element-ec861bc > .e-con-inner,
body.yiwan-blog-design .elementor-601 .elementor-element-7236511 {
    max-width: 1200px;
    width: 100%;
    padding: 0;
    margin-inline: auto;
    min-width: 0;
}

body.yiwan-blog-design .yiwan-blog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 352px;
    gap: 56px;
    align-items: start;
    width: 100%;
    min-width: 0;
}
body.yiwan-blog-design .yiwan-blog-copy {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    color: var(--yiwan-blog-text);
    font-size: 18px;
    line-height: 1.5;
    overflow-wrap: break-word;
}
body.yiwan-blog-design .yiwan-blog-copy p {
    margin: 0 0 18px;
    line-height: inherit;
}
body.yiwan-blog-design .yiwan-blog-copy h2 {
    margin: 34px 0 16px;
    font-size: 28px;
    line-height: 1.3;
    font-weight: 600;
    scroll-margin-top: calc(var(--yiwan-blog-sticky-top) + 20px);
}
body.yiwan-blog-design .yiwan-blog-copy h3 {
    margin: 26px 0 12px;
    font-size: 24px;
    line-height: 1.35;
    font-weight: 600;
}
body.yiwan-blog-design .yiwan-blog-copy h4 {
    margin: 24px 0 12px;
    line-height: 1.4;
}
body.yiwan-blog-design .yiwan-blog-copy > :first-child { margin-top: 0; }
body.yiwan-blog-design .yiwan-blog-copy ul,
body.yiwan-blog-design .yiwan-blog-copy ol { margin: 0 0 22px; padding-left: 24px; }
body.yiwan-blog-design .yiwan-blog-copy li { padding-left: 3px; margin-bottom: 9px; }
body.yiwan-blog-design .yiwan-blog-copy a:not(.elementor-button) { color: var(--yiwan-blog-red); text-underline-offset: 3px; }
body.yiwan-blog-design .yiwan-blog-copy a:not(.elementor-button):hover { color: #a92f25; text-decoration: underline; }
body.yiwan-blog-design .yiwan-blog-copy a:focus-visible,
body.yiwan-blog-design .yiwan-blog-toc :focus-visible { outline: 2px solid var(--yiwan-blog-red); outline-offset: 4px; }
body.yiwan-blog-design .yiwan-blog-copy blockquote {
    margin: 24px 0;
    padding: 18px 22px;
    border-left: 3px solid var(--yiwan-blog-red);
    background: #faf6f5;
}
body.yiwan-blog-design .yiwan-blog-copy blockquote > :last-child { margin-bottom: 0; }
body.yiwan-blog-design .yiwan-blog-copy img { max-width: 100%; height: auto; border-radius: 5px; }
body.yiwan-blog-design .yiwan-blog-copy figure { max-width: 100%; margin: 24px 0; }
body.yiwan-blog-design .yiwan-blog-copy figcaption { color: #666; font-size: 14px; line-height: 1.5; margin-top: 9px; }
body.yiwan-blog-design .yiwan-blog-copy iframe { max-width: 100%; }
body.yiwan-blog-design .yiwan-blog-copy .wp-block-embed__wrapper,
body.yiwan-blog-design .yiwan-blog-copy .elementor-widget-video { max-width: 100%; }
body.yiwan-blog-design .yiwan-blog-video { max-width: 100%; margin: 32px 0 28px; }
body.yiwan-blog-design .yiwan-blog-video.is-portrait { width: 100%; max-width: 360px; margin-inline: auto; }
body.yiwan-blog-design .yiwan-blog-video-trigger {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: #1f1f1f;
    cursor: pointer;
    overflow: hidden;
    text-align: left;
}
body.yiwan-blog-design .yiwan-blog-video-trigger img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: var(--yiwan-video-ratio, 16 / 9);
    object-fit: cover;
    opacity: .88;
    transition: opacity .2s ease;
}
body.yiwan-blog-design .yiwan-blog-video-trigger:hover img,
body.yiwan-blog-design .yiwan-blog-video-trigger:focus-visible img { opacity: 1; }
body.yiwan-blog-design .yiwan-blog-video-play {
    position: absolute;
    left: 50%;
    top: 50%;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 46px;
    padding: 11px 18px;
    border-radius: 5px;
    background: rgba(200, 57, 43, .96);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    transform: translate(-50%, -50%);
}
body.yiwan-blog-design .yiwan-blog-video-trigger:focus-visible { outline: 2px solid var(--yiwan-blog-red); outline-offset: 4px; }
body.yiwan-blog-design .yiwan-blog-video iframe {
    display: block;
    width: 100%;
    aspect-ratio: var(--yiwan-video-ratio, 16 / 9);
    height: auto;
    min-height: 0;
    border: 0;
}
body.yiwan-blog-design .yiwan-blog-video-caption {
    margin: 10px 0 0;
    color: #6a6969;
    font-size: 14px;
    line-height: 1.5;
}
body.yiwan-blog-design .yiwan-blog-video-caption a { color: var(--yiwan-blog-red); }

body.yiwan-blog-design .yiwan-blog-sidebar {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    position: sticky;
    top: var(--yiwan-blog-sticky-top);
    min-width: 0;
}
body.yiwan-blog-design .yiwan-blog-toc {
    margin: 0;
    border: 1px solid #dde0e3;
    border-radius: 5px;
    background: #fff;
    color: var(--yiwan-blog-text);
    overflow: hidden;
    font-family: var(--e-global-typography-primary-font-family, 'Roboto'), sans-serif;
}
body.yiwan-blog-design .yiwan-blog-toc summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    min-height: 54px;
    padding: 15px 20px;
    background: var(--yiwan-blog-red);
    color: #fff;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}
body.yiwan-blog-design .yiwan-blog-toc summary::-webkit-details-marker { display: none; }
body.yiwan-blog-design .yiwan-blog-toc summary i { font-size: 14px; }
body.yiwan-blog-design .yiwan-blog-toc[open] summary i { transform: rotate(180deg); }
body.yiwan-blog-design .yiwan-blog-toc nav {
    max-height: min(620px, calc(100vh - var(--yiwan-blog-sticky-top) - 80px));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding: 8px;
}
body.yiwan-blog-design .yiwan-blog-toc ol { margin: 0; padding: 0; list-style: none; }
body.yiwan-blog-design .yiwan-blog-toc li { margin: 0; padding: 0; border-bottom: 1px solid #eceeef; }
body.yiwan-blog-design .yiwan-blog-toc li:last-child { border-bottom: 0; }
body.yiwan-blog-design .yiwan-blog-toc a {
    display: block;
    min-height: 44px;
    padding: 11px 14px 11px 20px;
    border-left: 3px solid transparent;
    border-radius: 2px;
    color: var(--yiwan-blog-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    text-decoration: none;
    overflow-wrap: anywhere;
}
body.yiwan-blog-design .yiwan-blog-toc a:hover { color: var(--yiwan-blog-red); background: #fcf8f7; }
body.yiwan-blog-design .yiwan-blog-toc a[aria-current='location'] {
    color: #ac2c22;
    border-left-color: var(--yiwan-blog-red);
    background: #fbefed;
    font-weight: 500;
}

/* Keep comparison tables readable inside the narrower article column. */
body.yiwan-blog-design .yiwan-blog-copy table { width: 100%; max-width: 100%; font-size: 15px; line-height: 1.5; border-collapse: collapse; }
body.yiwan-blog-design .yiwan-blog-copy th,
body.yiwan-blog-design .yiwan-blog-copy td { padding: 12px 14px; vertical-align: top; overflow-wrap: anywhere; }
body.yiwan-blog-design .yiwan-blog-copy th { background: #f6f6f6; font-weight: 600; }
body.yiwan-blog-design .yiwan-blog-copy .yiwan-table-scroll,
body.yiwan-blog-design .yiwan-blog-copy .yiwan-blog-table-scroll,
body.yiwan-blog-design .yiwan-blog-copy .wp-block-table { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
body.yiwan-blog-design .yiwan-blog-copy pre { max-width: 100%; overflow-x: auto; }

/* The one independently composed Elementor article uses the same reading grid. */
body.yiwan-blog-design .elementor-4673 { max-width: 1200px; margin-inline: auto; }
body.yiwan-blog-design .elementor-4673 > .e-con { padding-inline: 24px; }
body.yiwan-blog-design .elementor-4673 .elementor-element-a7d3101 h1 { font-size: 32px; }

@media (max-width: 1100px) and (min-width: 901px) {
    body.yiwan-blog-design .yiwan-blog-layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; }
}
@media (max-width: 900px) {
    body.yiwan-blog-design .yiwan-blog-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    body.yiwan-blog-design .yiwan-blog-sidebar { position: static; grid-column: 1; grid-row: 1; }
    body.yiwan-blog-design .yiwan-blog-copy { grid-column: 1; grid-row: 2; }
    body.yiwan-blog-design .yiwan-blog-toc nav { max-height: 380px; }
}
@media (max-width: 767px) {
    body.yiwan-blog-design .elementor-601 > .elementor-element-8542914 { padding: 40px 20px 32px; min-height: 210px; }
    body.yiwan-blog-design .elementor-601 .elementor-element-93055af h1 { font-size: 27px; line-height: 1.25; }
    body.yiwan-blog-design .elementor-601 > .elementor-element-ec861bc { padding: 28px 20px 36px; }
    body.yiwan-blog-design .yiwan-blog-copy { font-size: 16px; line-height: 1.65; }
    body.yiwan-blog-design .yiwan-blog-copy h2 { font-size: 24px; margin-top: 30px; }
    body.yiwan-blog-design .yiwan-blog-copy h3 { font-size: 21px; }
    body.yiwan-blog-design .yiwan-blog-copy th,
    body.yiwan-blog-design .yiwan-blog-copy td { padding: 10px 12px; }
    body.yiwan-blog-design .elementor-4673 > .e-con { padding-inline: 20px; }
    body.yiwan-blog-design .elementor-4673 .elementor-element-a7d3101 h1 { font-size: 27px; }
}

/* Align article content with the existing 1200px header container. */
body.yiwan-blog-design .elementor-4673 { max-width: none; }
body.yiwan-blog-design .elementor-4673 > .e-con > .e-con-inner { max-width:1200px; width:100%; padding:0; margin-inline:auto; }