/* AI Technology page — scoped under .ai-tech-page to avoid clashing with assets/css/style.css */
.ai-tech-page {
  --container: 1120px;
  --gutter: max(24px, calc((100% - var(--container)) / 2));
  --green: #0f8a4f;
  --green-2: #12a05c;
  --green-dark: #0a6b3c;
  --ink: #0f1f2e;
  --text: #3b4a55;
  --muted: #5b6a73;
  --mint: #eef7f2;
  --mint-2: #e3f3ea;
  --line: #e3e9e6;
  --red: #d0342c;
  --amber: #d98a0b;
  --blue: #1d6fd1;
  --purple: #7a4fd6;

  display: block;
  margin: 0;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  color: var(--ink);
  background: #fbfdfc;
  -webkit-font-smoothing: antialiased;
}
.ai-tech-page * { box-sizing: border-box; }
.ai-tech-page a { color: var(--green); text-decoration: none; }
.ai-tech-page a:hover { color: var(--green-dark); }
.ai-tech-page h1, .ai-tech-page h2, .ai-tech-page h3, .ai-tech-page p { margin: 0; }
.ai-tech-page h1, .ai-tech-page h2, .ai-tech-page h3 { font-family: inherit; letter-spacing: normal; }
.ai-tech-page svg { display: block; flex: none; }
.ai-tech-page > section { padding-top: 0; padding-bottom: 0; }
.ai-tech-page .wrap { padding-left: var(--gutter); padding-right: var(--gutter); }
.ai-tech-page .eyebrow { font-size: 11.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--green); display: flex; align-items: center; gap: 12px; }
.ai-tech-page .eyebrow--line::after { content: ""; width: 36px; height: 1.5px; background: #7fcaa3; }
.ai-tech-page .hl { color: var(--green-2); }
.ai-tech-page .h2 { font-size: clamp(28px,3.6vw,40px); line-height: 1.08; font-weight: 800; letter-spacing: -.03em; }
.ai-tech-page .lede { font-size: clamp(14.5px,1.4vw,16px); line-height: 1.55; color: var(--text); }
.ai-tech-page .ico { width: 48px; height: 48px; border-radius: 50%; background: var(--mint-2); display: flex; align-items: center; justify-content: center; flex: none; }
.ai-tech-page .ico--sq { border-radius: 10px; }
.ai-tech-page .ai-card { background: #fff; border-radius: 12px; box-shadow: 0 14px 40px rgba(15,31,46,.08),0 1px 3px rgba(15,31,46,.04); }
.ai-tech-page .panel { background: linear-gradient(180deg,#f1f8f4,#f6fbf8); border-radius: 14px; padding: 30px 26px; }
.ai-tech-page .panel > .h2 { margin-top: 12px; }
.ai-tech-page .chk { width: 22px; height: 22px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; flex: none; }
.ai-tech-page .script { font: 700 22px/1.05 'Caveat',cursive; color: var(--ink); transform: rotate(-12deg); }
.ai-tech-page .script::after { content: ""; display: block; width: 75%; height: 3px; background: var(--green); border-radius: 3px; margin: 8px 0 0 25%; transform: rotate(-6deg); }
.ai-tech-page .sev { font-size: 11px; font-weight: 600; }
.ai-tech-page .sev--high { color: var(--red); }
.ai-tech-page .sev--med { color: var(--amber); }
.ai-tech-page .sev--blue { color: var(--blue); }
.ai-tech-page .fdot { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex: none; }
.ai-tech-page .fdot--red { background: #fdeceb; }
.ai-tech-page .fdot--amber { background: #fdf2df; }
.ai-tech-page .fdot--blue { background: #e2eefb; }
.ai-tech-page .fdot--purple { background: #ece6fb; }

/* Hero */
.ai-tech-page .ai-hero { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 32px; align-items: center; padding-top: 40px; padding-bottom: 40px; background: radial-gradient(40% 60% at 80% 20%,#e3f4ea 0%,rgba(227,244,234,0) 70%); overflow: hidden; }
.ai-tech-page .ai-hero__text { display: flex; flex-direction: column; gap: 12px; }
.ai-tech-page .ai-hero h1 { font-size: clamp(38px,5.2vw,58px); line-height: 1; font-weight: 800; letter-spacing: -.035em; }
.ai-tech-page .ai-hero__sub { font-size: clamp(18px,2vw,22px); font-weight: 600; color: #3b4a55; letter-spacing: -.01em; }
.ai-tech-page .ai-hero__text > .lede { max-width: 500px; }
.ai-tech-page .trio { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 18px; }
.ai-tech-page .trio__item { display: flex; align-items: flex-start; gap: 12px; }
.ai-tech-page .trio__item .ico { width: 44px; height: 44px; }
.ai-tech-page .trio__item b { display: block; font-size: 12.5px; font-weight: 700; }
.ai-tech-page .trio__item > div { min-width: 0; }
.ai-tech-page .trio__item > div > span { display: block; font-size: 11px; line-height: 1.45; color: var(--muted); margin-top: 2px; }

.ai-tech-page .diagram { position: relative; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); grid-template-rows: auto auto; gap: 28px 20px; padding: 10px 0 70px; }
.ai-tech-page .wires { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ai-tech-page .reports { grid-column: 1; grid-row: 1; padding: 16px 16px 18px; transform: rotate(-3deg); position: relative; z-index: 1; }
.ai-tech-page .card-title { font-size: 13px; font-weight: 700; }
.ai-tech-page .bureaus { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.ai-tech-page .bureau { border-radius: 8px; padding: 10px 4px 8px; display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.ai-tech-page .bureau--eq { background: #fdeeee; }
.ai-tech-page .bureau--ex { background: #e8f0fb; }
.ai-tech-page .bureau--tu { background: #e3f4ef; }
.ai-tech-page .tile { width: 28px; height: 28px; border-radius: 6px; color: #fff; font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.ai-tech-page .tile--eq { background: #e0342c; }
.ai-tech-page .tile--ex { background: #2a7be4; }
.ai-tech-page .tile--tu { background: #12a07f; }
.ai-tech-page .bureau b { font-size: 10px; font-weight: 600; }
.ai-tech-page .bureau small { font-size: 9px; color: var(--muted); }
.ai-tech-page .aimodel { grid-column: 1; grid-row: 2; justify-self: center; width: min(100%,220px); padding: 16px 16px 18px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; position: relative; z-index: 1; }
.ai-tech-page .aichip { width: 52px; height: 52px; border-radius: 12px; background: var(--mint-2); display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.ai-tech-page .aimodel h3 { font-size: 15px; font-weight: 700; }
.ai-tech-page .aimodel p { font-size: 11px; line-height: 1.45; color: var(--muted); }
.ai-tech-page .findings { grid-column: 2; grid-row: 1 / span 2; align-self: start; padding: 16px 14px 6px; position: relative; z-index: 1; }
.ai-tech-page .flist { list-style: none; margin: 10px 0 0; padding: 0; }
.ai-tech-page .flist li { display: flex; align-items: center; gap: 12px; padding: 11px 4px; border-top: 1px solid #eef1f0; }
.ai-tech-page .flist li div { flex: 1; min-width: 0; }
.ai-tech-page .flist b { display: block; font-size: 11.5px; font-weight: 600; }
.ai-tech-page .flist .chev { color: #9aa6ad; }
.ai-tech-page .diagram .script { position: absolute; right: 4px; bottom: 0; font-size: 21px; }
.ai-tech-page .diagram .arrow-curve { position: absolute; right: 43%; bottom: 18px; width: 80px; }

/* How it reads */
.ai-tech-page .reads { margin-top: 8px; }
.ai-tech-page .reads .lede { margin-top: 10px; }
.ai-tech-page .steps { display: grid; grid-template-columns: minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr); align-items: center; gap: 8px; margin-top: 24px; }
.ai-tech-page .step { background: #fff; border-radius: 10px; padding: 18px 20px 22px; height: 100%; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 2px 10px rgba(15,31,46,.04); }
.ai-tech-page .step__top { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 6px; }
.ai-tech-page .num { width: 22px; height: 22px; border-radius: 50%; background: var(--mint-2); color: var(--ink); font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.ai-tech-page .step .ico { width: 54px; height: 54px; }
.ai-tech-page .step h3 { font-size: 16px; font-weight: 700; padding-left: 32px; }
.ai-tech-page .step p { font-size: 13px; line-height: 1.5; color: var(--text); padding-left: 32px; }
.ai-tech-page .steps__arrow { justify-self: center; }

/* Trained */
.ai-tech-page .trained { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 40px; align-items: center; padding-top: 48px; padding-bottom: 40px; }
.ai-tech-page .trained__text { display: flex; flex-direction: column; gap: 14px; }
.ai-tech-page .trained .lede { max-width: 540px; }
.ai-tech-page .trio--plain { margin-top: 12px; }
.ai-tech-page .trio--plain .trio__item { align-items: center; }
.ai-tech-page .trio--plain .trio__item > span:not(.ico) { min-width: 0; font-size: 12px; line-height: 1.45; color: var(--text); }
.ai-tech-page .learns { padding: 22px 18px 22px; transform: rotate(-1.5deg); }
.ai-tech-page .learns .card-title { font-size: 14px; padding-left: 4px; }
.ai-tech-page .lsteps { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; align-items: stretch; }
.ai-tech-page .lsteps li { display: flex; align-items: center; gap: 16px; background: #f4f8f6; border-radius: 8px; padding: 12px 14px; }
.ai-tech-page .lsteps b { display: block; font-size: 12.5px; font-weight: 600; }
.ai-tech-page .lsteps small { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.ai-tech-page .lsteps .down { align-self: center; background: none; padding: 6px 0; }

/* Security */
.ai-tech-page .security .steps3 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 22px; }
.ai-tech-page .sec { background: #fff; border-radius: 10px; padding: 18px 20px; display: flex; gap: 18px; box-shadow: 0 2px 10px rgba(15,31,46,.04); }
.ai-tech-page .sec .ico { width: 56px; height: 56px; }
.ai-tech-page .sec h3 { font-size: 14.5px; font-weight: 700; margin-bottom: 6px; }
.ai-tech-page .sec p { font-size: 12.5px; line-height: 1.5; color: var(--text); }

/* CTA */
.ai-tech-page .ai-cta { margin-top: 20px; margin-bottom: 56px; }
.ai-tech-page .ai-cta__inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 28px; align-items: center; }
.ai-tech-page .ai-cta__text { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.ai-tech-page .ai-btn { margin-top: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; background: var(--green); color: #fff; font-size: 16px; font-weight: 700; padding: 15px 28px; border-radius: 7px; box-shadow: 0 8px 20px rgba(15,138,79,.22); transition: background .15s; }
.ai-tech-page .ai-btn:hover { background: var(--green-dark); color: #fff; }
.ai-tech-page .assure { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 10px; }
.ai-tech-page .assure span { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--text); }
.ai-tech-page .preview { position: relative; display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 12px; align-items: start; }
.ai-tech-page .preview .findings { grid-column: auto; grid-row: auto; transform: rotate(-2deg); padding: 14px 12px 4px; }
.ai-tech-page .conf { font-size: 9.5px; font-weight: 600; color: var(--green); background: var(--mint-2); border-radius: 4px; padding: 4px 8px; white-space: nowrap; }
.ai-tech-page .impact { padding: 16px; margin-top: 18px; transform: rotate(-2deg); }
.ai-tech-page .impact__pts { margin-top: 12px; background: var(--mint); border-radius: 8px; padding: 10px; text-align: center; color: var(--green); font-size: 15px; font-weight: 700; }
.ai-tech-page .impact__pts b { font-size: 28px; font-weight: 800; margin-right: 4px; }
.ai-tech-page .bars { display: flex; align-items: flex-end; gap: 5px; height: 60px; margin-top: 14px; }
.ai-tech-page .bars i { flex: 1; border-radius: 2px; background: #a7dcc0; }
.ai-tech-page .bars i:nth-last-child(-n+3) { background: var(--green-2); }
.ai-tech-page .impact small { display: block; font-size: 9px; color: var(--muted); margin-top: 8px; }

/* Responsive */
@media (max-width: 1240px) and (min-width: 1101px) {
  .ai-tech-page .ai-hero { gap: 24px; }
  .ai-tech-page .diagram { gap: 24px 14px; }
  .ai-tech-page .flist li { gap: 10px; padding: 10px 2px; }
  .ai-tech-page .trio { gap: 12px; }
  .ai-tech-page .preview { gap: 10px; }
}
@media (max-width: 1100px) {
  .ai-tech-page .ai-hero { grid-template-columns: 1fr; gap: 28px; padding-top: 40px; }
  .ai-tech-page .ai-hero__text > .lede { max-width: 680px; }
  .ai-tech-page .diagram { max-width: 680px; width: 100%; margin: 0 auto; }
  .ai-tech-page .trained { grid-template-columns: 1fr; gap: 28px; padding-top: 40px; }
  .ai-tech-page .trained .lede { max-width: 680px; }
  .ai-tech-page .learns { max-width: 560px; width: 100%; transform: none; }
  .ai-tech-page .ai-cta__inner { grid-template-columns: 1fr; gap: 28px; }
  .ai-tech-page .preview { max-width: 620px; width: 100%; }
}
@media (max-width: 900px) {
  .ai-tech-page .steps { grid-template-columns: 1fr; gap: 10px; margin-top: 20px; }
  .ai-tech-page .steps__arrow { transform: rotate(90deg); }
  .ai-tech-page .step { display: grid; grid-template-columns: auto 1fr; column-gap: 16px; row-gap: 6px; align-items: start; }
  .ai-tech-page .step__top { grid-row: span 2; margin: 0; }
  .ai-tech-page .step h3, .ai-tech-page .step p { padding-left: 0; }
  .ai-tech-page .security .steps3 { grid-template-columns: 1fr; }
  .ai-tech-page .sec .ico { width: 50px; height: 50px; }
}
@media (max-width: 760px) {
  .ai-tech-page .trio { grid-template-columns: 1fr; gap: 14px; }
  .ai-tech-page .trio__item { align-items: center; }
  .ai-tech-page .diagram { gap: 20px 12px; }
  .ai-tech-page .bureau b { font-size: 9.5px; }
}
@media (max-width: 640px) {
  .ai-tech-page .wrap { padding-left: 20px; padding-right: 20px; }
  .ai-tech-page .panel { padding: 24px 18px; }
  .ai-tech-page .ai-hero { padding-top: 32px; padding-bottom: 28px; }
  .ai-tech-page .ai-hero h1 br, .ai-tech-page .h2 br { display: none; }
  .ai-tech-page .diagram { grid-template-columns: 1fr; gap: 14px; padding: 0; }
  .ai-tech-page .wires, .ai-tech-page .diagram .arrow-curve { display: none; }
  .ai-tech-page .reports, .ai-tech-page .aimodel, .ai-tech-page .findings { grid-column: 1; grid-row: auto; transform: none; }
  .ai-tech-page .aimodel { width: 100%; flex-direction: row; text-align: left; align-items: center; gap: 14px; }
  .ai-tech-page .aichip { margin: 0; }
  .ai-tech-page .diagram .script { position: relative; right: auto; bottom: auto; justify-self: end; margin: 8px 10px 0 0; font-size: 20px; }
  .ai-tech-page .step { grid-template-columns: 1fr; }
  .ai-tech-page .step__top { grid-row: auto; }
  .ai-tech-page .trained { padding-top: 32px; padding-bottom: 28px; }
  .ai-tech-page .learns { padding: 18px 14px; }
  .ai-tech-page .lsteps li { gap: 12px; padding: 10px 12px; }
  .ai-tech-page .lsteps .ico { width: 40px; height: 40px; }
  .ai-tech-page .sec { padding: 16px; gap: 14px; }
  .ai-tech-page .sec .ico { width: 44px; height: 44px; }
  .ai-tech-page .ai-cta { margin-bottom: 40px; }
  .ai-tech-page .ai-btn { align-self: stretch; width: 100%; font-size: 15px; padding: 15px 18px; }
  .ai-tech-page .assure { flex-direction: column; gap: 10px; }
  .ai-tech-page .preview { grid-template-columns: 1fr; }
  .ai-tech-page .preview .findings, .ai-tech-page .impact { transform: none; }
  .ai-tech-page .impact { margin-top: 0; }
}
@media (max-width: 380px) {
  .ai-tech-page .bureaus { gap: 5px; }
  .ai-tech-page .tile { width: 24px; height: 24px; font-size: 11px; }
  .ai-tech-page .flist li { gap: 8px; }
  .ai-tech-page .flist b { font-size: 11px; }
  .ai-tech-page .conf { font-size: 9px; padding: 3px 6px; }
  .ai-tech-page .ai-hero__sub { font-size: 17px; }
}
