.co-page { --co-body:16px; }
.co-page section { padding:77px 0; scroll-margin-top:90px; }
.co-page .eyebrow { color:#fb5a00; margin:0 0 14px; }
.co-page h1,.co-page h2,.co-page h3 { font-family:var(--display); color:var(--navy); margin:0; text-transform:uppercase; }
.co-page h1 { font-size:clamp(38px,4.7vw,66px); line-height:1.04; }
.co-page h2 { font-size:clamp(29px,3vw,40px); line-height:1.12; }
.co-page h3 { font-size:24px; line-height:1.2; margin:0 0 14px; }
.co-page .co-detail { color:var(--muted); font-family:var(--sans); font-size:var(--co-body); font-weight:400; line-height:1.55; margin:0 0 14px; }
.co-page .co-detail:last-child { margin-bottom:0; }
.co-page .co-detail strong { font-weight:700; color:var(--ink); }
.co-hero,.co-sand { background:var(--sand); }
.co-split { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:center; gap:clamp(28px,5vw,64px); }
.co-split>* { min-width:0; }
.co-hero h1+.co-detail { margin-top:24px; }
.co-hero picture,.co-hero img { display:block; width:100%; }
.co-hero img { height:auto; border-radius:10px; box-shadow:0 12px 30px #092a4914; }
.co-intro { align-items:start; }
.co-section { background:var(--cream); }
.co-section.co-sand { background:var(--sand); }
.co-heading { max-width:760px; margin:0 auto 32px; text-align:center; }
.co-heading .co-detail { margin-top:16px; }
.co-model { display:grid; grid-template-columns:1fr 28px 1fr 28px 1fr; align-items:center; gap:12px; }
.co-model-card { align-self:stretch; padding:28px 22px; background:#fbf5e8; border:1px solid var(--line); border-radius:10px; text-align:center; }
.co-symbol { display:grid; place-items:center; width:52px; height:52px; border-radius:50%; background:#d6eae6; color:#12656a; font-weight:700; margin:0 auto 20px; }
.co-ai { background:#f7dfc7; color:#a54b14; }
.co-result { background:#f4e7bc; color:#786127; }
.co-connector { text-align:center; color:#fb5a00; font-size:28px; }
.co-responsibility { text-align:center; border-top:1px solid #d9c7a5; margin:24px 0 0; padding-top:20px; color:var(--ink); font-size:16px; }
.co-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; list-style:none; margin:0; padding:0; }
.co-steps li,.co-examples article { min-width:0; padding:26px 22px; background:#fdf8ed; border:1px solid var(--line); border-radius:10px; }
.co-steps li { display:flex; flex-direction:column; }
.co-number { display:grid; place-items:center; width:36px; height:36px; margin-bottom:20px; border-radius:50%; background:#f1dfaa; color:var(--navy); font-weight:700; }
.co-question { margin:auto 0 0; padding-top:18px; border-top:1px solid var(--line); color:var(--ink); font-size:15px; }
.co-examples { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.co-section.co-paper { background:var(--paper); }
.co-examples article { background:#f7ecd7; }
.co-section.co-close { text-align:center; background:var(--sand); }
.co-close .co-detail { max-width:680px; margin:22px auto 0; }
.co-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:28px; }
.co-button { padding:14px 23px; border:1px solid #04a1a5; border-radius:40px; background:#04a1a5; color:white; font-size:12px; font-weight:700; }
.co-outline { background:transparent; color:#08777a; }
.co-button:hover,.co-button:focus-visible { background:#fb5a00; border-color:#fb5a00; color:white; }
.co-button:focus-visible { outline:2px solid var(--navy); outline-offset:4px; }
@media(max-width:1000px) { .co-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .co-page { --co-body:15px; } .co-split { grid-template-columns:1fr; gap:28px; } .co-hero picture { grid-row:1; } .co-model { grid-template-columns:1fr; } .co-connector:last-of-type { transform:rotate(90deg); } .co-heading { text-align:left; } .co-examples { grid-template-columns:1fr; } .co-page .wrap { width:calc(100% - 40px); } .co-actions { flex-direction:column; } }
@media(max-width:480px) { .co-steps { grid-template-columns:1fr; } }
