/* Mobile Compact Comparison (모바일 한눈 비교) */
.translation-note {
  display: block;
  margin-top: 2px;
  color: #607181;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: -.01em;
}

@media (max-width: 640px) {
  .content-section {
    padding: 58px 0;
  }

  .page-two .wrap {
    padding: 66px 0;
  }

  .section-head,
  .two-head {
    gap: 18px;
    margin-bottom: 24px;
  }

  .section-head h2,
  .two-head h2 {
    font-size: clamp(2rem, 10vw, 2.45rem);
  }

  /* Four-card sections stay visible as a 2 x 2 comparison. */
  .benefits,
  .overview-grid,
  .price-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .benefit,
  .overview-card {
    min-width: 0;
    min-height: 0;
    padding: 15px 12px;
    border-radius: 15px;
  }

  .benefit b,
  .overview-card b {
    font-size: .64rem;
    letter-spacing: .08em;
  }

  .benefit h3,
  .overview-card h3 {
    margin: 16px 0 6px;
    font-size: .98rem;
    line-height: 1.3;
    word-break: keep-all;
  }

  .benefit p,
  .overview-card p {
    font-size: .78rem;
    line-height: 1.55;
  }

  .process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 16px;
  }

  .process-step {
    min-width: 0;
    min-height: 0;
    padding: 16px 13px;
    border-right: 1px solid #d9e4ec !important;
    border-bottom: 1px solid #d9e4ec !important;
  }

  .process-step:nth-child(2n) {
    border-right: 0 !important;
  }

  .process-step:nth-last-child(-n + 2) {
    border-bottom: 0 !important;
  }

  .process-step span {
    width: 31px;
    height: 31px;
    font-size: .7rem;
  }

  .process-step h3 {
    margin: 17px 0 6px;
    font-size: .98rem;
  }

  .process-step p {
    font-size: .78rem;
    line-height: 1.55;
  }

  /* Package cards: compact two-column layout matching the requested sketch. */
  .price-grid {
    align-items: stretch;
  }

  .price-card {
    min-width: 0;
    min-height: 0;
    padding: 15px 11px;
    border-radius: 15px;
  }

  .price-tag {
    min-height: 2.4em;
    font-size: .59rem;
    line-height: 1.25;
    letter-spacing: .07em;
    overflow-wrap: anywhere;
  }

  .price-card h3 {
    margin-top: 7px;
    font-size: 1.03rem;
  }

  .price {
    margin: 7px 0 3px;
    font-size: clamp(1.18rem, 5.7vw, 1.45rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  .price small {
    display: block;
    margin-top: 2px;
    font-size: .66rem;
  }

  .scope {
    min-height: 36px;
    font-size: .72rem;
    line-height: 1.4;
  }

  .price-card ul {
    margin: 10px 0;
  }

  .price-card li {
    padding: 5px 0;
    font-size: .72rem;
    line-height: 1.4;
    word-break: keep-all;
  }

  .recommend {
    padding-top: 9px;
  }

  .recommend b {
    margin-bottom: 4px;
    font-size: .65rem;
  }

  .recommend p {
    font-size: .71rem;
    line-height: 1.45;
  }

  .care-peek {
    align-items: flex-start;
    flex-direction: column;
    margin-top: 10px;
    padding: 8px;
    font-size: .67rem;
  }

  .care-peek b {
    font-size: .79rem;
  }

  /* Direct visual comparison for the employee cost section. */
  .cost-compare {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .cost-card,
  .system-card {
    min-width: 0;
    min-height: 0;
    padding: 18px 12px;
    border-radius: 17px;
  }

  .impact-label {
    font-size: .58rem;
    letter-spacing: .06em;
  }

  .cost-card h3,
  .system-card h3 {
    margin: 10px 0 8px;
    font-size: 1.05rem;
  }

  .work-shift {
    font-size: .76rem;
  }

  .cost-number {
    margin-top: 18px;
    font-size: clamp(1.15rem, 5.3vw, 1.4rem);
    white-space: nowrap;
  }

  .cost-note {
    font-size: .68rem;
    line-height: 1.5;
  }

  .ai-rules {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .ai-rules li {
    font-size: .69rem;
  }

  .value-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .value-item {
    padding: 16px 12px;
  }

  .value-item:last-child {
    grid-column: 1 / -1;
  }

  .value-item h3 {
    margin: 14px 0 5px;
    font-size: 1rem;
  }

  .value-item p {
    font-size: .78rem;
  }

  .brand-package {
    gap: 22px;
    padding: 22px 17px;
  }

  .brand-package h3 {
    font-size: 1.55rem;
  }

  .brand-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .brand-items span {
    min-width: 0;
    padding: 10px 9px;
    font-size: .73rem;
    line-height: 1.45;
    word-break: keep-all;
  }

  .translation-note {
    font-size: .64rem;
  }

  .care-services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .care-services li {
    padding: 10px 8px 10px 26px;
    font-size: .72rem;
    line-height: 1.4;
  }

  .care-services li::before {
    left: 9px;
  }
}

@media (max-width: 360px) {
  .price-card {
    padding: 13px 9px;
  }

  .cost-number {
    font-size: 1.08rem;
  }
}