/* AIA-HARDEN-V1-EXPORT 2026-08-25 — Cresta AI Agent page, "Harden your AI agent at scale" section
   Upload to: https://website-assets.cresta.com/ai-agent/harden/aia-harden.css
   Cache-Control: public, max-age=31536000, immutable — publish as aia-harden.v2.css etc when you change it.
   Class convention: aia-harden- prefix. JS-only hooks are data-aia-harden-* attributes, never
   used as style selectors here. DM Sans assumed loaded site-wide (see README). */

.aia-harden-root { width: 100%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; padding: clamp(56px,9vw,120px) clamp(20px,5.6vw,80px) clamp(64px,10vw,140px); font-family: 'DM Sans', 'Helvetica Neue', Arial, sans-serif; }

.aia-harden-grid { display: grid; grid-template-columns: minmax(0,1fr) 550px; gap: 110px; align-items: stretch; }

.aia-harden-copy { display: flex; flex-direction: column; }
.aia-harden-title { margin: 0; font-size: 37px; font-weight: 500; line-height: 120%; letter-spacing: -1.11px; color: #24242A; text-wrap: pretty; }
.aia-harden-list { margin-top: auto; padding-top: 96px; }

.aia-harden-item { border-bottom: 1px solid #E7EAEE; }
.aia-harden-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; margin: 0; padding: 22px 0; border: none; background: transparent; cursor: pointer; text-align: left; font-family: 'DM Sans', sans-serif; }

.aia-harden-item-title { font-size: 24px; font-weight: 500; letter-spacing: -0.72px; line-height: 120%; color: #A6B1BF; transition: color 420ms cubic-bezier(.2,.7,.2,1); }
.aia-harden-item.is-open .aia-harden-item-title { color: #24242A; }

.aia-harden-glyph { position: relative; display: block; width: 25px; height: 25px; flex: none; }
.aia-harden-plus { position: absolute; left: 0; top: 0; display: block; width: 25px; height: 25px; opacity: 1; transform: none; transition: opacity 260ms cubic-bezier(.2,.7,.2,1), transform 300ms cubic-bezier(.2,.7,.2,1); }
.aia-harden-item.is-open .aia-harden-plus { opacity: 0; transform: rotate(90deg); }
.aia-harden-bar { position: absolute; left: 2.2px; top: 11.4px; width: 20.64px; height: 1.7px; background: #205AE3; opacity: 0; transition: opacity 260ms cubic-bezier(.2,.7,.2,1); }
.aia-harden-item.is-open .aia-harden-bar { opacity: 1; }

.aia-harden-panel { overflow: hidden; will-change: max-height; max-height: 0; opacity: 0; transition: max-height 520ms cubic-bezier(.2,.7,.2,1), opacity 380ms cubic-bezier(.2,.7,.2,1) 0ms; }
.aia-harden-item.is-open .aia-harden-panel { max-height: 280px; opacity: 1; transition: max-height 520ms cubic-bezier(.2,.7,.2,1), opacity 380ms cubic-bezier(.2,.7,.2,1) 120ms; }
.aia-harden-copy-text { margin: 0; padding-bottom: 22px; max-width: 560px; font-size: 16px; font-weight: 400; line-height: 150%; color: #3C3C47; transform: translateY(-10px); opacity: 0; transition: transform 560ms cubic-bezier(.2,.7,.2,1), opacity 420ms cubic-bezier(.2,.7,.2,1) 0ms; }
.aia-harden-item.is-open .aia-harden-copy-text { transform: none; opacity: 1; transition: transform 560ms cubic-bezier(.2,.7,.2,1), opacity 420ms cubic-bezier(.2,.7,.2,1) 140ms; }

.aia-harden-media { position: relative; width: 550px; max-width: 100%; height: 558px; border-radius: 14px; overflow: hidden; background: #EBF0F5; border: 1px solid #DEE5EB; box-sizing: border-box; }
.aia-harden-layer { position: absolute; inset: 0; opacity: 0; transform: translateY(14px); z-index: 1; pointer-events: none; transition: opacity 480ms cubic-bezier(.2,.7,.2,1), transform 620ms cubic-bezier(.2,.7,.2,1); }
.aia-harden-layer.is-active { opacity: 1; transform: none; z-index: 2; pointer-events: auto; }
.aia-harden-layer video, .aia-harden-layer img { display: block; width: 100%; height: 100%; background: #EBF0F5; }
.aia-harden-layer[data-aia-harden-layer="0"] video { object-fit: contain; }
.aia-harden-layer[data-aia-harden-layer="1"] video { object-fit: cover; }
.aia-harden-layer[data-aia-harden-layer="2"] img { object-fit: cover; }

@media (max-width: 1100px) {
  .aia-harden-grid { grid-template-columns: minmax(0,1fr); gap: 56px; }
}
@media (max-width: 720px) {
  .aia-harden-grid { gap: 32px; }
  .aia-harden-copy { display: contents; }
  .aia-harden-title { order: 1; }
  .aia-harden-media { order: 2; width: 100%; height: auto; aspect-ratio: 1 / 1; }
  .aia-harden-layer video, .aia-harden-layer img { object-fit: contain; }
  .aia-harden-list { order: 3; padding-top: 0; margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .aia-harden-item-title, .aia-harden-plus, .aia-harden-bar, .aia-harden-panel, .aia-harden-copy-text, .aia-harden-layer { transition: none; }
}