/* ToyotaTypeW02 Font Face Definitions */
@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-LightIt.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Book.woff2") format("woff2");
  font-weight: 350;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-BookIt.woff2") format("woff2");
  font-weight: 350;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-SemiboldIt.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ToyotaTypeW02";
  src: url("./font/ToyotaTypeW02-BoldIt.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

/* Distribute top menu items evenly across the full width */
.md-tabs {
  justify-content: space-evenly;
}

.md-tabs__list {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
}

/* Make top navigation (header menu) bold */
.md-tabs__link {
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  /* increase size (default ~0.9rem) */
}

body {
  background: #ede7e4;
  font-family: "ToyotaTypeW02", sans-serif;
  font-weight: 400;
}

body,
body * {
  text-align: left !important;
  font-family: "ToyotaTypeW02", sans-serif;
}

/* Body text weight - one step heavier */
body,
p,
span,
div,
li,
td,
th {
  font-weight: 400;
}

/* Typography System - Consistent font sizes and weights */
/* Base font size: 14px (0.875rem) - h6 as reference */
/* Modular scale: ~1.25x ratio */

/* Headings Hierarchy - must come after body * to override */
h1,
.md-content__inner.md-typeset h1,
.md-content__inner.md-typeset h1:first-of-type {
  font-size: 2.25rem;
  /* 36px - 2.571x of h6 */
  font-weight: 700 !important;
  /* Bold - override body * styles */
  line-height: 1.2;
  margin-bottom: 1rem;
}

h2 {
  font-size: 1.875rem;
  /* 30px - 2.143x of h6 */
  font-weight: 600;
  /* Semibold */
  line-height: 1.3;
  margin-bottom: 0.875rem;
}

h3 {
  font-size: 1.5rem;
  /* 24px - 1.714x of h6 */
  font-weight: 600;
  /* Semibold */
  line-height: 1.4;
  margin-bottom: 0.75rem;
}

h4 {
  font-size: 1.25rem;
  /* 20px - 1.429x of h6 */
  font-weight: 600;
  /* Semibold */
  line-height: 1.4;
  margin-bottom: 0.625rem;
}

h5 {
  font-size: 1rem;
  /* 16px - 1.143x of h6 */
  font-weight: 600;
  /* Semibold */
  line-height: 1.5;
  margin-bottom: 0.5rem;
}

h6 {
  font-size: 0.875rem;
  /* 14px - base reference */
  font-weight: 600;
  /* Semibold */
  line-height: 1.5;
  margin-bottom: 0.5rem;
}

/* Body Text */
p {
  font-size: 1rem;
  /* 16px */
  font-weight: 400;
  /* Regular */
  line-height: 1.6;
  margin-bottom: 1rem;
}

/* Small Text */
small,
.small-text {
  font-size: 0.875rem;
  /* 14px */
  font-weight: 400;
  /* Regular */
  line-height: 1.5;
}

/* Text color for headings and body text */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
div,
li,
td,
th {
  color: #333f69 !important;
}

/* Ensure h1 in content area has consistent top margin and font weight */
.md-content__inner.md-typeset h1,
.md-content__inner.md-typeset h1:first-of-type {
  margin-top: 0;
  font-weight: 700 !important;
  /* Bold - ensure page titles are bold */
}

/* Remove margin from h2 in typeset content */
.md-typeset h2 {
  margin: 0;
}

/* Override Material for MkDocs default font-weight for h1 and h2 */
.md-typeset h1 {
  font-weight: 700 !important;
  /* Bold - override default 300 */
  letter-spacing: normal !important;
}

.md-typeset h2 {
  font-weight: 600 !important;
  /* Semibold - override default 300 */
  letter-spacing: normal !important;
}

.md-header,
.md-header * {
  background: #333f69;
  /* blue → purple */
  color: white !important;
}

/* Hide header logo */
.md-header__button.md-logo {
  display: none !important;
}

/* Search box text color */
.md-search__input {
  color: white !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 4px;
}

.md-search__input::placeholder {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Footer text color */
.md-footer,
.md-footer * {
  color: white !important;
}

/* Footer top margin */
.md-footer {
  margin-top: 40px;
}

/* Intro section styling - base styles */
.intro-section {
  background: #ebeefa;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Align intro section heading with description text */
.intro-section h2 {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

/* Use Cases Section */
.usecase-section {
  text-align: center;
  padding: 5px 10px;
  margin-top: 40px;
}

.usecase-section h2 {
  font-size: 1.875rem;
  /* 30px - consistent with h2 */
  margin-bottom: 0.875rem;
  font-weight: 600;
  /* Semibold - consistent with h2 */
  color: #3f51b5;
  cursor: pointer;
  transition: color 0.3s ease;
}

.usecase-section h2 a {
  text-decoration: none;
  color: inherit;
}

.usecase-section p {
  font-size: 1.125rem;
  /* 18px - slightly larger for emphasis */
  font-weight: 400;
  color: #333;
  line-height: 1.6;
  margin-bottom: 1.875rem;
  font-family: "ToyotaTypeW02", sans-serif;
}

.usecase-section p span {
  font-weight: 400;
  color: #222;
}

.usecase-section p a {
  color: #3f51b5;
  font-weight: 600;
  text-decoration: none;
}

/* Build Solutions Section */
.build-solutions-section {
  text-align: center;
  padding: 5px 10px;
}

.build-solutions-section h2 {
  font-size: 1.875rem;
  /* 30px - consistent with h2 */
  margin-bottom: 0.875rem;
  font-weight: 600;
  /* Semibold - consistent with h2 */
  color: #3f51b5;
  cursor: pointer;
  transition: color 0.3s ease;
}

.build-solutions-section h2 a {
  text-decoration: none;
  color: inherit;
}

.build-solutions-section p {
  font-size: 1.125rem;
  /* 18px - slightly larger for emphasis */
  color: #333;
  line-height: 1.6;
  margin-bottom: 1.875rem;
  font-family: "ToyotaTypeW02", sans-serif;
}

.build-solutions-section p span {
  font-weight: 400;
  color: #222;
}

.build-solutions-section p span:last-child {
  font-weight: 600;
}

.build-solutions-section p a {
  color: #3f51b5;
  font-weight: 600;
  text-decoration: none;
}

/* Why Us Section */
.section {
  border-radius: 20px;
  text-align: center;
  padding: 24px 40px;
  background: #f8f9fa;
  border: 1px solid #dde2f6 !important;
}

.section h2 {
  font-size: 1.875rem;
  /* 30px - consistent with h2 */
  font-weight: 600;
  /* Semibold - consistent with h2 */
  color: #3f51b5;
  margin: 0.3125rem auto 0.625rem;
}

.section p {
  font-size: 1rem;
  /* 16px - consistent with body text */
  line-height: 1.6;
  margin: 0 auto 1.875rem;
  color: #333;
}

.section .card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px;
  margin-bottom: 40px;
}

.section .card {
  flex: 1 1 250px;
  padding: 24px;
  background: white;
  border-radius: 16px;
  border: 1px solid #dde2f6;
  text-align: center;
}

/* Remove all box shadows */
* {
  box-shadow: none !important;
}

/* Hamburger menu title styling - reduce top padding and allow line breaks */
.md-nav__title[for="__drawer"] {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  line-height: 1.4 !important;
  white-space: normal !important;
  word-break: break-word !important;
}

/* Remove white line behind section navigation items */
.md-nav__item--section .md-nav__link::before,
.md-nav__item--section .md-nav__link::after,
.md-nav--lifted .md-nav__item--section .md-nav__link::before,
.md-nav--lifted .md-nav__item--section .md-nav__link::after {
  display: none !important;
  content: none !important;
}

.md-nav__item--section .md-nav__link,
.md-nav--lifted .md-nav__item--section .md-nav__link {
  border-left: none !important;
  background: transparent !important;
}

.md-nav__item--section .md-nav__title::before,
.md-nav--lifted .md-nav__item--section .md-nav__title::before {
  display: none !important;
  content: none !important;
}

/* Main content area styling */
.md-main__inner.md-grid {
  background: #fcfbfa;
  padding: 40px;
  border-radius: 24px;
}

/* Responsive padding adjustments */
@media (max-width: 1200px) {
  .md-main__inner.md-grid {
    padding: 30px;
  }
}

@media (max-width: 768px) {
  .md-main__inner.md-grid {
    padding: 20px;
  }
}

@media (max-width: 480px) {
  .md-main__inner.md-grid {
    padding: 15px;
  }
}

/* Pricing Section */
.pricing-section {
  text-align: center;
  padding-top: 0;
  padding-bottom: 50px;
  background: #f9f9f9;
  border-radius: 20px;
}

.pricing-section h2 {
  font-size: 2.25rem;
  /* 36px - consistent with h1 */
  font-weight: 600;
  /* Semibold - consistent with h2 */
  color: #3f51b5;
  margin-bottom: 1.875rem;
}

.pricing-section .pricing-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  margin: 0 auto;
}

.pricing-section .pricing-card {
  border: 1px solid #dde2f6;
  flex: 1 1 300px;
  background: white;
  padding: 25px;
  border-radius: 16px;
  text-align: center;
}

.pricing-section .pricing-card h3 {
  font-size: 1.5rem;
  /* 24px - consistent with h3 */
  font-weight: 600;
  /* Semibold - consistent with h3 */
  margin-top: 0.3125rem;
  margin-bottom: 0.9375rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}

.pricing-section .pricing-card h3 img {
  width: 36px;
  height: 36px;
  display: inline-block;
  vertical-align: middle;
}

/* SVGの色をbodyテキスト色（#333F69）に合わせる */
.pricing-section .pricing-card h3.blue {
  color: #3f51b5;
}

.pricing-section .pricing-card h3.blue img {
  filter: brightness(0) saturate(100%) invert(25%) sepia(15%) saturate(2000%)
    hue-rotate(200deg) brightness(95%) contrast(85%);
}

.pricing-section .pricing-card h3.orange {
  color: #ff9900;
  margin-bottom: 5px;
}

.pricing-section .pricing-card h3.orange img {
  filter: brightness(0) saturate(100%) invert(25%) sepia(15%) saturate(2000%)
    hue-rotate(200deg) brightness(95%) contrast(85%);
}

.pricing-section .pricing-card p {
  font-size: 1rem;
  /* 16px - consistent with body text */
  color: #333;
  line-height: 1.6;
}

.pricing-section .pricing-card a {
  color: #3f51b5;
  text-decoration: none;
}

.pricing-section .pricing-card a.orange {
  color: #ff9900;
  font-weight: 600;
}

/* Products/Product Pages */
.products-intro h1 {
  font-family: "ToyotaTypeW02", sans-serif;
  font-weight: 600;
  /* Semibold - consistent with h1 */
  letter-spacing: 0.2px;
  font-size: 1.25rem;
  /* 20px - consistent with h4 */
  color: #333333;
}

.products-intro p {
  font-family: "ToyotaTypeW02", sans-serif;
  font-size: 1rem;
  /* 16px - consistent with body text */
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.products-title h1 {
  font-family: "ToyotaTypeW02", sans-serif;
  font-weight: 600;
  /* Semibold - consistent with h1 */
  letter-spacing: 0.2px;
  font-size: 1.25rem;
  /* 20px - consistent with h4 */
  color: #4f6ef7;
}

.products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1.5rem;
}

.products-grid-inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  justify-items: stretch;
  align-items: stretch;
}

.product-card-link {
  text-decoration: none;
  color: inherit;
}

.product-card {
  border: 1px solid #dde2f6;
  border-radius: 16px;
  padding: 1.5rem;
  background: #fff;
  transition: transform 0.2s;
  height: 100%;
}

.product-card h2 {
  font-family: "ToyotaTypeW02", sans-serif;
  font-size: 1.5rem;
  /* 24px - consistent with h3 */
  font-weight: 600;
  /* Semibold - consistent with h2 */
  margin-top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}

.product-card h2.large {
  font-size: 1.5rem;
  /* 24px - consistent with h3 */
}

.product-card img {
  width: 36px;
  height: 36px;
  display: inline-block;
  vertical-align: middle;
  /* SVGの色を文字色（#333F69）に合わせる */
  filter: brightness(0) saturate(100%) invert(25%) sepia(15%) saturate(2000%)
    hue-rotate(200deg) brightness(95%) contrast(85%);
}

.product-card p {
  font-family: "ToyotaTypeW02", sans-serif;
  font-size: 1rem;
  /* 16px - consistent with body text */
  line-height: 1.6;
  margin-bottom: 0;
}

/* Features/Use Cases Pages */
.feature-subtitle h2,
.use-case-subtitle h2 {
  font-family: "ToyotaTypeW02", sans-serif;
  font-weight: 600;
  /* Semibold - consistent with h2 */
  letter-spacing: 0.2px;
  font-size: 1.25rem;
  /* 20px - consistent with h4 */
}

.feature-section {
  margin-top: 40px;
}

.feature-section h2,
.use-case-section h2 {
  font-family: "ToyotaTypeW02", sans-serif;
  font-weight: 600;
  /* Semibold - consistent with h2 */
  font-size: 1.125rem;
  /* 18px - slightly larger for emphasis */
  color: #5a5b5d;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.use-case-link {
  color: #f87575;
  font-weight: 600;
  /* Semibold - consistent with emphasis */
  text-decoration: none;
}

tbody tr.doc-section-item {
  font-size: 0.75rem !important;
  /* your preferred size */
  /* line-height: 1.5; */
  /* better readability */
}

.doc-md-description,
.doc-md-description > p:first-child {
  font-size: 0.7rem !important;
  /* your preferred size */
  /* line-height: 1.5; */
  /* better readability */
}

p .doc-section-title {
  font-size: 0.8rem;
}