:root { --article-lime: #c7ff37; --article-ink: #080808; --article-paper: #e9e8e3; }
.ai-articles-page { background: var(--article-ink); }
.article-ai-hero { position: relative; min-height: 100svh; padding: clamp(112px,10vw,160px) 0 clamp(72px,8vw,118px); overflow: hidden; background: radial-gradient(circle at 76% 34%,rgba(199,255,55,.12),transparent 28%),linear-gradient(145deg,#090909 0%,#101010 56%,#060606 100%); isolation: isolate; }
.article-ai-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom,#000,transparent 88%); }
.article-ai-orbit { position: absolute; z-index: -1; border: 1px solid rgba(199,255,55,.22); border-radius: 50%; animation: article-orbit 18s linear infinite; }
.article-ai-orbit::after { content: ""; position: absolute; top: 50%; left: -5px; width: 10px; height: 10px; border-radius: 50%; background: var(--article-lime); box-shadow: 0 0 24px rgba(199,255,55,.8); }
.article-ai-orbit--one { top: 10%; right: -8%; width: min(48vw,700px); aspect-ratio: 1; }
.article-ai-orbit--two { top: 24%; right: 5%; width: min(30vw,430px); aspect-ratio: 1; animation-direction: reverse; animation-duration: 13s; }
@keyframes article-orbit { to { transform: rotate(360deg); } }
.article-ai-hero__grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(390px,.85fr); gap: clamp(42px,7vw,112px); align-items: end; margin-top: clamp(42px,7vw,90px); }
.article-ai-kicker { display: flex; align-items: center; gap: 10px; color: #b9b9b3; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.article-ai-kicker span { width: 8px; height: 8px; border-radius: 50%; background: var(--article-lime); box-shadow: 0 0 14px rgba(199,255,55,.8); }
.article-ai-hero h1 { max-width: 960px; margin-top: 24px; font-size: clamp(54px,7vw,110px); font-weight: 900; line-height: .86; letter-spacing: -.068em; text-transform: uppercase; }
.article-ai-lead { max-width: 790px; margin-top: 30px; color: #aaa9a4; font-size: clamp(18px,1.55vw,23px); line-height: 1.5; }
.article-ai-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.article-ai-button { display: inline-flex; align-items: center; min-height: 52px; padding: 13px 20px; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; font-size: 14px; font-weight: 800; transition: transform .25s ease,border-color .25s ease; }
.article-ai-button--accent { border-color: var(--article-lime); background: var(--article-lime); color: #090909; }
.article-ai-console { padding: clamp(22px,2.4vw,34px); border: 1px solid rgba(255,255,255,.16); border-radius: 24px; background: rgba(17,17,17,.78); backdrop-filter: blur(18px); box-shadow: 0 28px 80px rgba(0,0,0,.38); }
.article-ai-console__top { display: flex; justify-content: space-between; gap: 14px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.14); color: #8f908a; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.article-ai-console__top .is-live { color: var(--article-lime); }
.article-ai-console__topic { padding: 24px 0; }
.article-ai-console__topic small { display: block; color: #858680; font-size: 11px; text-transform: uppercase; }
.article-ai-console__topic strong { display: block; margin-top: 10px; font-size: clamp(24px,2.3vw,38px); line-height: 1; letter-spacing: -.04em; }
.article-ai-console ol { list-style: none; border-top: 1px solid rgba(255,255,255,.12); }
.article-ai-console li { display: grid; grid-template-columns: 34px 1fr; gap: 13px; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.1); color: #666863; }
.article-ai-console li > span { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid currentColor; border-radius: 50%; font-size: 10px; }
.article-ai-console li strong,.article-ai-console li small { display: block; }
.article-ai-console li small { margin-top: 3px; color: #777872; font-size: 12px; }
.article-ai-console li.is-done { color: #c7c8c2; }
.article-ai-console li.is-active { color: var(--article-lime); }
.article-ai-console li.is-active > span { background: var(--article-lime); color: #090909; animation: article-pulse 1.8s ease-in-out infinite; }
@keyframes article-pulse { 50% { box-shadow: 0 0 0 8px rgba(199,255,55,.11); } }
.article-ai-section { padding: clamp(88px,10vw,150px) 0; }
.article-ai-quiz { padding-top: clamp(70px,8vw,110px); }
.article-ai-pipeline { background: var(--article-paper); color: #090909; }
.article-ai-pipeline .service-eyebrow,.article-ai-pipeline .service-head__copy { color: #686864; }
.article-pipeline-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-top: 1px solid rgba(0,0,0,.22); border-bottom: 1px solid rgba(0,0,0,.22); }
.article-pipeline-grid article { min-height: 330px; padding: 22px 20px 28px; border-right: 1px solid rgba(0,0,0,.18); }
.article-pipeline-grid article:last-child { border-right: 0; }
.article-pipeline-grid span { color: #777772; font-size: 11px; }
.article-pipeline-grid strong { display: block; margin-top: 112px; font-size: clamp(24px,2.3vw,38px); line-height: .96; letter-spacing: -.04em; }
.article-pipeline-grid p { margin-top: 14px; color: #62625e; font-size: 14px; line-height: 1.5; }
.article-ai-results { position: relative; overflow: hidden; background: #0a0a0a; }
.article-results-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.article-results-card { min-height: 590px; padding: clamp(26px,3vw,42px); border: 1px solid rgba(255,255,255,.14); border-radius: 24px; background: #131313; }
.article-results-card--accent { background: var(--article-lime); color: #090909; }
.article-results-card > span { color: #8e9088; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.article-results-card--accent > span { color: #48531f; }
.article-results-card h3 { max-width: 620px; margin-top: 56px; font-size: clamp(36px,4.1vw,64px); line-height: .92; letter-spacing: -.05em; }
.article-results-card ul { display: grid; gap: 11px; margin-top: 28px; list-style: none; color: #a8aaa3; }
.article-results-card--accent ul { color: #354016; }
.article-results-card li::before { content: "→"; margin-right: 10px; color: var(--article-lime); }
.article-results-card--accent li::before { color: #090909; }
.article-mini-chart { display: flex; align-items: end; gap: 9px; height: 130px; margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); }
.article-results-card--accent .article-mini-chart { border-top-color: rgba(0,0,0,.2); }
.article-mini-chart i { flex: 1; min-width: 12px; border-radius: 5px 5px 0 0; background: #52544f; animation: article-bars 1.4s ease both; transform-origin: bottom; }
.article-mini-chart--before i:nth-child(1){height:28%}.article-mini-chart--before i:nth-child(2){height:42%}.article-mini-chart--before i:nth-child(3){height:34%}.article-mini-chart--before i:nth-child(4){height:50%}.article-mini-chart--before i:nth-child(5){height:39%}.article-mini-chart--before i:nth-child(6){height:45%}
.article-mini-chart--after i { background: #090909; }.article-mini-chart--after i:nth-child(1){height:34%}.article-mini-chart--after i:nth-child(2){height:49%}.article-mini-chart--after i:nth-child(3){height:62%}.article-mini-chart--after i:nth-child(4){height:75%}.article-mini-chart--after i:nth-child(5){height:88%}.article-mini-chart--after i:nth-child(6){height:100%}
@keyframes article-bars { from { transform: scaleY(.08); } }
.article-ai-capabilities { background: var(--article-paper); color: #090909; }
.article-ai-capabilities .service-eyebrow,.article-ai-capabilities .service-head__copy { color: #686864; }
.article-capability-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.article-capability-grid article { min-height: 300px; padding: 22px; border: 1px solid rgba(0,0,0,.18); border-radius: 18px; transition: transform .3s ease,background .3s ease; }
.article-capability-grid span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(0,0,0,.5); border-radius: 50%; font-size: 11px; }
.article-capability-grid h3 { margin-top: 78px; font-size: clamp(26px,2.5vw,38px); line-height: .96; letter-spacing: -.04em; }
.article-capability-grid p { margin-top: 14px; color: #62625e; font-size: 14px; line-height: 1.5; }
.article-ai-seo { background: #0c0c0c; }
.article-ai-seo__layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(48px,9vw,150px); }
.article-ai-seo h2 { max-width: 700px; margin-top: 24px; font-size: clamp(48px,6.5vw,98px); font-weight: 900; line-height: .88; letter-spacing: -.06em; text-transform: uppercase; }
.article-ai-seo__copy { display: grid; gap: 26px; align-content: start; padding-top: 34px; }
.article-ai-seo__copy p { color: #a9aaa5; font-size: clamp(17px,1.35vw,20px); line-height: 1.62; }
.article-ai-seo__copy strong { color: var(--article-lime); }
.article-ai-integrations { background: var(--article-lime); color: #090909; }
.article-ai-integrations .service-eyebrow,.article-ai-integrations .service-head__copy { color: rgba(0,0,0,.62); }
.article-integration-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid rgba(0,0,0,.25); }
.article-integration-list span { display: flex; align-items: end; min-height: 150px; padding: 22px; border-right: 1px solid rgba(0,0,0,.2); border-bottom: 1px solid rgba(0,0,0,.2); font-size: clamp(25px,3vw,44px); font-weight: 850; letter-spacing: -.04em; }
.article-integration-list span:nth-child(3n) { border-right: 0; }
.article-ai-faq { background: var(--article-paper); color: #090909; }
.article-ai-faq .service-eyebrow { color: #686864; }
.article-ai-faq .service-faq-item { border-color: rgba(0,0,0,.2); }
.article-ai-faq .service-faq-item p { color: #62625e; }
.article-ai-cta { background: #090909; }
@media (hover:hover) { .article-ai-button:hover { transform: translateY(-2px); border-color: var(--article-lime); }.article-capability-grid article:hover { transform: translateY(-6px); background: #fff; } }
@media (max-width:1100px) { .article-ai-hero__grid { grid-template-columns: 1fr; }.article-ai-console { max-width: 760px; }.article-pipeline-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.article-pipeline-grid article:nth-child(2n) { border-right: 0; }.article-capability-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .article-ai-hero h1 { font-size: clamp(48px,14vw,72px); }.article-ai-hero__grid { margin-top: 34px; }.article-ai-console { border-radius: 18px; }.article-results-grid,.article-ai-seo__layout { grid-template-columns: 1fr; }.article-results-card { min-height: 520px; }.article-integration-list { grid-template-columns: 1fr; }.article-integration-list span { min-height: 110px; border-right: 0; }.article-pipeline-grid,.article-capability-grid { grid-template-columns: 1fr; }.article-pipeline-grid article { min-height: 240px; border-right: 0; }.article-pipeline-grid strong { margin-top: 70px; } }
@media (prefers-reduced-motion:reduce) { .article-ai-orbit,.article-ai-console li.is-active > span,.article-mini-chart i { animation: none; } }