/* Public home page */
  .nav { display: flex; align-items: center; gap: 28px; font-size: 15px; }
  .nav a { color: var(--ink); text-decoration: none; }
  .nav a:hover { color: var(--cinnabar); }
  .nav .btn { color: #fff; padding: 8px 18px; }
  .wrap.wide { max-width: 1120px; }
  a.btn { text-decoration: none; }

  .hero2 { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: center; padding: 64px 0 56px; }
  .hero2 h1 { font-family: var(--serif); font-size: 42px; line-height: 1.25; margin: 0 0 16px; letter-spacing: 0.02em; }
  .hero2 h1 em { font-style: normal; color: var(--cinnabar); }
  .hero2 p { color: var(--stone); font-size: 17px; margin: 0 0 28px; max-width: 520px; }
  .hero2 .actions .btn.ghost { background: transparent; }

  .compare { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; box-shadow: 0 12px 32px rgba(30,27,24,0.06); }
  .compare .row { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0; border-bottom: 1px dashed var(--line); }
  .compare .row:last-child { border-bottom: none; }
  .compare .label { color: var(--stone); font-size: 14px; }
  .compare .old { text-decoration: line-through; color: var(--stone); font-size: 20px; }
  .compare .new { color: var(--cinnabar); font-size: 30px; font-weight: 700; }
  .compare .save { display: inline-block; background: #e9f3ee; color: var(--ok); border-radius: 999px; padding: 2px 12px; font-size: 14px; font-weight: 600; }
  .compare .route { font-family: var(--serif); font-size: 18px; font-weight: 700; margin-bottom: 4px; }
  .compare .thumbline { display: flex; gap: 10px; align-items: center; margin: 14px 0 6px; font-size: 13px; color: var(--stone); }
  .compare .shot { width: 44px; height: 60px; border-radius: 6px; border: 1px solid var(--line); background: linear-gradient(#f4ede2 0 22%, #fff 22% 30%, #eee6da 30% 36%, #fff 36% 50%, #eee6da 50% 56%, #fff 56%); }

  .section { padding: 56px 0; }
  .section h2.title { font-family: var(--serif); font-size: 30px; margin: 0 0 8px; text-align: center; }
  .section .sub { text-align: center; color: var(--stone); margin: 0 0 36px; }

  .services { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
  .svc { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 22px 18px; display: flex; flex-direction: column; transition: border-color .15s, transform .15s; }
  .svc:hover { border-color: var(--cinnabar); transform: translateY(-2px); }
  .svc .ico { width: 44px; height: 44px; border-radius: 10px; background: #f7e9e5; display: grid; place-items: center; margin-bottom: 14px; }
  .svc .ico svg { width: 24px; height: 24px; stroke: var(--cinnabar); fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .svc h3 { font-family: var(--serif); font-size: 19px; margin: 0; }
  .svc .en { font-size: 11px; letter-spacing: 0.12em; color: var(--stone); text-transform: uppercase; margin-bottom: 8px; }
  .svc p { font-size: 14px; color: var(--stone); margin: 0 0 16px; flex: 1; }
  .svc a { font-size: 14px; font-weight: 600; text-decoration: none; }

  .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .stepc { text-align: center; padding: 8px 16px; }
  .stepc .n { width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 6px; background: var(--cinnabar); color: #fff; display: grid; place-items: center; font-family: var(--serif); font-size: 20px; font-weight: 700; }
  .stepc h3 { margin: 0 0 6px; font-size: 18px; }
  .stepc p { margin: 0; color: var(--stone); font-size: 14px; }

  .band { background: var(--soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }



  @media (max-width: 900px) {
    .nav a:not(.btn) { display: none; }
    .hero2 { grid-template-columns: 1fr; padding: 32px 0; gap: 28px; }
    .hero2 h1 { font-size: 30px; }
    .services { grid-template-columns: 1fr 1fr; }
    .section { padding: 40px 0; }
    .section h2.title { font-size: 24px; }
  }
  @media (max-width: 480px) { .services { grid-template-columns: 1fr; } }
  .cta-card { text-align: center; padding: 40px 24px; }
  .cta-card .btn { margin-top: 8px; }
