/* =============================================
   ACIDHOUSE INC - Main Stylesheet
   Typography matched to Google Blog Japan
   (https://blog.google/intl/ja-jp/)
   ============================================= */

/* === Typography Tokens (Google Blog JP Reference) === */
:root {
  /* Font Stacks */
  --font-primary: "Noto Sans JP", Roboto, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", Meiryo, Arial, Helvetica, sans-serif;
  --font-heading: "Noto Sans JP", Roboto, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Arial, Helvetica, sans-serif;

  /* Body Text */
  --body-font-size: 14px;
  --body-line-height: 1.8143;
  --body-font-weight: 400;
  --body-letter-spacing: 0.25px;

  /* Body Text — Desktop (≥1024px) */
  --body-font-size-lg: 16px;
  --body-line-height-lg: 1.725;
  --body-letter-spacing-lg: 0;

  /* Colors — Text */
  --color-body: #5f6368;
  --color-heading: #202124;
  --color-link: #1a73e8;
  --color-link-hover: #174ea6;
  --color-link-visited: #7b1fa2;
  --color-secondary: #5f6368;
  --color-dark: #202124;

  /* Heading Scale — Mobile-first (< 600px) */
  --h1-size: 32px;
  --h1-line-height: 1.25;
  --h1-weight: 400;
  --h1-letter-spacing: 0;

  --h2-size: 24px;
  --h2-line-height: 1.3333;
  --h2-weight: 400;
  --h2-letter-spacing: 0;

  --h3-size: 20px;
  --h3-line-height: 1.4;
  --h3-weight: 400;
  --h3-letter-spacing: 0;

  /* Layout — Header */
  --header-height: 80px;
  --header-height-mobile: 60px;

  /* Brand */
  --brand-emerald: #25b497;

  /* Nav / Menu */
  --nav-font-size: 14px;
  --nav-font-weight: 400;
  --nav-letter-spacing: 0.02em;

  /* Small / Caption */
  --small-font-size: 12px;
  --small-line-height: 1.5;
  --small-letter-spacing: 0.25px;

  /* Button / CTA */
  --button-font-size: 16px;
  --button-font-weight: 500;
  --button-line-height: 1.5;

  /* Eyebrow / Label */
  --eyebrow-font-size: 14px;
  --eyebrow-font-weight: 500;
  --eyebrow-letter-spacing: 0.25px;

  /* Footer */
  --footer-link-size: 14px;
  --footer-link-weight: 400;
  --footer-link-letter-spacing: -0.01em;
}

/* === Reset & Base === */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-primary);
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  font-weight: var(--body-font-weight);
  letter-spacing: var(--body-letter-spacing);
  color: var(--color-body);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--color-link);
  text-decoration: none;
  transition: color 0.3s, background 0.3s, opacity 0.3s;
}
a:hover { color: var(--color-link-hover); }

img { max-width: 100%; height: auto; vertical-align: bottom; }

.clearfix::after { content: ""; display: table; clear: both; }

.rich_font, .p-vertical {
  font-family: var(--font-primary);
}
.rich_font_type2 {
  font-family: var(--font-primary);
  font-weight: 500;
}

/* === Header (always-white fixed) === */
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px;
  height: var(--header-height);
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

#header a {
  color: var(--color-dark);
  transition: color 0.3s;
}
#header a:hover { color: var(--brand-emerald); text-decoration: none; }

#header_logo { flex-shrink: 0; }
#header_logo .logo { display: flex; align-items: center; }
#header_logo .logo a { display: flex; align-items: center; }
#header_logo .logo img {
  height: 38px;
  max-height: calc(var(--header-height) - 24px);
  width: auto;
}

/* type1 (white logo) removed from HTML; type2 (dark logo) is the only desktop logo */
.pc_logo_image.type2 { display: inline-block; }
.mobile_logo_image { display: none; }

/* === Navigation === */
#global_menu { margin-left: auto; }
#global_menu ul { list-style: none; display: flex; gap: 0; }
#global_menu ul li a {
  display: flex;
  align-items: center;
  padding: 0 20px;
  font-family: var(--font-heading);
  font-size: var(--nav-font-size);
  font-weight: var(--nav-font-weight);
  height: var(--header-height);
  line-height: 1;
  letter-spacing: var(--nav-letter-spacing);
  white-space: nowrap;
  color: var(--color-dark);
}
#global_menu ul li a:hover { color: var(--brand-emerald); text-decoration: none; }

/* Active nav underline (Google Blog tab-style) */
#global_menu ul li a {
  position: relative;
}
#global_menu ul li a.is-active {
  color: var(--color-dark);
}
#global_menu ul li a.is-active::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 3px;
  background: var(--brand-emerald);
  border-radius: 2px 2px 0 0;
}

#menu_button {
  display: none;
  font-size: 24px;
  cursor: pointer;
  position: relative;
  width: 30px;
  height: 20px;
}
#menu_button span { display: none; }
#menu_button::before {
  content: "≡";
  font-size: 28px;
  color: inherit;
}

/* === Page Header (Inner pages) === */
#page_header {
  position: relative;
  width: 100%;
  height: 450px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-top: 0;
}
#page_header .bg_image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#page_header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#page_header_inner {
  position: relative;
  z-index: 2;
  text-align: center;
}
#page_header_catch .catch {
  font-family: var(--font-heading);
  font-size: var(--h1-size);
  font-weight: var(--h1-weight);
  line-height: var(--h1-line-height);
  letter-spacing: var(--h1-letter-spacing);
  color: #FFFFFF;
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 0.8s ease forwards;
}
#page_header_catch .desc {
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  color: #FFFFFF;
}

/* === Index Header / Hero === */
#index_header_content {
  position: relative;
  width: 100%;
  height: 1000px;
  overflow: hidden;
}
#index_header_content.height_type1 { height: 1000px; }

#index_slider_wrap {
  position: relative;
  width: 100%;
  height: 100%;
}
#index_slider {
  position: relative;
  width: 100%;
  height: 100%;
}
#index_video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#index_video video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
}
#index_slider .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  z-index: 2;
}
#index_slider .caption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}
#index_slider .caption.mobile { display: none; }
#index_slider .caption_inner {
  text-align: center;
  padding: 0 30px;
}
#index_slider .catch {
  font-family: var(--font-heading);
  font-size: 32px;
  font-weight: var(--h1-weight);
  color: #FFFFFF;
  line-height: var(--h1-line-height);
  letter-spacing: 0;
  opacity: 0;
  transform: translateY(30px);
  animation: fadeInUp 1s 0.5s ease forwards;
}
#index_slider .desc {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.444;
  letter-spacing: 0;
  color: #FFFFFF;
  margin-top: 15px;
}

/* === Static NEWS Section (below hero) === */
.news-section {
  max-width: 980px;
  margin: 0 auto;
  padding: 60px 20px 40px;
}
.news-section .news-heading {
  font-family: var(--font-heading);
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-heading);
  margin-bottom: 24px;
}
.news-list {
  list-style: none;
  border-top: 1px solid #e5e5e5;
}
.news-list li {
  display: flex;
  align-items: baseline;
  gap: 20px;
  padding: 16px 0;
  border-bottom: 1px solid #e5e5e5;
}
.news-list .news-date {
  flex-shrink: 0;
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  color: var(--color-secondary);
  white-space: nowrap;
}
.news-list a.news-title {
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  color: var(--color-heading);
  text-decoration: none;
  transition: color 0.2s ease;
}
.news-list a.news-title:hover {
  color: var(--brand-emerald);
  text-decoration: none;
}

/* === Index Content Sections === */
.index_content1,
.index_content2 {
  padding: 80px 0;
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}
.index_content1 .catch,
.index_content2 .catch {
  font-family: var(--font-heading);
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-heading);
  margin-bottom: 40px;
}
.index_content1 .desc,
.index_content2 .desc {
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  text-align: left;
  margin-bottom: 40px;
  padding: 0 20px;
}
.index_content1 .image_list {
  display: flex;
  gap: 0;
  margin-bottom: 40px;
}
.index_content1 .image_list img {
  width: 33.333%;
  height: auto;
  object-fit: cover;
}

/* Content2 Image Section */
.index_content2 .image_content {
  position: relative;
  width: 100%;
  height: 400px;
  margin-bottom: 40px;
  background-size: cover;
  background-position: center;
}
.index_content2 .image_content .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.3);
}

/* Link Button */
.link_button {
  text-align: center;
}
.link_button a {
  display: inline-block;
  margin-top: 24px;
  font-family: var(--font-heading);
  font-size: var(--button-font-size);
  font-weight: 500;
  line-height: var(--button-line-height);
  letter-spacing: 0;
  color: var(--brand-emerald);
  background: none;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  text-decoration: none;
  transition: opacity 0.2s;
}
.link_button a:hover {
  color: var(--brand-emerald);
  background: none;
  text-decoration: underline;
  opacity: 0.85;
}

/* === CB Contents (content blocks) === */
.cb_contents { padding: 80px 20px; }
.cb_contents.last { border-bottom: none; }

/* === Main Contents (inner pages) === */
#main_contents {
  max-width: 980px;
  margin: 0 auto;
  padding: 60px 20px;
}
#main_col { width: 100%; }

.post_content {
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  color: var(--color-body);
}
.post_content h2 {
  font-family: var(--font-heading);
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-heading);
  margin: 40px 0 20px;
}
.post_content h3 {
  font-family: var(--font-heading);
  font-size: var(--h3-size);
  font-weight: var(--h3-weight);
  line-height: var(--h3-line-height);
  letter-spacing: var(--h3-letter-spacing);
  color: var(--color-heading);
  margin: 30px 0 15px;
}
.post_content h4 {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-heading);
  margin: 20px 0 10px;
}
.post_content p {
  margin-bottom: 20px;
}
.post_content ul {
  margin: 10px 0 20px 30px;
}
.post_content li {
  margin-bottom: 5px;
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
}
.post_content a { color: var(--color-link); }
.post_content a:hover { color: var(--color-link-hover); }

/* === Page Builder Rows === */
#tcd-pb-wrap { margin: 0; }

.tcd-pb-row { margin-bottom: 30px; }
.tcd-pb-row-inner { display: flex; flex-wrap: wrap; gap: 30px; }
.tcd-pb-col { flex: 1; min-width: 0; }
.tcd-pb-col.col1 { width: 100%; }

/* Two column layout */
.tcd-pb-row .tcd-pb-row-inner .tcd-pb-col.col1 + .tcd-pb-col.col2 {
  flex: 1;
}

.tcd-pb-widget { margin-bottom: 30px; }

.pb_headline {
  font-family: var(--font-heading);
  font-size: var(--h2-size);
  font-weight: var(--h2-weight);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-heading);
  text-align: center;
  margin-bottom: 20px;
}
.pb_font_family_type1 {
  font-family: var(--font-primary);
}

.pb-widget-image img {
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}

/* === Table Styles (About page) === */
.pb_simple_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 30px;
  font-size: var(--body-font-size);
  letter-spacing: var(--body-letter-spacing);
}
.pb_simple_table th,
.pb_simple_table td {
  padding: 15px 20px;
  border-bottom: 1px solid #e5e5e5;
  text-align: left;
  vertical-align: top;
}
.pb_simple_table th {
  width: 200px;
  font-weight: 500;
  background: #f9f9f9;
  white-space: nowrap;
  color: var(--color-heading);
}
.pb_simple_table td {
  color: var(--color-body);
}

/* === Tabs (About page) === */
.pb_tab { margin-bottom: 30px; }
.resp-tabs-list {
  list-style: none;
  display: flex;
  border-bottom: 2px solid #e5e5e5;
  margin-bottom: 30px;
}
.resp-tabs-list li {
  padding: 12px 30px;
  cursor: pointer;
  font-family: var(--font-heading);
  font-size: var(--eyebrow-font-size);
  font-weight: var(--eyebrow-font-weight);
  letter-spacing: var(--eyebrow-letter-spacing);
  border: 1px solid transparent;
  border-bottom: none;
  position: relative;
  bottom: -2px;
  color: var(--color-secondary);
  transition: color 0.3s;
}
.resp-tabs-list li.active {
  color: var(--color-heading);
  border-color: #e5e5e5;
  border-bottom: 2px solid #fff;
  background: #fff;
}
.resp-tabs-container .pb_tab_content { display: none; }
.resp-tabs-container .pb_tab_content.active { display: block; }

/* === Footer === */
#footer {
  margin-top: 0;
}

/* Upper footer: light gray nav links */
.footer-nav {
  background: #f5f5f5;
  padding: 60px 20px;
  text-align: center;
}
.footer-nav ul {
  list-style: none;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 32px;
}
.footer-nav li a {
  color: #5f6368;
  font-family: var(--font-heading);
  font-size: var(--footer-link-size);
  font-weight: var(--footer-link-weight);
  letter-spacing: var(--footer-link-letter-spacing);
  text-decoration: none;
  transition: color 0.2s;
}
.footer-nav li a:hover {
  color: var(--brand-emerald);
  text-decoration: none;
}

/* Lower copyright strip */
#copyright {
  text-align: center;
  padding: 18px 20px;
  font-size: 11px;
  letter-spacing: 0.03em;
  line-height: 1.5;
  background: #111;
  color: #ccc;
  margin: 0;
}

/* === Drawer Menu (Mobile) === */
#drawer_menu {
  position: fixed;
  top: var(--header-height-mobile);
  right: -300px;
  width: 300px;
  height: calc(100% - var(--header-height-mobile));
  background: #fff;
  z-index: 10001;
  overflow-y: auto;
  transition: right 0.3s ease;
}
#drawer_menu.open { right: 0; }

#drawer_menu .close_button {
  display: block;
  padding: 16px 20px;
  color: var(--color-dark);
  font-size: 20px;
  cursor: pointer;
  text-align: right;
  border-bottom: 1px solid #e5e5e5;
}
#drawer_menu .close_button:hover { color: #fff; background: #ff4b54; }

#mobile_menu {
  list-style: none;
  padding: 8px 0;
}
#mobile_menu li + li {
  margin-top: 2px;
}
#mobile_menu li a {
  display: block;
  padding: 18px 24px;
  color: var(--color-dark);
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
  font-family: var(--font-heading);
  font-size: var(--button-font-size);
  font-weight: var(--button-font-weight);
  line-height: var(--button-line-height);
  letter-spacing: 0;
  transition: background 0.2s, color 0.2s;
}
#mobile_menu li a:hover { color: #fff; background: #ff4b54; }

/* Drawer overlay */
.drawer-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 10000;
  display: none;
}
.drawer-overlay.active { display: block; }

/* === Animations === */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

/* === Business Page Specifics === */
.business-row-header .pb_headline {
  font-size: 32px;
  line-height: 1.25;
}
.business-two-col { display: flex; gap: 30px; }
.business-two-col .business-col { flex: 1; }
.business-two-col .business-col .pb_headline {
  font-size: var(--h3-size);
  font-weight: var(--h3-weight);
  line-height: var(--h3-line-height);
}
.business-two-col .business-col img { width: 100%; margin-bottom: 15px; }
.business-two-col .business-col p {
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  text-align: left;
  color: var(--color-body);
}

/* ===================================================================
   Responsive — Desktop-up (≥1024px)
   Google Blog JP switches body 14→16, headings scale up
   =================================================================== */
@media screen and (min-width: 1024px) {
  body {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .post_content {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .post_content li {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .post_content h2 {
    font-size: 44px;
    line-height: 1.1818;
    letter-spacing: -0.5px;
  }

  .post_content h3 {
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
  }

  .post_content h4 {
    font-size: 20px;
    line-height: 1.4;
  }

  #page_header_catch .catch {
    font-size: 56px;
    line-height: 1.1786;
    letter-spacing: -0.5px;
  }

  #page_header_catch .desc {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  #index_slider .catch {
    font-size: 56px;
    line-height: 1.1786;
    letter-spacing: -0.5px;
  }

  #index_slider .desc {
    font-size: 24px;
    line-height: 1.3333;
    letter-spacing: 0;
  }

  .index_content1 .catch,
  .index_content2 .catch {
    font-size: 44px;
    line-height: 1.1818;
    letter-spacing: -0.5px;
  }

  .index_content1 .desc,
  .index_content2 .desc {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .pb_headline {
    font-size: 44px;
    line-height: 1.1818;
    letter-spacing: -0.5px;
  }

  .business-row-header .pb_headline {
    font-size: 44px;
    line-height: 1.1818;
    letter-spacing: -0.5px;
  }

  .business-two-col .business-col .pb_headline {
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
  }

  .business-two-col .business-col p {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .pb_simple_table {
    font-size: var(--body-font-size-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }

  .news-section .news-heading {
    font-size: 44px;
    line-height: 1.1818;
    letter-spacing: -0.5px;
  }

  .news-list .news-date,
  .news-list .news-title {
    font-size: var(--body-font-size-lg);
    line-height: var(--body-line-height-lg);
    letter-spacing: var(--body-letter-spacing-lg);
  }
}

/* ===================================================================
   Responsive — Tablet (≥600px, <1024px)
   Google Blog JP intermediate: h1 38px, h2 32px, h3 24px
   =================================================================== */
@media screen and (min-width: 600px) and (max-width: 1023px) {
  .post_content h2 {
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: 0;
  }

  .post_content h3 {
    font-size: 24px;
    line-height: 1.3333;
    letter-spacing: 0;
  }

  #page_header_catch .catch {
    font-size: 38px;
    line-height: 1.1579;
    letter-spacing: 0;
  }

  #index_slider .catch {
    font-size: 38px;
    line-height: 1.1579;
  }

  .index_content1 .catch,
  .index_content2 .catch {
    font-size: 32px;
    line-height: 1.25;
  }

  .pb_headline {
    font-size: 32px;
    line-height: 1.25;
  }

  .business-row-header .pb_headline {
    font-size: 32px;
    line-height: 1.25;
  }

  .business-two-col .business-col .pb_headline {
    font-size: 24px;
    line-height: 1.3333;
  }

  .news-section .news-heading {
    font-size: 32px;
    line-height: 1.25;
  }
}

/* ===================================================================
   Responsive — Layout breakpoint (≤1050px) — non-typography preserved
   =================================================================== */
@media screen and (max-width: 1050px) {
  #header {
    height: var(--header-height-mobile);
    padding: 0 15px;
  }
  .pc_logo_image { display: none !important; }
  .mobile_logo_image { display: inline-block !important; }
  #header_logo .logo img {
    height: 35px;
    max-height: calc(var(--header-height-mobile) - 16px);
  }

  #global_menu { display: none; }
  #menu_button { display: block; color: var(--color-dark); }
  /* On mobile, header lang toggle sits next to hamburger */
  #header .lang-toggle { margin-left: auto; margin-right: 12px; }

  #index_header_content { height: calc(100vh - var(--header-height-mobile)); }
  #index_slider .caption.pc { display: none; }
  #index_slider .caption.mobile { display: flex; }
  #index_slider .overlay { background: rgba(0,0,0,0.5); }

  #page_header { height: 300px; margin-top: 0; }

  .index_content1,
  .index_content2 { padding: 50px 20px; }
  .index_content2 .image_content { height: 250px; }

  .cb_contents { padding: 50px 15px; }

  #main_contents { padding: 40px 15px; }

  .tcd-pb-row-inner { flex-direction: column; gap: 20px; }

  .business-two-col { flex-direction: column; }

  .news-section { padding: 40px 15px 30px; }
}

/* ===================================================================
   Responsive — Small screens (≤650px)
   =================================================================== */
@media screen and (max-width: 650px) {
  #index_slider .catch {
    font-size: 24px;
    line-height: 1.3333;
    letter-spacing: 0;
  }
  #index_slider .desc {
    font-size: 14px;
    line-height: 1.7143;
    letter-spacing: 0.25px;
  }

  #page_header_catch .catch {
    font-size: 24px;
    line-height: 1.3333;
  }

  .index_content1 .catch,
  .index_content2 .catch {
    font-size: 20px;
    line-height: 1.4;
  }

  .index_content1 .desc,
  .index_content2 .desc {
    font-size: 14px;
    line-height: 1.7143;
    letter-spacing: 0.25px;
  }

  .index_content1 .image_list { flex-direction: column; }
  .index_content1 .image_list img { width: 100%; }

  .news-section .news-heading {
    font-size: 20px;
    line-height: 1.4;
  }
  .news-list li a {
    flex-direction: column;
    gap: 4px;
  }

  .footer-nav { padding: 40px 15px; }
  .footer-nav ul { flex-direction: column; align-items: center; gap: 12px; }

  .pb_simple_table th { display: block; width: 100%; }
  .pb_simple_table td { display: block; width: 100%; }

  .resp-tabs-list { flex-direction: column; }
  .resp-tabs-list li { border-bottom: 1px solid #e5e5e5; }

  .pb_headline {
    font-size: 20px;
    line-height: 1.4;
  }
  .business-row-header .pb_headline {
    font-size: 24px;
    line-height: 1.3333;
  }
}

/* Fixed header offset — push content below header */
body { padding-top: var(--header-height); }
@media screen and (max-width: 1050px) {
  body { padding-top: var(--header-height-mobile); }
}

/* === Google Maps embed === */
.map-container iframe {
  width: 100%;
  height: 450px;
  border: 0;
}

/* === Bilingual: data-lang switching === */
[data-lang] { display: none !important; }
html[data-site-lang="en"] [data-lang="en"] { display: initial !important; }
html[data-site-lang="ja"] [data-lang="ja"] { display: initial !important; }
/* Block-level bilingual wrappers need display:block (not initial) */
html[data-site-lang="en"] div[data-lang="en"],
html[data-site-lang="en"] p[data-lang="en"],
html[data-site-lang="en"] li[data-lang="en"],
html[data-site-lang="en"] section[data-lang="en"],
html[data-site-lang="en"] article[data-lang="en"],
html[data-site-lang="en"] h1[data-lang="en"],
html[data-site-lang="en"] h2[data-lang="en"],
html[data-site-lang="en"] h3[data-lang="en"],
html[data-site-lang="en"] h4[data-lang="en"],
html[data-site-lang="en"] ul[data-lang="en"],
html[data-site-lang="en"] table[data-lang="en"],
html[data-site-lang="en"] tr[data-lang="en"] { display: block !important; }
html[data-site-lang="ja"] div[data-lang="ja"],
html[data-site-lang="ja"] p[data-lang="ja"],
html[data-site-lang="ja"] li[data-lang="ja"],
html[data-site-lang="ja"] section[data-lang="ja"],
html[data-site-lang="ja"] article[data-lang="ja"],
html[data-site-lang="ja"] h1[data-lang="ja"],
html[data-site-lang="ja"] h2[data-lang="ja"],
html[data-site-lang="ja"] h3[data-lang="ja"],
html[data-site-lang="ja"] h4[data-lang="ja"],
html[data-site-lang="ja"] ul[data-lang="ja"],
html[data-site-lang="ja"] table[data-lang="ja"],
html[data-site-lang="ja"] tr[data-lang="ja"] { display: block !important; }
/* Flex items that use data-lang — news list, nav links */
html[data-site-lang="en"] .news-list li[data-lang="en"],
html[data-site-lang="ja"] .news-list li[data-lang="ja"] { display: list-item !important; }
html[data-site-lang="en"] table[data-lang="en"],
html[data-site-lang="ja"] table[data-lang="ja"] { display: table !important; }
html[data-site-lang="en"] tr[data-lang="en"],
html[data-site-lang="ja"] tr[data-lang="ja"] { display: table-row !important; }

/* === Language Toggle UI === */
.lang-toggle {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-left: 16px;
  flex-shrink: 0;
}
.lang-toggle-btn {
  display: inline-block;
  padding: 4px 10px;
  font-family: var(--font-heading);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: var(--color-secondary);
  background: none;
  border: 1px solid #e0e0e0;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
  line-height: 1.4;
  white-space: nowrap;
}
.lang-toggle-btn:first-child { border-radius: 3px 0 0 3px; }
.lang-toggle-btn:last-child { border-radius: 0 3px 3px 0; border-left: 0; }
.lang-toggle-btn.active {
  color: #fff;
  background: var(--color-dark);
  border-color: var(--color-dark);
}
.lang-toggle-btn:hover:not(.active) {
  border-color: var(--color-dark);
  color: var(--color-dark);
}
/* Mobile: inside drawer menu */
.drawer-lang-toggle {
  display: flex;
  justify-content: center;
  padding: 16px 24px 8px;
}
.drawer-lang-toggle .lang-toggle {
  margin-left: 0;
}

/* === Form styles (Contact page legacy) === */
.formWrap {
  margin: 0;
  padding: 1rem;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-family: var(--font-primary);
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
  color: var(--color-body);
}