/* Hojokin Draft / Public Document Studio — stronger trustworthy color rhythm */

:root {
  --hd-paper: #f8fcff;
  --hd-paper-soft: #edf8ff;
  --hd-mint: #d9fff1;
  --hd-mint-strong: #9bf0d3;
  --hd-ink: #123f76;
  --hd-ink-soft: #537595;
  --hd-line: #a8d5e7;
  --hd-green: #0759c7;
  --hd-green-hover: #064aa8;
  --hd-clay: #ff765f;
  --hd-shadow: 0 26px 72px rgba(7, 89, 199, 0.16);
}

body.hojokin-page {
  background:
    linear-gradient(rgba(7, 89, 199, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 89, 199, 0.055) 1px, transparent 1px),
    var(--hd-paper);
  background-size: 42px 42px;
}

.hojokin-page ::selection {
  color: var(--hd-ink);
  background: #ffe36b;
}

.hd-notice {
  color: var(--hd-ink);
  background: #ffe36b;
  border-bottom: 1px solid var(--hd-ink);
  font-weight: 700;
}

.hd-header {
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 2px solid var(--hd-green);
  box-shadow: 0 8px 0 rgba(9, 196, 164, 0.08);
}

.hd-brand-mark {
  background: var(--hd-green);
  border-radius: 2px;
  box-shadow: 6px 6px 0 #9bf0d3;
}

.hojokin-page .hd-nav .hd-nav-cta,
.hd-button-primary {
  color: #ffffff;
  background: var(--hd-green);
  border-color: var(--hd-green);
  border-radius: 2px;
  box-shadow: 7px 7px 0 #9bf0d3;
}

.hojokin-page .hd-nav .hd-nav-cta:hover,
.hojokin-page .hd-nav .hd-nav-cta:focus-visible,
.hd-button-primary:hover,
.hd-button-primary:focus-visible {
  color: #ffffff;
  background: var(--hd-green-hover);
  transform: translate(-2px, -2px);
  box-shadow: 10px 10px 0 #9bf0d3;
}

.hd-button-secondary {
  color: var(--hd-ink);
  background: #ffffff;
  border: 2px solid var(--hd-green);
  border-radius: 2px;
}

.hd-hero {
  min-height: calc(100vh - 112px);
  padding-block: clamp(78px, 9vw, 130px);
  background:
    linear-gradient(116deg, rgba(255, 255, 255, 0.97) 0 53%, rgba(217, 255, 241, 0.82) 53% 77%, rgba(255, 227, 107, 0.42) 77% 100%);
}

.hd-hero::before {
  width: min(38vw, 550px);
  right: -7vw;
  top: -8%;
  border: 2px solid rgba(7, 89, 199, 0.42);
  border-radius: 0;
  background:
    linear-gradient(rgba(7, 89, 199, 0.13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 89, 199, 0.13) 1px, transparent 1px);
  background-size: 42px 42px;
  box-shadow:
    -38px 38px 0 rgba(9, 196, 164, 0.17),
    -76px 76px 0 rgba(255, 118, 95, 0.1);
  transform: rotate(8deg);
}

.hd-eyebrow,
.hd-kicker {
  color: var(--hd-green);
}

.hd-eyebrow::before,
.hd-kicker::before {
  height: 3px;
  background: var(--hd-clay);
}

.hd-hero h1 {
  color: var(--hd-ink);
  font-size: clamp(3.1rem, 6.1vw, 6.2rem);
  line-height: 1.06;
}

.hd-em {
  color: var(--hd-clay);
  text-shadow: 4px 4px 0 rgba(255, 227, 107, 0.68);
}

.hd-em::after {
  background: var(--hd-green);
  opacity: 0.8;
}

.hd-hero-lead {
  color: #365f83;
}

.hd-dossier {
  filter: drop-shadow(24px 26px 0 rgba(7, 89, 199, 0.14));
  transform: rotate(1.4deg);
}

.hd-document {
  border: 2px solid var(--hd-green);
  border-radius: 2px;
  background: #ffffff;
  box-shadow: none;
}

.hd-document::before {
  background: var(--hd-clay);
}

.hd-document::after {
  background: #9bf0d3;
}

.hd-document-top {
  color: #ffffff;
  background: var(--hd-green);
  border-bottom-color: var(--hd-green);
}

.hd-stamp {
  color: #ffffff;
  border-color: var(--hd-clay);
  background: var(--hd-clay);
}

.hd-document-row i {
  background: linear-gradient(90deg, #9bf0d3, #d9fff1);
}

.hd-document-note {
  color: var(--hd-ink);
  background: #ffe36b;
  border: 2px solid var(--hd-green);
  border-radius: 2px;
  box-shadow: 8px 8px 0 rgba(7, 89, 199, 0.12);
}

.hd-section-soft {
  background:
    linear-gradient(126deg, #d9f5ff 0 63%, #d9fff1 63% 100%);
}

.hd-section-warm {
  background:
    linear-gradient(118deg, #fff6bf 0 64%, #ffdcd4 64% 100%);
}

.hd-section-index {
  color: #ffffff;
  background: var(--hd-green);
  border-radius: 0;
}

.hd-concern,
.hd-flow-item,
.hd-role,
.hd-program,
.hd-price-card,
.hd-boundary,
.hd-legal {
  border: 2px solid var(--hd-green);
  border-radius: 2px;
  background: #ffffff;
  box-shadow: 10px 10px 0 rgba(7, 89, 199, 0.1);
}

.hd-concern:nth-child(2n),
.hd-flow-item:nth-child(2n),
.hd-program:nth-child(2n) {
  background: #e7fbff;
}

.hd-concern:nth-child(3n),
.hd-flow-item:nth-child(3n),
.hd-program:nth-child(3n) {
  background: #f5ffc7;
}

.hd-flow-no,
.hd-concern-no {
  color: #ffffff;
  background: var(--hd-green);
  border-radius: 0;
}

.hd-role:first-child {
  color: var(--hd-ink);
  background: #d9fff1;
}

.hd-role:last-child {
  color: var(--hd-ink);
  background: #d9f5ff;
}

.hd-program-type {
  color: var(--hd-ink);
  background: #ffe36b;
  border-radius: 0;
}

.hd-price-card-featured {
  color: #ffffff;
  background: var(--hd-green);
  box-shadow: 14px 14px 0 #9bf0d3;
}

.hd-price-card-featured .hd-price-label,
.hd-price-card-featured h3,
.hd-price-card-featured .hd-price,
.hd-price-card-featured .hd-checks {
  color: #ffffff;
}

.hd-contact {
  background: #d9fff1;
}

.hd-contact-card {
  color: #ffffff;
  border: 2px solid var(--hd-green);
  border-radius: 2px;
  background:
    linear-gradient(124deg, #0759c7 0 70%, #09c4a4 70%);
  box-shadow: 20px 20px 0 #ffe36b;
}

.hd-contact-card h2,
.hd-contact-card p {
  color: #ffffff;
}

.hd-contact-card::after {
  background: var(--hd-clay);
  border-radius: 0;
}

.hd-footer {
  background: var(--hd-green);
}

@media (max-width: 760px) {
  .hd-hero {
    min-height: auto;
    background:
      linear-gradient(158deg, #ffffff 0 60%, #d9f5ff 60% 84%, #fff6bf 84%);
  }

  .hd-hero h1 {
    font-size: clamp(3rem, 14.5vw, 5rem);
  }

  .hd-dossier {
    margin-top: 18px;
    filter: drop-shadow(12px 14px 0 rgba(7, 89, 199, 0.14));
    transform: none;
  }

  .hd-concern,
  .hd-flow-item,
  .hd-role,
  .hd-program,
  .hd-price-card,
  .hd-boundary,
  .hd-legal,
  .hd-contact-card {
    box-shadow: 7px 7px 0 rgba(7, 89, 199, 0.1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hd-dossier {
    transform: none;
  }
}

/* Refined palette — calm public-service credibility */
:root {
  --hd-paper: #f7f9f8;
  --hd-paper-soft: #eef3f2;
  --hd-mint: #e3eee9;
  --hd-mint-strong: #bfd8cd;
  --hd-ink: #344c61;
  --hd-ink-soft: #71808d;
  --hd-line: #cbd7da;
  --hd-green: #557887;
  --hd-green-hover: #456875;
  --hd-clay: #c77a68;
  --hd-shadow: 0 30px 82px rgba(53, 75, 91, 0.14);
}

body.hojokin-page {
  background:
    linear-gradient(rgba(85, 120, 135, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(85, 120, 135, 0.035) 1px, transparent 1px),
    var(--hd-paper);
  background-size: 56px 56px;
}

.hd-notice {
  background: #f0ead0;
  border-color: rgba(85, 120, 135, 0.32);
}

.hd-header {
  border-bottom: 1px solid rgba(85, 120, 135, 0.3);
  box-shadow: 0 14px 42px rgba(56, 77, 90, 0.07);
}

.hd-brand-mark,
.hojokin-page .hd-nav .hd-nav-cta,
.hd-button-primary {
  box-shadow: 0 13px 30px rgba(68, 100, 113, 0.2);
}

.hojokin-page .hd-nav .hd-nav-cta,
.hd-button-primary {
  border-radius: 999px;
}

.hd-button-secondary {
  border: 1px solid rgba(85, 120, 135, 0.4);
  border-radius: 999px;
}

.hd-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(191, 216, 205, 0.2), transparent 27rem),
    linear-gradient(116deg, rgba(255, 255, 255, 0.99) 0 55%, rgba(236, 243, 240, 0.92) 55% 80%, rgba(240, 234, 208, 0.42) 80%);
}

.hd-hero::before {
  border-color: rgba(85, 120, 135, 0.25);
  box-shadow: -30px 30px 0 rgba(191, 216, 205, 0.14);
  opacity: 0.7;
}

.hd-em {
  color: var(--hd-clay);
  text-shadow: none;
}

.hd-dossier {
  filter: drop-shadow(0 30px 42px rgba(54, 76, 91, 0.16));
}

.hd-document,
.hd-document-note,
.hd-concern,
.hd-flow-item,
.hd-role,
.hd-program,
.hd-price-card,
.hd-boundary,
.hd-legal,
.hd-contact-card {
  border-color: rgba(85, 120, 135, 0.4);
  border-radius: 18px;
  box-shadow: 0 26px 62px rgba(55, 76, 91, 0.11);
}

.hd-document-note,
.hd-program-type {
  background: #f0ead0;
}

.hd-section-soft {
  background:
    linear-gradient(126deg, rgba(239, 244, 244, 0.96), rgba(232, 239, 235, 0.9)),
    url("/assets/section-faq-archive-v1.webp");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.hd-section-warm {
  background: linear-gradient(118deg, #f3efdc 0 64%, #f1e5e1 64% 100%);
}

.hd-concern:nth-child(2n),
.hd-flow-item:nth-child(2n),
.hd-program:nth-child(2n),
.hd-concern:nth-child(3n),
.hd-flow-item:nth-child(3n),
.hd-program:nth-child(3n) {
  background: #f8f9f7;
}

.hd-role:first-child,
.hd-role:last-child {
  background: #edf2ef;
}

.hd-price-card-featured {
  background: #4f6e7b;
  box-shadow: 0 30px 70px rgba(52, 75, 87, 0.22);
}

.hd-contact {
  background: #e8efeb;
}

.hd-contact-card {
  background: linear-gradient(124deg, #536f7d 0 78%, #8baea2 78%);
}

.hd-contact-card::after {
  width: 7px;
}

.hd-footer {
  background: #4f6d7a;
}

@media (max-width: 760px) {
  .hd-hero {
    background:
      linear-gradient(158deg, rgba(255, 255, 255, 0.99) 0 62%, rgba(237, 243, 241, 0.94) 62% 87%, rgba(243, 239, 220, 0.86) 87%);
  }

  .hd-section-soft {
    background-attachment: scroll;
  }
}