/* Home layout aligned to Astro index structure — uses project tokens only (no Tailwind). */

.max-w-3xl {
    max-width: 48rem;
}

/* Centrado y ancho para cabeceras de sección (excepto hero y bloque works-split) */
.home-section-head {
    text-align: center;
    max-width: min(94vw, 56rem);
    margin-left: auto;
    margin-right: auto;
}

.home-section-head .section-title {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.home-section-head .why-lead,
.home-section-head .platform-lead,
.home-section-head .section-subtitle {
    margin-left: auto;
    margin-right: auto;
    max-width: min(94vw, 44rem);
}

.home-cost-intro .home-cost-kicker {
    text-align: center;
}

.home-cost-intro h2 {
    text-align: center;
}

.home-cost-intro > p {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: min(94vw, 44rem);
}

.font-semibold {
    font-weight: 600;
}

.text-ind {
    color: #f97316;
}

.text-team {
    color: var(--primary);
}

.text-mint {
    color: #34d399;
}

.platform-card:nth-child(1) .platform-icon {
    color: #f97316;
}

.platform-card:nth-child(2) .platform-icon {
    color: var(--primary);
}

.platform-card:nth-child(3) .platform-icon {
    color: #34d399;
}

.home-main > section {
    padding: 5rem 0;
}

@media (max-width: 768px) {
    .home-main > section {
        padding: 3.25rem 0;
    }
}

/* --- Hero --- */
.home-hero .hero-grid {
    align-items: center;
}

.home-hero .hero-title {
    font-size: clamp(2.25rem, 5vw, 3.75rem);
    max-width: 20ch;
}

.home-hero .hero-subtitle {
    max-width: 36rem;
    font-size: 1.1rem;
    line-height: 1.65;
}

.home-hero-note {
    margin-top: 1.5rem;
    font-size: 0.875rem;
    color: var(--text-muted);
}

.hero-product-card {
    position: relative;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--bg-card);
    padding: 1.75rem;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
}

[data-theme="light"] .hero-product-card {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-lg);
}

.hero-product-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="light"] .hero-product-card__head {
    border-bottom-color: rgba(0, 0, 0, 0.08);
}

.hero-product-card__head-left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.hero-ai-badge {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    background: rgba(0, 128, 255, 0.15);
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 800;
}

.hero-scenario-title {
    font-size: 0.9rem;
    font-weight: 600;
}

.hero-scenario-meta {
    font-size: 0.75rem;
    color: var(--text-muted);
}

.hero-live-pill {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.25rem 0.6rem;
    border-radius: var(--radius-md);
    background: rgba(16, 185, 129, 0.15);
    color: #34d399;
}

.hero-chat-stack {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hero-chat-bubble {
    max-width: 85%;
    padding: 0.75rem 1rem;
    border-radius: 1rem;
    font-size: 0.875rem;
    line-height: 1.45;
}

.hero-chat-bubble--buyer {
    align-self: flex-end;
    background: rgba(0, 128, 255, 0.15);
    border-bottom-right-radius: 0.35rem;
}

.hero-chat-bubble--rep {
    align-self: flex-start;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    border-bottom-left-radius: 0.35rem;
}

[data-theme="light"] .hero-chat-bubble--rep {
    background: #f1f5f9;
    border-color: rgba(0, 0, 0, 0.08);
}

.hero-feedback-card {
    margin-top: 1.25rem;
    width: 100%;
    max-width: 28rem;
    margin-left: auto;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(16, 185, 129, 0.35);
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), transparent);
    padding: 1rem;
}

.hero-feedback-kicker {
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #34d399;
}

.hero-feedback-text {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
}

/* --- Who it's for --- */
.home-who-intro {
    text-align: center;
    max-width: min(94vw, 56rem);
    margin: 0 auto;
}

.home-who-intro .section-title {
    margin-bottom: 1rem;
}

.home-who-intro p {
    font-size: 1.1rem;
    color: var(--text-muted);
    line-height: 1.65;
}

.audience-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-top: 3.5rem;
    max-width: 72rem;
    margin-left: auto;
    margin-right: auto;
}

.audience-card {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    padding: 2rem;
}

[data-theme="light"] .audience-card {
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: var(--shadow-md);
}

.audience-card::before {
    content: '';
    position: absolute;
    right: -3rem;
    top: -3rem;
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    pointer-events: none;
}

.audience-card--teams::before {
    background: rgba(0, 128, 255, 0.1);
}

.audience-card--individuals::before {
    background: rgba(249, 115, 22, 0.1);
}

.audience-card-inner {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.audience-card-icon {
    width: 3.5rem;
    height: 3.5rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-size: 1.35rem;
}

.audience-card--teams .audience-card-icon {
    background: rgba(0, 128, 255, 0.15);
}

.audience-card--individuals .audience-card-icon {
    background: rgba(249, 115, 22, 0.15);
}

.audience-card h3 {
    font-size: 1.25rem;
    margin-bottom: 0.35rem;
}

.audience-card--teams h3 {
    color: var(--primary);
}

.audience-card--individuals h3 {
    color: #f97316;
}

.audience-card .role-line {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-muted);
    margin-bottom: 1rem;
}

.audience-card .role-line strong {
    color: var(--text-main);
}

.audience-card p {
    color: var(--text-muted);
    line-height: 1.65;
    font-size: 0.95rem;
}

.audience-card .btn-link-ghost {
    display: inline-block;
    margin-top: 1.5rem;
    padding: 0;
    background: none;
    border: none;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    text-decoration: none;
}

.audience-card--teams .btn-link-ghost {
    color: var(--primary);
}

.audience-card--individuals .btn-link-ghost {
    color: #f97316;
}

/* --- Pain explorer --- */
.pain-shell {
    margin-top: 2.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    overflow: hidden;
}

[data-theme="light"] .pain-shell {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-md);
}

.pain-tabs {
    display: flex;
    gap: 0.25rem;
    padding: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="light"] .pain-tabs {
    border-bottom-color: rgba(0, 0, 0, 0.08);
}

@media (min-width: 640px) {
    .pain-tabs {
        gap: 0.5rem;
        padding: 1rem 1.25rem;
    }
}

.pain-tab {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.35rem;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-muted);
    font-family: var(--font-main);
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.pain-tab:hover {
    background: rgba(255, 255, 255, 0.04);
}

[data-theme="light"] .pain-tab:hover {
    background: rgba(0, 0, 0, 0.04);
}

.pain-tab.is-active {
    background: rgba(16, 185, 129, 0.12);
    color: var(--text-main);
}

.pain-tab-dot {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: var(--bg-dark);
}

@media (min-width: 640px) {
    .pain-tab-dot {
        width: 2.25rem;
        height: 2.25rem;
        font-size: 0.85rem;
    }
}

.pain-tab.is-active .pain-tab-dot {
    border-color: #34d399;
    background: #34d399;
    color: #0f172a;
}

.pain-tab-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    max-width: 5.5rem;
}

@media (min-width: 640px) {
    .pain-tab-label {
        font-size: 0.75rem;
        max-width: none;
    }
}

.pain-body {
    display: grid;
    grid-template-columns: 1fr;
}

@media (min-width: 1024px) {
    .pain-body {
        grid-template-columns: 1fr 1fr;
    }
}

.pain-media {
    position: relative;
    min-height: 13rem;
    background: rgba(0, 0, 0, 0.2);
}

@media (min-width: 1024px) {
    .pain-media {
        min-height: 17rem;
    }
}

.pain-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    min-height: 13rem;
}

@media (min-width: 1024px) {
    .pain-media img {
        position: absolute;
        inset: 0;
        min-height: 0;
    }
}

.pain-copy {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 1023px) {
    .pain-copy {
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    [data-theme="light"] .pain-copy {
        border-top-color: rgba(0, 0, 0, 0.08);
    }
}

@media (min-width: 1024px) {
    .pain-copy {
        border-left: 1px solid rgba(255, 255, 255, 0.08);
        padding: 2rem;
    }

    [data-theme="light"] .pain-copy {
        border-left-color: rgba(0, 0, 0, 0.08);
    }
}

.pain-copy h3 {
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.3;
}

.pain-copy p {
    margin-top: 0.75rem;
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--text-muted);
    max-height: 18rem;
    overflow-y: auto;
}

/* --- Why different (image tiles) --- */
.why-lead {
    max-width: 36rem;
    margin-top: 1rem;
    font-size: 1.1rem;
    color: var(--text-muted);
    line-height: 1.65;
}

.why-grid {
    display: grid;
    gap: 2rem;
    margin-top: 3.5rem;
}

@media (min-width: 768px) {
    .why-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.why-tile {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
    background: var(--bg-card);
}

[data-theme="light"] .why-tile {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-md);
}

.why-tile-media {
    position: relative;
    height: 11rem;
}

@media (min-width: 640px) {
    .why-tile-media {
        height: 12rem;
    }
}

.why-tile-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.why-tile-media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(3, 7, 18, 0.88) 0%, rgba(3, 7, 18, 0.2) 45%, transparent 100%);
    pointer-events: none;
}

[data-theme="light"] .why-tile-media::after {
    background: linear-gradient(to top, rgba(15, 23, 42, 0.85) 0%, transparent 100%);
}

.why-tile-media h3 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.25rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: #fff;
    z-index: 1;
}

.why-tile p {
    padding: 1.5rem;
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--text-muted);
}

.why-foot {
    margin-top: 3rem;
    max-width: min(94vw, 56rem);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--text-muted);
}

/* --- Cost panel --- */
#book-demo.home-cost-anchor {
    scroll-margin-top: 6rem;
}

#try-free {
    scroll-margin-top: 6rem;
}

.home-cost-shell {
    margin-top: 2.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    padding: 2rem;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.home-final-cta .hero-buttons {
    justify-content: center;
}

[data-theme="light"] .home-cost-shell {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-lg);
}

@media (min-width: 640px) {
    .home-cost-shell {
        padding: 2.5rem 3rem;
    }
}

.home-cost-intro .home-cost-kicker {
    margin-bottom: 0.5rem;
}

.home-cost-kicker {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #34d399;
}

.stat-tiles {
    display: grid;
    gap: 1rem;
    margin-top: 2.5rem;
}

@media (min-width: 640px) {
    .stat-tiles {
        grid-template-columns: repeat(3, 1fr);
    }
}

.stat-tile {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    padding: 1.5rem;
}

[data-theme="light"] .stat-tile {
    background: #f8fafc;
    border-color: rgba(0, 0, 0, 0.08);
}

.stat-tile--accent {
    border-color: rgba(16, 185, 129, 0.4);
    background: rgba(16, 185, 129, 0.08);
}

.stat-tile .label {
    font-size: 0.875rem;
    color: var(--text-muted);
}

.stat-tile .value {
    margin-top: 0.5rem;
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.stat-tile--accent .value {
    color: #34d399;
}

.cost-disclosure {
    margin-top: 2.5rem;
}

.cost-disclosure summary {
    list-style: none;
    cursor: pointer;
    text-align: center;
    border-radius: var(--radius-md);
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    padding: 1rem 1.25rem;
    font-size: 0.9rem;
    font-weight: 500;
}

.cost-disclosure summary::-webkit-details-marker {
    display: none;
}

.cost-disclosure summary:hover {
    border-color: rgba(16, 185, 129, 0.35);
}

.cost-disclosure-inner {
    padding-top: 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.cost-table-wrap {
    margin-top: 0.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: auto;
}

.cost-disclosure-inner > div > h3 {
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

[data-theme="light"] .cost-table-wrap {
    border-color: rgba(0, 0, 0, 0.1);
}

.cost-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.cost-table th,
.cost-table td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

[data-theme="light"] .cost-table th,
[data-theme="light"] .cost-table td {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

.cost-table thead {
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-muted);
    font-weight: 600;
}

.cost-table tfoot td,
.cost-table tbody tr:last-child td {
    font-weight: 600;
    background: rgba(255, 255, 255, 0.03);
}

.roi-callout {
    margin-top: 2.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(16, 185, 129, 0.3);
    background: rgba(16, 185, 129, 0.06);
    padding: 1.5rem 2rem;
}

.roi-callout p:first-child {
    font-size: 1.25rem;
    font-weight: 600;
}

.roi-callout p:last-child {
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.65;
}

/* --- Bento "What VendAce gives you" --- */
.gives-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.75rem;
    max-width: min(94vw, 56rem);
    margin-left: auto;
    margin-right: auto;
}

.gives-head .section-title {
    margin: 0;
}

.gives-head p {
    max-width: min(94vw, 44rem);
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.55;
    margin: 0;
}

.bento-grid {
    display: grid;
    gap: 1rem;
    margin-top: 3rem;
    grid-template-columns: 1fr;
}

@media (min-width: 900px) and (max-width: 1023px) {
    .bento-grid {
        grid-template-columns: repeat(6, 1fr);
    }

    .bento-md-3 {
        grid-column: span 3;
    }

    .bento-md-6 {
        grid-column: span 6;
    }
}

@media (min-width: 1024px) {
    .bento-grid {
        grid-template-columns: repeat(12, 1fr);
        gap: 1.25rem;
    }

    .bento-lg-3 {
        grid-column: span 3;
    }

    .bento-lg-4 {
        grid-column: span 4;
    }

    .bento-lg-5 {
        grid-column: span 5;
    }
}

.bento-card {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[data-theme="light"] .bento-card {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-md);
}

.bento-card--mint {
    border-color: rgba(16, 185, 129, 0.35);
}

.bento-media {
    position: relative;
    height: 9rem;
    flex-shrink: 0;
    background: rgba(0, 0, 0, 0.15);
}

.bento-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bento-card-split {
    flex-direction: column;
}

@media (min-width: 1024px) {
    .bento-card-split-lg {
        flex-direction: row;
        align-items: stretch;
    }

    .bento-card-split-lg .bento-body--order-first {
        order: 1;
        flex: 1;
        justify-content: center;
    }

    .bento-card-split-lg .bento-media--side {
        order: 2;
        width: 44%;
        height: auto;
        min-height: 12rem;
    }

    .bento-card-split-lg.bento-image-left .bento-media--side {
        order: 0;
        width: 42%;
    }

    .bento-card-split-lg.bento-image-left .bento-body {
        order: 1;
        flex: 1;
        justify-content: center;
    }

    .bento-card-split-lg .bento-media--side img {
        position: absolute;
        inset: 0;
        height: 100%;
    }

    .bento-card-split-lg .bento-media--side {
        position: relative;
    }
}

.bento-body {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.bento-kicker {
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #34d399;
}

.bento-kicker--team {
    color: var(--primary);
}

.bento-kicker--ind {
    color: #f97316;
}

.bento-body h3 {
    margin-top: 0.5rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.bento-body p {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-muted);
}

/* --- Argument grid --- */
.arg-grid {
    display: grid;
    gap: 1.25rem;
    margin-top: 3rem;
}

@media (min-width: 768px) {
    .arg-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.arg-card {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    padding: 2rem;
}

[data-theme="light"] .arg-card {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-md);
}

.arg-card-top {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.arg-num {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
    flex-shrink: 0;
}

.arg-num--1 {
    color: #f97316;
}

.arg-num--2 {
    color: rgba(148, 163, 184, 0.45);
}

.arg-num--3 {
    color: rgba(16, 185, 129, 0.55);
}

.arg-num--4 {
    color: rgba(0, 128, 255, 0.5);
}

.arg-card h3 {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.3;
}

.arg-card > p {
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.6;
}

.arg-card img {
    margin-top: 1.5rem;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-md);
    object-fit: cover;
}

/* --- Why works split --- */
.works-split {
    display: grid;
    gap: 3rem;
    align-items: start;
}

@media (min-width: 1024px) {
    .works-split {
        grid-template-columns: 1fr 1fr;
    }
}

.works-split-text {
    text-align: left;
}

.works-split-text .section-title {
    text-align: left;
}

.works-split-text p {
    margin-top: 1.25rem;
    font-size: 1.1rem;
    line-height: 1.65;
    color: var(--text-muted);
}

.works-side-card {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
    background: var(--bg-card);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .works-side-card {
    border-color: rgba(0, 0, 0, 0.1);
}

.works-side-card img {
    width: 100%;
    height: 10rem;
    max-height: min(11rem, 32vw);
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.works-side-body {
    padding: 1rem 1.25rem 1.15rem;
}

.works-side-body h3 {
    font-size: 1.05rem;
    font-weight: 600;
}

.works-side-body p {
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.6;
}

/* --- Platform strip --- */
.platform-lead {
    margin-top: 0.75rem;
    max-width: 40rem;
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.platform-grid {
    display: grid;
    gap: 1.25rem;
    margin-top: 3rem;
}

@media (min-width: 768px) {
    .platform-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.platform-card {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    padding: 1.5rem;
}

[data-theme="light"] .platform-card {
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: var(--shadow-md);
}

.platform-card-head {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.platform-icon {
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.platform-card h3 {
    font-size: 1.05rem;
    font-weight: 600;
}

.platform-card h3.text-ind {
    color: #f97316;
}

.platform-card h3.text-team {
    color: var(--primary);
}

.platform-card h3.text-mint {
    color: #34d399;
}

.platform-card p {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-muted);
}

/* --- Testimonials placeholder --- */
.t-testimonial-grid {
    display: grid;
    gap: 1.5rem;
    margin-top: 3.5rem;
}

@media (min-width: 768px) {
    .t-testimonial-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.t-card {
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-card);
    padding: 1.5rem;
}

[data-theme="light"] .t-card {
    border-color: rgba(0, 0, 0, 0.1);
}

.t-card-head {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.t-card img {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 9999px;
    object-fit: cover;
}

.t-card blockquote {
    margin-top: 1rem;
    font-size: 0.875rem;
    color: var(--text-muted);
    line-height: 1.6;
}

/* --- Final CTA --- */
.home-final-cta {
    text-align: center;
    max-width: 48rem;
    margin: 0 auto;
    padding: 0 1rem;
}

.home-final-cta h2 {
    font-size: clamp(1.85rem, 4vw, 3rem);
    font-weight: 800;
}

.home-final-cta .hero-buttons {
    margin-top: 2.5rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* util section tint — optional, very subtle */
.home-muted-band {
    background: rgba(0, 128, 255, 0.04);
}

[data-theme="light"] .home-muted-band {
    background: rgba(0, 128, 255, 0.05);
}

@media (max-width: 992px) {
    .audience-cards {
        grid-template-columns: 1fr;
    }
}