/* Artifacts feature page: original deliverable illustrations, scoped to this page. */
.art-hero { background: radial-gradient(ellipse at 85% 45%, #25314d 0, transparent 55%), var(--navy); color: #fff; padding: 112px 0 52px; overflow: hidden; }
.art-hero .breadcrumb { margin-bottom: 30px; }
.art-hero__grid { display: grid; grid-template-columns: .95fr 1.1fr; gap: 16px; align-items: center; }
.art-hero__copy { padding-bottom: 24px; min-width: 0; }
.art-hero h1 { color: #fff; font-size: clamp(2.5rem, 4.4vw, 3.7rem); line-height: 1.06; margin: 22px 0; letter-spacing: -.045em; }
.art-hero h1 span { color: #ffad70; }
.art-hero__copy > p { color: #c8d1e4; font-size: 1.08rem; max-width: 460px; line-height: 1.8; }
.art-actions { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 28px; }
.art-text-link { display: inline-flex; gap: 10px; align-items: center; font-size: .92rem; font-weight: 600; color: #fff; }
.art-text-link:hover { color: #ffad70; }
.art-hero__note { font: .75rem var(--font-mono); color: #a8b6cd; margin-top: 28px; display: flex; gap: 10px; align-items: center; }
.art-hero__note > span { width: 6px; height: 6px; background: #90d6ba; border-radius: 50%; }
.art-hero__visual { margin: 0 -20px 0 0; min-width: 0; }
.art-hero__visual img { width: 100%; height: auto; }
.art-hero__visual figcaption { color: #a8b6cd; text-align: center; font-size: .73rem; margin-top: 10px; }
.art-format-strip { background: #121b35; border-top: 1px solid #2b354c; color: #d3daea; padding: 23px 0; }
.art-format-strip .container { display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.art-format-strip span { display: flex; align-items: center; gap: 10px; font-size: .8rem; }
.art-format-strip i { color: #ffad70; }
.art-section { background: #fff; }
.art-section-heading { display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: end; margin-bottom: 44px; }
.art-section-heading h2 { margin-bottom: 0; }
.art-section-heading > p { max-width: 390px; font-size: 1.02rem; }
.art-examples { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.art-example { border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: #fff; }
.art-preview { height: 250px; padding: 20px 24px 0; position: relative; overflow: hidden; }
.art-preview--report { background: #edf1fb; }
.art-preview--prototype { background: #e7f1ef; }
.art-preview--evidence { background: #fff0e6; }
.art-preview__label { font: .62rem var(--font-mono); letter-spacing: .12em; color: #475773; display: block; margin-bottom: 20px; }
.art-mini-report, .art-mini-browser, .art-mini-checklist { background: #fff; border: 1px solid #dbe1ed; border-radius: 10px; box-shadow: 0 14px 28px #14224112; }
.art-mini-report { transform: rotate(-4deg); padding: 20px; max-width: 244px; margin: 0 auto; }
.art-mini-report > span, .art-mini-checklist > span { font-weight: 700; font-size: .85rem; }
.art-mini-lines { height: 20px; margin: 13px 0; background: repeating-linear-gradient(to bottom, #e6eaf1 0 3px, transparent 3px 8px); width: 84%; }
.art-mini-chart { display: flex; align-items: end; gap: 10px; height: 58px; border-bottom: 1px solid #dbe1ed; }
.art-mini-chart b { width: 20%; height: 36%; background: #8ba1d4; border-radius: 4px 4px 0 0; }
.art-mini-chart b:nth-child(2) { height: 64%; }.art-mini-chart b:nth-child(3) { height: 49%; }.art-mini-chart b:nth-child(4) { height: 86%; background: #e8833a; }.art-mini-chart b:nth-child(5) { height: 70%; }
.art-mini-report .art-mini-foot { display: block; font-size: .62rem; color: #65708b; margin-top: 9px; font-weight: 400; }
.art-mini-browser { transform: rotate(3deg); margin: 27px auto 0; max-width: 260px; }
.art-mini-browser__bar { display: flex; gap: 4px; border-bottom: 1px solid #e2e8eb; padding: 12px; }
.art-mini-browser__bar b { width: 5px; height: 5px; background: #97b3ad; border-radius: 50%; }
.art-mini-wireframe { padding: 19px; font-size: .76rem; font-weight: 600; }
.art-mini-wireframe__grid { display: flex; gap: 8px; margin: 13px 0; }
.art-mini-wireframe__grid i { width: 32%; height: 35px; background: #d8e8e3; border-radius: 4px; }.art-mini-wireframe__grid i:first-child { background: #86b9ab; }
.art-mini-checklist { margin: 22px auto 0; padding: 22px; transform: rotate(-3deg); max-width: 270px; }
.art-mini-checklist > span { display: block; margin-bottom: 13px; }
.art-mini-checklist > div { padding: 8px 0; color: #59657e; font-size: .68rem; border-top: 1px solid #edf0f5; }
.art-mini-checklist i { color: #387a61; margin-right: 6px; }
.art-example__body { padding: 27px; }
.art-kicker { display: block; font: .66rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: #636e85; margin-bottom: 13px; }
.art-example h3 { font-size: 1.37rem; line-height: 1.25; }
.art-example p { font-size: .93rem; line-height: 1.8; }
.art-outcome { display: block; font-size: .79rem; font-weight: 600; border-top: 1px solid var(--line); margin-top: 21px; padding-top: 17px; }
.art-caption { color: #64708a; font-size: .76rem; margin: 23px 0 0; }
.art-continuity { background: #f3f5fa; }
.art-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: 90px; align-items: center; }
.art-benefits { list-style: none; padding: 0; margin: 26px 0 0; }
.art-benefits li { padding: 18px 0; border-top: 1px solid #dce2ee; }
.art-benefits strong { display: block; font-size: .98rem; margin-bottom: 6px; }
.art-benefits span { font-size: .93rem; color: var(--text-soft); }
.art-history { background: #fff; margin: 0; border: 1px solid #e0e5f0; border-radius: 20px; box-shadow: 0 24px 55px #2836500c; }
.art-history__header { padding: 30px 32px 25px; border-bottom: 1px solid var(--line); }
.art-history__header h3 { margin-bottom: 10px; }
.art-history__file { font-size: .79rem; color: #5b6780; }.art-history__file i { margin-right: 7px; }
.art-timeline { list-style: none; padding: 30px 32px; margin: 0; }
.art-timeline li { display: grid; grid-template-columns: 40px 1fr; gap: 20px; padding-bottom: 30px; position: relative; }
.art-timeline li:last-child { padding-bottom: 0; }
.art-timeline li:not(:last-child)::before { content: ''; position: absolute; width: 1px; background: #dde3ef; top: 40px; bottom: 0; left: 19px; }
.art-version { display: grid; place-items: center; width: 40px; height: 40px; background: #f1f4f9; border-radius: 50%; font: .77rem var(--font-mono); color: #69748c; }
.art-timeline__current .art-version { background: #132041; color: #fff; }
.art-timeline strong { font-size: .93rem; }.art-timeline p { font-size: .79rem; margin: 5px 0 8px; }
.art-status { display: inline-block; color: #26614b; background: #e5f4ec; border-radius: 20px; padding: 3px 9px; font-size: .67rem; }
.art-history__retained { color: #69748c; font-size: .68rem; }
.art-history figcaption { background: #fafbfe; border-top: 1px solid var(--line); padding: 17px 30px; border-radius: 0 0 20px 20px; font-size: .72rem; color: #5b6780; }
.art-sharing { background: #fff; }
.art-share-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 960px; margin: 0 auto; }
.art-share-card { padding: 34px; border: 1px solid #e0e5f0; border-radius: 20px; background: #f8f9fc; }
.art-share-card--accent { background: #fff7f0; border-color: #f4d9c5; }
.art-share-card__icon { display: grid; place-items: center; width: 46px; height: 46px; background: #e9edf7; color: #384f83; border-radius: 14px; margin-bottom: 27px; }
.art-share-card--accent .art-share-card__icon { background: #fce3d0; color: #9c4d14; }
.art-share-card p { font-size: .95rem; line-height: 1.8; }.art-share-card__foot { font: .7rem var(--font-mono); color: #5b6780; margin-top: 25px; }
.art-sharing__note { max-width: 900px; margin: 25px auto 0; color: #616c84; font-size: .79rem; }
.art-agent-band { padding: 70px 0; background: var(--navy); }
.art-agent-band__inner { display: grid; grid-template-columns: 1.5fr 1fr; gap: 80px; align-items: center; }
.art-agent-band h2 { color: #fff; }.art-agent-band p { color: #c7d0e4; max-width: 620px; font-size: .98rem; }
.art-agent-band .art-agent-band__detail { color: #a3b1cb; font-size: .8rem; }
.art-agent-band__action { display: flex; flex-direction: column; align-items: start; gap: 22px; }
.art-faq .feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.art-final { padding: 20px 0 90px; text-align: center; }.art-final h2 { font-size: clamp(2rem,4vw,3rem); }.art-final .art-actions { justify-content: center; }
.art-section, .art-continuity, .art-sharing { scroll-margin-top: 90px; }
@media (max-width: 1000px) { .art-hero__grid { grid-template-columns: 1fr 1fr; gap: 0; }.art-desktop-break { display: none; }.art-hero h1 { font-size: 2.9rem; }.art-split { gap: 35px; }.art-examples { gap: 14px; }.art-example__body { padding: 22px; }.art-preview { padding-inline: 16px; }.art-agent-band__inner { gap: 35px; } }
@media (max-width: 760px) {
    .art-hero { padding-top: 102px; }.art-hero__grid { grid-template-columns: 1fr; gap: 15px; }.art-hero h1 { font-size: clamp(2.5rem,7.5vw,3.7rem); }.art-hero__copy > p { max-width: 560px; }.art-hero__visual { margin: 0 auto; max-width: 570px; }.art-hero__copy { padding: 0; }
    .art-format-strip .container { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 12px; }.art-format-strip span { font-size: .72rem; align-items: start; }.art-format-strip i { margin-top: 4px; }
    .art-section-heading, .art-split, .art-share-grid, .art-agent-band__inner { grid-template-columns: 1fr; gap: 28px; }.art-section-heading > p { max-width: none; }.art-examples { grid-template-columns: 1fr; gap: 26px; }.art-preview { height: 230px; }.art-example__body { padding: 27px; }.art-mini-report { max-width: 270px; }.art-mini-browser { margin-top: 16px; max-width: 290px; }.art-mini-checklist { margin-top: 13px; max-width: 290px; }
    .art-history { max-width: 540px; width: 100%; margin: 0 auto; }.art-share-card { padding: 28px; }.art-agent-band__action { gap: 22px; }.art-faq .feature-grid { grid-template-columns: 1fr; }.art-final { padding-bottom: 70px; }
}
@media (max-width: 380px) { .art-hero h1 { font-size: 2.35rem; }.art-actions { gap: 17px; }.art-hero__note { font-size: .66rem; }.art-history__header, .art-timeline { padding: 24px; }.art-timeline li { gap: 13px; }.art-agent-band .btn { font-size: .83rem; }.art-final .btn { font-size: .79rem; } }