/* Home AI chapter (TODO 00001.5.13). FINAL design/home/inspiration/sections/ai-chapter/r3/v1.png.
   Texture band (section 8): texture.jpg full bleed, text block left (orange eyebrow rule, white headline, outline
   button on navy), the three AI surfaces right as ai-surface panels. Nothing teal on the band itself. */
.p-home-ai-chapter {
  box-sizing: border-box; color: var(--wp--preset--color--white);
  background: var(--wp--preset--color--navy) url("../../img/texture.jpg") center / cover no-repeat;
  padding: var(--wp--custom--section--desktop) var(--wp--custom--gutter--desktop);
}
.p-home-ai-chapter *, .p-home-ai-chapter *::before, .p-home-ai-chapter *::after { box-sizing: border-box; }
.p-home-ai-chapter__inner {
  max-width: var(--wp--custom--layout--wide); margin-inline: auto;
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 4.6fr) minmax(0, 4fr);
  gap: var(--wp--preset--spacing--60); align-items: stretch;
}
@media (min-width: 1200px) {
  .p-home-ai-chapter__copy { align-self: center; }
  .p-home-ai-chapter__assistant { display: flex; flex-direction: column; }
  .p-home-ai-chapter__assistant .p-home-ai-chapter__source { margin-top: auto !important; }
  .p-home-ai-chapter__assistant .p-home-ai-chapter__pair { margin-bottom: var(--wp--preset--spacing--50); }
  .p-home-ai-chapter__recs { flex: 1; display: flex; flex-direction: column; }
  .p-home-ai-chapter__recs .p-home-ai-chapter__source { margin-top: auto !important; }
  .p-home-ai-chapter__recs .p-home-ai-chapter__tiles { margin-bottom: var(--wp--preset--spacing--50); }
}
.p-home-ai-chapter__assistant, .p-home-ai-chapter__stack { align-self: start; }
@media (min-width: 1200px) { .p-home-ai-chapter__assistant, .p-home-ai-chapter__stack { align-self: stretch; } }
.p-home-ai-chapter__copy { padding-right: var(--wp--preset--spacing--70); }
.p-home-ai-chapter__eyebrow {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--50); margin: 0;
  color: var(--wp--preset--color--white); font-size: var(--wp--preset--font-size--label);
  font-weight: var(--wp--custom--font-weight--label); letter-spacing: var(--wp--custom--letter-spacing--label);
  line-height: 1.3; text-transform: uppercase;
}
.p-home-ai-chapter__eyebrow::before { content: ""; flex: none; width: 32px; height: 3px; background: var(--wp--preset--color--orange); }
.p-home-ai-chapter .p-home-ai-chapter__title {
  margin: var(--wp--preset--spacing--40) 0 0; color: var(--wp--preset--color--white);
  font-size: var(--wp--preset--font-size--h-1); font-weight: var(--wp--custom--font-weight--h-1);
  letter-spacing: var(--wp--custom--letter-spacing--h-1); line-height: 1.1;
}
.p-home-ai-chapter__lead {
  margin: var(--wp--preset--spacing--50) 0 0; color: var(--wp--preset--color--white);
  font-size: var(--wp--preset--font-size--body-l); line-height: 1.6;
}
.p-home-ai-chapter__cta { margin: var(--wp--preset--spacing--80) 0 0; }
/* Outline button on navy (section 8): 1px white border, white label, arrow after. */
.p-home-ai-chapter__cta a {
  display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--40);
  min-height: var(--wp--custom--control); padding: 0 var(--wp--preset--spacing--60);
  border: 1px solid var(--wp--preset--color--white); border-radius: var(--wp--custom--radius--default);
  color: var(--wp--preset--color--white); font-size: var(--wp--preset--font-size--button);
  font-weight: var(--wp--custom--font-weight--button); letter-spacing: var(--wp--custom--letter-spacing--button);
  line-height: 1; text-decoration: none; transition: background-color 0.2s cubic-bezier(.22, .61, .36, 1);
}
.p-home-ai-chapter__cta a::after {
  content: ""; width: 20px; height: 20px; background: currentColor; transition: transform 0.2s cubic-bezier(.22, .61, .36, 1);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.p-home-ai-chapter__cta a:focus-visible {
  outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--white); outline-offset: var(--wp--custom--focus--offset);
}
.p-home-ai-chapter__cta a:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
  .p-home-ai-chapter__cta a:hover { background: var(--wp--custom--alpha--overlay-white); }
  .p-home-ai-chapter__cta a:hover::after { transform: translateX(3px); }
}

/* AI panels (section 8): ai-surface ground, 1px ai border, 4px radius, 24px padding, ink text. */
.p-home-ai-chapter__panel {
  position: relative; background: var(--wp--preset--color--ai-surface); border: 1px solid var(--wp--preset--color--ai);
  border-radius: var(--wp--custom--radius--default); padding: var(--wp--preset--spacing--60);
  color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-home-ai-chapter__panel p { margin: 0; }
.p-home-ai-chapter__stack { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--60); }
.p-home-ai-chapter__label {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); color: var(--wp--preset--color--ai);
  font-size: var(--wp--preset--font-size--label); font-weight: var(--wp--custom--font-weight--label);
  letter-spacing: var(--wp--custom--letter-spacing--label); line-height: 1.3; text-transform: uppercase;
}
.p-home-ai-chapter__panel a { color: var(--wp--preset--color--ai); }
.p-home-ai-chapter__panel a:focus-visible {
  outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--navy); outline-offset: 2px;
}
.p-home-ai-chapter__q {
  margin: var(--wp--preset--spacing--50) 0 0 auto !important; max-width: 80%; width: fit-content;
  background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
  color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); font-weight: 500;
}
.p-home-ai-chapter__a {
  margin-top: var(--wp--preset--spacing--60) !important; max-width: 88%;
  color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small);
}
.p-home-ai-chapter__pair {
  position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wp--preset--spacing--50); margin-top: var(--wp--preset--spacing--60);
}
.p-home-ai-chapter__mini {
  background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); overflow: hidden;
}
.p-home-ai-chapter__mini img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; background: var(--wp--preset--color--mist); }
.p-home-ai-chapter__mini-name {
  margin: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) 0 !important;
  color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--body); font-weight: 600; line-height: 1.3;
}
.p-home-ai-chapter__mini-kind {
  margin: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) !important;
  color: var(--wp--preset--color--ai); font-size: var(--wp--preset--font-size--label);
  font-weight: var(--wp--custom--font-weight--label); letter-spacing: var(--wp--custom--letter-spacing--label);
  line-height: 1.3; text-transform: uppercase;
}
/* The AI leader (section 7): from the answer down to the caliper it names, 6px ai dot on the object. */
.p-home-ai-chapter__leader {
  position: absolute; z-index: 1; left: 25%; top: calc(-1 * var(--wp--preset--spacing--60));
  height: calc(var(--wp--preset--spacing--60) + 64px); width: 1px; background: var(--wp--preset--color--ai); pointer-events: none;
}
.p-home-ai-chapter__leader::after {
  content: ""; position: absolute; left: -3px; bottom: -3px; width: 6px; height: 6px;
  border-radius: var(--wp--custom--radius--pill); background: var(--wp--preset--color--ai);
  box-shadow: 0 0 0 2px var(--wp--preset--color--white);
}
.p-home-ai-chapter__source {
  margin-top: var(--wp--preset--spacing--50) !important; padding-top: var(--wp--preset--spacing--40);
  border-top: 1px solid var(--wp--preset--color--line); color: var(--wp--preset--color--ai); font-size: var(--wp--preset--font-size--small);
}
.p-home-ai-chapter__field {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--50);
  height: var(--wp--custom--control); padding: 0 var(--wp--preset--spacing--50);
  background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--ai);
  border-radius: var(--wp--custom--radius--default); color: var(--wp--preset--color--ink);
}
.p-home-ai-chapter__field input {
  flex: 1; min-width: 0; height: 100%; border: 0; padding: 0; background: transparent; cursor: default;
  font: 400 var(--wp--preset--font-size--small)/1 var(--wp--preset--font-family--montserrat); color: var(--wp--preset--color--ink);
  text-overflow: clip;
}
.p-home-ai-chapter__field input:focus { outline: none; }
.p-home-ai-chapter__field:focus-within { outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--navy); outline-offset: 2px; }
.p-home-ai-chapter__sub {
  margin-top: var(--wp--preset--spacing--60) !important; color: var(--wp--preset--color--ai);
  font-size: var(--wp--preset--font-size--label); font-weight: var(--wp--custom--font-weight--label);
  letter-spacing: var(--wp--custom--letter-spacing--label); line-height: 1.3; text-transform: uppercase;
}
.p-home-ai-chapter__chips {
  list-style: none; margin: var(--wp--preset--spacing--30) 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--30);
}
.p-home-ai-chapter__chips a {
  display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--wp--preset--spacing--40);
  background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); color: var(--wp--preset--color--ink);
  font-size: var(--wp--preset--font-size--small); font-weight: 500; line-height: 1.2; text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  .p-home-ai-chapter__chips a:hover { border-color: var(--wp--preset--color--ai); color: var(--wp--preset--color--ai); }
}
.p-home-ai-chapter__why { margin-top: var(--wp--preset--spacing--40) !important; color: var(--wp--preset--color--ink); }
.p-home-ai-chapter__tiles {
  list-style: none; margin: var(--wp--preset--spacing--50) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--40);
}
.p-home-ai-chapter__tiles li {
  background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); overflow: hidden;
}
.p-home-ai-chapter__tiles img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; background: var(--wp--preset--color--mist); }
.p-home-ai-chapter__tiles span {
  display: block; padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
  color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--small); font-weight: 600; line-height: 1.3;
}

@media (max-width: 1199.98px) {
  .p-home-ai-chapter__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--wp--preset--spacing--90); }
  .p-home-ai-chapter__copy { grid-column: 1 / -1; max-width: 640px; padding-right: 0; }
}
@media (max-width: 991.98px) {
  .p-home-ai-chapter { padding: var(--wp--custom--section--tablet) var(--wp--custom--gutter--tablet); }
  .p-home-ai-chapter__inner { row-gap: var(--wp--preset--spacing--70); }
}
@media (max-width: 719.98px) {
  .p-home-ai-chapter__inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599.98px) {
  .p-home-ai-chapter { padding: var(--wp--custom--section--phone) var(--wp--custom--gutter--phone); }
  .p-home-ai-chapter__panel { padding: var(--wp--preset--spacing--50); }
  .p-home-ai-chapter__tiles span { padding: var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--label); }
}
