/* Article detail only: diagnosis screens and Premium keep their existing layout. */
.withgift-article .article-page {
    width: min(1240px, calc(100% - 48px));
    padding: 0 0 48px;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.withgift-article .breadcrumbs { font-size: 0.82rem; }
.withgift-article .article-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    column-gap: 40px;
    row-gap: 24px;
    align-items: start;
}
.withgift-article .article-main-column { min-width: 0; grid-column: 1; grid-row: 2; }
.withgift-article .article-sidebar { grid-column: 2; grid-row: 1 / span 2; min-width: 0; position: sticky; top: 108px; }
.withgift-article .article-toc {
    position: static;
    width: auto;
    max-height: calc(100vh - 132px);
    overflow-y: auto;
    margin: 0;
    padding: 20px;
    background: #fff;
    border: 1px solid var(--wg-line);
    border-radius: 16px;
    box-shadow: none;
}
.withgift-article .article-toc summary { color: var(--wg-ink); font-weight: 700; cursor: pointer; }
.withgift-article .article-toc ol { margin: 14px 0 0; padding: 0; list-style: none; }
.withgift-article .article-toc li { margin: 0; }
.withgift-article .article-toc a { display: block; padding: 7px 0; color: var(--wg-ink); line-height: 1.65; font-size: 0.85rem; text-decoration: none; }
.withgift-article .article-toc .toc-level-3 { padding-left: 14px; }
.withgift-article .article-toc a:hover { color: #a43d2d; text-decoration: underline; }
.withgift-article .article-detail-header { grid-column: 1; grid-row: 1; min-width: 0; width: 100%; margin: 0; }
.withgift-article .article-detail-header h1 { margin: 0 0 16px; font-size: clamp(1.65rem, 2.6vw, 2.45rem); line-height: 1.55; letter-spacing: 0.01em; overflow-wrap: break-word; }
.withgift-article .article-detail-header > p { font-size: 1rem; line-height: 1.9; color: var(--wg-muted); }
.withgift-article .article-meta { margin: 12px 0 18px; font-size: 0.82rem; }
.withgift-article .article-hero-image { display: block; width: 100%; height: auto; max-height: 280px; aspect-ratio: 16 / 9; object-fit: cover; margin: 0; border-radius: 12px; }
.withgift-article .article-detail-body { font-size: 1rem; line-height: 1.95; color: var(--wg-ink); overflow-wrap: break-word; }
.withgift-article .article-detail-body > p { margin: 0 0 24px; }
.withgift-article .article-detail-body > p strong,
.withgift-article .article-detail-body > :is(ul, ol) strong {
    font-weight: 700;
    text-decoration-line: underline;
    text-decoration-color: #f2cf36;
    text-decoration-thickness: 0.22em;
    text-underline-offset: -0.04em;
    text-decoration-skip-ink: none;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.withgift-article .article-detail-body h2 { padding: 0 0 12px; margin: 40px 0 18px; border: 0; border-bottom: 2px solid var(--wg-line); background: transparent; border-radius: 0; box-shadow: none; font-size: 1.45rem; line-height: 1.6; scroll-margin-top: 110px; }
.withgift-article .article-detail-body h2::before,
.withgift-article .article-detail-body h2::after { content: none; }
.withgift-article .article-detail-body h3 { margin: 30px 0 14px; font-size: 1.15rem; line-height: 1.65; scroll-margin-top: 110px; }
.withgift-article .article-detail-body > ul:not(:has(> li > a:only-child)),
.withgift-article .article-detail-body > ol { padding: 0 0 0 1.4em; margin: 0 0 24px; background: transparent; border: 0; border-radius: 0; }
.withgift-article .article-detail-body > ul > li,
.withgift-article .article-detail-body > ol > li { margin: 10px 0; padding: 0; background: transparent; border: 0; box-shadow: none; }
.withgift-article .article-detail-body blockquote { margin: 24px 0; padding: 20px 24px; background: var(--wg-peach); border: 0; border-radius: 12px; }
.withgift-article .article-detail-body blockquote p { margin: 0; }
.withgift-article .article-detail-body pre { padding: 22px; white-space: pre-wrap; overflow-wrap: anywhere; background: #f5f1ec; border-radius: 12px; line-height: 1.8; font-size: 0.9rem; }
.withgift-article .article-detail-body table { display: block; width: 100%; max-width: 100%; overflow-x: auto; margin: 24px 0; border-collapse: collapse; font-size: 0.92rem; }
.withgift-article .article-detail-body th,
.withgift-article .article-detail-body td { min-width: 125px; padding: 12px; line-height: 1.8; vertical-align: top; border: 1px solid var(--wg-line); }
.withgift-article .article-detail-body table:focus-visible { outline: 3px solid #a43d2d; outline-offset: 3px; }
.withgift-article .article-detail-body th { background: #f9eae2; color: var(--wg-ink); }
.withgift-article .article-detail-body td { background: #fff; }
.withgift-article .article-product-shelf { margin: 32px 0; padding: 20px; background: #fff; border: 1px solid var(--wg-line); border-radius: 12px; }
.withgift-article .article-product-shelf > h2 { margin: 0 0 10px; font-size: 1.25rem; }
.withgift-article .article-product-shelf .article-product-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.withgift-article .article-product-shelf .article-product-card { display: flex !important; flex-direction: column; align-items: stretch !important; min-width: 0; padding: 0 !important; border: 0; border-radius: 0 !important; background: #fff; box-shadow: none; }
.withgift-article .article-product-shelf .article-product-card__image-link { width: 100%; height: auto; min-height: 0 !important; aspect-ratio: 1; padding: 12px !important; background: #faf8f5; border-radius: 12px; }
.withgift-article .article-product-shelf img { width: 100%; height: 100%; max-width: 100% !important; max-height: 100% !important; object-fit: contain; }
.withgift-article .article-product-shelf .article-product-card__body { display: flex; flex-direction: column; flex: 1; min-width: 0; padding: 14px 0 0 !important; }
.withgift-article .article-product-shelf h3 { font-family: inherit; margin: 0 0 8px; font-size: 0.95rem; line-height: 1.7; }
.withgift-article .article-product-shelf .article-product-card__actions { display: flex; flex-direction: column; gap: 8px; margin-top: auto !important; }
.withgift-article .article-product-shelf .article-product-card__button { width: 100% !important; min-height: 44px !important; padding: 9px 10px !important; font-size: 0.85rem; }
.withgift-article .article-product-section__note { font-size: 0.82rem; line-height: 1.8; color: var(--wg-muted); margin-bottom: 20px; }
.withgift-article .gift-diagnosis-cta { margin: 32px 0; padding: 26px; background: var(--wg-peach); border: 0; border-radius: 16px; box-shadow: none; }
.withgift-article .gift-diagnosis-cta h2 { margin: 0 0 10px; padding: 0; font-size: 1.25rem; line-height: 1.6; }
.withgift-article .gift-diagnosis-cta p { margin: 0 0 18px; font-size: 0.95rem; line-height: 1.85; }
.withgift-article .gift-diagnosis-cta__button,
.withgift-article .gift-diagnosis-cta__button:hover { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; border-radius: 999px; background: #a43d2d !important; color: #fff !important; text-decoration: none; font-weight: 700; line-height: 1.6; }
.withgift-article .article-app-cta { margin: 48px 0 32px; }
.withgift-article .article-app-cta__note { font-size: 0.82rem !important; color: var(--wg-muted); }
.withgift-article .article-related h2 { font-size: 1.2rem; margin: 0 0 18px; }
.withgift-article .article-related ul { list-style: none; margin: 0; padding: 0; }
.withgift-article .article-related a { display: block; padding: 16px 0; border-bottom: 1px solid var(--wg-line); color: var(--wg-ink); font-size: 0.95rem; line-height: 1.7; }
.withgift-article .article-return-links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 28px; font-size: 0.9rem; }
.withgift-article .article-return-links a { color: #a43d2d; }
.withgift-article :is(a, summary):focus-visible { outline: 3px solid #a43d2d; outline-offset: 4px; }
@media (max-width: 1099px) {
    .withgift-article .article-layout { display: flex; flex-direction: column; gap: 20px; }
    .withgift-article .article-sidebar { position: static; width: 100%; }
    .withgift-article .article-toc { max-height: none; }
    .withgift-article .article-main-column { width: 100%; }
}
@media (max-width: 600px) {
    .withgift-article .article-page { width: calc(100% - 32px); margin-top: 24px; }
    .withgift-article .article-detail-header h1 { font-size: 1.6rem; line-height: 1.6; }
    .withgift-article .article-detail-body { font-size: 1rem; line-height: 1.95; }
    .withgift-article .article-detail-body h2 { font-size: 1.3rem; }
    .withgift-article .article-hero-image { max-height: 210px; }
    .withgift-article .article-product-shelf { padding: 14px; }
    .withgift-article .article-product-shelf .article-product-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .withgift-article .article-product-shelf .article-product-card:has(.article-product-card__image-link) { display: grid !important; grid-template-columns: 96px minmax(0, 1fr) !important; grid-template-rows: auto; gap: 14px !important; }
    .withgift-article .article-product-shelf .article-product-card__body { padding: 0 !important; }
    .withgift-article .article-product-shelf .article-product-card__image-link { align-self: start; }
    .withgift-article .gift-diagnosis-cta { padding: 22px 20px; }
    .withgift-article .gift-diagnosis-cta__button { width: 100%; }
}
