/* Layout rules scoped to AI Builder, including narrow phones and tablets. */
.ai-builder-page *, .ai-builder-page *::before, .ai-builder-page *::after { box-sizing:border-box; }
.ai-builder-page .grid > *, .ai-builder-page .flex > * { min-width:0; }
.ai-builder-page :is(h1,h2,h3,h4,p,li) { overflow-wrap:break-word; }
.ai-builder-page img { max-width:100%; }
.ai-builder-page .clay-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; max-width:100%; text-align:center; white-space:normal; gap:10px; }
.ai-builder-page #plans .scale-105 { transform:none; }
.ai-builder-page .ai-build-steps { display:grid; gap:20px; list-style:none; padding:0; margin:0; }
.ai-builder-page .ai-build-steps li { display:flex; align-items:flex-start; gap:16px; padding:18px; background:#fff; border:1px solid #dbe4ec; border-radius:16px; }
.ai-builder-page .ai-step-number { display:grid; place-items:center; flex:0 0 38px; height:38px; border-radius:50%; background:#eaf5fc; font-size:15px; font-weight:700; }
.ai-builder-page .ai-build-steps h3 { font-size:18px !important; line-height:1.4 !important; margin:0 0 8px; }
.ai-builder-page .ai-build-steps p { font-size:14px; line-height:1.75; margin:0; }
.ai-builder-page table { width:100%; min-width:600px; }
@media(max-width:1023px) {
 .ai-builder-page { padding-top:12px; }
 .ai-builder-page section > :is(.max-w-6xl,.max-w-5xl,.max-w-4xl) { width:100%; }
 .ai-builder-page .gap-20 { gap:36px; }
 .ai-builder-page .gap-12 { gap:28px; }
 .ai-builder-page :is(.mb-32,.mb-24) { margin-bottom:44px; }
 .ai-builder-page :is(.p-10,.p-12) { padding:28px; }
 .ai-builder-page .clay-card { border-radius:24px; box-shadow:0 8px 24px #092c4d0c; }
 .ai-builder-page .text-xl { font-size:17px; line-height:1.75; }
 .ai-builder-page .text-lg { font-size:16px; line-height:1.75; }
 .ai-builder-page #plans > div > .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
 .ai-builder-page #plans > div > .grid > :last-child:nth-child(odd) { grid-column:1 / -1; width:calc(50% - 12px); justify-self:center; }
 .ai-builder-page .clay-btn { padding:12px 22px; font-size:15px; }
 .ai-builder-page .ai-body-art img { max-height:320px; }
 .ai-builder-page .mt-20 { margin-top:36px; }
 .ai-builder-page .animate-bounce { animation:none; }
}
@media(max-width:639px) {
 .ai-builder-page section { padding-inline:20px; }
 .ai-builder-page section > .px-4 { padding-inline:0; }
 .ai-builder-page :is(.gap-8,.gap-6,.gap-12,.gap-20) { gap:20px; }
 .ai-builder-page :is(.p-10,.p-12,.p-8) { padding:20px; }
 .ai-builder-page .p-6 { padding:18px; }
 .ai-builder-page :is(.mb-16,.mb-12) { margin-bottom:28px; }
 .ai-builder-page :is(.mb-32,.mb-24) { margin-bottom:36px; }
 .ai-builder-page .text-xl { font-size:16px; }
 .ai-builder-page .text-lg { font-size:15px; }
 .ai-builder-page .clay-card.grid { grid-template-columns:1fr; }
 .ai-builder-page .clay-card.grid > .col-span-2 { grid-column:auto; }
 .ai-builder-page #plans > div > .grid { grid-template-columns:1fr; }
 .ai-builder-page #plans > div > .grid > :last-child:nth-child(odd) { grid-column:auto; width:100%; }

 .ai-builder-page .clay-icon-wrap { width:52px; height:52px; font-size:22px; border-radius:16px; }
 .ai-builder-page .ai-build-steps li { padding:14px; gap:12px; }
 .ai-builder-page .ai-build-steps h3 { font-size:16px !important; }
 .ai-builder-page .ai-body-art img { max-height:260px; }
 .ai-builder-page .aspect-\[16\/9\] { padding:10px; aspect-ratio:4/3; }
 .ai-builder-page .aspect-\[16\/9\] .animate-bounce { padding:12px; gap:10px; border-radius:16px; }
 .ai-builder-page .aspect-\[16\/9\] .animate-bounce .text-sm { font-size:11px; }
 .ai-builder-page table :is(th,td) { padding:14px; font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { .ai-builder-page *, .ai-builder-page *::before { animation:none !important; transition:none !important; } }
.ai-builder-page #plans .scale-105 { scale:1; }
@media(min-width:640px) and (max-width:1023px) {
 .ai-builder-page section:nth-of-type(2) > .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
}
@media(max-width:639px) {
 .ai-builder-page .clay-card.grid h4 { font-size:16px !important; }
 .ai-builder-page .clay-card.grid p { font-size:14px; line-height:1.75; }
}

@media(min-width:1024px) { .ai-builder-page #plans > div > .grid { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); } }
.ai-builder-page #plans nav a[aria-current="true"] { background:#062b50 !important; border-color:#062b50; }

.ai-builder-page #plans .ai-plan-card { text-align:center; }
