#page-hero.hero-section {
            height: 40vh;
        }

        #page-hero .hero-slide {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        #page-hero .hero-content {
            position: relative;
            left: auto;
            transform: none;
            top: 5vh;
        }

        #page-hero .hero-content h1 {
            font-size: 2.2rem;
        }

        #page-hero .hero-eyebrow {
            font-size: 0.85rem;
        }

        #page-hero .hero-desc {
            font-size: 1rem;
        }


        /* 게시글 제목 그라데이션 텍스트 */
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 2rem 2rem 0 2rem;
        }

        .post-title {
          font-size: 1.6rem;
          font-weight: 700;
          background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
          margin-bottom: 1rem;
        }
        .post-box {
          border: 1px solid var(--border-color);
          border-radius: 8px;
          background: #fafafa;
          padding: 2rem;
          box-shadow: 0 2px 6px rgba(0,0,0,0.03);
        }
        .post-meta {
          font-size: 0.9rem;
          color: #888;
          margin-bottom: 1.5rem;
          border-bottom: 1px solid #ddd;
          padding-bottom: 0.5rem;
        }
        .post-content {
          font-size: 1rem;
          line-height: 1.7;
          white-space: pre-line;
        }

        .post-content img {
          max-width: 100%;    /* 가로 폭을 부모에 맞춤 */
          height: auto;       /* 세로 비율 유지 */
          max-height: 100%;   /* 부모 높이를 넘지 않도록 */
          object-fit: contain; /* 비율 유지하면서 영역 내에 맞춤 */
          display: block;     /* inline-gap 제거 */
        }

        .bottom-box {
          display: flex;
          justify-content: center;
        }

        .back-button {
          display: inline-block;
          margin: 2.5rem 0;
          padding: 0.8rem 1.8rem;
          background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
          color: white;
          text-decoration: none;
          border-radius: 30px;
          font-weight: 600;

          /* button 기본 스타일 초기화 */
          border: none;          /* 테두리 제거 */
          outline: none;         /* 클릭 시 외곽선 제거 */
          cursor: pointer;       /* 마우스 커서 포인터로 변경 */
          font-family: inherit;  /* 폰트 통일 */
        }

            /* 반응형 디자인 */
            @media (max-width: 1024px) {
                .service-categories {
                    grid-template-columns: 1fr;
                }

                .process-steps {
                    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
                }

                .tech-categories {
                    grid-template-columns: 1fr;
                }

                 {
                    grid-template-columns: 1fr;
                }

                .post-box {
                  padding: 3rem 6rem;
                }

                .post-title {
                  font-size: 1.4rem;
                }

                .post-content {
                  font-size: 0.95rem;
                }
            }

            @media (max-width: 768px) {
                h2 {
                    font-size: 2.2rem;
                }

                section {
                    padding: 4rem 1rem;
                }

                .process-steps {
                    grid-template-columns: 1fr;
                }

                .post-box {
                  padding: 2rem 3rem;
                }

                .post-title {
                  font-size: 1.3rem;
                  text-align: center;
                }

                .post-meta {
                  font-size: 0.85rem;
                  text-align: center;
                }

                .post-content {
                  font-size: 0.9rem;
                }

                .back-button {
                  font-size: 0.95rem;
                  padding: 0.6rem 1.5rem;
                }
            }

            @media (max-width: 480px) {
                .service-category,
                .process-step {
                    padding: 2rem;
                }

                .process-step {
                    padding: 3rem 1.5rem 2rem 1.5rem;
                }

                .post-box {
                  padding: 1.5rem 1rem;
                }

                .post-title {
                  font-size: 1.2rem;
                }

                .post-meta, .post-content {
                  font-size: 0.85rem;
                }



                .back-button {
                  width: 100%;
                  text-align: center;
                  display: block;
                  padding: 0.8rem 0;
                }

                .bottom-box {
                  padding: 0 1rem;
                }
            }