/* ============================================================
   Contact — 掲載のご相談（Figma 49:4555 準拠）
   ============================================================ */

.page-contact {
  --ct-accent: #bd3a5d;
  background: var(--color-white);
}

.page-contact .header__cta {
  background: rgba(189, 58, 93, 0.06);
}

/* —— Page shell —— */
.ct-page {
  overflow: hidden;
}

.ct-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(0.625rem);
  pointer-events: none;
  z-index: 0;
}

/* —— Hero —— */
.ct-hero {
  position: relative;
  text-align: center;
  padding: 4rem 1.5rem 3.5rem;
  background: #fff;
  overflow: hidden;
}

.ct-hero__blob--1 {
  width: 10rem;
  height: 10rem;
  top: -1.25rem;
  left: 55%;
  background: #fee59b;
  opacity: 0.35;
}

.ct-hero__blob--2 {
  width: 8rem;
  height: 8rem;
  bottom: 2rem;
  left: 8%;
  background: #cab7f2;
  opacity: 0.28;
}

.ct-hero__blob--3 {
  width: 7rem;
  height: 7rem;
  top: 40%;
  right: 6%;
  background: #ade5d0;
  opacity: 0.32;
}

.ct-hero__inner {
  position: relative;
  z-index: 1;
  width: min(100%, 37.5rem);
  margin-inline: auto;
}

.ct-hero__label {
  font-family: var(--font-accent);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--ct-accent);
}

.ct-hero__title {
  margin-top: 1.25rem;
  font-family: var(--font-serif);
  font-size: clamp(2.25rem, 4.5vw, 3.25rem);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-heading);
}

.ct-hero__bar {
  width: 2.5rem;
  height: 0.125rem;
  margin: 1.25rem auto 0;
  background: var(--ct-accent);
}

.ct-hero__lead {
  margin-top: 1.75rem;
  font-size: 1rem;
  line-height: 2.1;
  color: var(--color-nav);
}

.ct-hero__sub {
  margin-top: 1rem;
  font-size: 0.9375rem;
  line-height: 2;
  color: var(--color-muted);
}

.ct-hero__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 2.75rem;
  padding: 0.875rem 2.25rem;
  background: var(--ct-accent);
  border-radius: var(--radius-pill);
  font-size: 0.875rem;
  font-weight: 700;
  color: #fff;
}

.ct-hero__btn .icon {
  width: 0.9375rem;
  height: 0.9375rem;
}

.ct-hero__btn:hover {
  opacity: 0.92;
}

/* —— Benefits —— */
.ct-benefits {
  position: relative;
  background: #fdf8f9;
  padding: 4.5rem 0 3.75rem;
  overflow: hidden;
}

.ct-benefits__why {
  position: absolute;
  top: -1.5rem;
  right: 8%;
  font-family: Caveat, cursive;
  font-size: 240px;
  font-style: normal;
  font-weight: 700;
  line-height: 240px;
  color: rgba(240, 230, 234, 0.65);
  pointer-events: none;
  z-index: 0;
  user-select: none;
}

.ct-benefits__blob {
  width: 10rem;
  height: 10rem;
  top: 1.25rem;
  right: 12%;
  background: #fee59b;
  opacity: 0.32;
}

.ct-benefits__inner {
  position: relative;
  z-index: 1;
  width: min(100% - 4rem, 65rem);
  margin-inline: auto;
}

.ct-benefits__label {
  font-family: var(--font-accent);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--ct-accent);
}

.ct-benefits__title {
  margin-top: 0.75rem;
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--color-heading);
}

.ct-benefits__list {
  margin-top: 2.75rem;
}

.ct-benefit {
  display: grid;
  grid-template-columns: 5.5rem minmax(10rem, 1fr) minmax(0, 26.75rem);
  gap: 1.5rem 2.5rem;
  align-items: center;
  padding: 2.25rem 0;
  border-top: 0.0625rem solid #ede6e8;
}

.ct-benefit:last-child {
  border-bottom: 0.0625rem solid #ede6e8;
}

.ct-benefit__num {
  font-family: var(--font-accent);
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
  opacity: 0.45;
}

.ct-benefit__num--1 {
  color: #bd3a5d;
}

.ct-benefit__num--2 {
  color: #fda887;
}

.ct-benefit__num--3 {
  color: #cab7f2;
}

.ct-benefit__title {
  font-family: var(--font-serif);
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-heading);
}

.ct-benefit__text {
  font-size: 0.875rem;
  line-height: 2.1;
  color: var(--color-nav);
}

/* —— Form section (full-bleed) —— */
.ct-form-sec {
  position: relative;
  background: #f5ebf0;
  padding: 4.5rem 1.5rem 4rem;
  overflow: hidden;
}

.ct-form-sec__blob--1 {
  width: 9.375rem;
  height: 9.375rem;
  top: -1.25rem;
  left: 58%;
  background: #fee59b;
  opacity: 0.39;
}

.ct-form-sec__blob--2 {
  width: 15rem;
  height: 15rem;
  bottom: 4rem;
  right: -2rem;
  background: #cab7f2;
  opacity: 0.26;
}

.ct-form-sec__blob--3 {
  width: 6.25rem;
  height: 6.25rem;
  bottom: 6rem;
  left: 38%;
  background: #ade5d0;
  opacity: 0.28;
}

.ct-form-sec__inner {
  position: relative;
  z-index: 1;
  width: min(100%, 37.5rem);
  margin-inline: auto;
}

.ct-form-sec__label {
  text-align: center;
  font-family: var(--font-accent);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--ct-accent);
}

.ct-form-sec__title {
  text-align: center;
  margin-top: 0.75rem;
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--color-heading);
}

.ct-form-sec__lead {
  text-align: center;
  margin-top: 1.25rem;
  font-size: 0.875rem;
  line-height: 2;
  color: var(--color-nav);
}

.ct-form {
  margin-top: 2.5rem;
  padding: 2.5rem 2.5rem;
  background: #fff;
  border-radius: 1.5rem;
  box-shadow: 0 0.25rem 1rem rgba(189, 58, 93, 0.08);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.ct-field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--color-heading);
  margin-bottom: 0.35rem;
  line-height: 1.4;
}

.ct-req {
  color: var(--ct-accent);
  font-weight: 700;
}

.ct-field__hint {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  color: var(--color-muted);
}

.ct-field input,
.ct-field textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 0.09375rem solid #ede6e8;
  border-radius: 0.75rem;
  background: #fdfafa;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--color-heading);
}

.ct-field input::placeholder,
.ct-field textarea::placeholder {
  color: rgba(39, 31, 36, 0.5);
}

.ct-field input:focus,
.ct-field textarea:focus {
  outline: none;
  border-color: var(--ct-accent);
}

.ct-field textarea {
  min-height: 9.8rem;
  resize: vertical;
}

.ct-field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.ct-cats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  grid-auto-rows: 1fr;
  align-items: stretch;
}

.ct-cat {
  position: relative;
  display: flex;
  height: 100%;
}

.ct-cat input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.ct-cat span {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  width: 100%;
  min-height: 3.5rem;
  padding: 0.75rem 1rem;
  border: 0.09375rem solid #ede6e8;
  border-radius: 0.75rem;
  background: #fdfafa;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--color-nav);
  cursor: pointer;
  box-sizing: border-box;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.ct-cat input:checked + span,
.ct-cat span:hover {
  border-color: var(--ct-accent);
  background: rgba(189, 58, 93, 0.06);
  color: var(--ct-accent);
  font-weight: 700;
}

.ct-consent {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: 0.8125rem;
  line-height: 1.75;
  color: var(--color-nav);
}

.ct-consent input {
  margin-top: 0.25rem;
  width: 1rem;
  height: 1rem;
  accent-color: var(--ct-accent);
  flex-shrink: 0;
}

.ct-consent a {
  color: var(--color-heading);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.ct-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 1rem;
  background: var(--ct-accent);
  border: 0;
  border-radius: var(--radius-pill);
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #fff;
  cursor: pointer;
}

.ct-submit .icon {
  width: 0.9375rem;
  height: 0.9375rem;
}

.ct-submit:hover {
  opacity: 0.92;
}

/* —— Contact Form 7 —— */
.wpcf7 .ct-form,
.ct-form--cf7 {
  margin-top: 2.5rem;
}

.wpcf7-form p {
  margin: 0;
}

.wpcf7-form .ct-field br,
.wpcf7-form .ct-field-row br,
.wpcf7-form .ct-cats br,
.wpcf7-form .ct-consent br {
  display: none;
}

.wpcf7-form .ct-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.wpcf7-form .ct-field > label {
  margin-bottom: 0;
}

.wpcf7-form .ct-field .wpcf7-form-control-wrap,
.wpcf7-form .ct-field-row .wpcf7-form-control-wrap {
  display: block;
  margin: 0;
}

.wpcf7-form .ct-field input.wpcf7-form-control:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.wpcf7-form .ct-field textarea.wpcf7-form-control {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 0.09375rem solid #ede6e8;
  border-radius: 0.75rem;
  background: #fdfafa;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--color-heading);
  box-sizing: border-box;
}

.wpcf7-form .ct-field input.wpcf7-form-control:focus,
.wpcf7-form .ct-field textarea.wpcf7-form-control:focus {
  outline: none;
  border-color: var(--ct-accent);
}

.wpcf7-form .ct-field textarea.wpcf7-form-control {
  min-height: 9.8rem;
  resize: vertical;
}

.wpcf7-form .ct-cats {
  grid-auto-rows: 1fr;
  align-items: stretch;
}

.wpcf7-form .ct-cats .wpcf7-form-control-wrap,
.wpcf7-form .ct-cats .wpcf7-radio {
  display: contents;
}

.wpcf7-form .ct-cats .wpcf7-list-item {
  display: flex;
  height: 100%;
  margin: 0;
}

.wpcf7-form .ct-cats .wpcf7-list-item label {
  display: flex;
  flex: 1;
  width: 100%;
  height: 100%;
  position: relative;
  cursor: pointer;
}

.wpcf7-form .ct-cats .wpcf7-list-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wpcf7-form .ct-cats .wpcf7-list-item-label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  width: 100%;
  min-height: 3.5rem;
  height: 100%;
  padding: 0.75rem 1rem;
  border: 0.09375rem solid #ede6e8;
  border-radius: 0.75rem;
  background: #fdfafa;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--color-nav);
  box-sizing: border-box;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.wpcf7-form .ct-cats .wpcf7-list-item input:checked + .wpcf7-list-item-label,
.wpcf7-form .ct-cats .wpcf7-list-item label:hover .wpcf7-list-item-label {
  border-color: var(--ct-accent);
  background: rgba(189, 58, 93, 0.06);
  color: var(--ct-accent);
  font-weight: 700;
}

.wpcf7-form .ct-consent .wpcf7-form-control-wrap,
.wpcf7-form .ct-consent .wpcf7-acceptance {
  display: contents;
}

.wpcf7-form .ct-consent label {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: 0.8125rem;
  line-height: 1.75;
  color: var(--color-nav);
  cursor: pointer;
}

.wpcf7-form .ct-consent input[type="checkbox"] {
  margin-top: 0.25rem;
  width: 1rem;
  height: 1rem;
  accent-color: var(--ct-accent);
  flex-shrink: 0;
}

.wpcf7-form input.wpcf7-submit.ct-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1rem;
  background: var(--ct-accent);
  border: 0;
  border-radius: var(--radius-pill);
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #fff;
  cursor: pointer;
}

.wpcf7-form input.wpcf7-submit.ct-submit:hover {
  opacity: 0.92;
}

.wpcf7-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.75rem;
  color: var(--ct-accent);
}

.wpcf7-form .wpcf7-response-output {
  margin: 1rem 0 0;
  padding: 0.875rem 1rem;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.6;
}

.wpcf7-form.sent .wpcf7-response-output {
  border-color: #2e7d4f;
  background: rgba(46, 125, 79, 0.06);
  color: #1b5e3a;
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output {
  border-color: var(--ct-accent);
  background: rgba(189, 58, 93, 0.06);
  color: var(--ct-accent);
}

.wpcf7-spinner {
  margin-left: 0.5rem;
}

/* —— FAQ (same pink band) —— */
.ct-faq {
  position: relative;
  z-index: 1;
  width: min(100%, 42.5rem);
  margin: 3.5rem auto 0;
}

.ct-faq__label {
  text-align: center;
  font-family: var(--font-accent);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--ct-accent);
}

.ct-faq__title {
  text-align: center;
  margin-top: 0.5rem;
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
}

.ct-faq__list {
  margin-top: 2.25rem;
  display: grid;
  gap: 0;
}

.ct-faq__item {
  border-top: 0.0625rem solid #f0e8ea;
  overflow-anchor: none;
}

.ct-faq__item:last-child {
  border-bottom: 0.0625rem solid #f0e8ea;
}

.ct-faq__q {
  width: 100%;
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) 2rem;
  gap: 0.875rem;
  align-items: start;
  padding: 1.1rem 0;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-family: var(--font-sans);
}

.ct-faq__q-mark,
.ct-faq__a-mark {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 1.125rem;
  font-family: var(--font-accent);
  font-size: var(--fs-15);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ct-faq__q-mark {
  background: var(--ct-accent);
  color: #fff;
}

.ct-faq__a-mark {
  background: #ede6e8;
  color: var(--color-muted);
}

.ct-faq__q-text {
  margin: 0;
  padding-top: 0.375rem;
  font-family: var(--font-serif);
  font-size: var(--fs-base);
  font-weight: 700;
  line-height: 1.65;
  color: var(--color-heading);
}

.ct-faq__icon {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  margin-top: 0.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 0.09375rem solid #ede6e8;
  border-radius: 1rem;
  transition: background 0.35s ease, border-color 0.35s ease;
}

.ct-faq__icon img {
  width: 0.9375rem;
  height: 0.9375rem;
  transition: transform 0.3s ease;
  will-change: transform;
}

.ct-faq__item.is-open .ct-faq__icon {
  background: rgba(189, 58, 93, 0.06);
  border-color: rgba(189, 58, 93, 0.25);
}

.ct-faq__item.is-open .ct-faq__icon img {
  transform: rotate(180deg);
}

/* Smooth expand: height animated in JS without scroll sync */
.ct-faq__panel {
  height: 0;
  overflow: hidden;
  overflow-anchor: none;
  transition: height 0.32s ease;
}

.ct-faq__a {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: 0.875rem;
  align-items: start;
  padding: 0.25rem 0 1rem;
}

.ct-faq__a-box {
  padding: 1rem 1.25rem;
  background: #fdfafa;
  border: 0.09375rem solid var(--color-border);
  border-radius: 1rem;
}

.ct-faq__a-box p {
  margin: 0;
  font-size: var(--fs-15);
  line-height: 1.9;
  color: var(--color-heading);
}

.ct-faq__foot {
  margin-top: 1.75rem;
  text-align: center;
}

.ct-faq__foot p {
  font-size: 0.875rem;
  color: var(--color-muted);
  margin-bottom: 1.25rem;
}

.ct-faq__foot a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.75rem;
  background: #fff;
  border: 0.09375rem solid var(--ct-accent);
  border-radius: var(--radius-pill);
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--ct-accent);
}

.ct-faq__foot a:hover {
  background: rgba(189, 58, 93, 0.04);
}

@media (max-width: 60rem) {
  .ct-benefits__why {
    font-size: 160px;
    line-height: 160px;
    right: 4%;
  }

  .ct-benefit {
    grid-template-columns: 4rem 1fr;
    gap: 0.75rem 1.25rem;
    padding: 2rem 0;
  }

  .ct-benefit__num {
    font-size: 3.5rem;
    grid-row: span 2;
    align-self: center;
  }

  .ct-benefit__text {
    grid-column: 2;
  }

  .ct-benefits__inner {
    width: min(100% - 2rem, 65rem);
  }
}

@media (max-width: 40rem) {
  .ct-benefits__why {
    font-size: 100px;
    line-height: 100px;
    top: -0.5rem;
  }

  .ct-hero {
    padding: 3.5rem 1.25rem 3rem;
  }

  .ct-hero__title {
    font-size: 1.5rem;
  }

  .ct-hero__lead {
    font-size: var(--fs-13);
    line-height: 1.8;
  }

  .ct-hero__sub {
    font-size: var(--fs-13);
    line-height: 1.8;
  }

  .ct-form {
    padding: 2rem 1.25rem;
  }

  .ct-field-row,
  .ct-cats {
    grid-template-columns: 1fr;
  }

  .ct-benefit {
    grid-template-columns: 1fr;
  }

  .ct-benefit__num {
    grid-row: auto;
    font-size: 3rem;
  }

  .ct-faq__q {
    gap: 0.75rem;
  }

  .ct-faq__q-text {
    font-size: var(--fs-15);
  }

  .ct-modal {
    width: min(90vw, 32rem);
    max-height: 85vh;
    padding: 2.25rem 1.75rem;
  }

  .ct-modal__head {
    margin-bottom: 1.5rem;
  }

  .ct-modal__body {
    max-height: calc(85vh - 8rem);
  }
}

/* —— Cookie policy modal —— */
.ct-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(90vw, 34rem);
  max-height: 80vh;
  margin: 0;
  padding: 2.75rem;
  border: none;
  border-radius: 1.5rem;
  box-shadow: 0 1rem 3rem rgba(39, 31, 36, 0.18);
}

.ct-modal::backdrop {
  background: rgba(39, 31, 36, 0.45);
}

.ct-modal__head {
  position: relative;
  margin-bottom: 1.75rem;
  padding-right: 2rem;
}

.ct-modal__title {
  font-family: var(--font-serif);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--color-heading);
}

.ct-modal__close {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  font-size: 1.5rem;
  line-height: 1;
  color: var(--color-muted);
  transition: color var(--ease);
}

.ct-modal__close:hover {
  color: var(--ct-accent);
}

.ct-modal__body {
  overflow-y: auto;
  max-height: calc(80vh - 9rem);
  padding-right: 0.5rem;
  font-size: 0.875rem;
  line-height: 2;
  color: var(--color-body);
}

.ct-modal__body p + p {
  margin-top: 1.25rem;
}

/* 本文は固定ページ（プライバシーポリシー）から読み込むため、
   ブロックエディタが出力する見出し・段落・リストをモーダル用に整える。 */
.ct-modal__body .ab-meta,
.ct-modal__body .ab-lead {
  font-size: 0.8125rem;
  color: var(--color-muted);
}

.ct-modal__body .ab-sec__label {
  margin-top: 1.75rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--ct-accent);
}

.ct-modal__body h2 {
  margin-top: 0.375rem;
  margin-bottom: 0.5rem;
  font-family: var(--font-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-heading);
}

.ct-modal__body ul {
  margin: 0.75rem 0 0;
  padding-left: 1.25rem;
  list-style: disc;
}

.ct-modal__body li + li {
  margin-top: 0.5rem;
}

.ct-modal__body ul + p {
  margin-top: 1.25rem;
}

.ct-modal__body a {
  color: var(--ct-accent);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.125rem;
}
