/* MAKO Article Standard v1.2
 * Visual benchmark: post 5543 (焔天目チタン®).
 * Scoped to .mako-article so legacy content outside the standard is untouched.
 */
.mako-article {
  --mako-accent: #ae2947;
  --mako-accent-deep: #7f1730;
  --mako-text: #242424;
  --mako-muted: #6f6f6f;
  --mako-border: #dedede;
  --mako-soft: #f6f6f6;
  --mako-dark: #202020;
  --mako-hero: #17121e;
  --mako-green: #3e7b4a;
  --mako-green-border: #bfd3c2;
  --mako-green-soft: #f2f8f3;
  color: var(--mako-text);
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
  font-size: 16px;
  line-height: 1.9;
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  box-sizing: border-box;
  counter-reset: mako-section;
}
.mako-article *, .mako-article *::before, .mako-article *::after { box-sizing: border-box; }
.mako-article > *:first-child { margin-top: 0; }
.mako-article p { margin: 0 0 1.25em; }
.mako-article a { color: var(--mako-accent); text-underline-offset: 5px; }
.mako-article strong { font-weight: 700; }

/* Shared articles no longer use the large dark hero block.
 * Hide legacy .mako-hero markup so already-standardized posts lose the black
 * rectangle immediately without requiring an urgent content rewrite.
 */
.mako-hero,
.mako-hero__copy {
  display: none !important;
}

/* Introduction */
.mako-intro,
.mako-lead,
.mako-definition {
  margin: 0 0 48px;
  padding: 30px;
  border: 0;
  border-top: 3px solid var(--mako-accent);
  background: var(--mako-soft);
}
.mako-intro p:last-child,
.mako-lead p:last-child,
.mako-definition p:last-child { margin-bottom: 0; }

/* Contents */
.mako-toc {
  margin: 0 0 64px;
  padding: 28px;
  border: 1px solid var(--mako-border);
  background: #fff;
}
.mako-toc__title {
  margin: 0 0 18px !important;
  color: var(--mako-accent);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .18em;
}
.mako-toc__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 24px; }
.mako-toc__item {
  display: flex;
  gap: 12px;
  align-items: baseline;
  padding: 13px 4px;
  border-bottom: 1px solid var(--mako-border);
  color: var(--mako-text) !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  text-decoration: none;
}
.mako-toc__num { flex: 0 0 30px; color: var(--mako-accent); font-size: 12px; letter-spacing: .08em; }

/* Sections and headings. Strong specificity overrides old theme H2 blocks. */
.mako-section { margin: 0 0 68px; }
.entry-content .mako-article h2,
.mako-article h2 {
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 30px !important;
  padding: 0 0 14px 14px !important;
  border: 0 !important;
  border-left: 4px solid var(--mako-accent) !important;
  border-bottom: 1px solid var(--mako-border) !important;
  background: transparent !important;
  color: var(--mako-text) !important;
  font-size: clamp(22px, 4vw, 28px) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
}
.mako-section-heading { counter-increment: mako-section; }
.mako-section-index {
  display: block;
  flex: 0 0 30px;
  padding-top: .38em;
  color: var(--mako-accent);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: .12em;
}
/* Fallback for older standardized content that contains plain H2 elements. */
.mako-article h2:not(.mako-section-heading) { counter-increment: mako-section; }
.mako-article h2:not(.mako-section-heading)::before {
  content: counter(mako-section, decimal-leading-zero);
  display: block;
  flex: 0 0 30px;
  padding-top: .38em;
  color: var(--mako-accent);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: .12em;
}
.entry-content .mako-article h3,
.mako-article h3 {
  display: block;
  margin: 42px 0 18px !important;
  padding: 0 0 10px 14px !important;
  border: 0 !important;
  border-left: 3px solid var(--mako-accent) !important;
  border-bottom: 1px solid var(--mako-border) !important;
  background: transparent !important;
  color: var(--mako-text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
}
.entry-content .mako-article h4,
.mako-article h4 { margin: 1.5em 0 .7em; color: var(--mako-text); font-size: 17px; font-weight: 700; line-height: 1.55; }

/* Images / figures. Preserve intrinsic resolution; remove legacy floats. */
.mako-figure { margin: 34px 0 38px; padding: 0; }
.mako-article img,
.mako-article img.alignleft,
.mako-article img.alignright,
.mako-article img.aligncenter {
  float: none !important;
  display: block;
  max-width: 100%;
  height: auto;
  margin: 18px auto 22px !important;
}
.mako-figure img { margin: 0 auto !important; }
.mako-figure figcaption { margin-top: 10px; color: var(--mako-muted); font-size: 13px; line-height: 1.7; text-align: center; }

/* Emphasis blocks */
.mako-point,
.mako-note,
.mako-statement,
.mako-summary,
.mako-related,
.mako-cta { margin: 28px 0; padding: 28px; }
.mako-point { border: 1px solid var(--mako-border); border-left: 4px solid var(--mako-accent); background: var(--mako-soft); }
.mako-note { border: 1px solid var(--mako-border); background: var(--mako-soft); color: var(--mako-muted); }
.mako-statement {
  border-left: 5px solid var(--mako-accent);
  background: var(--mako-soft);
  color: var(--mako-accent-deep);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.8;
}
.mako-quote { margin: 0 0 68px; padding: 52px 34px; background: var(--mako-dark); color: #fff; }
.mako-quote blockquote { max-width: 880px; margin: 0 auto; padding: 0; border: 0; color: #fff; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 27px; line-height: 1.8; text-align: center; }
.mako-quote p:last-child, .mako-point p:last-child, .mako-note p:last-child, .mako-statement p:last-child, .mako-summary p:last-child, .mako-related p:last-child, .mako-cta p:last-child { margin-bottom: 0; }
.mako-eco { margin: 28px 0; padding: 28px; border: 1px solid var(--mako-green-border); border-left: 4px solid var(--mako-green); background: var(--mako-green-soft); }
.mako-inline-cta { display: inline-block; color: var(--mako-accent) !important; font-weight: 700; line-height: 1.6; text-decoration: underline; text-underline-offset: 5px; }

/* Feature/process cards */
.mako-grid,
.mako-feature-grid,
.mako-process { display: grid; gap: 16px; margin: 30px 0; }
.mako-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mako-grid--3,
.mako-feature-grid,
.mako-process { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mako-feature-card { padding: 24px 20px; border-top: 3px solid var(--mako-accent); background: var(--mako-soft); font-weight: 700; line-height: 1.75; }
.mako-feature-card__num { display: block; margin-bottom: 10px; color: var(--mako-accent); font-size: 21px; }
.mako-process-step { padding: 24px 16px; border: 1px solid var(--mako-border); background: #fff; text-align: center; }
.mako-process-icon { display: flex; width: 54px; height: 54px; align-items: center; justify-content: center; margin: 0 auto 12px; border-radius: 50%; background: var(--mako-accent); color: #fff; font-size: 18px; font-weight: 700; }

/* Tables */
.mako-table { width: 100%; margin: 0 0 30px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mako-table table { width: 100%; min-width: 620px; margin: 0; border: 0; border-collapse: collapse; border-spacing: 0; table-layout: fixed; background: #fff; font-size: 14px; }
.mako-table th,
.mako-table td { padding: 15px 16px; border: 1px solid var(--mako-border); line-height: 1.6; vertical-align: middle; }
.mako-table thead th { background: #3a3a3a; color: #fff; font-weight: 700; text-align: center; }
.mako-table thead th:nth-child(2) { background: var(--mako-accent); }
.mako-table tbody th { background: #f4f4f4; color: var(--mako-text); font-weight: 700; text-align: left; }
.mako-table tbody td { background: #fff; color: var(--mako-text); text-align: left; }

/* Specification blocks */
.mako-spec,
.mako-case__spec { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1.1em 0 1.5em; border-top: 3px solid var(--mako-accent); border-left: 1px solid var(--mako-border); }
.mako-spec > div,
.mako-case__spec > div { min-width: 0; border-right: 1px solid var(--mako-border); border-bottom: 1px solid var(--mako-border); }
.mako-spec dt,
.mako-case__spec dt { padding: 11px 13px; background: var(--mako-soft); color: var(--mako-muted); font-size: 13px; font-weight: 700; }
.mako-spec dd,
.mako-case__spec dd { margin: 0; padding: 13px; background: #fff; font-weight: 600; }

/* Case studies — benchmark-style visual cards. */
.mako-case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; margin: 30px 0 40px; }
.mako-case-card,
.mako-case { overflow: hidden; margin: 0; padding: 0; border: 1px solid var(--mako-border); background: #fff; }
.mako-case-card__media { display: block; overflow: hidden; }
.mako-case-card__media img { width: 100%; max-width: 100%; height: auto; margin: 0 !important; }
.mako-case-card__body,
.mako-case__body { padding: 28px; }
.mako-case-card__title,
.mako-case__title h3 {
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-bottom: 2px solid var(--mako-accent) !important;
  font-size: 20px !important;
  line-height: 1.55 !important;
}
.mako-case__title { display: block; margin: 0; padding: 28px 28px 0; }
.mako-case__label { display: inline-block; margin-bottom: 10px; padding: .25em .65em; background: var(--mako-accent); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.4; }
.mako-case-card__link { display: inline-block; color: var(--mako-accent) !important; font-weight: 700; line-height: 1.6; text-decoration: underline; text-underline-offset: 5px; }
.mako-case__spec { margin-left: 28px; margin-right: 28px; }
.mako-case__body h4 { padding-bottom: .35em; border-bottom: 1px solid var(--mako-border); }

/* FAQ / summary / related / CTA */
.mako-faq { margin: 30px 0 50px; }
.mako-faq__item { padding: 20px 0; border-bottom: 1px solid var(--mako-border); }
.mako-faq__question { position: relative; margin: 0 0 10px !important; padding: 0 0 10px 34px !important; border-left: 0 !important; }
.mako-faq__question::before { content: "Q"; position: absolute; left: 0; top: 0; color: var(--mako-accent); font-weight: 700; }
.mako-faq__answer { position: relative; padding-left: 34px; }
.mako-faq__answer::before { content: "A"; position: absolute; left: 0; top: 0; color: var(--mako-muted); font-weight: 700; }
.mako-summary { border-top: 3px solid var(--mako-accent); background: var(--mako-soft); }
.mako-related { border: 1px solid var(--mako-border); background: #fff; }
.mako-related__title { margin-bottom: 12px !important; color: var(--mako-accent); font-weight: 700; }
.mako-related__list { margin-bottom: 0 !important; }
.mako-cta { border: 1px solid var(--mako-border); border-top: 3px solid var(--mako-accent); background: var(--mako-soft); text-align: center; }

@media (max-width: 767px) {
  .mako-article { font-size: 15px; line-height: 1.85; }
  .mako-intro, .mako-lead, .mako-definition, .mako-toc, .mako-point, .mako-note, .mako-statement, .mako-summary, .mako-related, .mako-cta, .mako-eco { padding: 22px 20px; }
  .mako-toc__grid, .mako-grid--2, .mako-grid--3, .mako-feature-grid, .mako-process, .mako-case-grid, .mako-spec, .mako-case__spec { grid-template-columns: 1fr; }
  .mako-section { margin-bottom: 54px; }
  .entry-content .mako-article h2, .mako-article h2 { font-size: 22px !important; }
  .entry-content .mako-article h3, .mako-article h3 { font-size: 18px !important; }
  .mako-quote { padding: 38px 22px; }
  .mako-quote blockquote { font-size: 22px; }
  .mako-table table { min-width: 560px; }
  .mako-case-card__body, .mako-case__body { padding: 22px; }
  .mako-case__title { padding: 22px 22px 0; }
  .mako-case__spec { margin-left: 22px; margin-right: 22px; }
}