/*
Theme Name: irodAI Homepage
Theme URI: https://www.irodai.ir/
Author: irodAI Team
Author URI: https://www.irodai.ir/
Description: اپ فروشگاهی irodAI — تبدیل کامل طراحی React به وردپرس + Elementor.
Version: 5.5.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: irodai-homepage
Tags: rtl-language-support, custom-menu, business, persian
*/

@font-face {
    font-family: Vazirmatn;
    src: url("assets/fonts/Vazirmatn-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Vazirmatn;
    src: url("assets/fonts/Vazirmatn-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Vazirmatn;
    src: url("assets/fonts/Vazirmatn-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Vazirmatn;
    src: url("assets/fonts/Vazirmatn-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Vazirmatn;
    src: url("assets/fonts/Vazirmatn-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

html, body {
    margin: 0;
    padding: 0;
    background: #EFE7DA;
}

body {
    font-family: Vazirmatn, system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}

a {
    color: #3F5540;
    text-decoration: none;
}

a:hover {
    color: #5C7A5B;
}

/* Main Container */
.irodai-container {
    width: 1280px;
    margin: 0 auto;
    background: #EFE7DA;
    color: #26251F;
    position: relative;
    overflow-x: clip;
}

/* Noise Texture Overlay */
.noise-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    opacity: .5;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.42'/%3E%3C/svg%3E");
}

/* Navigation */
.site-header {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 34px;
    background: #F7F1E6;
    border-bottom: 1.5px solid #DCCFB9;
    box-shadow: 0 2px 0 rgba(160, 140, 110, .18);
}

.site-branding {
    display: flex;
    align-items: center;
    gap: 28px;
}

.logo-wrapper {
    display: flex;
    align-items: center;
    gap: 11px;
}

.logo-icon {
    width: 38px;
    height: 38px;
    border-radius: 13px 15px 12px 16px;
    background: #2B4257;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 2px 3px 0 rgba(43, 66, 87, .22);
}

.logo-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #E9A62B;
}

.site-title-wrapper {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.site-title {
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.2px;
    color: #22323F;
    margin: 0;
}

.site-tagline {
    font-size: 10.5px;
    color: #8A8271;
    font-weight: 400;
}

.main-navigation {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 14px;
    font-size: 12px;
    color: #5C5748;
    font-weight: 500;
}

.main-navigation a {
    color: #5C5748;
}

.main-navigation a.active {
    color: #26251F;
    padding-bottom: 3px;
    border-bottom: 2.5px solid #E9A62B;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.consult-text {
    font-size: 14px;
    color: #5C5748;
    font-weight: 600;
}

.btn-primary {
    padding: 12px 18px;
    border-radius: 11px 13px 10px 14px;
    background: #43563E;
    color: #F7F1E6;
    font-size: 13.5px;
    font-weight: 700;
    box-shadow: 3px 4px 0 rgba(67, 86, 62, .28);
    border: none;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.btn-primary:hover {
    background: #3F5540;
    color: #F7F1E6;
}

.btn-header-chat {
    padding: 11px 16px;
    border-radius: 11px 13px 10px 14px;
    background: #FAF5EA;
    color: #2B4257;
    font-size: 13.5px;
    font-weight: 700;
    border: 1.5px solid #2B4257;
    box-shadow: 3px 4px 0 rgba(43, 66, 87, .18);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.btn-header-chat:hover {
    background: #FFF8EA;
    color: #2B4257;
}

/* Hero Section */
.hero-section {
    position: relative;
    z-index: 2;
    padding: 56px 34px 64px;
    overflow: hidden;
}

.hero-bg-circle-1 {
    position: absolute;
    top: 60px;
    right: -140px;
    width: 520px;
    height: 428px;
    border-radius: 50%;
    background: #E6DBC8;
    opacity: .75;
}

.hero-bg-circle-2 {
    position: absolute;
    bottom: -120px;
    left: -80px;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    background: #E4D9C4;
    opacity: .6;
}

.hero-content {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 400px);
    grid-template-areas:
        "copy visual"
        "unsure visual";
    gap: 10px 8px;
    align-items: stretch;
}

.hero-copy {
    grid-area: copy;
    min-width: 0;
}

.hero-visual,
.hero-preview {
    grid-area: visual;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 7px 15px;
    background: #43563E;
    border-radius: 8px 10px 7px 11px;
    font-size: 12.5px;
    color: #F2EEE2;
    font-weight: 600;
    margin-bottom: 28px;
    box-shadow: 2px 3px 0 rgba(67, 86, 62, .22);
}

.badge-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #E9A62B;
}

.hero-title {
    margin: 0 0 26px;
    font-size: 44px;
    line-height: 1.32;
    font-weight: 800;
    letter-spacing: -1px;
    color: #22323F;
    text-wrap: pretty;
}

.hero-title.hero-path-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 3px;
    margin: 0 0 16px;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0;
    font-weight: 600;
    color: #5C5748;
}

.hero-path-arrow {
    color: #E9A62B;
    font-weight: 800;
    font-size: 11px;
    line-height: 1;
    padding: 0 2px;
}

.hero-path-step {
    padding: 5px 10px;
    background: #FAF5EA;
    border: 1px solid #E4D9C4;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    color: #2B4257;
    box-shadow: 1px 2px 0 rgba(150, 130, 100, .08);
}

.hero-highlight {
    position: relative;
    display: inline-block;
    color: #22323F;
}

.highlight-bg {
    position: absolute;
    left: -6px;
    right: -6px;
    bottom: 6px;
    height: 16px;
    background: #E9A62B;
    opacity: .55;
    border-radius: 3px 6px 4px 7px;
    z-index: 0;
}

.highlight-text {
    position: relative;
    z-index: 1;
}

.hero-description {
    margin: 0 0 22px;
    max-width: 540px;
    font-size: 17px;
    line-height: 1.9;
    color: #5C5748;
    font-weight: 400;
}

.hero-starts {
    display: grid;
    gap: 8px;
    margin: 0;
    max-width: none;
}

.hero-starts-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.hero-starts-row .hero-start {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 11px 10px;
    min-height: 100%;
}

.hero-starts-row .hero-start-arrow {
    font-size: 13px;
}

.hero-starts-row .hero-start strong {
    font-size: 12px;
    line-height: 1.4;
}

.hero-start {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 14px 16px 12px 18px;
    box-shadow: 3px 4px 0 rgba(150, 130, 100, .14);
    text-decoration: none;
    color: inherit;
    animation: heroStartIn .55s ease both;
    animation-delay: calc(var(--i, 0) * .08s);
}

.hero-start:hover,
.hero-start:focus-visible,
.hero-start.is-hot {
    border-color: #E9A62B;
    background: #FFF8EA;
    box-shadow: 3px 4px 0 rgba(233, 166, 43, .28);
    color: inherit;
}

.hero-start-arrow {
    color: #E9A62B;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    flex-shrink: 0;
}

.hero-start-copy {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.hero-start strong {
    font-size: 14.5px;
    font-weight: 800;
    color: #22323F;
    line-height: 1.4;
}

.hero-start-copy > span:not(.hero-start-actions) {
    font-size: 12.5px;
    color: #7C7565;
    line-height: 1.45;
}

.hero-start-actions,
.service-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    margin-top: 4px;
}

.hero-start-actions a,
.service-actions a {
    font-size: 11.5px;
    font-weight: 700;
    color: #2B4257;
    line-height: 1.3;
    border-bottom: 1.5px solid #E9A62B;
    padding-bottom: 1px;
}

.hero-start-actions a:hover,
.service-actions a:hover {
    color: #43563E;
}

.service-actions a {
    font-size: 13.5px;
}

.hero-starts-row .hero-start-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.hero-unsure {
    grid-area: unsure;
    max-width: none;
    margin: 2px 0 0;
}

@keyframes heroStartIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes heroStartHint {
    0%, 10%, 100% {
        border-color: #DCCFB9;
        box-shadow: 3px 4px 0 rgba(150, 130, 100, .14);
    }
    5% {
        border-color: #E9A62B;
        box-shadow: 3px 4px 0 rgba(233, 166, 43, .28);
    }
}

.hero-preview {
    padding: 0;
}

.hero-visual.hero-preview {
    padding: 0;
    height: 100%;
}

.hero-preview .card-decoration-1,
.hero-preview .card-decoration-2 {
    display: none;
}

.hero-preview-card {
    position: relative;
    z-index: 1;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 16px;
    box-shadow: 8px 10px 0 rgba(150, 130, 100, .16);
    transform: none;
    overflow: hidden;
    min-height: 100%;
    height: 100%;
}

.hero-preview-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: #2B4257;
}

.hero-preview-head .agent-title {
    flex: 1;
}

.hero-preview-pane {
    display: none;
    padding: 14px 16px 16px;
}

.hero-preview-pane.is-active {
    display: block;
    animation: heroPreviewIn .45s ease;
}

.hero-preview-kicker {
    margin: 0 0 5px;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11px;
    color: #1F5F5B;
}

.hero-preview-title {
    margin: 0 0 8px;
    font-size: 16.5px;
    font-weight: 800;
    color: #22323F;
    line-height: 1.45;
}

.hero-preview-problem {
    margin: 0 0 12px;
    font-size: 13px;
    color: #7C7565;
    line-height: 1.65;
}

.hero-preview-problem span {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    background: #E9A62B;
    color: #22323F;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 800;
}

.hero-preview-stage {
    position: relative;
    min-height: 248px;
    background:
        radial-gradient(circle at 80% 20%, rgba(233, 166, 43, .22), transparent 42%),
        radial-gradient(circle at 20% 80%, rgba(31, 95, 91, .16), transparent 46%),
        #F1E9DA;
    border: 1.5px solid #DFD3BE;
    border-radius: 14px 16px 12px 18px;
    overflow: hidden;
}

.hero-preview-pulse {
    position: absolute;
    top: 46%;
    left: 50%;
    width: 88px;
    height: 88px;
    margin: -44px 0 0 -44px;
    border-radius: 50%;
    background: rgba(233, 166, 43, .28);
    animation: heroPulse 3.2s ease-in-out infinite;
    z-index: 0;
}

.hero-art-hub,
.hero-art-ring,
.hero-art-bars,
.hero-art-chats {
    display: none;
}

.hero-art-hub {
    position: absolute;
    top: 54%;
    left: 50%;
    width: 52px;
    height: 52px;
    margin: -26px 0 0 -26px;
    border-radius: 50%;
    background: #2B4257;
    color: #F2EEE2;
    font-size: 12px;
    font-weight: 800;
    align-items: center;
    justify-content: center;
    z-index: 1;
    box-shadow: 0 0 0 8px rgba(43, 66, 87, .1);
}

.hero-art-ring {
    position: absolute;
    top: 54%;
    left: 50%;
    width: 118px;
    height: 118px;
    margin: -59px 0 0 -59px;
    border: 1.5px dashed rgba(31, 95, 91, .4);
    border-radius: 50%;
    animation: heroSpin 16s linear infinite;
    z-index: 0;
}

.hero-art-ring::after {
    content: "";
    position: absolute;
    inset: 14px;
    border: 1.5px dashed rgba(233, 166, 43, .5);
    border-radius: 50%;
    animation: heroSpin 22s linear infinite reverse;
}

.hero-art-bars {
    position: absolute;
    left: 14px;
    bottom: 54px;
    height: 68px;
    align-items: flex-end;
    gap: 6px;
    z-index: 1;
}

.hero-art-bars i {
    display: block;
    width: 12px;
    border-radius: 4px 4px 2px 2px;
    background: #1F5F5B;
    transform-origin: bottom;
    animation: heroBar 2.2s ease-in-out infinite;
}

.hero-art-bars i:nth-child(1) { height: 38%; }
.hero-art-bars i:nth-child(2) { height: 72%; animation-delay: .12s; }
.hero-art-bars i:nth-child(3) { height: 54%; animation-delay: .24s; }
.hero-art-bars i:nth-child(4) { height: 88%; animation-delay: .36s; background: #E9A62B; }

.hero-art-chats {
    position: absolute;
    right: 16px;
    left: 16px;
    top: 58px;
    flex-direction: column;
    gap: 8px;
    z-index: 1;
}

.hero-art-chats i {
    display: block;
    height: 26px;
    border-radius: 12px 14px 11px 13px;
    background: #FFF8EA;
    border: 1.5px solid #DCCFB9;
    box-shadow: 1px 2px 0 rgba(150, 130, 100, .1);
    animation: heroChipFloat 4.2s ease-in-out infinite;
}

.hero-art-chats i:nth-child(1) { width: 64%; align-self: flex-start; }
.hero-art-chats i:nth-child(2) { width: 48%; align-self: flex-end; background: #E9A62B; border-color: #C98D1C; animation-delay: .2s; }
.hero-art-chats i:nth-child(3) { width: 56%; align-self: flex-start; animation-delay: .4s; }

[data-stage="overview"] .hero-art-hub,
[data-stage="connect"] .hero-art-hub,
[data-stage="unsure"] .hero-art-hub {
    display: flex;
}

[data-stage="overview"] .hero-art-ring,
[data-stage="connect"] .hero-art-ring,
[data-stage="unsure"] .hero-art-ring {
    display: block;
}

[data-stage="biz"] .hero-art-bars,
[data-stage="app"] .hero-art-bars,
[data-stage="content"] .hero-art-bars {
    display: flex;
}

[data-stage="customer"] .hero-art-chats {
    display: flex;
}

[data-stage="customer"] .hero-chips {
    display: none;
}

.hero-dash-stats {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    padding: 8px 8px 0;
}

.hero-dash-stat {
    background: #FFF8EA;
    border: 1px solid #E4D9C4;
    border-radius: 10px 12px 9px 11px;
    padding: 7px 8px 6px;
    box-shadow: 1px 2px 0 rgba(150, 130, 100, .1);
    animation: heroPreviewIn .5s ease both;
}

.hero-dash-stat:nth-child(2) { animation-delay: .06s; }
.hero-dash-stat:nth-child(3) { animation-delay: .12s; }

.hero-dash-stat b {
    display: block;
    font-size: 15px;
    color: #22323F;
    line-height: 1.2;
}

.hero-dash-stat span {
    display: block;
    margin-top: 2px;
    font-size: 10.5px;
    color: #7C7565;
}

.hero-dash-flow {
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 8px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 4px;
}

.hero-dash-node {
    flex-shrink: 0;
    padding: 6px 8px;
    background: #2B4257;
    color: #F2EEE2;
    border-radius: 8px;
    font-size: 10.5px;
    font-weight: 700;
    white-space: nowrap;
}

.hero-dash-node:nth-child(4n + 1) {
    background: #1F5F5B;
}

.hero-dash-pipe {
    flex: 1;
    height: 2px;
    min-width: 10px;
    background: repeating-linear-gradient(-90deg, #E9A62B 0 5px, transparent 5px 9px);
    background-size: 14px 2px;
    animation: heroPipe .8s linear infinite;
    border-radius: 2px;
}

.hero-chips {
    position: absolute;
    inset: 58px 8px 44px;
    z-index: 2;
    pointer-events: none;
}

.hero-chip {
    position: absolute;
    padding: 6px 9px;
    background: #FFF8EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 10px 12px 9px 13px;
    box-shadow: 2px 3px 0 rgba(150, 130, 100, .14);
    font-size: 11px;
    font-weight: 700;
    color: #22323F;
    white-space: nowrap;
    animation: heroChipFloat 5.5s ease-in-out infinite;
    animation-delay: calc(var(--c, 0) * .35s);
}

.hero-chip:nth-child(1) { top: 6%; right: 2%; }
.hero-chip:nth-child(2) { top: 8%; left: 4%; }
.hero-chip:nth-child(3) { top: 46%; right: 0; }
.hero-chip:nth-child(4) { top: 44%; left: 2%; }
.hero-chip:nth-child(5) { top: 78%; right: 14%; }
.hero-chip:nth-child(6) { top: 76%; left: 12%; }

@keyframes heroPreviewIn {
    from { opacity: 0; transform: translateY(10px) scale(.98); }
    to { opacity: 1; transform: none; }
}

@keyframes heroPulse {
    0%, 100% { transform: scale(.85); opacity: .45; }
    50% { transform: scale(1.18); opacity: .8; }
}

@keyframes heroChipFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
}

@keyframes heroSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes heroPipe {
    from { background-position: 14px 0; }
    to { background-position: 0 0; }
}

@keyframes heroBar {
    0%, 100% { transform: scaleY(.72); }
    50% { transform: scaleY(1); }
}

@media (prefers-reduced-motion: reduce) {
    .hero-start,
    .hero-preview-pane,
    .hero-chip,
    .hero-preview-pulse,
    .hero-art-ring,
    .hero-dash-pipe,
    .hero-art-bars i,
    .hero-art-chats i,
    .agent-indicator {
        animation: none !important;
    }
}

.hero-buttons {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 50px;
}

.btn-hero-primary {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 34px;
    border-radius: 13px 15px 12px 16px;
    background: #43563E;
    color: #F7F1E6;
    font-size: 15.5px;
    font-weight: 700;
    box-shadow: 5px 6px 0 rgba(67, 86, 62, .3);
    border: none;
    cursor: pointer;
}

.btn-hero-secondary {
    padding: 17px 30px;
    border-radius: 13px 15px 12px 16px;
    border: 2px solid #2B4257;
    background: #F7F1E6;
    color: #22323F;
    font-size: 15.5px;
    font-weight: 700;
    box-shadow: 4px 5px 0 rgba(43, 66, 87, .18);
    cursor: pointer;
}

.hero-stats {
    display: flex;
    align-items: center;
    gap: 30px;
    padding-top: 26px;
    border-top: 2px dashed #D4C7B0;
}

.stat-item {
    display: flex;
    flex-direction: column;
}

.stat-number {
    font-size: 28px;
    font-weight: 800;
    color: #1F5F5B;
}

.stat-label {
    font-size: 13px;
    color: #7C7565;
    margin-top: 4px;
}

.stat-divider {
    width: 1.5px;
    height: 38px;
    background: #D4C7B0;
}

/* Agent Card */
.agent-card-wrapper {
    position: relative;
    padding: 14px 26px 40px 30px;
}

.card-decoration-1 {
    position: absolute;
    top: 0;
    right: -14px;
    width: 88px;
    height: 104px;
    background: #D9CDB6;
    border-radius: 6px 10px 7px 9px;
    transform: rotate(-7deg);
    box-shadow: 3px 4px 0 rgba(150, 130, 100, .22);
}

.card-decoration-2 {
    position: absolute;
    bottom: 0;
    left: -16px;
    width: 112px;
    height: 84px;
    background: #E9A62B;
    border-radius: 8px 11px 7px 12px;
    transform: rotate(6deg);
    box-shadow: 3px 4px 0 rgba(160, 120, 30, .25);
}

.agent-card {
    position: relative;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 18px 22px 16px 24px;
    box-shadow: 8px 10px 0 rgba(150, 130, 100, .16);
    overflow: hidden;
    transform: rotate(-1.2deg);
}

.agent-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: #2B4257;
}

.agent-title-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}

.agent-indicator {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #E9A62B;
    animation: heroLive 1.8s ease-in-out infinite;
}

@keyframes heroLive {
    0%, 100% { box-shadow: 0 0 0 0 rgba(233, 166, 43, .5); }
    70% { box-shadow: 0 0 0 6px rgba(233, 166, 43, 0); }
}

.agent-title {
    font-size: 13.5px;
    font-weight: 700;
    color: #F2EEE2;
}

.agent-live-badge {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 10.5px;
    color: #B9C6D0;
    border: 1px solid rgba(242, 238, 226, .3);
    border-radius: 5px;
    padding: 2px 7px;
}

.agent-steps {
    padding: 22px 20px;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.step-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    border-radius: 11px 13px 10px 14px;
    background: #F1E9DA;
    border: 1.5px solid #DFD3BE;
}

.step-item.active {
    background: #E9A62B;
    border: 1.5px solid #C98D1C;
    box-shadow: 2px 3px 0 rgba(160, 120, 30, .24);
}

.step-item.pending {
    border: 1.5px dashed #CDBFA6;
}

.step-number {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    color: #F2EEE2;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-item .step-number {
    background: #3F5540;
}

.step-item:nth-child(2) .step-number {
    background: #1F5F5B;
}

.step-item.active .step-number {
    background: #2B4257;
}

.step-item.pending .step-number {
    border: 1.5px solid #CDBFA6;
    background: transparent;
    color: #9B9280;
}

.step-text {
    flex: 1;
    font-size: 13.5px;
    color: #454034;
    font-weight: 500;
}

.step-item.active .step-text {
    color: #3A2C08;
    font-weight: 700;
}

.step-item.pending .step-text {
    color: #8A8271;
}

.step-time {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11px;
    color: #1F5F5B;
}

.agent-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1.5px solid #DCCFB9;
    background: #F4EDE0;
}

.agent-stat {
    padding: 17px 18px;
    border-left: 1.5px solid #DCCFB9;
}

.agent-stat:last-child {
    border-left: none;
}

.agent-stat-label {
    font-size: 11.5px;
    color: #8A8271;
    margin-bottom: 6px;
}

.agent-stat-value {
    font-size: 19px;
    font-weight: 800;
    color: #22323F;
}

.agent-stat-value.highlight {
    font-size: 21px;
    color: #1F5F5B;
}

.integration-badge {
    position: absolute;
    bottom: -4px;
    right: 2px;
    padding: 15px 18px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 14px 16px 12px 17px;
    box-shadow: 5px 6px 0 rgba(150, 130, 100, .18);
    display: flex;
    align-items: center;
    gap: 12px;
    transform: rotate(2deg);
}

.integration-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: #C25B42;
    color: #FAF5EA;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.integration-text-wrapper {
    display: flex;
    flex-direction: column;
}

.integration-title {
    font-size: 12.5px;
    font-weight: 700;
    color: #26251F;
}

.integration-tech {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 10.5px;
    color: #8A8271;
    margin-top: 2px;
}

/* Sections */
.section {
    position: relative;
    z-index: 2;
    padding: 66px 34px;
}

.section.alt-bg {
    background: #E7DCC9;
    border-top: 1.5px solid #D8CAB2;
    border-bottom: 1.5px solid #D8CAB2;
}

.section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 44px;
}

.section-label {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11.5px;
    letter-spacing: 1.6px;
    color: #3F5540;
    margin-bottom: 14px;
}

.section-title {
    margin: 0 0 12px;
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -.6px;
    color: #22323F;
}

.section-description {
    margin: 0;
    font-size: 15.5px;
    color: #5C5748;
}

/* Cards Grid */
.cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.cards-grid.two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cards-grid.four-col {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.feature-card {
    position: relative;
    padding: 24px 22px 22px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 20px 24px 18px 26px;
    box-shadow: 6px 7px 0 rgba(150, 130, 100, .16);
}

.feature-card.featured {
    border: 2px solid #43563E;
    box-shadow: 7px 8px 0 rgba(67, 86, 62, .24);
}

.feature-badge {
    position: absolute;
    top: -11px;
    left: 24px;
    padding: 4px 11px;
    background: #E9A62B;
    border-radius: 6px 8px 5px 9px;
    font-size: 10.5px;
    font-weight: 800;
    color: #3A2C08;
    box-shadow: 2px 2px 0 rgba(160, 120, 30, .28);
}

.feature-icon {
    display: flex;
    width: 50px;
    height: 50px;
    border-radius: 15px 17px 13px 18px;
    background: #43563E;
    align-items: center;
    justify-content: center;
    font-size: 23px;
    margin-bottom: 20px;
    box-shadow: 3px 3px 0 rgba(67, 86, 62, .22);
}

.feature-title {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 800;
    color: #22323F;
}

.feature-description {
    margin: 0 0 22px;
    font-size: 14.5px;
    line-height: 1.85;
    color: #5C5748;
}

.feature-link {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    font-weight: 700;
    color: #43563E;
}

/* Footer */
.site-footer {
    position: relative;
    z-index: 2;
    padding: 46px 34px 28px;
    background: #E4D9C4;
    border-top: 1.5px solid #D3C4AB;
}

.footer-columns {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 30px;
    padding-bottom: 40px;
    border-bottom: 2px dashed #C9B99E;
}

.footer-info p {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.9;
    color: #6B6555;
    max-width: 340px;
}

.social-links {
    display: flex;
    gap: 10px;
}

.social-link {
    width: 38px;
    height: 38px;
    border-radius: 11px 13px 10px 14px;
    background: #FAF5EA;
    border: 1.5px solid #D3C4AB;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    font-weight: 700;
    color: #5C5748;
}

.footer-column h4 {
    font-size: 13px;
    font-weight: 800;
    color: #22323F;
    margin: 0 0 16px;
}

.footer-links {
    display: flex;
    flex-direction: column;
    gap: 11px;
    font-size: 13.5px;
    color: #6B6555;
}

.footer-bottom {
    padding-top: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12.5px;
    color: #8A8271;
}

.logo-link {
    display: flex;
    align-items: center;
    gap: 11px;
    color: inherit;
}

.site-logo-img {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 13px 15px 12px 16px;
    box-shadow: 2px 3px 0 rgba(43, 66, 87, .22);
    display: block;
}

.header-social {
    width: 36px;
    height: 36px;
    border-radius: 11px 13px 10px 14px;
    background: #FAF5EA;
    border: 1.5px solid #D3C4AB;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    color: #5C5748;
}

.nav-toggle {
    display: none;
    width: 42px;
    height: 42px;
    border: 1.5px solid #DCCFB9;
    background: #FAF5EA;
    border-radius: 12px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.nav-toggle span:not(.screen-reader-text) {
    display: block;
    width: 18px;
    height: 2px;
    background: #22323F;
}

.btn-hero-primary,
.btn-hero-secondary {
    text-decoration: none;
}

a.btn-hero-primary,
a.btn-hero-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.hero-badge-logo {
    width: 18px;
    height: 18px;
    border-radius: 5px;
    object-fit: cover;
}

.hero-visual {
    position: relative;
    margin: 0;
    padding: 14px 26px 28px 30px;
}

.hero-photo {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    display: block;
    border: 1.5px solid #DCCFB9;
    border-radius: 18px 22px 16px 24px;
    box-shadow: 8px 10px 0 rgba(150, 130, 100, .16);
    transform: rotate(-1.2deg);
    background: #FAF5EA;
}

.hero-visual-caption {
    position: relative;
    z-index: 1;
    margin: 14px 8px 0 0;
    font-size: 12.5px;
    color: #8A8271;
}

.build-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.build-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px 18px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 18px 22px 16px 24px;
    box-shadow: 5px 6px 0 rgba(150, 130, 100, .14);
    color: inherit;
    min-height: 180px;
}

.build-card strong {
    font-size: 16.5px;
    font-weight: 800;
    color: #22323F;
}

.build-card span {
    font-size: 13.5px;
    line-height: 1.8;
    color: #5C5748;
}

.build-card em {
    margin-top: auto;
    font-style: normal;
    font-size: 13px;
    font-weight: 700;
    color: #43563E;
}

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

.service-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 22px 20px 18px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 18px 22px 16px 24px;
    box-shadow: 5px 6px 0 rgba(150, 130, 100, .14);
}

.service-kicker {
    margin: 0;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11px;
    color: #1F5F5B;
}

.service-card h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #22323F;
}

.service-meaning,
.service-how,
.service-samples {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.8;
    color: #5C5748;
}

.service-meaning span,
.service-how span,
.service-samples span {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    background: #E9A62B;
    color: #22323F;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 800;
}

.service-does {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

.service-does li {
    padding: 8px 10px;
    background: #F1E9DA;
    border: 1px solid #E4D9C4;
    border-radius: 10px;
    font-size: 13px;
    color: #22323F;
}

.service-start,
.service-actions {
    margin-top: auto;
    padding-top: 8px;
}

.service-page {
    position: relative;
    z-index: 2;
    padding: 36px 34px 0;
}

.service-page-head {
    max-width: 720px;
    margin: 0 auto 22px;
}

.service-page-head h1 {
    margin: 6px 0 10px;
    font-size: 32px;
    font-weight: 800;
    color: #22323F;
    line-height: 1.35;
}

.service-page-lede {
    margin: 0;
    font-size: 18px;
    line-height: 1.85;
    color: #5C5748;
}

.service-page-body {
    max-width: 720px;
    margin: 0 auto 28px;
    display: grid;
    gap: 12px;
}

.service-page-detail {
    margin: 0;
    font-size: 15px;
    line-height: 1.9;
    color: #5C5748;
}

.service-page .cge-cta {
    padding-top: 12px;
}

.process-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.process-steps li {
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 16px 19px 14px 20px;
    padding: 22px 20px;
}

.process-steps strong {
    display: block;
    margin-bottom: 8px;
    font-size: 16px;
    color: #22323F;
}

.process-steps span {
    font-size: 13.5px;
    line-height: 1.8;
    color: #5C5748;
}

a.feature-card {
    color: inherit;
    display: block;
}

.industry-icon {
    font-size: 11px;
    font-weight: 800;
    color: #FAF5EA;
    text-align: center;
    padding: 0 4px;
}

.feature-icon svg,
.shop-cat__icon svg {
    width: 26px;
    height: 26px;
    fill: none;
    stroke: #FAF5EA;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.shop-cats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.shop-cat {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 26px 22px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 20px 24px 18px 26px;
    box-shadow: 6px 7px 0 rgba(150, 130, 100, .16);
    color: inherit;
}

.shop-cat__icon {
    width: 50px;
    height: 50px;
    border-radius: 15px 17px 13px 18px;
    background: #2B4257;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-cat strong {
    font-size: 20px;
    font-weight: 800;
    color: #22323F;
}

.shop-cat > span {
    font-size: 14.5px;
    line-height: 1.85;
    color: #5C5748;
}

.shop-cat em {
    margin-top: auto;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    color: #43563E;
}

.need-help-btn {
    padding: 13px 22px;
    border-radius: 11px 13px 10px 14px;
    border: 2px solid #2B4257;
    background: #F4EDE0;
    font-size: 14.5px;
    font-weight: 700;
    color: #22323F;
    box-shadow: 3px 4px 0 rgba(43, 66, 87, .16);
    cursor: pointer;
    font-family: inherit;
}

.section-more {
    font-size: 14.5px;
    font-weight: 700;
    color: #3F5540;
    white-space: nowrap;
}

.products-spotlight {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1fr;
    gap: 18px;
}

.spotlight-card {
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 20px 24px 18px 26px;
    box-shadow: 7px 8px 0 rgba(150, 130, 100, .16);
    overflow: hidden;
    color: inherit;
    display: flex;
    flex-direction: column;
}

.spotlight-card__media {
    min-height: 136px;
    background: #2B4257 center / cover no-repeat;
}

.spotlight-card.is-flagship .spotlight-card__media {
    min-height: 216px;
}

.spotlight-card__badge {
    display: inline-block;
    margin: 16px;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 10.5px;
    color: #3A2C08;
    background: #E9A62B;
    padding: 3px 9px;
    border-radius: 6px;
    font-weight: 600;
}

.spotlight-card__body {
    padding: 26px;
}

.spotlight-card__body h3 {
    margin: 0 0 12px;
    font-size: 19px;
    font-weight: 800;
    color: #22323F;
}

.spotlight-card__body p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.85;
    color: #5C5748;
}

.home-feature + .home-feature {
    margin-top: 48px;
}

.industries-layout {
    display: grid;
    grid-template-columns: 292px minmax(0, 1fr);
    gap: 40px;
    align-items: start;
}

.industry-card {
    padding: 24px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 16px 19px 14px 20px;
    box-shadow: 5px 6px 0 rgba(150, 130, 100, .14);
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.industry-icon {
    width: 40px;
    height: 40px;
    flex: none;
    border-radius: 12px 14px 11px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.industry-card h3 {
    margin: 0 0 8px;
    font-size: 17.5px;
    font-weight: 800;
    color: #22323F;
}

.industry-card p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.8;
    color: #5C5748;
}

.faq-list {
    display: grid;
    gap: 12px;
}

.faq-item {
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 16px 19px 14px 20px;
    padding: 4px 22px 4px;
}

.faq-item summary {
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    color: #22323F;
    padding: 16px 0;
    list-style: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item p {
    margin: 0 0 18px;
    font-size: 14.5px;
    line-height: 1.9;
    color: #5C5748;
}

.faq-board {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    gap: 16px;
    align-items: start;
}

.faq-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.faq-chip {
    padding: 8px 12px;
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 999px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    color: #22323F;
    cursor: pointer;
}

.faq-chip.is-on,
.faq-chip:hover {
    border-color: #E9A62B;
    background: #FFF8EA;
}

.faq-answer {
    background: #FAF5EA;
    border: 1.5px solid #DCCFB9;
    border-radius: 18px 22px 16px 24px;
    box-shadow: 5px 6px 0 rgba(150, 130, 100, .14);
    padding: 20px 22px;
}

.faq-answer h3 {
    margin: 0 0 10px;
    font-size: 17px;
    color: #22323F;
}

.faq-answer p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.9;
    color: #5C5748;
}

.faq-ask {
    background: #2B4257;
    color: #F2EEE2;
    border-radius: 18px 22px 16px 24px;
    padding: 20px 18px 16px;
    box-shadow: 5px 6px 0 rgba(43, 66, 87, .22);
}

.faq-ask-kicker {
    margin: 0 0 4px;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 11px;
    color: #E9A62B;
}

.faq-ask h3 {
    margin: 0 0 12px;
    font-size: 16px;
    color: #F2EEE2;
}

.faq-ask-log {
    display: grid;
    gap: 8px;
    max-height: 220px;
    overflow: auto;
    margin-bottom: 12px;
}

.faq-ask-log:empty {
    display: none;
}

.faq-ask-log p {
    margin: 0;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.7;
}

.faq-ask-log .is-user {
    background: rgba(233, 166, 43, .2);
}

.faq-ask-log .is-bot {
    background: rgba(242, 238, 226, .1);
}

.faq-ask-form {
    display: flex;
    gap: 8px;
}

.faq-ask-form input {
    flex: 1;
    min-width: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 10px;
    font: inherit;
    font-size: 13.5px;
}

.faq-ask-form button {
    padding: 10px 14px;
    border: 0;
    border-radius: 10px;
    background: #E9A62B;
    color: #22323F;
    font: inherit;
    font-size: 13.5px;
    font-weight: 800;
    cursor: pointer;
}

.footer-chat-btn {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    text-align: inherit;
    cursor: pointer;
}

.skip-link:focus {
    position: absolute;
    z-index: 100;
    top: 12px;
    right: 16px;
    width: auto;
    height: auto;
    clip: auto;
    background: #FAF5EA;
    color: #22323F;
    padding: 8px 14px;
    border-radius: 8px;
}

.cge-cta {
    position: relative;
    z-index: 2;
    padding: 40px 34px 8px;
}

img {
    max-width: 100%;
    height: auto;
}

/* Responsive */
@media (max-width: 1320px) {
    .irodai-container {
        width: 100%;
        max-width: 1280px;
    }
}

@media (max-width: 1100px) {
    .site-header {
        flex-wrap: wrap;
        gap: 12px;
    }

    .site-branding {
        width: 100%;
        justify-content: space-between;
        position: relative;
    }

    .nav-toggle {
        display: flex;
        margin-inline-start: auto;
    }

    .main-navigation {
        display: none;
        position: absolute;
        top: calc(100% + 10px);
        right: 0;
        left: 0;
        z-index: 20;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background: #FAF5EA;
        border: 1.5px solid #DCCFB9;
        border-radius: 16px;
        padding: 10px;
        box-shadow: 5px 6px 0 rgba(150, 130, 100, .16);
    }

    .main-navigation.is-open,
    body.nav-open .main-navigation {
        display: flex;
    }

    .main-navigation a {
        padding: 10px 12px;
        border-radius: 10px;
    }

    .header-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .consult-text {
        display: none;
    }

    .hero-title.hero-path-line {
        font-size: 12px;
    }

    .hero-content {
        grid-template-columns: 1fr;
        grid-template-areas:
            "copy"
            "visual"
            "unsure";
        gap: 12px;
    }

    .industries-layout,
    .products-spotlight,
    .shop-cats,
    .cards-grid,
    .cards-grid.two-col,
    .build-grid,
    .service-grid,
    .faq-board,
    .process-steps {
        grid-template-columns: 1fr;
    }

    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
}

@media (max-width: 720px) {
    .hero-section {
        padding: 18px 14px 22px;
    }

    .hero-copy {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .hero-title.hero-path-line {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        margin: 0;
        padding: 2px 0 6px;
        font-size: 11px;
    }

    .hero-title.hero-path-line::-webkit-scrollbar {
        display: none;
    }

    .hero-path-step {
        flex: 0 0 auto;
        font-size: 11px;
        padding: 5px 9px;
    }

    .hero-starts {
        max-width: none;
        gap: 6px;
        margin: 0;
    }

    .hero-starts-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .hero-starts-row .hero-start {
        flex-direction: row;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
    }

    .hero-starts-row .hero-start-actions {
        flex-direction: row;
        gap: 8px 12px;
    }

    .hero-starts-row .hero-start strong {
        font-size: 13px;
    }

    .hero-start {
        padding: 11px 12px;
        border-radius: 12px;
        box-shadow: 2px 3px 0 rgba(150, 130, 100, .12);
    }

    .hero-preview,
    .hero-visual.hero-preview {
        padding: 0;
    }

    .hero-preview-card {
        min-height: 0;
        height: auto;
        border-radius: 16px;
        box-shadow: 4px 6px 0 rgba(150, 130, 100, .14);
    }

    .hero-preview-head {
        padding: 10px 12px;
    }

    .hero-preview-pane {
        padding: 10px 12px 12px;
    }

    .hero-preview-title {
        font-size: 15px;
    }

    .hero-preview-problem {
        font-size: 12.5px;
        margin-bottom: 10px;
    }

    .hero-preview-stage {
        min-height: 220px;
    }

    .hero-chips,
    .hero-art-hub,
    .hero-art-ring,
    .hero-art-bars,
    .hero-preview-pulse {
        display: none;
    }

    .hero-dash-stats {
        padding: 8px;
    }

    .hero-unsure {
        max-width: none;
        margin: 0;
    }

    .hero-title {
        font-size: 32px;
    }

    .hero-title.hero-path-line {
        font-size: 11.5px;
    }

    .hero-path-step {
        font-size: 11px;
        padding: 4px 8px;
    }

    .hero-section,
    .section,
    .site-header,
    .site-footer,
    .cge-cta,
    .service-page {
        padding-left: 18px;
        padding-right: 18px;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-stats {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .stat-divider {
        display: none;
    }

    .footer-columns,
    .agent-stats-grid {
        grid-template-columns: 1fr;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }

    .header-actions {
        flex-wrap: wrap;
    }
}

@media (max-width: 560px) {
    .hero-starts-row {
        grid-template-columns: 1fr;
    }

    .hero-dash-node {
        font-size: 10px;
        padding: 5px 6px;
    }
}

/* Elementor wrappers should not add extra chrome around irodAI widgets. */
.site-main .elementor {
    --widgets-spacing: 0px;
}

.site-main .elementor-section,
.site-main .e-con {
    margin: 0;
}

.site-main .elementor-section > .elementor-container {
    max-width: none !important;
    width: 100%;
    padding: 0 !important;
    display: block;
}

.site-main .elementor-column-wrap,
.site-main .elementor-widget-wrap,
.site-main .elementor-widget-container,
.site-main .e-con-inner {
    padding: 0 !important;
}

.site-main .elementor-widget {
    margin: 0 !important;
}

.site-main .elementor-column {
    width: 100%;
}