:root {
  --ot-canvas: #FFFFFF;
  --ot-surface: #F7F8F6;
  --ot-text: #202622;
  --ot-muted: #5F6962;
  --ot-primary: #2F6B57;
  --ot-interaction: #255443;
  --ot-accent: #B45309;
  --ot-border: #D8DED9;
  --ot-green-dark: #183F33;
  --ot-green-surface: #EEF6F1;
  --ot-neutral: #F4F5F3;
  --ot-orange-surface: #FFF7ED;
  --ot-radius-sm: 10px;
  --ot-radius: 16px;
  --ot-radius-lg: 24px;
  --ot-shadow: 0 10px 30px rgba(31, 63, 50, .08);
  --ot-shadow-hover: 0 14px 34px rgba(31, 63, 50, .13);
  --ot-space-1: 8px;
  --ot-space-2: 16px;
  --ot-space-3: 24px;
  --ot-space-4: 36px;
  --ot-space-5: 56px;
  --ot-font: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
}

body {
  background: var(--ot-neutral);
  color: var(--ot-text);
  font-family: var(--ot-font);
  font-size: 16px;
  line-height: 1.75;
}

.header-container { background: rgba(255, 255, 255, .98); border-bottom: 1px solid var(--ot-border); }
.header-container-in { margin: 0 auto; max-width: 1160px; }
.header { background: transparent; }
.header-in { min-height: 72px; }
.tagline { color: var(--ot-muted); font-size: 12px; letter-spacing: .02em; line-height: 1.5; margin: 0; padding: 4px 12px 0; text-align: left; }
.logo-header { margin: 0; padding: 2px 12px 10px; }
.logo-header .site-name-text { color: var(--ot-green-dark); font-family: var(--ot-font); font-size: 23px; font-weight: 750; letter-spacing: -.02em; }
.site-name-text-link { text-decoration: none; }
.navi { background: transparent; }
.navi-in > ul { display: flex; flex-wrap: nowrap; justify-content: flex-end; }
.navi-in > ul > li { flex: 0 1 auto; width: auto; }
.navi-in a { color: var(--ot-text); font-size: 14px; font-weight: 600; min-height: 44px; padding: 8px 12px; white-space: nowrap; }
.navi-in a:hover { background: var(--ot-green-surface); color: var(--ot-interaction); }
.footer { background: var(--ot-green-dark); border-top: 0; color: #FFFFFF; }
.footer a, .footer .copyright { color: #FFFFFF; }
.navi-footer-in > ul { display: flex; flex-wrap: wrap; justify-content: center; }
.navi-footer-in > ul > li { border: 0; }
.navi-footer-in a { align-items: center; display: inline-flex; min-height: 44px; padding: 8px 12px; }

.content-in { max-width: 1160px; }
#main { background: transparent; border: 0; padding: 0; }

/* Reader-first treatment for Phase 1 article drafts. */
body.single-post.wp-child-theme-cocoon-child-master { background: #FFFFFF; }
body.single-post.wp-child-theme-cocoon-child-master #main {
  background: #FFFFFF;
  color: var(--ot-text);
  padding: clamp(20px, 4vw, 46px);
}
body.single-post.wp-child-theme-cocoon-child-master .entry-title,
body.single-post.wp-child-theme-cocoon-child-master .entry-content h2,
body.single-post.wp-child-theme-cocoon-child-master .entry-content h3 {
  color: var(--ot-text);
  font-family: var(--ot-font);
  letter-spacing: -.02em;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content {
  color: var(--ot-text);
  font-family: var(--ot-font);
  line-height: 1.8;
  overflow-wrap: anywhere;
}
body.ot-first-five-article .entry-content > p,
body.ot-first-five-article .entry-content > ul,
body.ot-first-five-article .entry-content > ol { margin-bottom: 1.2em; }
body.ot-first-five-article .sns-share.ss-top,
body.ot-first-five-article .mobile-footer-menu-buttons { display: none !important; }
body.ot-first-five-article .article-footer,
body.ot-first-five-article .under-entry-content,
body.ot-first-five-article .breadcrumb,
body.ot-first-five-article #sidebar { display: none !important; }
body.ot-first-five-article #main { margin-inline: auto; max-width: 960px; width: 100%; }
body.ot-first-five-article .entry-content a {
  align-items: center;
  display: inline-flex;
  min-height: 44px;
  min-width: 44px;
  padding-block: 8px;
}
body.ot-first-five-article .entry-content .toc {
  background: var(--ot-neutral);
  border: 1px solid var(--ot-border);
  border-radius: var(--ot-radius-sm);
  margin: 26px 0 34px;
  max-width: 100%;
  padding: 18px 20px;
  text-align: left;
  width: 100%;
}
body.ot-first-five-article .entry-content .toc-title {
  color: var(--ot-green-dark);
  display: block;
  font-size: 18px;
  font-weight: 750;
  letter-spacing: .02em;
  min-height: 44px;
  padding: 8px 2px;
}
body.ot-first-five-article .entry-content .toc-title::after { content: "[開く]"; }
body.ot-first-five-article .entry-content .toc-checkbox:checked + .toc-title::after { content: "[閉じる]"; }
body.ot-first-five-article .entry-content .toc-list { margin: 8px 0 0; }
body.ot-first-five-article .entry-content .toc-list li { margin-block: 4px; }
body.ot-first-five-article .entry-content .toc-list a {
  display: inline-flex;
  line-height: 1.55;
  min-height: 44px;
  padding-block: 8px;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content h2 {
  background: var(--ot-neutral);
  border: 0;
  border-left: 4px solid var(--ot-primary);
  border-radius: 0;
  font-size: clamp(23px, 3vw, 29px);
  margin: 42px 0 18px;
  padding: 14px 16px;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content h3 {
  background: transparent;
  border: 0;
  border-bottom: 2px solid var(--ot-border);
  font-size: 20px;
  margin: 30px 0 14px;
  padding: 0 0 8px;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content a {
  color: var(--ot-interaction);
  text-decoration: underline;
  text-decoration-thickness: .08em;
  text-underline-offset: .16em;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content table {
  background: #FFFFFF;
  border: 1px solid var(--ot-border);
  border-collapse: collapse;
  display: block;
  font-size: 15px;
  margin: 18px 0 26px;
  max-width: 100%;
  overflow-x: auto;
  width: max-content;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content th,
body.single-post.wp-child-theme-cocoon-child-master .entry-content td {
  background: #FFFFFF;
  border: 1px solid var(--ot-border);
  color: var(--ot-text);
  min-width: 148px;
  padding: 11px 12px;
  text-align: left;
  vertical-align: top;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content thead th {
  background: var(--ot-neutral);
  color: var(--ot-text);
  font-weight: 750;
}
body.ot-first-five-article .entry-content tbody tr:nth-child(even) td { background: #FAFBFA; }
body.ot-first-five-article .entry-content table:focus-visible {
  outline: 3px solid var(--ot-accent);
  outline-offset: 3px;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content blockquote {
  background: var(--ot-neutral);
  border: 0;
  border-left: 4px solid var(--ot-primary);
  color: var(--ot-text);
  margin: 22px 0;
  padding: 16px 18px;
}
body.single-post.wp-child-theme-cocoon-child-master .entry-content strong {
  color: var(--ot-text);
}
body.ot-first-five-article .ot-service-review {
  background: #FFFFFF;
  border: 1px solid var(--ot-border);
  border-radius: var(--ot-radius);
  box-shadow: 0 5px 16px rgba(31, 63, 50, .045);
  margin: 30px 0;
  padding: clamp(18px, 3vw, 28px);
}
body.ot-first-five-article .entry-content .ot-service-review > h2 {
  background: transparent;
  border-left-color: var(--ot-primary);
  margin: 0 0 18px;
  padding-block: 6px;
}
body.ot-first-five-article .ot-decision-label {
  align-items: center;
  background: var(--ot-green-surface);
  border-left: 4px solid var(--ot-primary);
  color: var(--ot-green-dark);
  display: flex;
  margin: 20px 0 8px !important;
  min-height: 42px;
  padding: 8px 12px;
}
body.ot-first-five-article .ot-decision-label--strength { background: var(--ot-neutral); }
body.ot-first-five-article .ot-decision-label--caution {
  background: var(--ot-orange-surface);
  border-left-color: var(--ot-accent);
}
body.ot-first-five-article .ot-shared-notice {
  background: var(--ot-neutral);
  border-left: 4px solid var(--ot-primary);
  border-radius: 0 var(--ot-radius-sm) var(--ot-radius-sm) 0;
  color: var(--ot-text);
  margin: 22px 0 30px !important;
  padding: 14px 16px;
}
body.ot-first-five-article .ot-no-affiliate-disclosure,
body.ot-first-five-article .ot-next-step-section {
  background: var(--ot-neutral);
  border: 1px solid var(--ot-border);
  border-radius: var(--ot-radius-sm);
  margin: 30px 0;
  padding: 18px 20px;
}
body.ot-first-five-article .entry-content .ot-no-affiliate-disclosure > h2,
body.ot-first-five-article .entry-content .ot-next-step-section > h2 {
  background: transparent;
  border-left-width: 3px;
  font-size: 22px;
  margin: 0 0 10px;
  padding: 4px 10px;
}
body.ot-first-five-article .ot-no-affiliate-disclosure p,
body.ot-first-five-article .ot-next-step-section p { margin-bottom: 0; }
body.ot-first-five-article .ot-official-source-list {
  border-top: 1px solid var(--ot-border);
  color: var(--ot-muted);
  font-size: 14px;
  padding-top: 14px;
}
body.ot-first-five-article .entry-content a:focus-visible,
body.ot-first-five-article .toc-checkbox:focus-visible + .toc-title {
  outline: 3px solid var(--ot-accent);
  outline-offset: 3px;
}
.ot-page, .ot-page * { box-sizing: border-box; }
.ot-page { color: var(--ot-text); margin: 0 auto; max-width: 1160px; padding: 28px 20px 72px; }
.ot-page h1, .ot-page h2, .ot-page h3 { color: var(--ot-text); font-family: var(--ot-font); letter-spacing: -.025em; }
.ot-page h1 { font-size: clamp(34px, 5vw, 54px); line-height: 1.16; margin: 10px 0 18px; }
.ot-page h2 { font-size: clamp(25px, 3vw, 34px); line-height: 1.3; margin: 0 0 16px; }
.ot-page h3 { font-size: 20px; line-height: 1.4; margin: 0; }
.ot-page p { margin: 0 0 16px; }
.ot-eyebrow { color: var(--ot-primary); font-size: 13px; font-weight: 750; letter-spacing: .08em; margin: 0; text-transform: none; }
.ot-supporting { color: var(--ot-muted); font-size: 13px; line-height: 1.65; }

.ot-hero { align-items: center; background: var(--ot-green-surface); border: 1px solid #DCEBE2; border-radius: var(--ot-radius-lg); display: grid; gap: 24px 32px; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .55fr); margin-bottom: 22px; max-width: none; overflow: hidden; padding: clamp(30px, 5vw, 58px); position: relative; }
.ot-hero::after { background: var(--ot-primary); border-radius: 50%; content: ""; height: 240px; opacity: .08; position: absolute; right: -100px; top: -120px; width: 240px; }
.ot-hero__copy { grid-column: 1; max-width: 710px; position: relative; z-index: 1; }
.ot-hero p:not(.ot-eyebrow) { color: var(--ot-muted); font-size: 17px; max-width: 650px; }
.ot-hero__trust { display: flex; flex-wrap: wrap; gap: 8px 18px; list-style: none; margin: 22px 0 0; padding: 0; }
.ot-hero__trust li { align-items: center; color: var(--ot-green-dark); display: inline-flex; font-size: 13px; font-weight: 700; gap: 7px; }
.ot-hero__trust li::before { align-items: center; background: var(--ot-primary); border-radius: 50%; color: #FFFFFF; content: "✓"; display: inline-flex; font-size: 10px; height: 20px; justify-content: center; width: 20px; }
.ot-hero__note { background: #FFFFFF; border-left: 4px solid var(--ot-accent); border-radius: var(--ot-radius-sm); box-shadow: var(--ot-shadow); grid-column: 1; margin: 0 !important; max-width: 620px; padding: 16px 18px; position: relative; z-index: 1; }
.ot-hero__note strong, .ot-hero__note span { display: block; }
.ot-hero__note strong { color: var(--ot-text); font-size: 16px; }
.ot-hero__note span { color: var(--ot-muted); font-size: 13px; margin-top: 3px; }
.ot-page-visual { line-height: 0; margin: 0; overflow: hidden; position: relative; z-index: 1; }
.ot-page-visual img { display: block; height: auto; max-width: 100%; object-fit: cover; width: 100%; }
.ot-page-visual--top { aspect-ratio: 4 / 3; border: 1px solid rgba(47, 107, 87, .16); border-radius: var(--ot-radius); box-shadow: var(--ot-shadow); grid-column: 2; grid-row: 1 / span 2; justify-self: end; max-width: 360px; width: 100%; }
.ot-page-visual--top img { aspect-ratio: 4 / 3; }

.ot-section { border: 0; margin-top: 22px; padding: var(--ot-space-5) clamp(20px, 4vw, 46px); }
.ot-section:nth-of-type(even):not(.ot-surface):not(.ot-diagnosis-entry) { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius-lg); }
.ot-surface { background: var(--ot-green-surface); border: 1px solid #DCEBE2; border-radius: var(--ot-radius-lg); margin-inline: 0; }
.ot-section-heading { align-items: flex-start; display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; }
.ot-badge, .ot-dev-badge { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 999px; color: var(--ot-primary); display: inline-flex; font-size: 12px; font-weight: 750; letter-spacing: .04em; padding: 5px 11px; }

.ot-tool-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ot-tool-card { align-items: center; background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); box-shadow: 0 6px 18px rgba(31, 63, 50, .05); color: var(--ot-text); display: grid; gap: 14px; grid-template-columns: 44px minmax(0, 1fr) auto; min-height: 116px; padding: 20px; text-decoration: none; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.ot-tool-card__icon { align-items: center; background: var(--ot-green-surface); border-radius: 12px; color: var(--ot-primary); display: inline-flex; font-size: 19px; font-weight: 800; height: 44px; justify-content: center; width: 44px; }
.ot-tool-card__copy { display: flex; flex-direction: column; min-width: 0; }
.ot-tool-card__copy strong { font-size: 18px; line-height: 1.4; }
.ot-tool-card small { color: var(--ot-muted); font-size: 13px; margin-top: 4px; }
.ot-tool-card__arrow { color: var(--ot-primary); font-size: 20px; }
.ot-tool-card--diagnostic { border-color: #F5C894; }
.ot-tool-card--diagnostic .ot-tool-card__icon { background: var(--ot-orange-surface); color: var(--ot-accent); }
.ot-tool-card:hover { border-color: var(--ot-primary); box-shadow: var(--ot-shadow-hover); color: var(--ot-interaction); transform: translateY(-2px); }

.ot-business-list, .ot-link-row { display: flex; flex-wrap: wrap; gap: 10px; }
.ot-business-link, .ot-link-row a { align-items: center; background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 999px; color: var(--ot-interaction); display: inline-flex; min-height: 44px; padding: 8px 16px; text-decoration: none; }
.ot-business-link--primary { background: var(--ot-primary); border-color: var(--ot-primary); color: #FFFFFF; font-weight: 700; }
.ot-inline-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 16px 0 24px; padding: 0; }
.ot-inline-list li { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 999px; padding: 5px 13px; }

.ot-scorecard { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); box-shadow: var(--ot-shadow); margin: 28px 0; padding: clamp(18px, 3vw, 28px); }
.ot-scorecard__header { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; }
.ot-scorecard__total { background: var(--ot-neutral); border-radius: var(--ot-radius-sm); min-width: 80px; padding: 8px 12px; text-align: center; }
.ot-scorecard__total span { color: var(--ot-muted); display: block; font-size: 12px; }
.ot-scorecard__total strong { font-size: 30px; }
.ot-scorecard__bar { align-items: center; display: grid; gap: 10px; grid-template-columns: auto minmax(120px, 1fr) auto; margin: 18px 0; }
.ot-scorecard__bar span, .ot-scorecard__bar strong { color: var(--ot-muted); font-size: 12px; }
.ot-scorecard__bar div { background: var(--ot-neutral); border-radius: 999px; height: 8px; overflow: hidden; }
.ot-scorecard__bar i { background: var(--ot-border); display: block; height: 100%; width: 0; }
.ot-score-items { display: grid; gap: 0 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 16px 0; }
.ot-score-items > div { align-items: center; border-top: 1px solid var(--ot-border); display: flex; gap: 16px; justify-content: space-between; min-height: 48px; padding: 9px 0; }
.ot-score-items dt { font-size: 14px; font-weight: 650; }
.ot-score-items dd { margin: 0; text-align: right; }
.ot-state { border-radius: 999px; font-size: 12px; font-weight: 750; padding: 3px 8px; }
.ot-state--unknown, .ot-state--not_tested { background: var(--ot-orange-surface); color: var(--ot-accent); }
.ot-state--not_available, .ot-state--not_applicable { background: var(--ot-neutral); color: var(--ot-muted); }

.ot-status { border-left: 4px solid var(--ot-primary); border-radius: 0 var(--ot-radius-sm) var(--ot-radius-sm) 0; font-size: 14px; padding: 10px 13px; }
.ot-status--hold, .ot-status--error { background: var(--ot-orange-surface); border-color: var(--ot-accent); }
.ot-status--notice { background: var(--ot-green-surface); }
.ot-comparison { border: 1px solid var(--ot-border); border-radius: var(--ot-radius-sm); overflow-x: auto; overscroll-behavior-inline: contain; width: 100%; }
.ot-comparison table { border-collapse: separate; border-spacing: 0; margin: 0; min-width: 680px; width: 100%; }
.ot-comparison th, .ot-comparison td { border-bottom: 1px solid var(--ot-border); border-right: 1px solid var(--ot-border); min-width: 144px; padding: 13px; text-align: left; }
.ot-comparison tr:last-child th, .ot-comparison tr:last-child td { border-bottom: 0; }
.ot-comparison th:last-child, .ot-comparison td:last-child { border-right: 0; }
.ot-comparison thead th { background: var(--ot-green-dark); color: #FFFFFF; }
.ot-comparison tbody th { background: var(--ot-neutral); left: 0; position: sticky; z-index: 1; }

.ot-content-list { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ot-content-list a { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); color: var(--ot-text); display: flex; flex-direction: column; min-height: 154px; padding: 20px; text-decoration: none; transition: border-color .18s ease, box-shadow .18s ease; }
.ot-content-list a:hover { border-color: var(--ot-primary); box-shadow: var(--ot-shadow); }
.ot-content-list a:hover strong { color: var(--ot-interaction); }
.ot-content-list__kind { color: var(--ot-primary) !important; font-size: 12px !important; font-weight: 750; letter-spacing: .05em; }
.ot-content-list strong { font-size: 17px; line-height: 1.5; margin-top: 8px; }
.ot-content-list__action { color: var(--ot-muted); font-size: 13px; margin-top: auto; padding-top: 14px; }
.ot-hub-steps { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 24px 0 30px; }
.ot-hub-steps span { align-items: center; background: var(--ot-neutral); border: 1px solid var(--ot-border); border-radius: var(--ot-radius-sm); display: flex; gap: 10px; min-height: 56px; padding: 10px 14px; }
.ot-hub-steps strong { align-items: center; background: var(--ot-primary); border-radius: 50%; color: #FFFFFF; display: inline-flex; flex: 0 0 28px; height: 28px; justify-content: center; }
.ot-hub-diagnosis { margin-top: 30px; }
.ot-hub-steps-heading h2, .ot-hub-list-heading h2 { font-size: clamp(22px, 2.5vw, 29px); }
.ot-hub-list-heading { border-top: 1px solid var(--ot-border); margin-top: 8px; padding-top: 30px; }
.ot-diagnosis-entry { align-items: center; background: var(--ot-green-dark); border-radius: var(--ot-radius-lg); color: #FFFFFF; display: flex; flex-wrap: wrap; gap: 20px 32px; justify-content: space-between; }
.ot-diagnosis-entry h2, .ot-diagnosis-entry .ot-eyebrow { color: #FFFFFF; }
.ot-diagnosis-entry p { color: rgba(255, 255, 255, .78); max-width: 650px; }

.ot-button { align-items: center; border: 2px solid var(--ot-primary); border-radius: 10px; display: inline-flex; font: inherit; font-weight: 750; gap: 8px; justify-content: center; min-height: 46px; padding: 9px 17px; text-decoration: none; transition: background .18s ease, border-color .18s ease, box-shadow .18s ease; }
.ot-button--primary { background: var(--ot-primary); color: #FFFFFF; }
.ot-button--primary:hover { background: var(--ot-interaction); color: #FFFFFF; }
.ot-button--diagnostic { background: var(--ot-accent); border-color: var(--ot-accent); color: #FFFFFF; }
.ot-button--diagnostic:hover { background: #92400E; border-color: #92400E; color: #FFFFFF; }
.ot-button--secondary { background: #FFFFFF; color: var(--ot-interaction); }
.ot-button--official { background: #FFFFFF; border-color: var(--ot-primary); color: var(--ot-interaction); }
.ot-button--affiliate { background: var(--ot-primary); border-color: var(--ot-primary); color: #FFFFFF; }
.ot-button[aria-disabled="true"] { cursor: not-allowed; opacity: .72; }
.ot-cta-row { display: flex; flex-wrap: wrap; gap: 8px; }

.ot-evidence-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ot-evidence { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); padding: 22px; }
.ot-evidence--current { border-top: 4px solid var(--ot-primary); }
.ot-evidence--stale { border-top: 4px solid var(--ot-accent); }
.ot-evidence__heading { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; }
.ot-evidence__heading span { background: var(--ot-neutral); border-radius: 999px; color: var(--ot-muted); font-size: 12px; font-weight: 750; padding: 4px 8px; }
.ot-evidence--current .ot-evidence__heading span { background: var(--ot-green-surface); color: var(--ot-primary); }
.ot-evidence dl { margin-bottom: 18px; }
.ot-evidence dl > div { border-top: 1px solid var(--ot-border); display: flex; gap: 12px; justify-content: space-between; padding: 8px 0; }
.ot-evidence dt { color: var(--ot-muted); font-size: 13px; }
.ot-evidence dd { font-weight: 650; margin: 0; text-align: right; }
.ot-disclosure { background: var(--ot-neutral); border-left: 3px solid var(--ot-primary); border-radius: 0 var(--ot-radius-sm) var(--ot-radius-sm) 0; margin-top: 24px; padding: 16px 18px; }
.ot-disclosure strong { font-size: 14px; }
.ot-disclosure p { color: var(--ot-muted); font-size: 13px; margin: 4px 0 0; }
.ot-decision-blocks { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.ot-decision-blocks section { background: var(--ot-neutral); border: 1px solid var(--ot-border); border-radius: var(--ot-radius-sm); padding: 16px; }
.ot-decision-blocks .ot-unsuitable { border-left: 4px solid var(--ot-accent); }
.ot-decision-blocks p { color: var(--ot-muted); margin: 4px 0 0; }

.ot-shell { max-width: 960px; }
.ot-shell__header { max-width: 760px; padding: 8px 0 24px; }
.ot-shell__header h1 { font-size: clamp(32px, 4vw, 46px); }
.ot-hub-hero { background: var(--ot-green-surface); border: 1px solid #DCEBE2; border-left: 5px solid var(--ot-primary); border-radius: var(--ot-radius-lg); max-width: none; padding: clamp(28px, 5vw, 48px); }
.ot-hub-hero--cashless { background: #F6F8F5; }
.ot-hub-hero--diagnosis { background: var(--ot-orange-surface); border-color: #F3D8B5; border-left-color: var(--ot-accent); }
.ot-hub-hero--with-visual { align-items: center; display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); }
.ot-hub-hero--with-visual .ot-shell__copy { min-width: 0; }
.ot-page-visual--hub { aspect-ratio: 3 / 2; border: 1px solid rgba(47, 107, 87, .14); border-radius: var(--ot-radius); justify-self: end; max-width: 300px; width: 100%; }
.ot-page-visual--hub img { aspect-ratio: 3 / 2; }
.ot-hub-hero h1 { margin-bottom: 12px; max-width: 720px; }
.ot-shell__lead { color: var(--ot-muted); font-size: 17px; max-width: 700px; }
.ot-topic-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 20px 0 0; padding: 0; }
.ot-topic-list li { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 999px; color: var(--ot-green-dark); font-size: 13px; font-weight: 700; padding: 6px 12px; }
.ot-shell__notice { color: var(--ot-muted); font-size: 14px; max-width: 630px; }
.ot-shell__back { margin-top: 24px; }
.ot-empty-state { max-width: 760px; }
.ot-trust-content, .ot-editorial-structure, .ot-sitemap { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius-lg); max-width: 760px; }
.ot-trust-lead { color: var(--ot-green-dark); font-size: 18px; font-weight: 650; line-height: 1.75; }
.ot-trust-section { border-top: 1px solid var(--ot-border); margin-top: 24px; padding-top: 24px; }
.ot-trust-section h2 { font-size: 24px; }
.ot-trust-section li { margin-block: 6px; }
.ot-trust-links { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; margin: 16px 0 0; padding: 0; }
.ot-trust-links a { align-items: center; display: inline-flex; min-height: 44px; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ot-trust-content .ot-comparison { margin-top: 24px; }
.ot-trust-content .ot-comparison table { min-width: 0; }
.ot-contact-preview { background: var(--ot-neutral); border-radius: var(--ot-radius); margin-top: 24px; padding: 20px; }
.ot-contact-preview label { display: block; font-weight: 700; margin-bottom: 4px; }
.ot-contact-preview input, .ot-contact-preview textarea { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 8px; min-height: 44px; padding: 8px; width: 100%; }
.ot-contact-preview :disabled { cursor: not-allowed; opacity: .72; }
.ot-structure-list { list-style: none; margin: 0; padding: 0; }
.ot-structure-list > li { border-top: 1px solid var(--ot-border); padding: 22px 0; }
.ot-structure-list h2 { font-size: 22px; margin-bottom: 6px; }
.ot-structure-list p { color: var(--ot-muted); margin-bottom: 0; }
.ot-sitemap .ot-content-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ot-sitemap .ot-content-list a { justify-content: center; min-height: 60px; padding: 12px 16px; }

.ot-diagnostic { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius-lg); box-shadow: var(--ot-shadow); margin-top: 0; padding: clamp(22px, 5vw, 46px); }
.ot-diagnostic__intro { display: grid; gap: 16px; }
.ot-diagnostic__intro > div > p:not(.ot-eyebrow) { color: var(--ot-muted); max-width: 620px; }
.ot-diagnostic-start { justify-self: start; }
.ot-diagnostic__promises { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 18px 0 0; padding: 0; }
.ot-diagnostic__promises li { background: var(--ot-green-surface); border: 1px solid #DCEBE2; border-radius: 999px; color: var(--ot-green-dark); font-size: 13px; font-weight: 700; padding: 6px 12px; }
.ot-progress { align-items: center; background: var(--ot-neutral); border-radius: var(--ot-radius-sm); display: grid; gap: 6px 12px; grid-template-columns: auto minmax(100px, 1fr) auto; margin: 28px 0 12px; padding: 13px 16px; }
.ot-progress span, .ot-progress strong { font-size: 13px; }
.ot-progress progress { accent-color: var(--ot-primary); height: 10px; width: 100%; }
.ot-question { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); margin: 16px 0; padding: 20px; }
.ot-question legend { font-size: 18px; font-weight: 750; line-height: 1.5; padding: 0 4px; width: auto; }
.ot-question legend > span { align-items: center; background: var(--ot-primary); border-radius: 50%; color: #FFFFFF; display: inline-flex; height: 34px; justify-content: center; margin-right: 9px; width: 34px; }
.ot-question legend small { background: var(--ot-neutral); border-radius: 999px; color: var(--ot-muted); font-size: 11px; margin-left: 8px; padding: 3px 7px; }
.ot-question label { align-items: center; border: 1px solid var(--ot-border); border-radius: var(--ot-radius-sm); cursor: pointer; display: flex; gap: 12px; min-height: 50px; margin: 9px 0; padding: 10px 13px; transition: background .15s ease, border-color .15s ease, box-shadow .15s ease; }
.ot-question label:hover { background: var(--ot-green-surface); border-color: #A9C8B8; }
.ot-question label:has(input:checked) { background: var(--ot-green-surface); border-color: var(--ot-primary); box-shadow: inset 0 0 0 1px var(--ot-primary); color: var(--ot-green-dark); font-weight: 700; }
.ot-question input { accent-color: var(--ot-primary); flex: 0 0 auto; height: 20px; width: 20px; }
.ot-question-actions { display: flex; gap: 10px; justify-content: space-between; margin-top: 16px; }
.ot-question-actions .ot-button { min-width: 112px; }
.ot-field-error { color: #9A3412; font-size: 14px; font-weight: 700; }
.ot-diagnostic-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ot-preview-control { background: var(--ot-neutral); border-radius: var(--ot-radius-sm); display: grid; font-size: 13px; gap: 4px; margin: 24px 0; max-width: 520px; padding: 12px; }
.ot-preview-control select { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: 8px; font: inherit; min-height: 44px; padding: 8px; }
.ot-diagnostic-result { background: var(--ot-neutral); border: 1px solid var(--ot-border); border-radius: var(--ot-radius); padding: 16px; }
.ot-diagnostic-result:focus { outline: 2px solid var(--ot-primary); outline-offset: 3px; }
.ot-diagnostic-result ol { margin: 14px 0; padding-left: 24px; }
.ot-diagnostic-result li { margin: 7px 0; }
.ot-result-card { background: #FFFFFF; border: 1px solid var(--ot-border); border-radius: var(--ot-radius); margin-top: 14px; padding: 20px; }
.ot-result-card--featured { border-top: 5px solid var(--ot-primary); box-shadow: var(--ot-shadow); padding: 24px; }
.ot-result-card--secondary { border-top: 3px solid #86A997; }
.ot-result-card__heading { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; }
.ot-result-card__score { background: var(--ot-green-surface); border-radius: var(--ot-radius-sm); min-width: 86px; padding: 8px 10px; text-align: center; }
.ot-result-card__score span { color: var(--ot-muted); display: block; font-size: 10px; }
.ot-result-card__score strong { color: var(--ot-primary); font-size: 24px; }
.ot-result-card dl > div { border-top: 1px solid var(--ot-border); display: grid; gap: 8px; grid-template-columns: minmax(104px, .32fr) 1fr; padding: 9px 0; }
.ot-result-card dt { font-weight: 700; }
.ot-result-card dd { margin: 0; }

.ot-page a:focus-visible, .ot-page button:focus-visible, .ot-page input:focus-visible, .ot-page select:focus-visible, .ot-comparison:focus-visible { outline: 3px solid var(--ot-accent); outline-offset: 3px; }
.skip-link, .site-name-text-link, #footer .menu-item a, .mobile-menu-buttons .menu-button-in, .search-submit { min-height: 44px; min-width: 44px; }
.site-name-text-link, #footer .menu-item a { align-items: center; display: inline-flex; }
.menu-drawer .menu-item a { align-items: center; display: flex; min-height: 44px; }
@media (min-width: 768px) {
  .ot-page { padding-inline: 24px; }
  .header-container-in { align-items: center; display: grid; grid-template-columns: minmax(250px, .7fr) minmax(0, 1fr); }
  body.home.wp-child-theme-cocoon-child-master #header,
  body.home.wp-child-theme-cocoon-child-master .header-in,
  body.home.wp-child-theme-cocoon-child-master #navi,
  body.home.wp-child-theme-cocoon-child-master .navi-in,
  body.ot-first-five-article #header,
  body.ot-first-five-article .header-in,
  body.ot-first-five-article #navi,
  body.ot-first-five-article .navi-in,
  body.page-template-page-phase1-shell #header,
  body.page-template-page-phase1-shell .header-in,
  body.page-template-page-phase1-shell #navi,
  body.page-template-page-phase1-shell .navi-in { max-width: none; min-width: 0; width: auto; }
}

@media (min-width: 1024px) {
  body.home.wp-child-theme-cocoon-child-master .navi-in > ul,
  body.page-template-page-phase1-shell .navi-in > ul { flex-wrap: nowrap; }
  body.home.wp-child-theme-cocoon-child-master .navi-in > ul > li,
  body.page-template-page-phase1-shell .navi-in > ul > li { flex: 0 1 auto; width: auto; }
  body.home.wp-child-theme-cocoon-child-master .navi-in > ul > li > a,
  body.page-template-page-phase1-shell .navi-in > ul > li > a { width: auto; }
  .ot-content-list a:first-child { grid-column: span 2; }
}

@media (max-width: 1023px) {
  body.home.wp-child-theme-cocoon-child-master #navi,
  body.page-template-page-phase1-shell #navi { display: none; }
  body.home.wp-child-theme-cocoon-child-master .mobile-footer-menu-buttons,
  body.page-template-page-phase1-shell .mobile-footer-menu-buttons {
    background: transparent;
    bottom: auto;
    box-shadow: none;
    display: block !important;
    height: 44px;
    left: auto;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 12px;
    top: 22px;
    width: 44px;
    z-index: 1000;
  }
  body.home.wp-child-theme-cocoon-child-master .mobile-footer-menu-buttons > li,
  body.page-template-page-phase1-shell .mobile-footer-menu-buttons > li { display: none !important; }
  body.home.wp-child-theme-cocoon-child-master .mobile-footer-menu-buttons > .navi-menu-button,
  body.page-template-page-phase1-shell .mobile-footer-menu-buttons > .navi-menu-button {
    align-items: center;
    display: flex !important;
    height: 44px;
    justify-content: center;
    width: 44px;
  }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open,
  body.page-template-page-phase1-shell #navi-menu-open {
    align-items: center;
    background: #FFFFFF;
    border: 1px solid var(--ot-border);
    border-radius: 10px;
    color: var(--ot-green-dark);
    display: flex;
    height: 44px;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 0;
    width: 44px;
  }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open:focus-visible,
  body.page-template-page-phase1-shell #navi-menu-open:focus-visible,
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button:focus-visible,
  body.page-template-page-phase1-shell .navi-menu-close-button:focus-visible {
    outline: 3px solid var(--ot-accent);
    outline-offset: 3px;
  }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open .menu-icon,
  body.page-template-page-phase1-shell #navi-menu-open .menu-icon {
    display: block;
    font-size: 0;
    height: 16px;
    position: relative;
    width: 22px;
  }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open .menu-icon .fa,
  body.page-template-page-phase1-shell #navi-menu-open .menu-icon .fa,
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button .fa,
  body.page-template-page-phase1-shell .navi-menu-close-button .fa { display: none; }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open .menu-icon::before,
  body.page-template-page-phase1-shell #navi-menu-open .menu-icon::before {
    background: currentColor;
    border-radius: 999px;
    box-shadow: 0 7px 0 currentColor, 0 14px 0 currentColor;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    top: 0;
    width: 22px;
  }
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button,
  body.page-template-page-phase1-shell .navi-menu-close-button {
    align-items: center;
    color: var(--ot-green-dark);
    display: flex;
    height: 44px;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    position: relative;
    width: 44px;
  }
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button::before,
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button::after,
  body.page-template-page-phase1-shell .navi-menu-close-button::before,
  body.page-template-page-phase1-shell .navi-menu-close-button::after {
    background: currentColor;
    border-radius: 999px;
    content: "";
    height: 2px;
    left: 11px;
    position: absolute;
    top: 21px;
    width: 22px;
  }
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button::before,
  body.page-template-page-phase1-shell .navi-menu-close-button::before { transform: rotate(45deg); }
  body.home.wp-child-theme-cocoon-child-master .navi-menu-close-button::after,
  body.page-template-page-phase1-shell .navi-menu-close-button::after { transform: rotate(-45deg); }
  body.home.wp-child-theme-cocoon-child-master #navi-menu-open .menu-caption,
  body.page-template-page-phase1-shell #navi-menu-open .menu-caption { display: none; }
  .ot-hero { grid-template-columns: 1fr; }
  .ot-hero__copy, .ot-hero__note, .ot-page-visual--top { grid-column: 1; grid-row: auto; }
  .ot-hero__note { max-width: 620px; }
  .ot-page-visual--top { justify-self: start; max-width: 360px; }
  .ot-tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ot-tool-card--diagnostic { grid-column: span 2; }
  .ot-content-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  body.home.wp-child-theme-cocoon-child-master,
  body.page-template-page-phase1-shell,
  body.single-post.wp-child-theme-cocoon-child-master { overflow-x: clip; }
  body.home.wp-child-theme-cocoon-child-master .container,
  body.home.wp-child-theme-cocoon-child-master .header-container,
  body.home.wp-child-theme-cocoon-child-master .header-in,
  body.home.wp-child-theme-cocoon-child-master .content-in,
  body.home.wp-child-theme-cocoon-child-master #main,
  body.page-template-page-phase1-shell .container,
  body.page-template-page-phase1-shell .header-container,
  body.page-template-page-phase1-shell .header-in,
  body.page-template-page-phase1-shell .content-in,
  body.page-template-page-phase1-shell #main,
  body.single-post.wp-child-theme-cocoon-child-master .container,
  body.single-post.wp-child-theme-cocoon-child-master .content-in,
  body.single-post.wp-child-theme-cocoon-child-master #main { max-width: 100%; min-width: 0; }
  body.home.wp-child-theme-cocoon-child-master .header-in,
  body.page-template-page-phase1-shell .header-in { display: block; height: auto; min-height: 0; }
  body.home.wp-child-theme-cocoon-child-master .tagline,
  body.page-template-page-phase1-shell .tagline { font-size: 11px; line-height: 1.4; margin: 0; overflow: hidden; padding: 4px 12px 0; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
  body.home.wp-child-theme-cocoon-child-master .logo-header,
  body.page-template-page-phase1-shell .logo-header { height: auto; padding: 0 12px; }
  body.home.wp-child-theme-cocoon-child-master .logo-header .site-name-text,
  body.page-template-page-phase1-shell .logo-header .site-name-text { font-size: 20px; }
  body.home.wp-child-theme-cocoon-child-master .site-name-text-link,
  body.page-template-page-phase1-shell .site-name-text-link { justify-content: center; min-height: 44px; width: 100%; }
  body.home.wp-child-theme-cocoon-child-master #main,
  body.page-template-page-phase1-shell #main { padding: 12px; }
  body.single-post.wp-child-theme-cocoon-child-master #main { padding: 18px 14px 36px; }
  body.single-post.wp-child-theme-cocoon-child-master .entry-title { font-size: 28px; line-height: 1.35; }
  body.single-post.wp-child-theme-cocoon-child-master .entry-content h2 { font-size: 22px; margin-top: 34px; padding: 12px; }
  body.single-post.wp-child-theme-cocoon-child-master .entry-content h3 { font-size: 18px; }
  body.single-post.wp-child-theme-cocoon-child-master .entry-content table { font-size: 14px; }
  body.single-post.wp-child-theme-cocoon-child-master .entry-content th,
  body.single-post.wp-child-theme-cocoon-child-master .entry-content td { min-width: 132px; padding: 9px 10px; }
  .ot-page { padding: 0 0 40px; }
  .ot-page h1 { font-size: 34px; }
  .ot-page h2 { font-size: 25px; }
  .ot-hero { border-radius: var(--ot-radius); gap: 18px; padding: 26px 20px; }
  .ot-hero p:not(.ot-eyebrow) { font-size: 15px; }
  .ot-hero__trust { display: grid; gap: 8px; margin-top: 18px; }
  .ot-hero__note { padding: 13px 15px; }
  .ot-page-visual--top { justify-self: center; max-width: 280px; }
  .ot-section { margin-top: 12px; padding: 32px 18px; }
  .ot-tool-grid, .ot-content-list, .ot-evidence-grid, .ot-decision-blocks { grid-template-columns: 1fr; }
  .ot-hub-steps { grid-template-columns: 1fr; }
  .ot-tool-card, .ot-tool-card--diagnostic { grid-column: auto; min-height: 88px; padding: 15px; }
  .ot-content-list a, .ot-content-list a:first-child { grid-column: auto; min-height: 132px; }
  .ot-score-items { grid-template-columns: 1fr; }
  .ot-scorecard__header, .ot-evidence__heading { min-width: 0; }
  .ot-evidence dl > div { align-items: flex-start; flex-direction: column; gap: 0; }
  .ot-evidence dd { overflow-wrap: anywhere; text-align: left; }
  .ot-diagnosis-entry { align-items: stretch; }
  .ot-diagnosis-entry .ot-button { width: 100%; }
  .ot-shell__header { padding: 2px 4px 12px; }
  .ot-shell__header.ot-hub-hero { border-radius: var(--ot-radius); padding: 24px 18px; }
  .ot-shell__header.ot-hub-hero--with-visual { display: grid; gap: 18px; grid-template-columns: 1fr; }
  .ot-page-visual--hub { justify-self: center; max-width: 320px; }
  .ot-shell__header h1 { font-size: 31px; margin: 8px 0 10px; }
  .ot-shell__lead { font-size: 15px; line-height: 1.7; }
  .ot-topic-list { gap: 7px; margin-top: 16px; }
  .ot-topic-list li { padding: 5px 10px; }
  .ot-shell__notice { font-size: 12px; line-height: 1.55; margin-bottom: 4px !important; }
  .ot-shell:has(.ot-diagnostic) .ot-shell__header { padding-bottom: 6px; }
  .ot-shell:has(.ot-diagnostic) .ot-shell__header.ot-hub-hero { padding-bottom: 24px; }
  .ot-shell:has(.ot-diagnostic) .ot-shell__header h1 { font-size: 28px; margin-bottom: 4px; }
  .ot-diagnostic { border-radius: var(--ot-radius); padding: 22px 16px; }
  .ot-diagnostic__intro > div > p:not(.ot-eyebrow) { font-size: 14px; line-height: 1.65; }
  .ot-diagnostic-start { margin-top: 4px; width: 100%; }
  .ot-diagnostic__promises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ot-diagnostic__promises li { padding-inline: 6px; text-align: center; }
  .ot-progress { grid-template-columns: 1fr auto; }
  .ot-progress progress { grid-column: 1 / -1; grid-row: 2; }
  .ot-question { padding: 17px 13px; }
  .ot-question legend { font-size: 16px; width: 100%; }
  .ot-question label { min-height: 52px; }
  .ot-result-card, .ot-result-card--featured { padding: 17px; }
  .ot-result-card__heading { align-items: flex-start; }
  .ot-result-card dl > div { grid-template-columns: 1fr; gap: 2px; }
  .ot-result-card__score { min-width: 74px; }
  .ot-cta-row .ot-button { width: 100%; }
  .ot-trust-content, .ot-editorial-structure, .ot-sitemap { max-width: 100%; }
  .ot-trust-lead { font-size: 16px; }
  .ot-sitemap .ot-content-list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* TOP brand redesign v4. All design rules are isolated to the front-page root. */
.ot-brand-home-v4 { background: #FFFFFF; max-width: 1360px; overflow: hidden; padding: 26px clamp(20px, 3vw, 42px) 132px; }
.ot-brand-home-v4 .ot-brand-v4-label { color: #2F6B57; font-size: 11px; font-weight: 800; letter-spacing: .21em; line-height: 1.4; margin: 0 0 22px; text-transform: uppercase; }
.ot-brand-home-v4 .ot-brand-v4-hero { align-items: center; display: grid; gap: clamp(30px, 3.6vw, 52px); grid-template-columns: minmax(0, 41fr) minmax(0, 59fr); min-height: 690px; }
.ot-brand-home-v4 .ot-brand-v4-hero__copy { min-width: 0; padding: 32px 0; }
.ot-brand-home-v4 .ot-brand-v4-hero h1 { font-size: clamp(3.35rem, 4.55vw, 3.65rem); font-weight: 780; letter-spacing: -.05em; line-height: 1.06; margin: 0; }
.ot-brand-home-v4 .ot-brand-v4-lead { color: #51605B; font-size: clamp(15px, 1.35vw, 18px); line-height: 1.9; margin: 40px 0 32px; max-width: 35em; }
.ot-brand-home-v4 .ot-brand-v4-text-link { align-items: center; background: none; border: 0; border-bottom: 1px solid #2F6B57; border-radius: 0; color: #183D31; display: inline-flex; font-size: 16px; font-weight: 760; gap: 20px; min-height: 44px; padding: 4px 0 3px; text-decoration: none; }
.ot-brand-home-v4 .ot-brand-v4-text-link span { display: inline-block; transition: transform .38s ease; }
.ot-brand-home-v4 .ot-brand-v4-text-link:hover span { transform: translateX(6px); }
.ot-brand-home-v4 .ot-brand-v4-hero__visual { align-self: stretch; height: 690px; line-height: 0; margin: 0; min-width: 0; overflow: hidden; }
.ot-brand-home-v4 .ot-brand-v4-hero__visual img { display: block; height: 100%; max-width: none; object-fit: cover; object-position: 100% 54%; transform: scale(1.18); transform-origin: 100% 54%; width: 100%; }

.ot-brand-home-v4 .ot-brand-v4-section { border: 0; margin: 0; padding: 0; }
.ot-brand-home-v4 .ot-brand-v4-section h2 { font-size: clamp(2.55rem, 5.25vw, 5rem); font-weight: 740; letter-spacing: -.055em; line-height: 1.08; margin: 0; }
.ot-brand-home-v4 .ot-brand-v4-choose { margin-top: clamp(126px, 11vw, 158px); }
.ot-brand-home-v4 .ot-brand-v4-intro { color: #51605B; font-size: 17px; line-height: 1.85; margin: 27px 0 52px; }
.ot-brand-home-v4 .ot-brand-v4-choose__links { border-top: 1px solid #C7D3CE; }
.ot-brand-home-v4 .ot-brand-v4-choice { align-items: center; border-bottom: 1px solid #C7D3CE; border-radius: 0; color: #183D31; display: grid; gap: 32px; grid-template-columns: 62px minmax(0, 1fr) 48px; height: 142px; overflow: hidden; padding: 0 clamp(20px, 3.3vw, 46px); position: relative; text-decoration: none; }
.ot-brand-home-v4 .ot-brand-v4-choice::before { background-position: center; background-size: cover; content: ""; inset: 0; opacity: .15; position: absolute; transform: scale(1); transition: opacity .42s ease, transform .42s ease; }
.ot-brand-home-v4 .ot-brand-v4-choice::after { background: rgba(255, 255, 255, .48); content: ""; inset: 0; position: absolute; }
.ot-brand-home-v4 .ot-brand-v4-choice--pos::before { background-image: url("../images/phase1/pages/tablet-pos-small-shop-960.webp"); background-position: 50% 56%; }
.ot-brand-home-v4 .ot-brand-v4-choice--cashless::before { background-image: url("../images/phase1/pages/cashless-payment-small-shop-960.webp"); background-position: 50% 56%; }
.ot-brand-home-v4 .ot-brand-v4-choice--diagnosis::before { background-image: url("../images/phase1/pages/small-cafe-pos-counter-1200.webp"); background-position: 88% 50%; }
.ot-brand-home-v4 .ot-brand-v4-choice > span { position: relative; z-index: 1; }
.ot-brand-home-v4 .ot-brand-v4-choice__number { color: #2F6B57; font-size: 11px; font-weight: 800; letter-spacing: .17em; }
.ot-brand-home-v4 .ot-brand-v4-choice__copy { align-items: baseline; display: grid; gap: 34px; grid-template-columns: minmax(200px, .42fr) minmax(0, 1fr); }
.ot-brand-home-v4 .ot-brand-v4-choice__copy strong { font-size: clamp(24px, 2.5vw, 32px); line-height: 1.2; }
.ot-brand-home-v4 .ot-brand-v4-choice__copy small { color: #334A42; font-size: 15px; line-height: 1.7; }
.ot-brand-home-v4 .ot-brand-v4-choice__arrow { font-size: 25px; justify-self: end; transition: transform .42s ease; }
.ot-brand-home-v4 .ot-brand-v4-choice:hover::before { opacity: .27; transform: scale(1.02); }
.ot-brand-home-v4 .ot-brand-v4-choice:hover .ot-brand-v4-choice__arrow { transform: translateX(6px); }

.ot-brand-home-v4 .ot-brand-v4-statement { margin-top: clamp(160px, 15vw, 210px); max-width: 870px; padding-left: clamp(0px, 6vw, 78px); }
.ot-brand-home-v4 .ot-brand-v4-statement h2 { margin-bottom: 48px; }
.ot-brand-home-v4 .ot-brand-v4-statement p:not(.ot-brand-v4-label) { color: #42534D; font-size: clamp(19px, 2.1vw, 25px); line-height: 1.85; margin: 0 0 20px; }

.ot-brand-home-v4 .ot-brand-v4-small-shop { align-items: center; display: grid; gap: clamp(38px, 5vw, 72px); grid-template-columns: minmax(0, 64fr) minmax(0, 36fr); margin-top: clamp(170px, 16vw, 224px); }
.ot-brand-home-v4 .ot-brand-v4-small-shop__visual { aspect-ratio: 3 / 2; line-height: 0; margin: 0; overflow: hidden; }
.ot-brand-home-v4 .ot-brand-v4-small-shop__visual img { display: block; height: 100%; object-fit: cover; object-position: 50% 50%; width: 100%; }
.ot-brand-home-v4 .ot-brand-v4-small-shop__copy { min-width: 0; }
.ot-brand-home-v4 .ot-brand-v4-small-shop h2 { font-size: clamp(2.1rem, 3.5vw, 3.75rem); }
.ot-brand-home-v4 .ot-brand-v4-small-shop__copy > p:not(.ot-brand-v4-label) { color: #51605B; font-size: 16px; line-height: 1.9; margin: 31px 0 29px; max-width: 30em; }

.ot-brand-home-v4 .ot-brand-v4-guide { margin-top: clamp(170px, 16vw, 224px); }
.ot-brand-home-v4 .ot-brand-v4-guide h2 { margin-bottom: 58px; }
.ot-brand-home-v4 .ot-brand-v4-guide__list { border-top: 1px solid #C7D3CE; }
.ot-brand-home-v4 .ot-brand-v4-guide__list a { align-items: center; border-bottom: 1px solid #C7D3CE; color: #183D31; display: grid; gap: 28px; grid-template-columns: 120px minmax(0, 1fr) 46px; min-height: 112px; padding: 22px 8px; text-decoration: none; }
.ot-brand-home-v4 .ot-brand-v4-guide__list a > span { color: #2F6B57; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.ot-brand-home-v4 .ot-brand-v4-guide__list strong { font-size: clamp(18px, 2.05vw, 25px); line-height: 1.5; }
.ot-brand-home-v4 .ot-brand-v4-guide__list i { font-size: 23px; font-style: normal; justify-self: end; transition: transform .38s ease; }
.ot-brand-home-v4 .ot-brand-v4-guide__list a:hover i { transform: translateX(6px); }

.ot-brand-home-v4 .ot-brand-v4-diagnosis-entry { background: #F2F7F4; margin-top: clamp(170px, 16vw, 224px); padding: clamp(62px, 8vw, 108px) clamp(26px, 7vw, 92px); }
.ot-brand-home-v4 .ot-brand-v4-diagnosis-entry h2 { margin-bottom: 30px; }
.ot-brand-home-v4 .ot-brand-v4-diagnosis-entry > p:not(.ot-brand-v4-label) { color: #51605B; font-size: 16px; line-height: 1.8; margin: 0 0 26px; }

.ot-brand-home-v4 .ot-brand-v4-policy { margin-top: clamp(170px, 16vw, 224px); }
.ot-brand-home-v4 .ot-brand-v4-policy h2 { margin-bottom: 54px; max-width: 850px; }
.ot-brand-home-v4 .ot-brand-v4-policy ol { border-top: 1px solid #C7D3CE; list-style: none; margin: 0; padding: 0; }
.ot-brand-home-v4 .ot-brand-v4-policy li { align-items: center; border-bottom: 1px solid #C7D3CE; display: grid; font-size: clamp(18px, 1.9vw, 22px); font-weight: 690; gap: 26px; grid-template-columns: 58px 1fr; min-height: 82px; }
.ot-brand-home-v4 .ot-brand-v4-policy li span { color: #2F6B57; font-size: 11px; letter-spacing: .17em; }
.ot-brand-home-v4 .ot-brand-v4-policy__links { display: flex; flex-wrap: wrap; gap: 16px 32px; margin-top: 38px; }
.ot-brand-home-v4 .ot-brand-v4-policy__links a { border-bottom: 1px solid #2F6B57; color: #183D31; min-height: 44px; padding: 8px 0 4px; text-decoration: none; }

@media (max-width: 1023px) {
  .ot-brand-home-v4 { padding-inline: clamp(20px, 3.5vw, 34px); }
  .ot-brand-home-v4 .ot-brand-v4-hero { gap: 28px; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); min-height: 620px; }
  .ot-brand-home-v4 .ot-brand-v4-hero h1 { font-size: clamp(3.1rem, 5.25vw, 3.4rem); }
  .ot-brand-home-v4 .ot-brand-v4-hero__visual { height: 620px; }
  .ot-brand-home-v4 .ot-brand-v4-small-shop { gap: 36px; grid-template-columns: minmax(0, 62fr) minmax(0, 38fr); }
}

@media (max-width: 767px) {
  .ot-brand-home-v4 { padding: 24px 0 86px; }
  .ot-brand-home-v4 .ot-brand-v4-hero { display: grid; gap: 30px; grid-template-columns: 1fr; min-height: 0; }
  .ot-brand-home-v4 .ot-brand-v4-hero__copy { padding: 22px 8px 0; }
  .ot-brand-home-v4 .ot-brand-v4-label { font-size: 10px; margin-bottom: 17px; }
  .ot-brand-home-v4 .ot-brand-v4-hero h1 { font-size: clamp(2.5rem, 11vw, 2.8rem); letter-spacing: -.04em; line-height: 1.08; }
  .ot-brand-home-v4 .ot-brand-v4-lead { font-size: 15px; line-height: 1.82; margin: 27px 0 22px; }
  .ot-brand-home-v4 .ot-brand-v4-hero__visual { height: clamp(250px, 72vw, 288px); width: 100%; }
  .ot-brand-home-v4 .ot-brand-v4-hero__visual img { object-position: 96% 50%; transform: none; }
  .ot-brand-home-v4 .ot-brand-v4-section { padding-inline: 8px; }
  .ot-brand-home-v4 .ot-brand-v4-section h2 { font-size: clamp(2.1rem, 10.4vw, 2.85rem); }
  .ot-brand-home-v4 .ot-brand-v4-choose { margin-top: 94px; }
  .ot-brand-home-v4 .ot-brand-v4-intro { font-size: 15px; margin: 21px 0 34px; }
  .ot-brand-home-v4 .ot-brand-v4-choice { gap: 13px; grid-template-columns: 34px minmax(0, 1fr) 27px; height: 108px; padding: 0 10px; }
  .ot-brand-home-v4 .ot-brand-v4-choice__copy { align-items: start; display: flex; flex-direction: column; gap: 5px; }
  .ot-brand-home-v4 .ot-brand-v4-choice__copy strong { font-size: 21px; }
  .ot-brand-home-v4 .ot-brand-v4-choice__copy small { font-size: 12px; line-height: 1.5; }
  .ot-brand-home-v4 .ot-brand-v4-choice__arrow { font-size: 20px; }
  .ot-brand-home-v4 .ot-brand-v4-statement { margin-top: 112px; padding-left: 8px; }
  .ot-brand-home-v4 .ot-brand-v4-statement h2 { margin-bottom: 32px; }
  .ot-brand-home-v4 .ot-brand-v4-statement p:not(.ot-brand-v4-label) { font-size: 17px; }
  .ot-brand-home-v4 .ot-brand-v4-small-shop { display: grid; gap: 36px; grid-template-columns: 1fr; margin-top: 120px; padding-inline: 0; }
  .ot-brand-home-v4 .ot-brand-v4-small-shop__visual { grid-row: 1; width: 100%; }
  .ot-brand-home-v4 .ot-brand-v4-small-shop__copy { grid-row: 2; padding-inline: 8px; }
  .ot-brand-home-v4 .ot-brand-v4-small-shop h2 { font-size: clamp(2.05rem, 9.7vw, 2.75rem); }
  .ot-brand-home-v4 .ot-brand-v4-small-shop__copy > p:not(.ot-brand-v4-label) { font-size: 15px; margin: 25px 0 23px; }
  .ot-brand-home-v4 .ot-brand-v4-guide { margin-top: 120px; }
  .ot-brand-home-v4 .ot-brand-v4-guide h2 { margin-bottom: 36px; }
  .ot-brand-home-v4 .ot-brand-v4-guide__list a { gap: 10px 14px; grid-template-columns: 68px minmax(0, 1fr) 24px; min-height: 100px; padding: 17px 2px; }
  .ot-brand-home-v4 .ot-brand-v4-guide__list strong { font-size: 15px; }
  .ot-brand-home-v4 .ot-brand-v4-guide__list i { font-size: 18px; }
  .ot-brand-home-v4 .ot-brand-v4-diagnosis-entry { margin-top: 120px; padding: 58px 26px; }
  .ot-brand-home-v4 .ot-brand-v4-policy { margin-top: 120px; }
  .ot-brand-home-v4 .ot-brand-v4-policy h2 { margin-bottom: 36px; }
  .ot-brand-home-v4 .ot-brand-v4-policy li { font-size: 16px; grid-template-columns: 42px 1fr; min-height: 72px; }
  .ot-brand-home-v4 .ot-brand-v4-policy__links { align-items: flex-start; flex-direction: column; gap: 8px; }
}