@charset "UTF-8";

/* =========================================================
   こころ物流 - contact.css（お問い合わせ）
   ========================================================= */

/* ---------- 優先1：公式LINE ---------- */
.ct-line {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding: 56px 40px;
  border-radius: var(--radius-lg);
  border: 4px solid #06c755;
  background: var(--white);
  box-shadow: 0 10px 0 rgba(6, 199, 85, .18);
  overflow: hidden;
  text-align: center;
}

@media (max-width: 767px) {
  .ct-line { padding: 40px 22px; }
}

.ct-line__rays {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 130vmax;
  height: 130vmax;
  translate: -50% -50%;
  background: repeating-conic-gradient(rgba(6, 199, 85, .07) 0 3deg, transparent 3deg 8deg);
  animation: spin 60s linear infinite;
  pointer-events: none;
}

.ct-line__inner { position: relative; }

.ct-line__badge {
  display: inline-block;
  padding: 6px 20px;
  border-radius: 999px;
  background: #06c755;
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .06em;
}

.ct-line__title {
  margin-top: 18px;
  font-size: clamp(24px, 4.4vw, 36px);
  font-weight: 700;
  line-height: 1.4;
}

.ct-line__text { margin-top: 16px; font-size: 15px; color: var(--ink-soft); }
.ct-line .btn { margin-top: 30px; min-width: min(360px, 100%); }
.ct-line__note { margin-top: 16px; font-size: 12px; color: var(--ink-soft); }

/* ---------- 優先2：電話 ---------- */
.ct-tel {
  max-width: 900px;
  margin: 40px auto 0;
  padding: 44px 32px;
  border-radius: var(--radius-lg);
  border: 2px solid var(--line);
  background: var(--white);
  box-shadow: var(--shadow-pop);
  text-align: center;
}

@media (max-width: 767px) {
  .ct-tel { padding: 32px 20px; }
}

.ct-tel__badge {
  display: inline-block;
  padding: 5px 18px;
  border-radius: 999px;
  background: var(--sky-tint);
  color: var(--sky-dark);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
}

.ct-tel__num {
  margin-top: 14px;
  font-size: clamp(32px, 6.4vw, 50px);
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.2;
  color: var(--pink);
}

.ct-tel__num a:hover { opacity: .75; }
.ct-tel__hours { margin-top: 8px; font-size: 13.5px; color: var(--ink-soft); }

.ct-tel__btns {
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}

.ct-tel__btns .btn { min-width: 210px; }
.ct-tel__note { margin-top: 20px; font-size: 12px; color: var(--ink-soft); }

/* コピー完了トースト */
.copy-toast {
  position: fixed;
  left: 50%;
  bottom: 40px;
  translate: -50% 20px;
  z-index: 950;
  padding: 12px 26px;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s, translate .3s var(--ease-pop);
}

.copy-toast.is-visible { opacity: 1; visibility: visible; translate: -50% 0; }

@media (max-width: 767px) {
  .copy-toast { bottom: 96px; }
}

/* ---------- ご案内 ---------- */
.ct-info {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 64px;
}

@media (max-width: 899px) {
  .ct-info { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
}

.ct-info__item { padding: 28px; }

.ct-info__item h3 {
  font-size: 18px;
  font-weight: 700;
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 3px solid var(--pink);
}

.ct-info__item:nth-child(2) h3 { border-bottom-color: var(--sky); }
.ct-info__item p { font-size: 14px; color: var(--ink-soft); }

.ct-info__link {
  display: inline-block;
  margin-top: 6px;
  color: var(--pink);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.ct-info__link:hover { opacity: .7; }
