/* ═══════════════════════════════════════════
       HOME PAGE SECTIONS
       ═══════════════════════════════════════════ */

    /* ── 1. Hero (dark-section) ── */
    .home-hero {
        padding: var(--space-10) var(--space-5);
        min-height: 550px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .home-hero-inner {
        max-width: var(--content-max-width);
        margin: 0 auto;
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--space-8);
        align-items: center;
    }
    .home-hero-text { min-width: 0; }
    .home-hero-promo-col {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .home-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 14px;
        background: rgba(255,255,255,0.1);
        color: rgba(255,255,255,0.8);
        font-size: var(--font-size-xs);
        font-weight: var(--font-weight-semibold);
        border-radius: var(--radius-full);
        margin-bottom: var(--space-5);
        letter-spacing: 0.4px;
        text-transform: uppercase;
        border: 1px solid rgba(255,255,255,0.15);
    }
    .home-hero-badge i { font-size: 10px; }
    .home-hero h1 {
        font-size: var(--font-size-5xl);
        font-weight: var(--font-weight-bold);
        color: var(--color-accent-light);
        line-height: 1.12;
        margin: 0 0 var(--space-4);
        letter-spacing: -0.5px;
        max-width: 680px;
    }
    .home-hero h1 em {
        font-style: normal;
        color: #fff;
    }
    .home-hero-sub {
        font-size: var(--font-size-lg);
        color: white;
        line-height: var(--line-height-relaxed);
        margin: 0 0 var(--space-5);
        max-width: 560px;
    }
    .home-hero-trust {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-top: 10px;
    }
    .home-hero-trust-img {
        height: 21px;
        width: auto;
    }
    .home-hero-trust-label {
        font-size: 12px;
        color: rgba(255,255,255,0.7);
        line-height: 1.3;
    }

    /* ── Hero promo card ── */
    .hero-promo {
        background: #fff;
        border-radius: var(--radius-lg);
        padding: var(--space-5);
        color: var(--color-text-primary);
        box-shadow: 0 8px 32px rgba(0,0,0,0.18);
        position: relative;
        overflow: visible;
        width: 320px;
        max-width: 100%;
    }
    .hero-promo::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0;
        height: 3px;
        background: linear-gradient(90deg, var(--color-accent), #6366f1);
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }
    .hero-promo-badge {
        position: absolute;
        top: -10px;
        right: var(--space-4);
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 4px 12px;
        background: #dc2626;
        color: #fff;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border-radius: var(--radius-full);
        box-shadow: 0 2px 8px rgba(220,38,38,0.3);
        z-index: 1;
    }
    .hero-promo-badge i { font-size: 6px; }
    .hero-promo-header {
        display: flex;
        align-items: center;
        gap: var(--space-3);
        margin-bottom: var(--space-3);
    }
    .hero-promo-icon {
        width: 42px; height: 42px;
        border-radius: var(--radius-md);
        background: var(--color-dark-bg);
        color: #fff;
        display: flex; align-items: center; justify-content: center;
        font-size: 18px;
        flex-shrink: 0;
    }
    .hero-promo-name {
        font-size: var(--font-size-lg);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-primary);
        line-height: 1.2;
    }
    .hero-promo-desc {
        font-size: 13px;
        color: var(--color-text-secondary);
        line-height: var(--line-height-relaxed);
        margin-bottom: var(--space-4);
    }
    .hero-promo-cta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 9px 20px;
        background: var(--color-dark-bg);
        color: #fff;
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-semibold);
        text-decoration: none;
        border-radius: var(--radius-md);
        transition: opacity 0.15s;
    }
    .hero-promo-cta:hover { opacity: 0.9; }
    .hero-promo-cta i { font-size: 10px; }

    /* ── Generic section ── */
    .home-section {
        padding: var(--space-10) var(--space-5);
        min-height: 550px;
        display: flex;
        align-items: center;
    }
    .home-section-inner {
        max-width: var(--content-max-width);
        margin: 0 auto;
        width: 100%;
    }
    .home-section-header {
        display: flex;
        align-items: flex-end;
        gap: var(--space-6);
        margin-bottom: var(--space-6);
    }
    .home-section-header-text {
        flex: 1;
        min-width: 0;
    }
    .home-section-header-action {
        flex-shrink: 0;
        padding-bottom: 2px;
    }
    .home-section-title {
        font-size: var(--font-size-4xl);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-primary);
        margin: 0 0 var(--space-2);
    }
    .home-section-title em {
        font-style: normal;
        text-decoration: underline;
        text-decoration-color: var(--color-accent);
        text-underline-offset: 4px;
        text-decoration-thickness: 2.5px;
    }
    .home-section-sub {
        font-size: var(--font-size-md);
        color: var(--color-text-secondary);
        max-width: 540px;
        line-height: var(--line-height-relaxed);
        margin: 0;
    }
    .home-section-link {
        color: var(--color-accent);
        text-decoration: none;
        font-weight: var(--font-weight-semibold);
        white-space: nowrap;
        font-size: var(--font-size-lg);
    }
    .home-section-link:hover {
        text-decoration: underline;
    }
    .home-section-footer {
        margin-top: var(--space-5);
        text-align: center;
    }

    /* ── 2. Latest Insights – tab filters ── */
    .insights-tabs {
        display: flex;
        align-items: center;
        gap: var(--space-2);
        margin-top: var(--space-4);
        flex-wrap: wrap;
    }
    .insights-tab {
        display: inline-block;
        padding: 0;
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-semibold);
        color: var(--color-text-primary);
        background: none;
        border: none;
        border-radius: 0;
        cursor: pointer;
        transition: color var(--transition-fast);
        text-decoration: none;
        font-family: var(--font-family);
        white-space: nowrap;
    }
    .insights-tab:hover {
        color: var(--color-accent);
        text-decoration: underline;
    }
    .insights-tab--active {
        color: var(--color-accent);
        font-weight: var(--font-weight-semibold);
    }
    .insights-tab--active:hover {
        text-decoration: underline;
    }
    .insights-tab-sep {
        color: var(--color-text-faint);
        font-size: var(--font-size-sm);
        user-select: none;
        pointer-events: none;
    }

    /* ── Compact news card grid (ncc-*) ──
       Reusable component: vertical cards side-by-side in a responsive grid.
       Each card has: source logo strip, title, source + time ago.
    */
    .ncc-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-6);
    }
    .ncc {
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-lg);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        height: 300px;
        transition: box-shadow 0.25s ease, border-color 0.25s ease;
        position: relative;
        cursor: pointer;
    }
    .ncc:hover {
        box-shadow: 0 4px 20px rgba(51,136,255,0.15);
        border-color: rgba(51,136,255,0.25);
    }
    /* Image band at top */
    .ncc-image {
        position: relative;
        width: 100%;
        height: 140px;
        overflow: hidden;
        background: var(--color-surface-hover);
        flex-shrink: 0;
    }
    .ncc-image > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .ncc-logo-badge {
        position: absolute;
        bottom: 10px;
        left: 10px;
        padding: 6px 14px;
        border-radius: var(--radius-md);
        background: rgba(255,255,255,0.94);
        backdrop-filter: blur(6px);
        display: flex;
        align-items: center;
        box-shadow: 0 2px 6px rgba(0,0,0,0.10);
    }
    .ncc-logo-badge img {
        max-height: 22px;
        max-width: 110px;
        width: auto;
        height: auto;
        object-fit: contain;
        display: block;
    }
    /* Fallback logo strip (no image) */
    .ncc-logo-strip {
        height: 44px;
        padding: 8px 12px;
        display: flex;
        align-items: center;
        box-sizing: border-box;
    }
    .ncc-logo-strip img {
        max-height: 26px;
        max-width: 120px;
        width: auto;
        height: auto;
        object-fit: contain;
    }
    /* Body */
    .ncc-body {
        padding: var(--space-3) var(--space-4) var(--space-4);
        display: flex;
        flex-direction: column;
        flex: 1;
        gap: var(--space-1);
        border-radius: 0 0 var(--radius-lg) var(--radius-lg);
        transition: background 0.25s ease, color 0.25s ease;
    }
    .ncc:hover .ncc-body {
        background: var(--color-dark-bg);
        color: #fff;
    }
    .ncc:hover .ncc-title,
    .ncc:hover .ncc-title a,
    .ncc:hover .ncc-desc,
    .ncc:hover .ncc-meta,
    .ncc:hover .ncc-source,
    .ncc:hover .ncc-time {
        color: #fff;
    }
    .ncc:hover .ncc-meta {
        border-top-color: rgba(255,255,255,0.2);
    }
    .ncc-title {
        font-size: var(--font-size-md);
        font-weight: var(--font-weight-semibold);
        color: var(--color-text-primary);
        line-height: var(--line-height-tight);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .ncc-title a { color: inherit; text-decoration: none; }
    .ncc-title a::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 3;
    }
    .ncc-title a:hover { color: var(--color-accent); }
    .ncc-desc {
        font-size: var(--font-size-sm);
        color: var(--color-text-secondary);
        line-height: var(--line-height-relaxed);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin: 0;
    }
    /* Footer meta: source + time */
    .ncc-meta {
        margin-top: auto;
        padding-top: var(--space-3);
        border-top: 1px solid var(--color-border);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--space-2);
        font-size: var(--font-size-xs);
        color: var(--color-text-faint);
    }
    .ncc-source {
        font-weight: var(--font-weight-medium);
        color: var(--color-text-muted);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
    }
    .ncc-flag {
        flex-shrink: 0;
        font-size: 14px;
        line-height: 1;
        border-radius: 2px;
        overflow: hidden;
    }
    .ncc-time {
        white-space: nowrap;
        flex-shrink: 0;
    }

    #insights-list { min-height: 200px; }
    .insights-loading {
        text-align: center;
        padding: var(--space-8) 0;
        color: var(--color-text-faint);
        font-size: var(--font-size-sm);
    }

    @media (max-width: 1024px) {
        .ncc-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 640px) {
        .ncc-grid { grid-template-columns: 1fr; }
    }

    /* ── 2b. Coming Soon Solutions Teaser ── */
    .cs-section {
        padding: var(--space-10) var(--space-5);
    }
    .cs-section-inner {
        max-width: var(--content-max-width);
        margin: 0 auto;
    }
    .cs-header {
        display: flex;
        align-items: flex-end;
        gap: var(--space-6);
        margin-bottom: var(--space-7);
    }
    .cs-header-text { flex: 1; min-width: 0; }
    .cs-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: var(--font-size-xs);
        font-weight: var(--font-weight-semibold);
        text-transform: uppercase;
        letter-spacing: 1.2px;
        color: var(--color-accent);
        margin-bottom: var(--space-2);
    }
    .cs-eyebrow i { font-size: 9px; }
    .cs-title {
        font-size: var(--font-size-4xl);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-primary);
        margin: 0 0 var(--space-2);
        line-height: 1.15;
    }
    .cs-title em {
        font-style: normal;
        text-decoration: underline;
        text-decoration-color: var(--color-accent);
        text-underline-offset: 4px;
        text-decoration-thickness: 2.5px;
    }
    .cs-subtitle {
        font-size: var(--font-size-md);
        color: var(--color-text-secondary);
        max-width: 560px;
        margin: 0;
        line-height: var(--line-height-relaxed);
    }
    .cs-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-6);
    }
    .cs-card {
        position: relative;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-lg);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        text-decoration: none;
        color: inherit;
        transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.25s ease;
    }
    .cs-card:hover {
        box-shadow: 0 8px 32px rgba(51,136,255,0.14);
        border-color: rgba(51,136,255,0.3);
        transform: translateY(-4px);
    }
    .cs-card-top {
        position: relative;
        padding: var(--space-5) var(--space-5) 0;
    }
    .cs-card-medal {
        position: absolute;
        top: var(--space-4);
        right: var(--space-4);
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 3px 10px;
        border-radius: var(--radius-full);
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }
    .cs-card-medal i { font-size: 10px; }
    .cs-card-medal--gold {
        background: linear-gradient(135deg, #fbbf24, #f59e0b);
        color: #78350f;
        box-shadow: 0 2px 8px rgba(245,158,11,0.25);
    }
    .cs-card-medal--silver {
        background: linear-gradient(135deg, #d1d5db, #9ca3af);
        color: #1f2937;
        box-shadow: 0 2px 8px rgba(156,163,175,0.25);
    }
    .cs-card-medal--bronze {
        background: linear-gradient(135deg, #d97706, #b45309);
        color: #fff;
        box-shadow: 0 2px 8px rgba(180,83,9,0.25);
    }
    .cs-card-icon {
        width: 48px;
        height: 48px;
        border-radius: var(--radius-md);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: var(--space-3);
        transition: background 0.3s ease, color 0.3s ease;
    }
    .cs-card:nth-child(1) .cs-card-icon { background: rgba(51,136,255,0.08); color: var(--color-accent); }
    .cs-card:nth-child(2) .cs-card-icon { background: rgba(99,102,241,0.08); color: #6366f1; }
    .cs-card:nth-child(3) .cs-card-icon { background: rgba(16,185,129,0.08); color: #10b981; }
    .cs-card:hover:nth-child(1) .cs-card-icon { background: var(--color-accent); color: #fff; }
    .cs-card:hover:nth-child(2) .cs-card-icon { background: #6366f1; color: #fff; }
    .cs-card:hover:nth-child(3) .cs-card-icon { background: #10b981; color: #fff; }

    .cs-card-title {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-primary);
        line-height: var(--line-height-tight);
        margin-bottom: var(--space-2);
        padding-right: 80px;
    }
    .cs-card-body {
        padding: 0 var(--space-5) var(--space-5);
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    .cs-card-desc {
        font-size: var(--font-size-sm);
        color: var(--color-text-secondary);
        line-height: var(--line-height-relaxed);
        flex: 1;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .cs-card-footer {
        margin-top: var(--space-4);
        padding-top: var(--space-3);
        border-top: 1px solid var(--color-border);
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .cs-card-badge-row {
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .cs-card-status {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 3px 10px;
        background: rgba(16,185,129,0.08);
        color: #059669;
        border-radius: var(--radius-full);
        font-size: 11px;
        font-weight: var(--font-weight-semibold);
    }
    .cs-card-status i { font-size: 6px; animation: cs-pulse 2s infinite; }
    @keyframes cs-pulse { 0%,100%{opacity:1;} 50%{opacity:.3;} }
    .cs-card-cta {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-semibold);
        color: var(--color-accent);
        transition: gap 0.2s ease;
    }
    .cs-card:hover .cs-card-cta { gap: 10px; }
    .cs-card-cta i { font-size: 10px; transition: transform 0.2s ease; }
    .cs-card:hover .cs-card-cta i { transform: translateX(2px); }

    .cs-roadmap-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-semibold);
        color: var(--color-accent);
        text-decoration: none;
        white-space: nowrap;
        padding-bottom: 2px;
    }
    .cs-roadmap-link:hover { text-decoration: underline; }
    .cs-roadmap-link i { font-size: 10px; }

    @media (max-width: 1024px) {
        .cs-grid { grid-template-columns: 1fr 1fr; }
        .cs-grid .cs-card:nth-child(3) { grid-column: 1 / -1; max-width: 500px; margin: 0 auto; }
    }
    @media (max-width: 640px) {
        .cs-grid { grid-template-columns: 1fr; }
        .cs-grid .cs-card:nth-child(3) { max-width: none; }
        .cs-header { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
        .cs-card-title { padding-right: 0; }
        .cs-card-medal { position: static; margin-bottom: var(--space-2); }
    }

    /* ── 3. Industries We Cover ── */
    .industries-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: var(--space-6);
    }
    .industry-card {
        position: relative;
        display: flex;
        flex-direction: column;
        height: 300px;
        border-radius: var(--radius-lg);
        overflow: hidden;
        text-decoration: none;
        transition: box-shadow 0.25s ease;
    }
    .industry-card:hover {
        box-shadow: 0 4px 20px rgba(51,136,255,0.15);
    }
    /* Background image: fills entire card */
    .industry-card-bg {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        z-index: 0;
    }
    .industry-card-bg::after {
        content: '';
        position: absolute;
        inset: 0;
        background: var(--dark-bg-pattern);
        background-size: cover;
        opacity: 0.3;
        pointer-events: none;
    }
    /* Content panel: sits at bottom, slides up on hover */
    .industry-card-content {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 2;
        background: var(--color-dark-bg);
        opacity: 0.9;
        padding: var(--space-4) var(--space-5);
        transition: height 0.15s cubic-bezier(.4,0,.2,1), background 0.15s ease, opacity 0.15s ease;
        height: 80px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: var(--space-3);
    }
    .industry-card:hover .industry-card-content {
        height: calc(100% - 50px);
        background: #fff;
        opacity: 1;
    }
    /* Top row: icon + name/hint side by side */
    .industry-card-header {
        display: flex;
        align-items: center;
        gap: var(--space-3);
        flex-shrink: 0;
    }
    .industry-card-icon {
        width: 38px; height: 38px;
        border-radius: var(--radius-md);
        background: rgba(255,255,255,.15);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        color: #fff;
        flex-shrink: 0;
        transition: background 0.1s ease, color 0.1s ease;
    }
    .industry-card:hover .industry-card-icon {
        background: var(--color-accent-bg);
        color: var(--color-accent);
    }
    .industry-card-name {
        font-size: var(--font-size-lg);
        font-weight: var(--font-weight-bold);
        color: #fff;
        line-height: var(--line-height-tight);
        transition: color 0.1s ease;
    }
    .industry-card:hover .industry-card-name {
        color: var(--color-text-primary);
    }
    .industry-card-hint {
        font-size: var(--font-size-xs);
        color: rgba(255,255,255,.7);
        margin-top: 1px;
        transition: color 0.1s ease;
    }
    .industry-card:hover .industry-card-hint {
        color: var(--color-text-muted);
    }
    /* Description: revealed when panel slides up */
    .industry-card-desc {
        font-size: var(--font-size-sm);
        color: var(--color-text-secondary);
        line-height: var(--line-height-relaxed);
        opacity: 0;
        transition: opacity 0.1s ease 0.1s;
        display: -webkit-box;
        -webkit-line-clamp: 6;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .industry-card:hover .industry-card-desc {
        opacity: 1;
    }

    /* ── 4. Advantages ── */
    .advantages-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-6);
    }
    .advantage-item {
        text-align: center;
        padding: var(--space-5);
    }
    .advantage-icon {
        width: 80px; height: 80px;
        border-radius: 50%;
        border: 1px solid var(--color-border);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 30px;
        margin: 0 auto var(--space-4);
    }
    .advantage-icon i {
        background: var(--color-dark-bg);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .advantage-title {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-primary);
        margin-bottom: var(--space-2);
    }
    .advantage-desc {
        font-size: var(--font-size-sm);
        color: var(--color-text-secondary);
        line-height: var(--line-height-relaxed);
        max-width: 320px;
        margin: 0 auto;
    }
    .advantage-link {
        display: inline-block;
        margin-top: var(--space-3);
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-semibold);
        color: var(--color-accent);
        text-decoration: none;
    }
    .advantage-link:hover {
        text-decoration: underline;
    }

    /* Advantages section bg pattern (right-aligned, like dark-section) */
    .home-section--advantages {
        position: relative;
        overflow: hidden;
    }
    .home-section--advantages::before {
        content: '';
        position: absolute;
        top: 0; right: 0; bottom: 0;
        width: 55%;
        background-image: url("https://res.cloudinary.com/djeg1yyff/image/upload/f_auto,q_40,w_800/site/bg-pattern-dark.png");
        background-repeat: no-repeat;
        background-position: right center;
        background-size: contain;
        opacity: 0.06;
        z-index: 0;
        pointer-events: none;
    }
    .home-section--advantages > * {
        position: relative;
        z-index: 1;
    }

    /* ── 5. Logo carousel: styles in partials/logos-carousel.html ── */

    /* ── 1b. Frameworks strip ── */
    .fw-strip {
        background: var(--color-bg);
        border-bottom: 1px solid var(--color-border);
        padding: 20px 0;
    }
    .fw-strip-inner {
        max-width: var(--content-max-width);
        margin: 0 auto;
        padding: 0 var(--space-5);
        display: flex;
        align-items: center;
        gap: var(--space-6);
    }
    .fw-strip-label {
        font-size: var(--font-size-xs);
        font-weight: var(--font-weight-semibold);
        text-transform: uppercase;
        letter-spacing: 1px;
        color: var(--color-text-faint);
        white-space: nowrap;
        display: flex;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
    }
    .fw-strip-label i { font-size: 11px; color: var(--color-accent); }
    .fw-strip-grid {
        display: flex;
        align-items: center;
        gap: var(--space-3);
        flex-wrap: wrap;
    }
    .fw-strip-item {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 14px;
        border: 1px solid var(--color-border-strong);
        border-radius: var(--radius-full);
        background: var(--color-surface);
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-medium);
        color: var(--color-text-secondary);
        text-decoration: none;
        transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
        white-space: nowrap;
    }
    .fw-strip-item:hover {
        border-color: var(--color-accent);
        color: var(--color-accent);
        background: rgba(51,136,255,0.04);
    }
    .fw-strip-icon { font-size: 12px; color: var(--color-text-faint); transition: color 0.15s ease; }
    .fw-strip-item:hover .fw-strip-icon { color: var(--color-accent); }
    .fw-strip-name { font-size: var(--font-size-sm); }

    /* ── Responsive ── */
    @media (max-width: 768px) {
        .home-hero { padding: var(--space-8) var(--space-4); min-height: auto; text-align: center; }
        .home-hero-inner { grid-template-columns: 1fr; gap: var(--space-6); }
        .home-hero h1 { font-size: 42px; }
        .home-hero-sub { font-size: var(--font-size-base); margin-left: auto; margin-right: auto; }
        .home-hero-promo-col { justify-content: center; }
        .hero-promo { max-width: 380px; margin: 0 auto; text-align: left; }
        .advantages-grid { grid-template-columns: 1fr; gap: var(--space-4); }
        .home-section { padding: var(--space-8) var(--space-4); }
        .home-section-title { font-size: 24px; }
        .fw-strip-inner { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
        .fw-strip-label { font-size: 11px; }
        .fw-strip-grid { gap: var(--space-2); }
    }