.coding-agent-page .oc-hero__layout { grid-template-columns: minmax(0,.82fr) minmax(560px,1.18fr); }
.coding-agent-page .oc-hero h1 { font-size: clamp(48px,4.7vw,70px); }

.ca-control { overflow: hidden; border: 1px solid rgba(229,254,150,.26); background: #151a16; box-shadow: 0 34px 90px rgba(0,0,0,.3); color: #eef2ec; font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; }
.ca-control__bar,.ca-control__foot { display: flex; justify-content: space-between; align-items: center; padding: 0 16px; background: #202720; color: #899289; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ca-control__bar { height: 44px; border-bottom: 1px solid #343d34; }
.ca-control__bar b { display: inline-flex; align-items: center; gap: 7px; color: var(--oc-lime); font-size: 7px; }
.ca-control__bar i,.ca-control__foot i { width: 6px; height: 6px; border-radius: 50%; background: var(--oc-lime); box-shadow: 0 0 12px rgba(229,254,150,.45); }
.ca-control__tools { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid #303830; background: #1a201b; }
.ca-control__tools span { display: flex; align-items: center; gap: 7px; min-height: 54px; padding: 0 13px; border-right: 1px solid #303830; color: #737d74; font-size: 8px; font-weight: 700; }
.ca-control__tools span:last-child { border-right: 0; }
.ca-control__tools i { width: 7px; height: 7px; border: 1px solid #69736a; border-radius: 50%; }
.ca-control__tools span.is-active { color: #eef2ec; background: #242c24; }
.ca-control__tools span.is-active i { border-color: var(--oc-lime); background: var(--oc-lime); }
.ca-control__body { display: grid; grid-template-columns: 180px 1fr; min-height: 342px; }
.ca-control__scope { display: flex; flex-direction: column; padding: 24px 18px; border-right: 1px solid #303830; background: #1b211c; }
.ca-control__scope small { color: var(--oc-lime); font-size: 6px; font-weight: 700; letter-spacing: .1em; }
.ca-control__scope strong { margin-top: auto; font-family: "DM Sans",sans-serif; font-size: 18px; line-height: 1.15; letter-spacing: -.03em; }
.ca-control__scope p { margin: 12px 0 0; color: #788279; font-family: "DM Sans",sans-serif; font-size: 9px; line-height: 1.55; }
.ca-control__rows { padding: 15px 18px; }
.ca-control__rows > div { display: grid; grid-template-columns: 72px 1fr auto; align-items: center; min-height: 72px; border-bottom: 1px solid #303830; }
.ca-control__rows > div:last-child { border-bottom: 0; }
.ca-control__rows span { color: #839c32; font-size: 6px; font-weight: 700; letter-spacing: .08em; }
.ca-control__rows p { margin: 0; color: #b2b9b1; font-size: 8px; }
.ca-control__rows b { padding: 5px 7px; border: 1px solid #4c5945; color: var(--oc-lime); font-size: 6px; }
.ca-control__foot { min-height: 42px; border-top: 1px solid #343d34; }
.ca-control__foot span { display: flex; align-items: center; gap: 7px; }

.ca-tool-grid { display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid var(--oc-line); border-left: 1px solid var(--oc-line); }
.ca-tool-grid article { position: relative; min-height: 360px; padding: 28px; border-right: 1px solid var(--oc-line); border-bottom: 1px solid var(--oc-line); background: #fff; }
.ca-tool-grid article.ca-tool-card--featured { background: var(--oc-lime); }
.ca-tool-card__top { display: flex; justify-content: space-between; align-items: center; }
.ca-tool-card__top span { color: var(--oc-green); font-size: 10px; font-weight: 700; }
.ca-tool-card__top small { color: #73766f; font-size: 8px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ca-tool-grid h3 { margin: 60px 0 13px; font-size: 34px; line-height: 1; letter-spacing: -.045em; }
.ca-tool-grid p { max-width: 490px; margin: 0; color: #60645e; font-size: 13px; line-height: 1.65; }
.ca-tool-grid ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 25px 0 40px; padding: 0; list-style: none; }
.ca-tool-grid li { display: flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid rgba(36,38,35,.18); color: #595d56; font-size: 9px; }
.ca-tool-grid li i { width: 5px; height: 5px; border-radius: 50%; background: var(--oc-green); }
.ca-tool-grid article > a { position: absolute; right: 28px; bottom: 26px; color: var(--oc-ink); font-size: 10px; font-weight: 700; text-decoration: none; }
.ca-tool-grid article > a span { margin-left: 7px; color: var(--oc-green); }
.ca-tool-note { margin: 24px 0 0; color: #70746d; font-size: 11px; text-align: right; }

.ca-standard { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 64px; border-top: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); }
.ca-standard article { display: flex; flex-direction: column; min-height: 205px; padding: 22px; border-right: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.ca-standard span { color: var(--oc-lime); font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ca-standard strong { margin-top: auto; font-size: 20px; line-height: 1.15; }
.ca-standard small { margin-top: 9px; color: rgba(255,255,255,.52); font-size: 9px; line-height: 1.5; }

@media (max-width: 1100px) {
    .coding-agent-page .oc-hero__layout { grid-template-columns: 1fr; }
    .ca-control { max-width: 850px; }
}

@media (max-width: 800px) {
    .ca-tool-grid,.ca-standard { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
    .ca-control__tools { grid-template-columns: 1fr 1fr; }
    .ca-control__tools span:nth-child(2) { border-right: 0; }
    .ca-control__tools span:nth-child(-n+2) { border-bottom: 1px solid #303830; }
    .ca-control__body { grid-template-columns: 1fr; }
    .ca-control__scope { min-height: 150px; border-right: 0; border-bottom: 1px solid #303830; }
    .ca-control__scope strong { margin-top: 36px; }
    .ca-control__rows { padding: 10px; }
    .ca-control__rows > div { grid-template-columns: 62px 1fr; min-height: 66px; }
    .ca-control__rows b { display: none; }
    .ca-control__foot span:last-child { display: none; }
    .ca-tool-grid,.ca-standard { grid-template-columns: 1fr; }
    .ca-tool-grid article { min-height: 390px; }
}