@charset "UTF-8";

#ai-ready { position: relative; isolation: isolate; overflow: clip; padding-block: 96px; background: #fbfeff; color: #142f50; }
#ai-ready .ai-backdrop { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
#ai-ready > .container { width: min(calc(100% - 48px),1500px); }
#ai-ready .ai-intro { text-align: center; }
#ai-ready .ai-eyebrow { display: flex; justify-content: center; align-items: center; gap: 16px; margin-bottom: 28px; color: #071b3f; font-size: 18px; font-weight: 800; line-height: 1.6; }
#ai-ready .ai-eyebrow::before { content: ""; width: 28px; height: 3px; background: #ffc400; }
#ai-ready .ai-heading { color: #06152f; font-size: clamp(32px,3.5vw,54px); font-weight: 900; line-height: 1.5; letter-spacing: -.045em; overflow-wrap: normal; }
#ai-ready .ai-heading mark { color: #0088ff; background: linear-gradient(transparent 77%,#ffe27c 77%,#ffe27c 97%,transparent 97%); padding: 0; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
#ai-ready .ai-lead { margin-top: 28px; font-size: 22px; line-height: 1.8; }
#ai-ready .ai-lead strong { color: #0082ef; font-weight: 800; }
#ai-ready .ai-cycle-diagram { position: relative; margin-top: 64px; }
#ai-ready .ai-arrow-defs { position: absolute; width: 0; height: 0; }
#ai-ready .ai-cycle { --cycle-gap: 64px; display: grid; grid-template-columns: 1fr 1.2fr 1fr; align-items: start; column-gap: var(--cycle-gap); row-gap: 72px; }
#ai-ready .ai-cycle-step { position: relative; min-width: 0; padding: 24px; border: 1px solid #eef8ff; border-radius: 22px; background: #fff; box-shadow: 0 4px 24px rgba(19,138,208,.055); }
#ai-ready .ai-step-heading { display: flex; align-items: center; gap: 14px; min-height: 52px; }
#ai-ready .ai-number { display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; color: #fff; background: #0088ff; font-size: 34px; font-weight: 800; line-height: 1; }
#ai-ready .ai-cycle-step h3 { color: #071831; font-size: 20px; font-weight: 900; line-height: 1.5; letter-spacing: -.045em; overflow-wrap: normal; }
#ai-ready .ai-phrase { white-space: nowrap; }
#ai-ready .ai-step-body { margin-top: 20px; font-size: 16px; line-height: 1.8; color: #21436c; }
#ai-ready .ai-line-icon { width: 34px; height: 34px; flex: 0 0 34px; fill: none; stroke: currentColor; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; color: #008aff; }
#ai-ready .ai-collect { min-height: 390px; }
#ai-ready .ai-collect-visual { display: grid; grid-template-columns: 112px 1fr; align-items: end; gap: 10px; margin-top: 36px; }
#ai-ready .ai-worker { width: 112px; height: auto; }
#ai-ready .ai-record-types { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
#ai-ready .ai-record-types li { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 6px; min-height: 70px; padding: 8px 4px; border-radius: 12px; background: #eef9ff; color: #244469; font-size: 12px; line-height: 1.5; white-space: nowrap; }
#ai-ready .ai-record-types .ai-line-icon { width: 30px; height: 30px; flex-basis: 30px; }
#ai-ready .ai-connect { isolation: isolate; background: none; border-color: transparent; box-shadow: none; padding-inline: 18px; }
#ai-ready .ai-connect::before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; height: 210px; border-radius: 22px; background: #fffcf0; }
#ai-ready .ai-connect::after { content: ""; position: absolute; z-index: -1; top: 150px; bottom: 0; left: -32px; right: -32px; border-radius: 50%; background: #fffcf0; }
#ai-ready .ai-connect .ai-number { background: #ffbf00; }
#ai-ready .ai-connect .ai-step-body { text-align: center; }
#ai-ready .ai-hub { position: relative; display: grid; grid-template-columns: 1fr 1.6fr 1fr; align-items: center; gap: 8px; margin-top: 32px; padding-block: 20px; }
#ai-ready .ai-hub-ring { position: absolute; inset: -4% -5%; z-index: 0; width: 110%; height: 108%; max-width: none; fill: none; stroke: #d9f1ff; stroke-width: 7; pointer-events: none; }
#ai-ready .ai-hub-ring path { marker-end: url(#ai-hub-arrowhead); }
#ai-ready .ai-hub-core, #ai-ready .ai-hub-nodes { position: relative; z-index: 1; }
#ai-ready .ai-hub-core { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 32px; }
#ai-ready .ai-official-logo { width: 172px; height: auto; }
#ai-ready .ai-hub-label { position: relative; width: 100%; padding: 26px 4px 20px; color: #fff; border-radius: 0 0 50% 50% / 0 0 18% 18%; background: linear-gradient(#199aff,#0080ff); font-size: 14px; line-height: 1.6; text-align: center; white-space: nowrap; }
#ai-ready .ai-hub-label::before { content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 27px; border: 1px solid white; border-radius: 50%; background: #71caff; }
#ai-ready .ai-hub-nodes { display: grid; gap: 14px; }
#ai-ready .ai-hub-nodes li { display: flex; align-items: center; gap: 6px; color: #204466; font-size: 12px; line-height: 1.5; }
#ai-ready .ai-hub-nodes li > span:first-child { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%; background: #e6f6ff; }
#ai-ready .ai-hub-nodes .ai-line-icon { width: 26px; height: 26px; }
#ai-ready .ai-hub-detail { position: relative; margin: 18px auto 0; max-width: 330px; text-align: center; color: #204466; font-size: 14px; line-height: 1.7; }
#ai-ready .ai-assistant { width: 100%; max-width: 332px; margin: 24px auto 0; height: auto; }
#ai-ready .ai-improve { grid-column: 1 / -1; display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 32px; width: calc(100% - 320px); margin-inline: auto; }
#ai-ready .ai-benefits { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; }
#ai-ready .ai-benefits li { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 14px; min-height: 112px; padding: 12px 4px; border-radius: 12px; background: #f5fbff; text-align: center; }
#ai-ready .ai-benefit-label { color: #21436c; font-size: 12px; line-height: 1.5; }
#ai-ready .ai-benefits li:nth-child(3) .ai-line-icon { color: #f5b500; }
#ai-ready .ai-flow-arrow { position: absolute; overflow: visible; pointer-events: none; max-width: none; fill: none; stroke: #ffcf32; stroke-width: 14; }
#ai-ready .ai-flow-arrow path { marker-end: url(#ai-cycle-arrowhead); }
#ai-ready .ai-arrow-1, #ai-ready .ai-arrow-2 { left: calc(100% + 5px); top: 62px; width: calc(var(--cycle-gap) - 10px); height: 84px; }
#ai-ready .ai-arrow-3 { top: calc(100% + 12px); right: 0; width: 108px; height: 96px; }
#ai-ready .ai-arrow-4 { right: calc(100% + 12px); top: -150px; width: 140px; height: 180px; }
#ai-ready .ai-mobile-flow, #ai-ready .ai-return-label { display: none; }
#ai-ready .ai-cta-wrap { display: flex; justify-content: center; margin-top: 56px; }
#ai-ready .ai-cta { display: inline-flex; align-items: center; justify-content: center; gap: 28px; min-height: 64px; max-width: 100%; padding: 16px 40px; border-radius: 999px; background: #0088ff; color: white; text-decoration: none; font-size: 20px; font-weight: 700; line-height: 1.6; }
#ai-ready .ai-cta:hover { background: #0074df; }
#ai-ready .ai-cta svg { width: 26px; height: 26px; flex: 0 0 26px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#ai-ready .ai-scope-note { max-width: 1050px; margin: 24px auto 0; color: #526a82; font-size: 12px; line-height: 1.8; text-align: center; }

@media (max-width: 1199px) {
  #ai-ready .ai-heading { font-size: 36px; }
  #ai-ready .ai-lead { font-size: 18px; }
  #ai-ready .ai-cycle-diagram { max-width: 720px; margin-inline: auto; padding-left: 28px; }
  #ai-ready .ai-cycle-diagram::before { content: ""; position: absolute; left: 3px; top: 32px; bottom: 12px; width: 24px; border-left: 2px solid #7abfff; border-bottom: 2px solid #7abfff; border-radius: 0 0 0 20px; }
  #ai-ready .ai-cycle-diagram::after { content: ""; position: absolute; left: -1px; top: 32px; width: 10px; height: 10px; border-left: 2px solid #7abfff; border-top: 2px solid #7abfff; transform: rotate(45deg); }
  #ai-ready .ai-cycle { grid-template-columns: 1fr; gap: 60px; }
  #ai-ready .ai-cycle-step { padding: 28px; }
  #ai-ready .ai-connect { background: #fffcf0; border-color: #eef8ff; }
  #ai-ready .ai-connect::before, #ai-ready .ai-connect::after { display: none; }
  #ai-ready .ai-collect { min-height: 0; }
  #ai-ready .ai-collect-visual { max-width: 420px; margin-inline: auto; grid-template-columns: 130px 1fr; }
  #ai-ready .ai-worker { width: 130px; }
  #ai-ready .ai-record-types li { flex-direction: row; gap: 8px; font-size: 13px; min-height: 76px; }
  #ai-ready .ai-hub { max-width: 500px; margin-inline: auto; }
  #ai-ready .ai-hub-label { font-size: 15px; }
  #ai-ready .ai-improve { width: 100%; grid-column: auto; grid-template-columns: 1fr; gap: 28px; }
  #ai-ready .ai-benefit-label { font-size: 14px; }
  #ai-ready .ai-desktop-flow { display: none; }
  #ai-ready .ai-mobile-flow { display: block; inset: auto; top: calc(100% + 12px); left: calc(50% - 12px); width: 24px; height: 36px; stroke-width: 3.5; }
  #ai-ready .ai-mobile-4 { top: auto; left: -38px; bottom: 2px; }
  #ai-ready .ai-return-label { display: block; margin-top: 20px; color: #086cc3; font-size: 14px; font-weight: 700; line-height: 1.6; }
}

@media (max-width: 600px) {
  #ai-ready { padding-block: 80px; }
  #ai-ready > .container { width: calc(100% - 40px); }
  #ai-ready .ai-eyebrow { font-size: 15px; margin-bottom: 24px; gap: 12px; }
  #ai-ready .ai-heading { font-size: 28px; line-height: 1.55; text-align: left; }
  #ai-ready .ai-lead { font-size: 16px; line-height: 1.8; text-align: left; margin-top: 28px; }
  #ai-ready .ai-lead-break { display: none; }
  #ai-ready .ai-cycle-diagram { margin-top: 52px; padding-left: 22px; }
  #ai-ready .ai-cycle-step { padding: 20px 16px; border-radius: 18px; }
  #ai-ready .ai-step-heading { gap: 12px; align-items: flex-start; min-height: 44px; }
  #ai-ready .ai-number { flex-basis: 44px; width: 44px; height: 44px; font-size: 28px; }
  #ai-ready .ai-cycle-step h3 { font-size: 19px; line-height: 1.5; padding-top: 5px; }
  #ai-ready .ai-step-body { margin-top: 18px; font-size: 16px; line-height: 1.8; }
  #ai-ready .ai-collect-visual { grid-template-columns: 92px 1fr; gap: 8px; margin-top: 28px; }
  #ai-ready .ai-worker { width: 92px; }
  #ai-ready .ai-record-types { gap: 6px; }
  #ai-ready .ai-record-types li { flex-direction: column; gap: 5px; padding: 6px 2px; font-size: 11px; min-height: 65px; }
  #ai-ready .ai-record-types .ai-line-icon { width: 26px; height: 26px; flex-basis: 26px; }
  #ai-ready .ai-connect .ai-step-body { text-align: left; }
  #ai-ready .ai-hub { display: flex; justify-content: center; margin-top: 28px; padding-block: 26px; }
  #ai-ready .ai-hub-nodes { display: none; }
  #ai-ready .ai-hub-core { width: 200px; gap: 32px; }
  #ai-ready .ai-hub-label { font-size: 15px; }
  #ai-ready .ai-hub-ring { inset: -2% 0; width: 100%; height: 104%; }
  #ai-ready .ai-hub-detail { margin-top: 16px; font-size: 14px; }
  #ai-ready .ai-assistant { margin-top: 28px; }
  #ai-ready .ai-benefits { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  #ai-ready .ai-benefits li { min-height: 96px; gap: 10px; }
  #ai-ready .ai-benefit-label { font-size: 13px; }
  #ai-ready .ai-mobile-4 { left: -32px; }
  #ai-ready .ai-return-label { font-size: 13px; }
  #ai-ready .ai-cta-wrap { margin-top: 48px; }
  #ai-ready .ai-cta { min-height: 64px; padding: 16px 24px; gap: 16px; font-size: 16px; text-align: center; }
  #ai-ready .ai-cta svg { flex-basis: 24px; width: 24px; height: 24px; }
  #ai-ready .ai-scope-note { text-align: left; }
}
