/* Recruitment conversion redesign — keeps the existing Hug&Chill visual language. */

body.recruit-page {
  padding-bottom: 0;
}

/* Small section labels need the darker gold on light backgrounds (WCAG AA). */
#reasons .label,
#work .label,
#conditions .label,
#recruit-flow .label,
#recruit-faq .label,
#recruit-form .label {
  color: #765326;
}

#workday .label,
#recruit-book .label {
  color: var(--c-gold-p);
}

#workday .desc {
  color: var(--c-grey-l);
}

.scroll-txt-r {
  color: var(--c-gold);
}

#recruit-hero {
  min-height: 820px;
}

.recruit-hero-inner {
  width: min(1120px, calc(100% - 48px));
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(320px, .82fr);
  gap: clamp(48px, 7vw, 96px);
  align-items: center;
  text-align: left;
  padding-inline: 0;
}

.recruit-copy {
  padding-top: 20px;
}

.recruit-h1 {
  max-width: 720px;
  margin: 28px 0 22px;
  font-size: clamp(34px, 4.3vw, 54px);
  line-height: 1.48;
  letter-spacing: .06em;
}

.recruit-h1 .hero-line {
  display: block;
  white-space: nowrap;
}

.recruit-h1 .accent {
  color: var(--c-gold-p);
}

.recruit-sub {
  max-width: 610px;
  margin-bottom: 32px;
  line-height: 2;
}

.recruit-cta-row,
.recruit-badges {
  justify-content: flex-start;
}

.recruit-cta-row .btn-g {
  min-width: 244px;
}

.recruit-line-note {
  margin: 12px 0 0;
  color: var(--c-grey);
  font-size: 12px;
  letter-spacing: .08em;
}

.recruit-facts {
  position: relative;
  border-left: 1px solid rgba(201,169,110,.42);
  padding: 8px 0 8px clamp(28px, 4vw, 54px);
  opacity: 0;
  animation: rfu 1s ease forwards .75s;
}

.recruit-facts::before,
.recruit-facts::after {
  content: '';
  position: absolute;
  left: -3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--c-gold);
}

.recruit-facts::before { top: 0; }
.recruit-facts::after { bottom: 0; }

.facts-kicker {
  margin-bottom: 24px;
  color: var(--c-gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: .38em;
  text-transform: uppercase;
}

.fact-row {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 16px;
  align-items: baseline;
  padding: 16px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.fact-row:last-of-type { border-bottom: 0; }

.fact-row dt {
  color: var(--c-grey);
  font-size: 11px;
  letter-spacing: .18em;
}

.fact-row dd {
  color: var(--c-white);
  font-family: 'Noto Serif JP', serif;
  font-size: 15px;
  letter-spacing: .08em;
  line-height: 1.7;
}

.fact-row .pay {
  color: var(--c-gold-p);
  font-size: 22px;
}

.fact-caution {
  margin-top: 22px;
  color: var(--c-grey);
  font-size: 11px;
  line-height: 1.75;
}

/* A concrete workday, presented as a quiet timeline rather than another card grid. */
#workday { background: var(--c-navy); }

.workday-line {
  max-width: 880px;
  margin: 0 auto;
  counter-reset: workday;
}

.workday-item {
  counter-increment: workday;
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 34px;
  position: relative;
  padding: 0 0 38px;
}

.workday-item:last-child { padding-bottom: 0; }

.workday-item::before {
  content: counter(workday, decimal-leading-zero);
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(201,169,110,.5);
  border-radius: 50%;
  color: var(--c-gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 16px;
  position: relative;
  z-index: 1;
  background: var(--c-navy);
}

.workday-item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 26px;
  top: 54px;
  bottom: 0;
  width: 1px;
  background: rgba(201,169,110,.2);
}

.workday-copy {
  padding: 4px 0 0;
}

.workday-time {
  color: var(--c-gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  letter-spacing: .3em;
}

.workday-copy h3 {
  margin: 7px 0 7px;
  color: var(--c-white);
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .08em;
}

.workday-copy p {
  color: var(--c-grey-l);
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: .05em;
}

.pay-example {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 26px;
  align-items: center;
  margin: 0 0 34px;
  padding: 28px 32px;
  border-top: 1px solid rgba(201,169,110,.35);
  border-bottom: 1px solid rgba(201,169,110,.2);
}

.cond-grid > dl {
  display: flex;
  margin: 0;
}

.cond-grid .cond-item {
  width: 100%;
  height: 100%;
}

.pay-example h3 {
  margin-bottom: 7px;
  color: #765326;
  font-family: 'Noto Serif JP', serif;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: .08em;
}

.pay-example p {
  color: var(--page-copy, #3D5870);
  font-size: 13px;
  line-height: 1.8;
}

.pay-formula {
  color: var(--page-ink, #10294B);
  font-family: 'Noto Serif JP', serif;
  font-size: 16px;
  letter-spacing: .08em;
  white-space: nowrap;
}

.pay-formula strong {
  color: #8A642B;
  font-size: 28px;
  font-weight: 400;
}

.flow-note {
  max-width: 700px;
  margin: 34px auto 0;
  padding: 16px 20px;
  border: 1px solid rgba(201,169,110,.16);
  color: var(--c-grey-l);
  font-size: 12px;
  line-height: 1.8;
  text-align: center;
}

.form-choice {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  max-width: 720px;
  margin: 0 auto 30px;
  padding: 22px 24px;
  border: 1px solid var(--page-line, rgba(16,41,75,.16));
  background: rgba(255,255,255,.82);
  box-shadow: 0 16px 42px rgba(16,41,75,.055);
}

.form-choice strong {
  display: block;
  color: var(--page-ink, #10294B);
  font-family: 'Noto Serif JP', serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: .08em;
}

.form-choice p {
  margin-top: 5px;
  color: var(--page-copy, #3D5870);
  font-size: 12px;
  line-height: 1.7;
}

.form-choice .btn-o {
  padding: 12px 20px;
  white-space: nowrap;
  color: var(--page-ink, #10294B);
  border-color: rgba(16,41,75,.3);
}

.contact-group {
  padding: 20px;
  border: 1px solid var(--page-line, rgba(16,41,75,.16));
  background: rgba(223,241,247,.34);
}

.contact-heading {
  margin-bottom: 16px;
  color: var(--page-ink, #10294B);
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  letter-spacing: .1em;
}

.contact-error {
  display: none;
  margin-top: 12px;
  color: #e3a39f;
  font-size: 12px;
}

.contact-group.has-error {
  border-color: rgba(227,163,159,.65);
}

.contact-group.has-error .contact-error { display: block; }

.optional-fields {
  border-top: 1px solid var(--page-line, rgba(16,41,75,.16));
  border-bottom: 1px solid var(--page-line, rgba(16,41,75,.16));
  padding: 3px 0;
}

.optional-fields summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 2px;
  color: var(--page-copy, #3D5870);
  font-size: 13px;
  letter-spacing: .08em;
  cursor: pointer;
  list-style: none;
}

.optional-fields summary::-webkit-details-marker { display: none; }
.optional-fields summary::after { content: '＋'; color: var(--c-gold); }
.optional-fields[open] summary::after { content: '−'; }
.optional-fields-inner { display: grid; gap: 22px; padding: 8px 0 22px; }

.form-promise {
  display: flex;
  justify-content: center;
  gap: 22px;
  margin-bottom: 28px;
  color: var(--page-copy, #3D5870);
  font-size: 12px;
  letter-spacing: .06em;
}

.form-promise span::before {
  content: '✓';
  margin-right: 7px;
  color: var(--c-gold);
}

.submit-btn {
  background: var(--c-gold);
  color: var(--c-bg);
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .12em;
  text-transform: none;
}

.submit-btn:hover:not(:disabled) {
  background: var(--c-gold-p);
}

.recruit-mobile-cta {
  display: none;
}

@media (max-width: 960px) {
  #recruit-hero { min-height: auto; }

  .recruit-hero-inner {
    grid-template-columns: 1fr;
    gap: 46px;
    padding-top: 136px;
    padding-bottom: 110px;
  }

  .recruit-facts {
    max-width: 640px;
  }

  .recruit-scroll { display: none; }
}

@media (max-width: 640px) {
  body.recruit-page { padding-bottom: 76px; }

  .recruit-hero-inner {
    width: min(100% - 36px, 560px);
    padding-top: 118px;
    padding-bottom: 64px;
    gap: 38px;
  }

  .recruit-label { letter-spacing: .32em; }

  .recruit-h1 {
    margin: 22px 0 17px;
    font-size: clamp(25px, 7.2vw, 30px);
    line-height: 1.52;
    letter-spacing: .04em;
  }

  .recruit-sub {
    font-size: 13px;
    line-height: 1.9;
  }

  .recruit-cta-row {
    align-items: stretch;
    width: 100%;
  }

  .recruit-cta-row .btn-g,
  .recruit-cta-row .btn-o {
    width: 100%;
    justify-content: center;
  }

  .recruit-badges {
    justify-content: flex-start;
    gap: 10px 16px;
    margin-top: 28px;
  }

  .recruit-facts { padding-left: 22px; }
  .fact-row { grid-template-columns: 76px 1fr; gap: 10px; }

  .workday-item {
    grid-template-columns: 62px 1fr;
    gap: 16px;
  }

  .workday-item::before { width: 46px; height: 46px; }
  .workday-item:not(:last-child)::after { left: 22px; top: 46px; }

  .pay-example,
  .form-choice {
    grid-template-columns: 1fr;
    padding-inline: 20px;
  }

  .pay-formula { white-space: normal; }
  .form-choice .btn-o { justify-content: center; }
  .form-promise { flex-direction: column; gap: 8px; }

  .recruit-mobile-cta {
    position: fixed;
    z-index: 900;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 8px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(201,169,110,.24);
    background: rgba(5,12,24,.94);
    backdrop-filter: blur(16px);
  }

  .recruit-mobile-cta a {
    min-height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid var(--c-gold);
    border-radius: 3px;
    color: var(--c-bg);
    background: var(--c-gold);
    font-size: 13px;
    letter-spacing: .06em;
  }

  .recruit-mobile-cta a:last-child {
    color: var(--c-gold-p);
    background: transparent;
  }
}

@media (prefers-reduced-motion: reduce) {
  .recruit-label,
  .recruit-h1,
  .recruit-sub,
  .recruit-cta-row,
  .recruit-badges,
  .recruit-facts {
    opacity: 1;
    animation: none;
  }
}
