/* industries.css —— 由模板内联样式外置，15 语种共用 */

    /* ==========================================================================

       Industries Page - Inline Styles (Protolabs-inspired layout)

       ========================================================================== */

    /* ---------- Hero ---------- */

    .ind-hero {

        position: relative;

        min-height: 560px;

        padding: 100px 0 80px;

        background: linear-gradient(160deg, #0b1929 0%, #122240 40%, #1a365d 100%);

        overflow: hidden;

    }

    .ind-hero::before {

        content: ''; position: absolute; top: -200px; right: -200px;

        width: 600px; height: 600px; border-radius: 50%;

        background: radial-gradient(circle, rgba(37,99,235,0.15) 0%, transparent 70%);

        pointer-events: none;

    }

    .ind-hero::after {

        content: ''; position: absolute; bottom: -100px; left: -100px;

        width: 400px; height: 400px; border-radius: 50%;

        background: radial-gradient(circle, rgba(16,185,129,0.08) 0%, transparent 70%);

        pointer-events: none;

    }

    .ind-hero-content {

        position: relative; z-index: 2; text-align: left;

        max-width: 100%; margin: 0;

    }

    .ind-hero-label {

        display: inline-flex; align-items: center; gap: 8px; padding: 8px 20px;

        border-radius: var(--radius-full); font-size: var(--font-size-sm);

        font-weight: 600; color: rgba(255,255,255,0.85);

        background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12);

        margin-bottom: 24px;

    }

    .ind-hero h1 {

        font-size: var(--font-size-6xl); font-weight: 900; color: var(--color-white);

        line-height: var(--line-height-tight); letter-spacing: -0.03em; margin-bottom: 20px;

    }

    .ind-hero-sub {

        font-size: var(--font-size-xl); color: rgba(255,255,255,0.75);

        max-width: 720px; margin: 0 0 36px; line-height: var(--line-height-relaxed);

    }

    .ind-hero-ctas {

        display: flex; gap: 16px; justify-content: flex-start; flex-wrap: wrap;

        margin-bottom: 40px;

    }

    .ind-hero-cert {

        display: inline-flex; align-items: center; gap: 10px;

        padding: 12px 24px; border-radius: var(--radius-full);

        background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15);

        text-decoration: none; transition: all var(--transition-normal);

    }

    .ind-hero-cert:hover { background: rgba(255,255,255,0.12); }

    .ind-hero-cert svg { flex-shrink: 0; color: rgba(255,255,255,0.9); }

    .ind-hero-cert-text {

        font-size: var(--font-size-sm); font-weight: 600;

        color: rgba(255,255,255,0.9); letter-spacing: 0.3px;

    }

    /* ---------- Client Logo Strip ---------- */

    .client-strip {

        padding: 56px 0;

        background: var(--color-white);

        border-bottom: 1px solid var(--color-gray-100);

    }

    .client-strip-title {

        text-align: center; font-size: var(--font-size-sm);

        font-weight: 700; color: var(--color-gray-400);

        text-transform: uppercase; letter-spacing: 2px; margin-bottom: 32px;

    }

    .client-logos-row {

        display: flex; align-items: center; justify-content: center;

        gap: 48px; flex-wrap: wrap;

    }

    .client-logo-item {

        height: 40px; min-width: 120px; max-width: 180px;

        display: flex; align-items: center; justify-content: center;

        opacity: 0.45; filter: grayscale(100%);

        transition: all var(--transition-normal);

    }

    .client-logo-item:hover { opacity: 0.75; filter: grayscale(0%); }

    .client-logo-item .logo-text {

        font-size: var(--font-size-lg); font-weight: 800;

        color: var(--color-gray-500); letter-spacing: -0.02em;

    }

    /* ---------- Industry Cards Grid ---------- */

    .ind-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }

    .ind-card {

        background: var(--color-white); border-radius: var(--radius-xl); overflow: hidden;

        border: 1px solid var(--color-gray-100); transition: all var(--transition-normal);

        text-decoration: none; color: inherit; display: block;

    }

    .ind-card:hover {

        transform: translateY(-6px); box-shadow: var(--shadow-xl);

        border-color: var(--color-gray-200);

    }

    .ind-card-img {

        aspect-ratio: 4/3; background: var(--color-gray-100);

        overflow: hidden; position: relative;

    }

    .ind-card-img img {

        width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;

    }

    .ind-card:hover .ind-card-img img { transform: scale(1.06); }

    .ind-card-body { padding: 24px; }

    .ind-card-body h3 {

        font-size: var(--font-size-lg); font-weight: 700; color: var(--color-gray-900); margin-bottom: 8px;

    }

    .ind-card-body p {

        font-size: var(--font-size-sm); color: var(--color-gray-500);

        line-height: var(--line-height-relaxed); margin-bottom: 16px;

        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;

    }

    .ind-card-link {

        display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-sm);

        font-weight: 600; color: var(--color-primary); text-decoration: none; transition: gap 0.2s ease;

    }

    .ind-card:hover .ind-card-link { gap: 10px; }

    /* ---------- How Companies Use ---------- */

    .how-use-section { padding: 100px 0; background: var(--color-gray-50); }

    .how-use-grid {

        display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;

        max-width: 1200px; margin: 0 auto;

    }

    .how-use-item {

        position: relative; padding: 36px 32px; border-radius: var(--radius-xl);

        background: var(--color-white); border: 1px solid var(--color-gray-200);

        transition: all var(--transition-normal);

    }

    .how-use-item:hover {

        transform: translateY(-4px); box-shadow: var(--shadow-lg);

        border-color: var(--color-primary-light);

    }

    .how-use-num {

        font-size: var(--font-size-3xl); font-weight: 900; color: var(--color-gray-100);

        line-height: 1; margin-bottom: 12px; letter-spacing: -0.02em;

    }

    .how-use-item h3 {

        font-size: var(--font-size-xl); font-weight: 700; color: var(--color-gray-900);

        margin-bottom: 12px;

    }

    .how-use-item p {

        font-size: var(--font-size-base); color: var(--color-gray-600);

        line-height: var(--line-height-relaxed); margin-bottom: 16px;

    }

    .how-use-link {

        display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-sm);

        font-weight: 600; color: var(--color-primary); text-decoration: none; transition: gap 0.2s ease;

    }

    .how-use-link:hover { gap: 10px; }

    /* ---------- Featured Services ---------- */

    .featured-section { padding: 100px 0; }

    .featured-grid {

        display: grid; grid-template-columns: 1fr 1fr; gap: 32px;

    }

    .featured-card {

        position: relative; border-radius: var(--radius-xl); overflow: hidden;

        background: var(--color-white); border: 1px solid var(--color-gray-200);

        text-decoration: none; color: inherit; display: flex; flex-direction: column;

        transition: all var(--transition-normal);

    }

    .featured-card:hover {

        transform: translateY(-6px); box-shadow: var(--shadow-xl);

        border-color: var(--color-gray-300);

    }

    .featured-card-img {

        aspect-ratio: 16/9; background: var(--color-gray-100); overflow: hidden; position: relative;

    }

    .featured-card-img img {

        width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;

    }

    .featured-card:hover .featured-card-img img { transform: scale(1.05); }

    .featured-card-body { padding: 32px; flex: 1; }

    .featured-card-badge {

        display: inline-block; padding: 4px 12px; border-radius: var(--radius-full);

        background: rgba(37,99,235,0.08); color: var(--color-primary);

        font-size: var(--font-size-xs); font-weight: 600; text-transform: uppercase;

        letter-spacing: 0.5px; margin-bottom: 12px;

    }

    .featured-card-body h3 {

        font-size: var(--font-size-2xl); font-weight: 800; color: var(--color-gray-900);

        margin-bottom: 12px; letter-spacing: -0.01em;

    }

    .featured-card-body p {

        font-size: var(--font-size-base); color: var(--color-gray-600);

        line-height: var(--line-height-relaxed); margin-bottom: 20px;

    }

    .featured-card-link {

        display: inline-flex; align-items: center; gap: 8px; font-size: var(--font-size-sm);

        font-weight: 700; color: var(--color-primary); text-decoration: none;

        text-transform: uppercase; letter-spacing: 0.5px; transition: gap 0.2s ease;

    }

    .featured-card:hover .featured-card-link { gap: 12px; }

    /* ---------- Additional Resources ---------- */

    .resources-section { padding: 100px 0; background: var(--color-gray-50); }

    .resources-grid {

        display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;

    }

    .resource-card {

        display: flex; flex-direction: column; padding: 36px 28px; border-radius: var(--radius-xl);

        background: var(--color-white); border: 1px solid var(--color-gray-200);

        text-decoration: none; color: inherit; transition: all var(--transition-normal);

        min-height: 240px;

    }

    .resource-card:hover {

        transform: translateY(-4px); box-shadow: var(--shadow-lg);

        border-color: var(--color-primary-light);

    }

    .resource-card-icon {

        width: 56px; height: 56px; border-radius: var(--radius-lg);

        background: linear-gradient(135deg, rgba(37,99,235,0.1) 0%, rgba(37,99,235,0.05) 100%);

        display: flex; align-items: center; justify-content: center;

        color: var(--color-primary); margin-bottom: 20px;

    }

    .resource-card-icon svg { width: 28px; height: 28px; }

    .resource-card h3 {

        font-size: var(--font-size-lg); font-weight: 700; color: var(--color-gray-900);

        margin-bottom: 10px;

    }

    .resource-card p {

        font-size: var(--font-size-sm); color: var(--color-gray-500);

        line-height: var(--line-height-relaxed); margin-bottom: 16px; flex: 1;

    }

    .resource-card-link {

        display: inline-flex; align-items: center; gap: 6px; font-size: var(--font-size-sm);

        font-weight: 600; color: var(--color-primary); transition: gap 0.2s ease;

    }

    .resource-card:hover .resource-card-link { gap: 10px; }

    /* ---------- FAQ Accordion ---------- */

    .faq-list { max-width: 860px; margin: 0 auto; }

    .faq-item { border-bottom: 1px solid var(--color-gray-200); }

    .faq-question {

        width: 100%; padding: 20px 0; background: none; border: none; cursor: pointer;

        display: flex; align-items: center; justify-content: space-between;

        font-size: var(--font-size-base); font-weight: 600; color: var(--color-gray-900);

        text-align: left; gap: 16px; font-family: var(--font-family);

    }

    .faq-question:hover { color: var(--color-primary); }

    .faq-question svg { flex-shrink: 0; transition: transform var(--transition-normal); }

    .faq-item.active .faq-question svg { transform: rotate(180deg); }

    .faq-answer { max-height: 0; overflow: hidden; transition: max-height var(--transition-normal); }

    .faq-item.active .faq-answer { max-height: 400px; }

    .faq-answer-inner {

        padding: 0 0 20px; font-size: var(--font-size-sm); color: var(--color-gray-600);

        line-height: var(--line-height-relaxed);

    }

    /* ---------- Bottom CTA ---------- */

    .ind-bottom-cta {

        padding: 100px 0;

        background: linear-gradient(160deg, #0b1929 0%, #122240 40%, #1a365d 100%);

        position: relative; overflow: hidden;

    }

    .ind-bottom-cta::before {

        content: ''; position: absolute; top: -200px; right: -100px;

        width: 500px; height: 500px; border-radius: 50%;

        background: radial-gradient(circle, rgba(37,99,235,0.12) 0%, transparent 70%);

        pointer-events: none;

    }

    /* ---------- Responsive ---------- */

    @media (max-width: 1024px) {

        .ind-cards-grid { grid-template-columns: repeat(2, 1fr); }

        .how-use-grid { grid-template-columns: repeat(2, 1fr); }

        .featured-grid { grid-template-columns: 1fr; }

        .resources-grid { grid-template-columns: repeat(2, 1fr); }

        .client-logos-row { gap: 32px; }

    }

    @media (max-width: 768px) {

        .ind-hero h1 { font-size: var(--font-size-4xl); }

        .ind-hero-sub { font-size: var(--font-size-base); }

        .ind-cards-grid { grid-template-columns: 1fr; }

        .how-use-grid { grid-template-columns: 1fr; }

        .resources-grid { grid-template-columns: 1fr; }

        .ind-hero { min-height: auto; padding: 64px 0 56px; }

        .how-use-section,

        .featured-section,

        .resources-section { padding: 64px 0; }

        .ind-bottom-cta { padding: 64px 0; }

        .client-logos-row { gap: 24px; }

        .client-logo-item { min-width: 100px; }

    }

    @media (max-width: 480px) {

        .ind-hero-cert-text { font-size: var(--font-size-xs); }

    }

/* ===== [STYLEATTR-FALLBACK-BEGIN] 由 _tools/_t_styleattr_responsive.js 生成，勿手改 =====
   原机制：protolabs-style.css 用 [style*="…"] 命中行内样式串做移动端降级；
   这些元素的内联样式外置后属性选择器不再命中，移动端会退回桌面尺寸。
   下面按类名重绘同样的降级，声明与 protolabs 逐字一致（含 !important）。 ===== */

@media (max-width: 768px) {
    .ind-cards-grid {
        grid-template-columns: 1fr !important;
    }
    .how-use-grid {
        grid-template-columns: 1fr !important;
    }
    .resources-grid {
        grid-template-columns: 1fr !important;
    }
    .featured-grid {
        grid-template-columns: 1fr !important;
    }
    .faq-question {
        flex-direction: column !important;
        gap: 24px !important;
    }
    .ind-hero {
        padding: 48px 0 !important;
    }
    .how-use-section {
        padding: 48px 0 !important;
    }
    .featured-section {
        padding: 48px 0 !important;
    }
    .resources-section {
        padding: 48px 0 !important;
    }
    .ind-bottom-cta {
        padding: 48px 0 !important;
    }
    .ind-hero-sub {
        font-size: var(--font-size-base) !important;
    }
    .how-use-item h3 {
        font-size: var(--font-size-base) !important;
    }
    .client-logos-row {
        gap: 24px !important;
    }
    .ind-card-img {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 480px) {
    .ind-cards-grid {
        grid-template-columns: 1fr !important;
    }
    .how-use-grid {
        grid-template-columns: 1fr !important;
    }
    .resources-grid {
        grid-template-columns: 1fr !important;
    }
    .featured-grid {
        grid-template-columns: 1fr !important;
    }
    .ind-card-body {
        padding: 16px !important;
    }
    .how-use-num {
        font-size: var(--font-size-2xl) !important;
    }
    .how-use-grid {
        gap: 16px !important;
    }
    .featured-grid {
        gap: 16px !important;
    }
    .client-logos-row {
        gap: 16px !important;
    }
}
.ind-card-img {
    aspect-ratio: 16 / 9 !important;
    width: 460px !important;
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
}
/* ===== [STYLEATTR-FALLBACK-END] ===== */