.ai-studio,
.ai-studio-page {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 18% 12%, rgba(28, 188, 220, .2), transparent 30%),
        radial-gradient(circle at 82% 10%, rgba(130, 94, 255, .16), transparent 28%),
        linear-gradient(180deg, #061424 0%, #071d2d 100%) !important;
    background-color: #061424 !important;
    background-image:
        radial-gradient(circle at 18% 12%, rgba(28, 188, 220, .2), transparent 30%),
        radial-gradient(circle at 82% 10%, rgba(130, 94, 255, .16), transparent 28%),
        linear-gradient(180deg, #061424 0%, #071d2d 100%) !important;
    color: #f7fbff;
}

.ai-studio::before,
.ai-studio-page::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
}

.ai-studio > .container,
.ai-studio-page .container {
    position: relative;
    z-index: 1;
}

.ai-studio-page .blog-breadcrumbs {
    color: rgba(220, 238, 251, .76);
}

.ai-studio-page .blog-breadcrumbs a {
    color: #d9f7ff;
}

.ai-studio {
    padding: 86px 0;
}

.ai-studio--featured {
    padding-top: 70px;
}

.ai-studio__featured,
.ai-studio__case,
.ai-studio__final,
.ai-studio-page__hero-grid {
    border: 1px solid rgba(130, 225, 255, .18);
    background: linear-gradient(145deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .035));
    box-shadow: 0 30px 90px rgba(0, 0, 0, .34);
    backdrop-filter: blur(18px);
}

.ai-studio__featured {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);
    gap: 40px;
    align-items: center;
    padding: 36px;
    border-radius: 28px;
}

.ai-studio__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: #6ee8ff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-studio__eyebrow::before {
    content: "";
    width: 28px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #6ee8ff, #8d75ff);
}

.ai-studio h2,
.ai-studio-page h1,
.ai-studio-page h2 {
    margin: 0;
    color: #fff;
    line-height: 1.06;
    letter-spacing: 0;
}

.ai-studio h2 {
    font-size: clamp(34px, 4vw, 58px);
}

.ai-studio h3,
.ai-studio-page h3 {
    color: #fff;
}

.ai-studio p,
.ai-studio-page p {
    color: rgba(231, 244, 255, .82);
    font-size: 18px;
    line-height: 1.75;
}

.ai-studio__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 24px 0 28px;
}

.ai-studio__features span {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid rgba(110, 232, 255, .16);
    border-radius: 12px;
    background: rgba(4, 20, 34, .62);
    color: #f6fbff;
    font-size: 14px;
    font-weight: 700;
}

.ai-studio__features i {
    color: #27d8ff;
}

.ai-studio__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.ai-studio__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 48px;
    padding: 0.65rem 0.85rem 0.65rem 1.05rem;
    border-radius: 999px;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.15;
    font-family: 'Manrope', 'Manrope Fallback', sans-serif;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.ai-studio__btn:hover {
    transform: translateY(-1px);
    text-decoration: none;
}

.ai-studio__btn--primary {
    color: #ffffff !important;
    background-color: #042237 !important;
    background-image: linear-gradient(to right, #042237 0%, #2be0f7 100%) !important;
    box-shadow: 0 8px 24px rgba(4, 34, 55, 0.25);
}

.ai-studio__btn--primary:hover {
    color: #ffffff !important;
    background-color: #052b45 !important;
    background-image: linear-gradient(to right, #052b45 0%, #36e8ff 100%) !important;
    filter: brightness(1.03);
}

.ai-studio__btn--secondary {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.06) !important;
    background-image: none !important;
    border: 2px solid rgba(255, 255, 255, 0.22) !important;
    box-shadow: none;
}

.ai-studio__btn--secondary:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(43, 224, 247, 0.55) !important;
}

.ai-studio__mockup {
    position: relative;
    border: 1px solid rgba(130, 225, 255, .24);
    border-radius: 22px;
    background: linear-gradient(155deg, rgba(6, 28, 48, .94), rgba(7, 16, 31, .9));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 28px 70px rgba(0, 0, 0, .32);
    overflow: hidden;
}

.ai-studio__mockup::after {
    content: "";
    position: absolute;
    inset: auto -10% -40% 10%;
    height: 210px;
    background: radial-gradient(circle, rgba(24, 207, 238, .28), transparent 70%);
    pointer-events: none;
}

.ai-studio__mockup-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    color: rgba(242, 250, 255, .82);
}

.ai-studio__mockup-bar span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #20c5df;
}

.ai-studio__mockup-bar span:nth-child(2) {
    background: #8d75ff;
}

.ai-studio__mockup-bar span:nth-child(3) {
    background: #f8d45c;
}

.ai-studio__mockup-bar strong {
    margin-left: auto;
    font-size: 13px;
}

.ai-studio__mockup-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 14px;
    padding: 18px;
}

.ai-studio__panel {
    min-height: 170px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 16px;
    background: rgba(255, 255, 255, .06);
}

.ai-studio__panel--wide {
    grid-row: span 2;
}

.ai-studio__panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    color: #fff;
    font-weight: 800;
}

.ai-studio__panel-head em {
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(110, 232, 255, .12);
    color: #6ee8ff;
    font-style: normal;
    font-size: 12px;
}

.ai-studio__chat {
    display: grid;
    gap: 10px;
}

.ai-studio__chat p {
    margin: 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(5, 18, 32, .78);
    font-size: 13px;
    line-height: 1.45;
}

.ai-studio__pipeline {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ai-studio__pipeline li,
.ai-studio__nodes span,
.ai-studio__stack span,
.ai-studio__kpis span {
    border: 1px solid rgba(110, 232, 255, .15);
    background: rgba(5, 18, 32, .72);
    color: #eefaff;
}

.ai-studio__pipeline li {
    padding: 9px 10px;
    border-radius: 10px;
    font-size: 13px;
}

.ai-studio__nodes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.ai-studio__nodes span {
    position: relative;
    padding: 11px 9px;
    border-radius: 12px;
    text-align: center;
    font-size: 13px;
    font-weight: 800;
}

.ai-studio__section-head {
    max-width: 820px;
    margin-bottom: 34px;
}

.ai-studio__product-grid,
.ai-studio__tech-grid,
.ai-studio__case-columns {
    display: grid;
    gap: 18px;
}

.ai-studio__product-grid {
    grid-template-columns: 1.25fr repeat(3, minmax(0, 1fr));
}

.ai-studio__product-card,
.ai-studio__tech-card,
.ai-studio__case-columns article {
    position: relative;
    min-height: 100%;
    padding: 24px;
    border: 1px solid rgba(130, 225, 255, .16);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .035));
    box-shadow: 0 18px 50px rgba(0, 0, 0, .18);
}

.ai-studio__product-card--flagship {
    background:
        radial-gradient(circle at 90% 0%, rgba(33, 206, 238, .18), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .045));
}

.ai-studio__product-badge {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(110, 232, 255, .12);
    color: #6ee8ff;
    font-size: 12px;
    font-weight: 900;
}

.ai-studio__product-card h3,
.ai-studio__product-card h2,
.ai-studio__tech-card h3,
.ai-studio__case-columns h3 {
    margin: 0 0 12px;
    font-size: 24px;
}

.ai-studio__product-card p,
.ai-studio__tech-card p,
.ai-studio__case-columns p {
    margin-bottom: 18px;
    font-size: 15px;
    line-height: 1.65;
}

.ai-studio__product-card a {
    color: #6ee8ff;
    font-weight: 800;
    text-decoration: none;
}

.ai-studio__tech-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ai-studio__tech-card i {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(17, 200, 234, .2), rgba(141, 117, 255, .2));
    color: #6ee8ff;
}

.ai-studio__stack,
.ai-studio__kpis {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.ai-studio__stack span,
.ai-studio__kpis span {
    padding: 9px 13px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 13px;
}

.ai-studio__case {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 30px;
    padding: 34px;
    border-radius: 26px;
}

.ai-studio__case-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ai-studio__section-head--spaced {
    margin-top: 44px;
}

.ai-studio__architecture {
    display: grid;
    gap: 12px;
    margin: 0 0 28px;
    padding: 20px;
    border: 1px solid rgba(130, 225, 255, .18);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .03));
    box-shadow: 0 22px 70px rgba(0, 0, 0, .24);
}

.ai-studio__arch-layer {
    display: grid;
    grid-template-columns: 150px repeat(4, minmax(0, 1fr));
    gap: 10px;
    align-items: center;
}

.ai-studio__arch-layer span,
.ai-studio__arch-layer b {
    min-height: 46px;
    display: flex;
    align-items: center;
    border-radius: 12px;
}

.ai-studio__arch-layer span {
    padding: 0 14px;
    background: rgba(110, 232, 255, .12);
    color: #6ee8ff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-studio__arch-layer b {
    justify-content: center;
    padding: 0 10px;
    border: 1px solid rgba(110, 232, 255, .14);
    background: rgba(5, 18, 32, .66);
    color: #f7fbff;
    font-size: 13px;
    text-align: center;
}

.ai-studio__evidence-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 18px;
}

.ai-studio__screen {
    min-height: 250px;
    border: 1px solid rgba(130, 225, 255, .18);
    border-radius: 20px;
    background: linear-gradient(155deg, rgba(7, 29, 47, .94), rgba(5, 14, 28, .92));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .26);
    overflow: hidden;
}

.ai-studio__screen--workflow,
.ai-studio__screen--metrics {
    grid-column: span 1;
}

.ai-studio__screen-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    color: rgba(242, 250, 255, .86);
}

.ai-studio__screen-bar span {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #16c7df;
}

.ai-studio__screen-bar span:nth-child(2) {
    background: #8d75ff;
}

.ai-studio__screen-bar span:nth-child(3) {
    background: #f4c84b;
}

.ai-studio__screen-bar strong {
    margin-left: auto;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.ai-studio__workflow-map {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding: 22px;
}

.ai-studio__workflow-map span {
    position: relative;
    min-height: 66px;
    display: grid;
    place-items: center;
    padding: 12px;
    border: 1px solid rgba(110, 232, 255, .2);
    border-radius: 16px;
    background: radial-gradient(circle at 50% 0%, rgba(18, 199, 234, .18), transparent 60%), rgba(255, 255, 255, .055);
    color: #f5fbff;
    font-weight: 900;
    text-align: center;
}

.ai-studio__workflow-map span::after {
    content: "";
    position: absolute;
    right: -15px;
    top: 50%;
    width: 15px;
    height: 1px;
    background: rgba(110, 232, 255, .35);
}

.ai-studio__workflow-map span:nth-child(3n)::after,
.ai-studio__workflow-map span:last-child::after {
    display: none;
}

.ai-studio__workflow-map--mini {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 0;
    margin-top: 18px;
}

.ai-studio__workflow-map--mini span {
    min-height: 46px;
    font-size: 12px;
}

.ai-studio__kanban {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 18px;
}

.ai-studio__kanban div {
    min-height: 176px;
    padding: 12px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .055);
}

.ai-studio__kanban b {
    display: block;
    margin-bottom: 12px;
    color: #6ee8ff;
    font-size: 13px;
}

.ai-studio__kanban i {
    display: block;
    height: 34px;
    margin-bottom: 9px;
    border-radius: 10px;
    background: linear-gradient(90deg, rgba(255, 255, 255, .16), rgba(110, 232, 255, .12));
}

.ai-studio__conversation {
    display: grid;
    gap: 11px;
    padding: 18px;
}

.ai-studio__conversation p {
    margin: 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .06);
    font-size: 13px;
    line-height: 1.45;
}

.ai-studio__conversation b {
    display: block;
    color: #6ee8ff;
}

.ai-studio__metric-board {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 18px;
}

.ai-studio__metric-board span {
    min-height: 84px;
    display: grid;
    align-content: center;
    gap: 3px;
    padding: 15px;
    border-radius: 15px;
    background: rgba(255, 255, 255, .06);
    color: rgba(235, 248, 255, .78);
    font-weight: 800;
}

.ai-studio__metric-board b {
    color: #fff;
    font-size: 26px;
}

.ai-studio-page {
    padding-bottom: 80px;
}

.ai-studio-page__hero {
    padding: 96px 0 56px;
}

.ai-studio-page__hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
    gap: 34px;
    align-items: center;
    padding: 34px;
    border-radius: 26px;
}

.ai-studio-page h1 {
    max-width: 900px;
    margin-bottom: 20px;
    font-size: clamp(38px, 5vw, 72px);
}

.ai-studio-page__hero-grid > div:first-child > p {
    max-width: 720px;
    color: rgba(231, 244, 255, .84);
}

.ai-studio-page__section,
.ai-studio-page__cta {
    padding: 44px 0;
}

.ai-studio__product-grid--compact,
.ai-studio__product-grid--solutions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ai-studio__featured--page {
    grid-template-columns: .8fr 1.2fr;
}

.ai-studio__tech-grid--deep {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ai-studio__nodes--large {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 28px;
}

.ai-studio__note {
    color: #9cefff !important;
    font-weight: 800;
}

.ai-studio__case--page {
    grid-template-columns: 1fr;
}

.ai-studio__case--page .ai-studio__case-columns {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ai-studio__final {
    padding: 34px;
    border-radius: 26px;
    text-align: center;
}

.ai-studio__final .ai-studio__btn {
    margin-top: 12px;
}

.ai-studio-footer-product {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 18px 0 26px;
    padding: 22px 24px;
    border: 1px solid rgba(110, 232, 255, .18);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .035));
}

.ai-studio-footer-product span {
    color: #6ee8ff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-studio-footer-product h3 {
    margin: 4px 0;
    color: #fff;
}

.ai-studio-footer-product p {
    margin: 0;
    color: rgba(255, 255, 255, .78);
}

.ai-studio-footer-product a.iadev-cta.lets_talk {
    white-space: nowrap;
}

.ai-studio-footer-product a:not(.iadev-cta) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 11px 16px;
    border-radius: 999px;
    background: linear-gradient(to right, #042237 0%, #2be0f7 100%);
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

@media (prefers-reduced-motion: no-preference) {
    .ai-studio__panel,
    .ai-studio__product-card,
    .ai-studio__tech-card {
        transform: translateY(14px);
        opacity: .86;
        transition: transform .45s ease, opacity .45s ease;
    }

    .ai-studio.is-visible .ai-studio__panel,
    .ai-studio.is-visible .ai-studio__product-card,
    .ai-studio.is-visible .ai-studio__tech-card,
    .ai-studio-page.is-visible .ai-studio__panel,
    .ai-studio-page.is-visible .ai-studio__product-card,
    .ai-studio-page.is-visible .ai-studio__tech-card {
        transform: translateY(0);
        opacity: 1;
    }
}

@media (max-width: 1199px) {
    .ai-studio__featured,
    .ai-studio__case,
    .ai-studio-page__hero-grid,
    .ai-studio__featured--page {
        grid-template-columns: 1fr;
    }

    .ai-studio__product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .ai-studio {
        padding: 58px 0;
    }

    .ai-studio__featured,
    .ai-studio__case,
    .ai-studio-page__hero-grid,
    .ai-studio__final {
        padding: 22px;
        border-radius: 20px;
    }

    .ai-studio__features,
    .ai-studio__evidence-grid,
    .ai-studio__mockup-grid,
    .ai-studio__product-grid,
    .ai-studio__product-grid--compact,
    .ai-studio__product-grid--solutions,
    .ai-studio__tech-grid,
    .ai-studio__tech-grid--deep,
    .ai-studio__case-columns,
    .ai-studio__case--page .ai-studio__case-columns {
        grid-template-columns: 1fr;
    }

    .ai-studio__actions,
    .ai-studio__btn,
    .ai-studio-footer-product,
    .ai-studio-footer-product a {
        width: 100%;
    }

    .ai-studio-footer-product {
        align-items: stretch;
        flex-direction: column;
    }

    .ai-studio__nodes--large {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .ai-studio__workflow-map,
    .ai-studio__arch-layer,
    .ai-studio__kanban,
    .ai-studio__metric-board,
    .ai-studio__workflow-map--mini {
        grid-template-columns: 1fr;
    }

    .ai-studio__workflow-map span::after {
        display: none;
    }
}