/* AI LIBRARY */
.ail-main {max-width:1280px; margin:0 auto; padding:10rem 2rem 6rem;}
.ail-header {max-width:760px; margin:0 auto 4rem; text-align:center;}
.ail-badge {display:inline-flex; align-items:center; padding:0.45rem 0.85rem; margin-bottom:1.5rem; color:#818cf8; background:rgba(99,102,241,0.1); border:1px solid rgba(99,102,241,0.2); border-radius:50px; font-size:0.8rem; font-weight:600;}
.ail-intro {max-width:760px; margin:0 auto 4rem; text-align:center;}
.ail-intro h1 {margin-bottom:1.25rem; font-size:clamp(2.7rem,5vw,4rem); font-weight:800; line-height:1.12; letter-spacing:-0.04em; background:linear-gradient(135deg,#818cf8,#c084fc); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;}
.ail-intro p {max-width:680px; margin:0 auto; color:var(--muted-2,#94a3b8); font-size:1.05rem; line-height:1.75;}
.ail-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem;}
.ail-card {display:flex; flex-direction:column; min-width:0; overflow:hidden; color:var(--text,#fff); text-decoration:none; background:var(--card,rgba(15,23,42,0.6)); border:1px solid var(--stroke,rgba(51,65,85,0.6)); border-radius:1rem; box-shadow:0 10px 30px rgba(0,0,0,0.25); transition:transform 0.25s ease,border-color 0.25s ease,box-shadow 0.25s ease;}
.ail-card:hover {transform:translateY(-4px); border-color:rgba(129,140,248,0.6); box-shadow:0 20px 40px rgba(0,0,0,0.35);}
.ail-card:focus-visible {outline:2px solid #818cf8; outline-offset:4px;}
.ail-card-media {position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; background:#151b2b; border-bottom:1px solid var(--stroke,rgba(51,65,85,0.6));}
.ail-card-media::after {position:absolute; inset:45% 0 0; content:""; pointer-events:none; background:linear-gradient(180deg,transparent,rgba(7,10,20,0.35));}
.ail-card-media img {display:block; width:100%; height:100%; object-fit:cover; object-position:center; transition:transform 0.45s ease;}
.ail-card:hover .ail-card-media img {transform:scale(1.035);}
.ail-card-number {position:absolute; z-index:1; right:1rem; bottom:1rem; color:#fff; font-size:0.8rem; font-weight:700; letter-spacing:0.12em;}
.ail-card-body {display:flex; flex:1; flex-direction:column; padding:1.75rem 1.75rem 1.5rem;}
.ail-card-meta {display:flex; align-items:center; justify-content:space-between; gap:0.75rem; margin-bottom:1.15rem;}
.ail-category {color:#a5a6ff; font-size:0.72rem; font-weight:700; letter-spacing:0.07em; line-height:1.5;}
.ail-version {flex-shrink:0; padding:0.3rem 0.6rem; color:#a5a6ff; background:rgba(99,102,241,0.1); border:1px solid rgba(99,102,241,0.2); border-radius:50px; font-size:0.72rem; font-weight:600;}
.ail-card h2 {margin:0 0 0.8rem; color:var(--text,#fff); font-size:1.35rem; font-weight:700; line-height:1.35; letter-spacing:-0.02em;}
.ail-card-body>p {flex:1; margin:0 0 1.75rem; color:var(--muted-2,#94a3b8); font-size:0.92rem; line-height:1.75;}
.ail-card-footer {display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1.25rem; border-top:1px solid var(--stroke,rgba(51,65,85,0.6));}
.ail-command {color:var(--muted-2,#94a3b8); font-size:0.82rem; font-weight:600;}
.ail-card-link {display:inline-flex; align-items:center; gap:0.4rem; color:var(--accent,#7777ff); font-size:0.88rem; font-weight:700; white-space:nowrap; transition:color 0.2s ease;}
.ail-card-link svg {width:16px; height:16px; transition:transform 0.2s ease;}
.ail-card:hover .ail-card-link {color:#a5a6ff;}
.ail-card:hover .ail-card-link svg {transform:translate(2px,-2px);}
.ail-bottom-cta {display:flex; align-items:center; justify-content:space-between; gap:2rem; margin-top:4rem; padding:2.5rem; background:linear-gradient(135deg,rgba(99,102,241,0.1),rgba(192,132,252,0.04)); border:1px solid var(--stroke,rgba(51,65,85,0.6)); border-radius:1rem;}
.ail-cta-label {display:block; margin-bottom:0.8rem; color:#a5a6ff; font-size:0.72rem; font-weight:700; letter-spacing:0.09em;}
.ail-bottom-cta h2 {margin-bottom:0.7rem; color:var(--text,#fff); font-size:clamp(1.35rem,2.5vw,1.8rem); font-weight:700; letter-spacing:-0.025em;}
.ail-bottom-cta p {max-width:600px; color:var(--muted-2,#94a3b8); font-size:0.92rem; line-height:1.7;}
.ail-cta-button {display:inline-flex; flex-shrink:0; align-items:center; justify-content:center; gap:0.6rem; min-height:46px; padding:0.8rem 1.15rem; color:#fff; background:var(--accent,#7777ff); border:1px solid transparent; border-radius:0.65rem; font-size:0.88rem; font-weight:700; text-decoration:none; transition:background 0.2s ease,transform 0.2s ease;}
.ail-cta-button:hover {background:var(--accent-2,#6666ee); transform:translateY(-1px);}
.ail-cta-button svg {width:17px; height:17px;}
@media (max-width:968px) {
.ail-grid {gap:1.25rem;}
.ail-card-body {padding:1.5rem;}
.ail-bottom-cta {align-items:flex-start; flex-direction:column;}
}
@media (max-width:640px) {
.ail-main {padding:8rem 1rem 4rem;}
.ail-intro {margin-bottom:2.5rem;}
.ail-intro h1 {font-size:clamp(2.4rem,10vw,3.2rem);}
.ail-intro p {font-size:0.95rem;}
.ail-grid {grid-template-columns:1fr; gap:1.25rem;}
.ail-card-media {aspect-ratio:16/10;}
.ail-card-body {padding:1.25rem;}
.ail-card h2 {font-size:1.2rem;}
.ail-card-footer {gap:0.5rem;}
.ail-command {font-size:0.78rem;}
.ail-card-link {font-size:0.82rem;}
.ail-bottom-cta {margin-top:2.5rem; padding:1.5rem;}
.ail-cta-button {width:100%;}
}
@media (prefers-reduced-motion:reduce) {
.ail-card,.ail-card-media img,.ail-card-link,.ail-card-link svg,.ail-cta-button {transition:none;}
.ail-card:hover,.ail-cta-button:hover {transform:none;}
}