html { scroll-behavior: smooth; }
        body.homepage { background: #fff; color: #0f172a; }
        .home-shell { max-width: 1240px; margin: 0 auto; padding: 0 16px; }
        .hero { padding: 42px 0 20px; text-align: center; }
        .hero-pill { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: #f7f8ff; border: 1px solid transparent; box-shadow: 0 8px 30px rgba(2, 8, 23, 0.05); color: #0f172a; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 9px 18px; min-height: 38px; }
        .hero-pill svg, .feature-inline svg, .card-icon svg, .step-badge svg, .industry-item svg, .who-card svg { color: #0099ff; }
        .hero h1 { font-size: clamp(2.2rem, 5vw, 4.2rem); line-height: 1.08; font-weight: 900; letter-spacing: -0.03em; margin: 18px 0; color: #000; }
        .hero p.lead { font-size: clamp(1rem, 2vw, 1.45rem); line-height: 1.7; font-weight: 300; max-width: 860px; margin: 0 auto 28px; color: #111827; }
        .hero-cta { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; background: transparent; border: 0; color: #111827; font-size: 1rem; cursor: pointer; }
        .hero-cta .cta-icon { width: 30px; height: 30px; border-radius: 999px; background: #0099ff; display: inline-flex; align-items: center; justify-content: center; color: #fff; transition: transform .25s ease; }
        .hero-cta:hover .cta-icon { transform: scale(1.08); }
        .hero-cta .cta-text { position: relative; }
        .hero-cta .cta-text::after { content: ''; position: absolute; left: 0; right: 100%; bottom: -4px; height: 2px; background: #0099ff; transition: right .25s ease; }
        .hero-cta:hover .cta-text::after { right: 0; }
        .hero-features { display: flex; justify-content: center; gap: 28px; flex-wrap: wrap; margin-top: 14px; }
        .feature-inline { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #111827; }

        .section { padding: 68px 0 0; }
        .section-title { text-align: center; margin-bottom: 34px; }
        .section-title h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 900; line-height: 1.15; margin: 0 0 14px; color: #000; }
        .section-title p { font-size: clamp(1rem, 2vw, 1.3rem); line-height: 1.7; max-width: 840px; margin: 0 auto; font-weight: 300; color: #111827; }
        .section-title strong { font-weight: 700; }

        .cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
        .service-card { border: 1px solid #ddd; border-radius: 14px; background: #fff; min-height: 214px; padding: 22px; position: relative; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; overflow: hidden; }
        .service-card:hover { transform: translateY(-4px); border-color: #0099ff; box-shadow: 0 16px 40px rgba(0, 153, 255, 0.16); }
        .service-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,153,255,.05), rgba(0,119,204,.05)); opacity: 0; transition: opacity .25s ease; pointer-events: none; }
        .service-card:hover::after { opacity: 1; }
        .card-icon { width: 32px; height: 32px; margin-bottom: 16px; }
        .service-card h3 { margin: 0 0 12px; font-size: 1.06rem; line-height: 1.45; font-weight: 800; color: #111827; }
        .service-card p { margin: 0; font-size: .95rem; line-height: 1.6; font-weight: 300; color: #111827; }

        .steps-wrap { position: relative; }
        .steps-line { position: absolute; left: 0; right: 0; top: 30px; height: 2px; background: #e5e7eb; display: block; }
        .steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; position: relative; z-index: 1; }
        .step { text-align: center; }
        .step-number { width: 60px; height: 60px; border-radius: 50%; background: #0099ff; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; color: #fff; font-weight: 800; box-shadow: 0 10px 24px rgba(0,153,255,.25); }
        .step-badge { width: 52px; height: 52px; margin: 0 auto 18px; border-radius: 50%; border: 2px solid #eef2f7; background: #fff; display: flex; align-items: center; justify-content: center; transition: border-color .25s ease, transform .25s ease; }
        .step:hover .step-badge { border-color: #0099ff; transform: translateY(-2px); }
        .step h3 { margin: 0 0 10px; font-size: 1.2rem; font-weight: 800; }
        .step p { margin: 0; color: #475569; line-height: 1.65; }

        .industry-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px 24px; }
        .industry-item { display: flex; align-items: center; gap: 12px; padding: 8px 2px; font-size: clamp(1rem, 2vw, 1.28rem); color: #111827; }

        .who-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
        .who-card { background: #f0f8ff; border-radius: 14px; padding: 20px 18px; display: flex; align-items: center; gap: 14px; font-weight: 600; }

        .experience-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
        .experience-card h3 { margin: 0 0 12px; font-size: 1.25rem; font-weight: 800; }
        .experience-card p { margin: 0; font-size: 1.05rem; line-height: 1.8; font-weight: 300; color: #111827; }

        .faq-wrap { max-width: 920px; margin: 0 auto; display: grid; gap: 16px; }
        .faq-item { border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; transition: border-color .25s ease, box-shadow .25s ease; }
        .faq-item.open, .faq-item:hover { border-color: #0099ff; }
        .faq-question { width: 100%; border: 0; background: #fff; text-align: left; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; }
        .faq-question h3 { margin: 0; font-size: 1.06rem; font-weight: 700; color: #111827; }
        .faq-icon { color: #94a3b8; transition: transform .25s ease, color .25s ease; }
        .faq-item.open .faq-icon { transform: rotate(45deg); color: #0099ff; }
        .faq-answer { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .28s ease, opacity .28s ease; background: #f8fafc; }
        .faq-answer-inner { padding: 0 22px 20px; color: #334155; line-height: 1.7; }
        .faq-item.open .faq-answer { max-height: 260px; opacity: 1; }
        .faq-cta { text-align: center; margin-top: 26px; }
        .faq-cta p { color: #64748b; margin-bottom: 14px; }
        .btn-primary { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 22px; border-radius: 10px; border: 0; background: #0099ff; color: #fff; font-weight: 700; cursor: pointer; transition: background .25s ease; text-decoration: none; }
        .btn-primary:hover { background: #0077cc; }

        @media (max-width: 1024px) {
            .cards-grid, .industry-grid { grid-template-columns: repeat(2, 1fr); }
            .steps-grid { grid-template-columns: repeat(2, 1fr); }
            .steps-line { display: none; }
            .who-grid, .experience-grid { grid-template-columns: 1fr; }
        }
        @media (max-width: 720px) {
            .hero { padding-top: 28px; }
            .section { padding-top: 54px; }
            .cards-grid, .industry-grid, .steps-grid, .who-grid { grid-template-columns: 1fr; }
            .hero-features { gap: 10px 18px; flex-direction: column; align-items: center; }
            .service-card { min-height: auto; }
            .faq-question { padding: 18px; }
            .faq-answer-inner { padding: 0 18px 18px; }
        }