/* Local preview-only overrides. Keep production changes in the WordPress implementation files. */

/* Keep screen-reader-only headings hidden. On production the theme
   outputs an <h1 class="u-sr-only"> site title that was rendering
   visibly at the very top; force it back to visually-hidden. */
.u-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Hamburger menu: remove the slow white fade-in. The theme fades
   the nav list in over ~0.9s (with delay), leaving the items
   faint/whitish and hard to read. Kill the transition/animation
   so it opens instantly, and force full opacity ONLY while the
   menu is open (body.js-body__noscroll) so the closed menu stays
   hidden by the theme's own mechanism. */
.ol-header__nav,
.ol-header__nav-list,
.ol-header__nav-item,
.ol-header__nav-anchor,
.ol-blur__overlay {
  transition: none !important;
  animation: none !important;
}

.js-body__noscroll .ol-header__nav-list,
.js-body__noscroll .ol-header__nav-item,
.js-body__noscroll .ol-header__nav-anchor {
  opacity: 1 !important;
}

/* Remove the translucent white dim layer entirely — it left a
   "white film" over the page (visible especially as the mobile
   address bar resizes, fixed by a tiny scroll). */
.ol-blur__overlay {
  display: none !important;
}

/* Make the open menu a solid, full-screen panel that always
   covers the viewport (use dynamic viewport height so there is
   no white gap when the mobile address bar shows/hides). */
.js-body__noscroll .ol-header__nav {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  background: #fffef9 !important;
  overflow-y: auto !important;
}

/* === Mobile header: slimmer + 3-bar hamburger icon === */
@media (max-width: 1339px) {
  /* Slim down the header bar (a touch thicker than the previous pass) */
  .ol-header__inner {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    min-height: 0 !important;
  }
  .ol-header__title-anchor,
  .ol-header__title-logo {
    line-height: 1 !important;
  }
  .ol-header__title-logo img {
    height: 40px !important;
    width: auto !important;
    max-height: 40px !important;
    display: block !important;
  }
  /* Optional CTA button (お問い合わせ) in header — keep compact */
  .ol-header__cvbutton a.ol-btn-regular {
    padding: 8px 14px !important;
    font-size: 12px !important;
  }

  /* Hamburger: rebuild as 3 thin bars. The theme renders the two
     <span>s using a ::before pseudo (beige #d6bda5) and applies
     margin-top / bottom to position them — we override all of it
     and draw the bars directly on the spans + an ::after on the
     inner container, so we get 3 evenly-spaced lines. */
  .ol-hamburger__menu-icon {
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .ol-hamburger__menu-icon-inner {
    position: relative !important;
    width: 24px !important;
    height: 18px !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .ol-hamburger__menu-icon-label {
    display: none !important;
  }
  /* Kill the theme's pseudo bars on each <span> */
  .ol-hamburger__menu-icon-inner span::before,
  .ol-hamburger__menu-icon-inner span::after {
    content: none !important;
    background: transparent !important;
  }
  /* Draw 3 bars: span1 (top), span2 (middle), inner::after (bottom) */
  .ol-hamburger__menu-icon-inner span,
  .ol-hamburger__menu-icon-inner::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    margin: 0 !important;
    width: 24px !important;
    height: 2px !important;
    background: #6c6059 !important;
    border-radius: 2px !important;
    transform: none;
    transition: transform 0.2s ease, opacity 0.2s ease, top 0.2s ease !important;
  }
  .ol-hamburger__menu-icon-inner span:nth-of-type(1) { top: 0 !important; }
  .ol-hamburger__menu-icon-inner span:nth-of-type(2) { top: 8px !important; }
  .ol-hamburger__menu-icon-inner::after { top: 16px !important; }

  /* Open state → animated × */
  .js-body__noscroll .ol-hamburger__menu-icon-inner span:nth-of-type(1) {
    top: 8px !important;
    transform: rotate(45deg) !important;
  }
  .js-body__noscroll .ol-hamburger__menu-icon-inner span:nth-of-type(2) {
    opacity: 0 !important;
  }
  .js-body__noscroll .ol-hamburger__menu-icon-inner::after {
    top: 8px !important;
    transform: rotate(-45deg) !important;
  }

  /* Open menu: tighten vertical rhythm so all nav items fit on one
     screen without scrolling (was 9 items × 73px + 105px top gap).
     Trim the top gap and each anchor's vertical padding — kept
     comfortable, not cramped. */
  .js-body__noscroll .ol-header__nav {
    padding-top: 80px !important;
    padding-bottom: 16px !important;
  }
  .js-body__noscroll .ol-header__nav-anchor {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }
  /* The theme caps the nav list at max-height:66% with its own
     inner scroll, which hid the last items (BLOG / お知らせ) behind a
     scroll. Let the list size to its content and let the whole nav
     panel scroll only if it truly overflows. */
  .js-body__noscroll .ol-header__nav-list {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
  }
  /* Pull the SNS row up a touch so it sits right under the list */
  .js-body__noscroll .ol-header__sns {
    margin-top: 12px !important;
  }
}

.js-loading-noscroll {
  height: auto !important;
  overflow: auto !important;
}

.js-loading-noscroll .ol-wrapper {
  opacity: 1 !important;
}

.js-loading-noscroll .ol-wrapper::before,
#olLoading {
  display: none !important;
}

.ol-animation,
.ol-service__heading-wrapper,
.ol-service__list-item,
.ol-product__heading-wrapper,
.ol-product__image,
.ol-product__content,
.ol-story__heading-wrapper,
.ol-story__list,
.ol-faq__heading-wrapper,
.ol-faq__list,
.ol-voice__heading-wrapper,
.ol-voice__list,
.ol-message__image-item1,
.ol-message__image-item2,
.ol-message__caption-body,
.ol-message__heading-sp,
.ol-message__content,
.ol-news__heading-wrapper,
.ol-news__nav,
.ol-news__body,
.ol-media__heading-wrapper,
.ol-media__list,
.ol-media__list .ol-card-item,
.ol-contact__heading-wrapper,
.ol-contact__hours,
.ol-contact__body-inner,
.ol-access__image,
.ol-access__heading-wrapper,
.ol-access__info,
.ol-banner__heading-wrapper,
.ol-banner__list {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* ============================================================
 * Labosec PC navigation (preview)
 * ------------------------------------------------------------
 * Mirrors the existing hamburger menu items as in-line anchor
 * links. Targets are section anchors on the top page, so they
 * scroll on the home page and navigate to the home page + jump
 * from any sub-page. Mobile remains untouched (hamburger only).
 * ============================================================ */

.labosec-desktop-nav {
  display: none;
}

/* Header must sit above the absolutely positioned first-view
   title (z:100) at every width. */
.ol-header {
  position: relative;
  z-index: 200;
}

/* The PC nav has many items + a CTA, so it only fits comfortably
   at ~1300px and up. Below that we keep the theme hamburger to
   avoid the nav colliding with the お問い合わせ button. */
@media (min-width: 1340px) {
  .ol-header__inner {
    gap: 28px;
  }

  /* Hide hamburger icon on PC; keep markup for theme JS hooks. */
  .ol-hamburger__menu-icon {
    display: none;
  }

  .ol-header__cvbutton {
    margin-left: auto;
  }

  .labosec-desktop-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 24px;
    font-family: "Noto Sans JP", sans-serif;
  }

  .labosec-nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 10px 12px;
    color: #6c6059;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 1.5;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
  }

  .labosec-nav__link::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 4px;
    height: 1px;
    background: #d6bda5;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.25s ease;
  }

  .labosec-nav__link:hover {
    color: #b9986f;
  }

  .labosec-nav__link:hover::after {
    transform: scaleX(1);
  }
}

@media (min-width: 1340px) and (max-width: 1480px) {
  .labosec-desktop-nav {
    margin-left: 16px;
  }

  .labosec-nav__link {
    padding: 10px 9px;
    font-size: 13px;
  }

  .labosec-nav__link::after {
    left: 9px;
    right: 9px;
  }
}

/* ============================================================
 * Audience branching section (preview-only)
 * Placed right after the hero so visitors can self-identify
 * before scrolling through generic info.
 * ============================================================ */
.labosec-audience__section {
  padding: clamp(48px, 7vw, 96px) clamp(20px, 5vw, 60px);
  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.06) 100%);
  font-family: "Noto Sans JP", sans-serif;
  color: #6c6059;
}

.labosec-audience__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.labosec-audience__heading-wrapper {
  text-align: center;
  margin-bottom: clamp(32px, 4vw, 56px);
}

.labosec-audience__heading-sub {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.2em;
  color: rgba(214, 189, 165, 0.9);
  margin-bottom: 8px;
  text-transform: uppercase;
}

.labosec-audience__heading {
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 500;
  letter-spacing: 0.06em;
  margin: 0 0 14px;
  color: #6c6059;
}

.labosec-audience__lead {
  font-size: 14px;
  line-height: 1.9;
  color: rgba(108, 96, 89, 0.78);
  margin: 0;
}

.labosec-audience__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 640px) {
  .labosec-audience__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

@media (min-width: 1024px) {
  .labosec-audience__list {
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
  }
}

.labosec-audience__item {
  margin: 0;
  padding: 0;
}

.labosec-audience__card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 28px 22px 26px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  transition: transform 0.28s ease, border-color 0.25s ease,
              box-shadow 0.28s ease, background-color 0.25s ease;
}

.labosec-audience__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(214, 189, 165, 0) 0%, rgba(214, 189, 165, 0.1) 100%);
  opacity: 0;
  transition: opacity 0.28s ease;
  pointer-events: none;
}

.labosec-audience__card:hover {
  transform: translateY(-4px);
  border-color: #d6bda5;
  box-shadow: 0 18px 36px -22px rgba(108, 96, 89, 0.28),
              0 8px 18px -12px rgba(214, 189, 165, 0.32);
}

.labosec-audience__card:hover::before {
  opacity: 1;
}

.labosec-audience__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(214, 189, 165, 0.14);
  color: #b9986f;
  margin-bottom: 4px;
  transition: background-color 0.25s ease, color 0.25s ease;
}

.labosec-audience__card:hover .labosec-audience__icon {
  background: rgba(214, 189, 165, 0.24);
}

.labosec-audience__en {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.14em;
  color: rgba(214, 189, 165, 0.95);
  text-transform: uppercase;
}

.labosec-audience__title {
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #6c6059;
  line-height: 1.5;
}

.labosec-audience__desc {
  font-size: 13.5px;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.78);
  flex: 1 1 auto;
}

.labosec-audience__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: #b9986f;
  font-weight: 500;
}

.labosec-audience__arrow {
  transition: transform 0.28s ease;
}

.labosec-audience__card:hover .labosec-audience__arrow {
  transform: translateX(4px);
}

/* ============================================================
 * Profile page (/profile/, page-id-46) — bring it in line with
 * the rest of the site: soft ground, centered title, accented
 * section headings, tidy lists. Content unchanged.
 * ============================================================ */
body.page-id-46 .ol-article__body {
  max-width: 820px;
  margin: 0 auto !important;
  padding: clamp(36px, 5vw, 64px) clamp(20px, 5vw, 56px) !important;
  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.04) 100%);
  border-radius: 18px;
}

body.page-id-46 .ol-article__title {
  text-align: center;
  font-size: clamp(28px, 3.6vw, 40px) !important;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #6c6059;
  padding: 8px 0 22px !important;
  margin: 0 0 36px !important;
  border-bottom: 0 !important;
}

body.page-id-46 .ol-article__title::before {
  content: "Profile";
  display: block;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 12px;
  text-transform: uppercase;
}

body.page-id-46 .ol-article__title::after {
  content: "";
  display: block;
  width: 56px;
  height: 1px;
  background: #b9986f;
  margin: 22px auto 0;
}

/* Section headings — left accent bar, drop the theme box */
body.page-id-46 .ol-article__content h2.wp-block-heading {
  position: relative;
  font-size: clamp(19px, 2.3vw, 23px) !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #6c6059 !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(214, 189, 165, 0.3) !important;
  border-radius: 0 !important;
  padding: 0 0 12px 16px !important;
  margin: 44px 0 20px !important;
}

body.page-id-46 .ol-article__content h2.wp-block-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  width: 4px;
  height: 20px;
  border-radius: 2px;
  background: #d6bda5;
}

body.page-id-46 .ol-article__content p {
  font-size: 14.5px;
  line-height: 2.0;
  color: rgba(108, 96, 89, 0.85);
  margin: 0 0 16px;
  text-wrap: pretty;
}

/* Lists (実績 / 対応可能業務 / ツール / 経歴 / 保有資格) */
body.page-id-46 .ol-article__content ul.wp-block-list {
  list-style: none !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}

@media (min-width: 680px) {
  body.page-id-46 .ol-article__content ul.wp-block-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 4px 28px;
  }
}

body.page-id-46 .ol-article__content ul.wp-block-list li {
  position: relative;
  padding: 7px 0 7px 20px !important;
  margin: 0 !important;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(108, 96, 89, 0.85);
}

body.page-id-46 .ol-article__content ul.wp-block-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 15px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d6bda5;
}

body.page-id-46 .ol-article__content ul.wp-block-list li::after {
  display: none !important;
}

@media (max-width: 720px) {
  body.page-id-46 .ol-article__body {
    padding: 28px 16px 36px !important;
    border-radius: 12px;
  }
  body.page-id-46 .ol-article__title {
    font-size: 26px !important;
  }
  body.page-id-46 .ol-article__content h2.wp-block-heading {
    font-size: 18px !important;
  }
}

/* ============================================================
 * Contact form page (/contact/, page-id-40) — tighten spacing
 * so more of the form is visible at once, and style fields to
 * match the rounded, beige tone of the site. Content unchanged.
 * ============================================================ */
body.page-id-40 .ol-article__body {
  max-width: 720px;
  margin: 0 auto !important;
  padding: clamp(28px, 4vw, 44px) clamp(20px, 4vw, 40px) clamp(36px, 5vw, 56px) !important;
  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.04) 100%);
  border-radius: 18px;
}

body.page-id-40 .ol-article__title {
  text-align: center;
  font-size: clamp(26px, 3.4vw, 38px) !important;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #6c6059;
  padding: 8px 0 18px !important;
  margin: 0 0 8px !important;
  border-bottom: 0 !important;
}

body.page-id-40 .ol-article__title::before {
  content: "Contact";
  display: block;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 12px;
  text-transform: uppercase;
}

body.page-id-40 .ol-article__title::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  background: #b9986f;
  margin: 18px auto 0;
}

/* Intro note */
body.page-id-40 .ol-article__content > p:first-of-type {
  text-align: center;
  font-size: 13.5px;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.72);
  max-width: 600px;
  margin: 0 auto 28px !important;
}

/* Form rows — compact, no theme dividers */
body.page-id-40 .wpcf7-form p {
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  position: static !important;
}

/* Remove the theme's gray divider line drawn under each field
   (an absolutely-positioned ::after) — it overlapped labels
   once the spacing was tightened. */
body.page-id-40 .wpcf7-form p::after,
body.page-id-40 .wpcf7-form p::before {
  display: none !important;
  content: none !important;
}

body.page-id-40 .wpcf7-form p br {
  display: none;
}

body.page-id-40 .wpcf7-form label {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #6c6059;
  margin-bottom: 7px;
}

/* Inputs & textareas */
body.page-id-40 .wpcf7-form input[type="text"],
body.page-id-40 .wpcf7-form input[type="email"],
body.page-id-40 .wpcf7-form input[type="tel"],
body.page-id-40 .wpcf7-form input[type="date"],
body.page-id-40 .wpcf7-form select,
body.page-id-40 .wpcf7-form textarea {
  width: 100% !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(214, 189, 165, 0.5) !important;
  border-radius: 10px !important;
  background: #fffef9 !important;
  font-size: 14px !important;
  color: #6c6059 !important;
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body.page-id-40 .wpcf7-form input:focus,
body.page-id-40 .wpcf7-form textarea:focus,
body.page-id-40 .wpcf7-form select:focus {
  outline: none;
  border-color: #b9986f !important;
  box-shadow: 0 0 0 3px rgba(214, 189, 165, 0.18);
}

/* Shorter textareas so the whole form is easier to scan */
body.page-id-40 .wpcf7-form textarea {
  min-height: 96px !important;
  height: 96px !important;
  line-height: 1.7;
  resize: vertical;
}

/* Radio / checkbox groups laid out as wrapped chips-like rows */
body.page-id-40 .wpcf7-form .wpcf7-radio,
body.page-id-40 .wpcf7-form .wpcf7-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
}

body.page-id-40 .wpcf7-list-item {
  margin: 0 !important;
}

body.page-id-40 .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 400;
  margin: 0;
  cursor: pointer;
}

body.page-id-40 .wpcf7-list-item input {
  accent-color: #b9986f;
  width: 16px;
  height: 16px;
}

body.page-id-40 .wpcf7-list-item-label {
  font-size: 13.5px;
  color: #6c6059;
}

/* Submit button — match the site CTA */
body.page-id-40 .wpcf7-form p:last-of-type {
  text-align: center;
  margin-top: 28px !important;
}

body.page-id-40 .wpcf7-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 260px;
  padding: 16px 40px !important;
  background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%) !important;
  color: #fffef9 !important;
  font-size: 15.5px !important;
  font-weight: 600;
  letter-spacing: 0.08em;
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer;
  box-shadow: 0 12px 28px -16px rgba(108, 96, 89, 0.4),
              0 6px 14px -10px rgba(185, 152, 111, 0.5);
  transition: transform 0.22s ease, box-shadow 0.25s ease;
}

body.page-id-40 .wpcf7-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px -16px rgba(108, 96, 89, 0.45),
              0 10px 20px -10px rgba(185, 152, 111, 0.55);
}

@media (max-width: 720px) {
  body.page-id-40 .ol-article__body {
    padding: 24px 16px 36px !important;
    border-radius: 12px;
  }
  body.page-id-40 .ol-article__title {
    font-size: 26px !important;
  }
  body.page-id-40 .wpcf7-submit {
    min-width: 0;
    width: 100%;
  }
}

/* ============================================================
 * Audience detail pages (researchers / entrepreneurs /
 * professionals / corporations) – visual redesign only.
 * Text content is unchanged; layout, hierarchy, icons added
 * purely through CSS.
 * ============================================================ */

body.page-id-49 .ol-article__body,
body.page-id-164 .ol-article__body,
body.page-id-175 .ol-article__body,
body.page-id-179 .ol-article__body {
  --lbsc-accent: #b9986f;
  --lbsc-accent-soft: rgba(214, 189, 165, 0.16);
  --lbsc-accent-line: rgba(214, 189, 165, 0.4);
  --lbsc-ink: #6c6059;
  --lbsc-ink-soft: rgba(108, 96, 89, 0.78);
  --lbsc-surface: #fffef9;

  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.04) 100%);
  padding: clamp(40px, 6vw, 72px) clamp(20px, 5vw, 56px) !important;
  border-radius: 18px;
  margin-top: 0 !important;
}

/* --- Page title ------------------------------------------------ */
body.page-id-49 .ol-article__title,
body.page-id-164 .ol-article__title,
body.page-id-175 .ol-article__title,
body.page-id-179 .ol-article__title {
  position: relative;
  font-size: clamp(28px, 3.8vw, 42px) !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--lbsc-ink);
  text-align: center;
  padding: 28px 0 24px;
  margin: 0 0 32px !important;
  border-bottom: 0 !important;
}

body.page-id-49 .ol-article__title::before,
body.page-id-164 .ol-article__title::before,
body.page-id-175 .ol-article__title::before,
body.page-id-179 .ol-article__title::before {
  content: attr(data-en);
  display: block;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 12px;
  text-transform: uppercase;
}

body.page-id-49 .ol-article__title::after,
body.page-id-164 .ol-article__title::after,
body.page-id-175 .ol-article__title::after,
body.page-id-179 .ol-article__title::after {
  content: "";
  display: block;
  width: 56px;
  height: 1px;
  background: var(--lbsc-accent);
  margin: 22px auto 0;
}

/* English label per page */
body.page-id-49  .ol-article__title::before { content: "For Researchers"; }
body.page-id-164 .ol-article__title::before { content: "For Entrepreneurs"; }
body.page-id-175 .ol-article__title::before { content: "For Professionals"; }
body.page-id-179 .ol-article__title::before { content: "For Corporations"; }

/* --- Lead paragraph (first <p> in content) -------------------- */
body.page-id-49 .ol-article__content > p:first-of-type,
body.page-id-164 .ol-article__content > p:first-of-type,
body.page-id-175 .ol-article__content > p:first-of-type,
body.page-id-179 .ol-article__content > p:first-of-type {
  max-width: 760px;
  margin: 0 auto 40px !important;
  padding: 24px 28px;
  background: var(--lbsc-surface);
  border-left: 3px solid var(--lbsc-accent);
  border-radius: 4px 12px 12px 4px;
  font-size: 15px;
  line-height: 2.0;
  color: var(--lbsc-ink);
  box-shadow: 0 8px 24px -18px rgba(108, 96, 89, 0.18);
}

/* --- Basic services list (first <ul> before any h3) ----------- */
body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px 18px;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 auto 56px !important;
  max-width: 880px;
}

@media (min-width: 720px) {
  body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type {
    grid-template-columns: repeat(2, 1fr);
  }
}

body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type > li {
  position: relative;
  padding: 14px 16px 14px 44px !important;
  background: var(--lbsc-surface);
  border: 1px solid var(--lbsc-accent-line);
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.6;
  list-style: none !important;
  margin: 0 !important;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type > li::before,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type > li::before,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type > li::before,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type > li::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  background-color: var(--lbsc-accent);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
}

body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type > li::after,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type > li::after,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type > li::after,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type > li::after {
  display: none !important;
}

/* --- Section headings (h3 with id academic/accounting/financial) ----- */
body.page-id-49 .ol-article__content h3.wp-block-heading,
body.page-id-164 .ol-article__content h3.wp-block-heading,
body.page-id-175 .ol-article__content h3.wp-block-heading,
body.page-id-179 .ol-article__content h3.wp-block-heading {
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: clamp(20px, 2.4vw, 26px) !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--lbsc-ink);
  padding: 28px 0 16px 0 !important;
  margin: 64px 0 24px !important;
  border: 0 !important;
  background: none !important;
}

body.page-id-49 .ol-article__content h3.wp-block-heading::before,
body.page-id-164 .ol-article__content h3.wp-block-heading::before,
body.page-id-175 .ol-article__content h3.wp-block-heading::before,
body.page-id-179 .ol-article__content h3.wp-block-heading::before {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12px;
  letter-spacing: 0.24em;
  color: rgba(214, 189, 165, 0.95);
  font-weight: 500;
  width: 48px;
  flex: 0 0 auto;
  padding-top: 2px;
}

body.page-id-49 .ol-article__content h3#academic::before,
body.page-id-164 .ol-article__content h3#academic::before,
body.page-id-175 .ol-article__content h3#academic::before,
body.page-id-179 .ol-article__content h3#academic::before { content: "01"; }
body.page-id-49 .ol-article__content h3#accounting::before,
body.page-id-164 .ol-article__content h3#accounting::before,
body.page-id-175 .ol-article__content h3#accounting::before,
body.page-id-179 .ol-article__content h3#accounting::before { content: "02"; }
body.page-id-49 .ol-article__content h3#financial::before,
body.page-id-164 .ol-article__content h3#financial::before,
body.page-id-175 .ol-article__content h3#financial::before,
body.page-id-179 .ol-article__content h3#financial::before { content: "03"; }

body.page-id-49 .ol-article__content h3.wp-block-heading::after,
body.page-id-164 .ol-article__content h3.wp-block-heading::after,
body.page-id-175 .ol-article__content h3.wp-block-heading::after,
body.page-id-179 .ol-article__content h3.wp-block-heading::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, var(--lbsc-accent-line) 0%, transparent 100%);
}

/* --- Section intro paragraph (p directly after h3) ------------ */
body.page-id-49 .ol-article__content h3 + p,
body.page-id-164 .ol-article__content h3 + p,
body.page-id-175 .ol-article__content h3 + p,
body.page-id-179 .ol-article__content h3 + p {
  font-size: 14.5px;
  line-height: 2.0;
  color: var(--lbsc-ink-soft);
  margin: 0 0 28px !important;
  max-width: 900px;
}

/* --- Detail topic cards: ul.oltana-list containing nested ul -- */
body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list),
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list),
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list),
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  background: var(--lbsc-surface);
  border: 1px solid var(--lbsc-accent-line);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.25s ease;
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list):hover,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list):hover,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list):hover,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list):hover {
  border-color: var(--lbsc-accent);
  box-shadow: 0 12px 28px -22px rgba(108, 96, 89, 0.24);
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li {
  padding: 22px 26px 18px !important;
  margin: 0 !important;
  list-style: none !important;
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li::after,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li::after,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li::after,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li::after {
  display: none !important;
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--lbsc-ink);
  letter-spacing: 0.03em;
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px dashed var(--lbsc-accent-line);
  position: relative;
  padding-left: 22px;
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong::before,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong::before,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong::before,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 12px;
  height: 2px;
  background: var(--lbsc-accent);
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px 18px;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

@media (min-width: 720px) {
  body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
  body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
  body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
  body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li {
  position: relative;
  padding: 6px 0 6px 18px !important;
  margin: 0 !important;
  list-style: none !important;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--lbsc-ink-soft);
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::before,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::before,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::before,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--lbsc-accent);
  opacity: 0.55;
}

body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::after,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::after,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::after,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li::after {
  display: none !important;
}

/* End-of-article spacing */
body.page-id-49 .ol-article__content > ul:last-child,
body.page-id-164 .ol-article__content > ul:last-child,
body.page-id-175 .ol-article__content > ul:last-child,
body.page-id-179 .ol-article__content > ul:last-child {
  margin-bottom: 24px !important;
}

/* ------------------------------------------------------------
 * List labels split by preview-overrides.js into a main label
 * line and a parenthetical line, so "（...）" never orphans.
 * ------------------------------------------------------------ */
.lbsc-li-title {
  display: block;
}

.lbsc-li-paren {
  display: block;
  margin-top: 1px;
  font-size: 0.84em;
  color: rgba(108, 96, 89, 0.6);
  letter-spacing: 0.01em;
}

/* ------------------------------------------------------------
 * Japanese line-break refinements: avoid orphan characters
 * like "な\nど）" by keeping CJK punctuation with preceding
 * characters and balancing wrapped lines.
 * ------------------------------------------------------------ */
body.page-id-49 .ol-article__content,
body.page-id-164 .ol-article__content,
body.page-id-175 .ol-article__content,
body.page-id-179 .ol-article__content,
.labosec-audience__card,
.labosec-audience__desc {
  line-break: strict;
  word-break: normal;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

/* ------------------------------------------------------------
 * Basic services list: let each card use its natural height so
 * 1-line items don't visually inflate to match 2-line ones.
 * Tighten right padding so labels are more likely to fit in
 * a single line on PC.
 * ------------------------------------------------------------ */
body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type {
  align-items: start;
  max-width: 980px;
}

body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type > li,
body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type > li {
  padding: 12px 14px 12px 40px !important;
  font-size: 13.5px;
  line-height: 1.55;
}

/* Detail topic cards: same — keep natural height + finer breaks */
body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list,
body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list {
  align-items: start;
}

/* ------------------------------------------------------------
 * Mobile refinements (<= 720px) for the redesigned pages
 * ------------------------------------------------------------ */
@media (max-width: 720px) {
  body.page-id-49 .ol-article__body,
  body.page-id-164 .ol-article__body,
  body.page-id-175 .ol-article__body,
  body.page-id-179 .ol-article__body {
    padding: 28px 16px 36px !important;
    border-radius: 12px;
  }

  body.page-id-49 .ol-article__title,
  body.page-id-164 .ol-article__title,
  body.page-id-175 .ol-article__title,
  body.page-id-179 .ol-article__title {
    font-size: 24px !important;
    padding: 16px 0 12px;
    margin: 0 0 20px !important;
  }

  body.page-id-49 .ol-article__title::before,
  body.page-id-164 .ol-article__title::before,
  body.page-id-175 .ol-article__title::before,
  body.page-id-179 .ol-article__title::before {
    font-size: 11px;
    letter-spacing: 0.22em;
    margin-bottom: 8px;
  }

  body.page-id-49 .ol-article__title::after,
  body.page-id-164 .ol-article__title::after,
  body.page-id-175 .ol-article__title::after,
  body.page-id-179 .ol-article__title::after {
    width: 40px;
    margin-top: 14px;
  }

  body.page-id-49 .ol-article__content > p:first-of-type,
  body.page-id-164 .ol-article__content > p:first-of-type,
  body.page-id-175 .ol-article__content > p:first-of-type,
  body.page-id-179 .ol-article__content > p:first-of-type {
    padding: 18px 18px;
    font-size: 14px;
    line-height: 1.85;
    margin: 0 0 28px !important;
  }

  body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type,
  body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type {
    margin: 0 0 36px !important;
    gap: 8px;
  }

  body.page-id-49 .ol-article__content > ul.oltana-list:first-of-type > li,
  body.page-id-164 .ol-article__content > ul.oltana-list:first-of-type > li,
  body.page-id-175 .ol-article__content > ul.oltana-list:first-of-type > li,
  body.page-id-179 .ol-article__content > ul.oltana-list:first-of-type > li {
    padding: 12px 14px 12px 38px !important;
    font-size: 13.5px;
  }

  body.page-id-49 .ol-article__content h3.wp-block-heading,
  body.page-id-164 .ol-article__content h3.wp-block-heading,
  body.page-id-175 .ol-article__content h3.wp-block-heading,
  body.page-id-179 .ol-article__content h3.wp-block-heading {
    gap: 12px;
    font-size: 18px !important;
    margin: 40px 0 16px !important;
    padding: 16px 0 10px !important;
  }

  body.page-id-49 .ol-article__content h3.wp-block-heading::before,
  body.page-id-164 .ol-article__content h3.wp-block-heading::before,
  body.page-id-175 .ol-article__content h3.wp-block-heading::before,
  body.page-id-179 .ol-article__content h3.wp-block-heading::before {
    width: 32px;
    font-size: 11px;
  }

  body.page-id-49 .ol-article__content h3 + p,
  body.page-id-164 .ol-article__content h3 + p,
  body.page-id-175 .ol-article__content h3 + p,
  body.page-id-179 .ol-article__content h3 + p {
    font-size: 13.5px;
    line-height: 1.85;
    margin: 0 0 20px !important;
  }

  body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
  body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
  body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li,
  body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li {
    padding: 18px 18px 14px !important;
  }

  body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
  body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
  body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong,
  body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > strong {
    font-size: 14.5px;
    padding-left: 18px;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }

  body.page-id-49 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
  body.page-id-164 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
  body.page-id-175 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li,
  body.page-id-179 .ol-article__content ul.oltana-list:has(> li > ul.oltana-list) > li > ul.oltana-list > li {
    font-size: 13px;
    padding: 4px 0 4px 16px !important;
  }
}

/* ============================================================
 * Footer — refined layout: soft beige ground, circular SNS
 * buttons, a section-link nav row, tidy legal links + copyright.
 * Applies on every page.
 * ============================================================ */
.ol-footer__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: clamp(40px, 5vw, 64px) clamp(20px, 4vw, 40px) clamp(28px, 3vw, 40px) !important;
}

.ol-footer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.ol-footer__title-logo img {
  width: 200px;
  height: auto;
}

/* Legal links + copyright */
.ol-footer__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: clamp(28px, 3.5vw, 44px);
  padding-top: clamp(24px, 3vw, 32px);
  border-top: 1px solid rgba(214, 189, 165, 0.3);
}

.ol-footer__links {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
  flex-wrap: wrap;
}

.ol-footer__links .ol-anchor-style1 {
  font-size: 12.5px;
  color: rgba(108, 96, 89, 0.75);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ol-footer__links .ol-anchor-style1:hover {
  color: #b9986f;
}

.ol-footer__link-item.ol-separator {
  width: 1px;
  height: 12px;
  background: rgba(214, 189, 165, 0.5);
  padding: 0;
}

.ol-footer__copyright {
  font-size: 12px;
  color: rgba(108, 96, 89, 0.6);
  letter-spacing: 0.04em;
}

@media (max-width: 720px) {
  .ol-footer__head {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 18px;
  }

  .lbsc-footer-nav {
    gap: 10px 20px;
  }

  .ol-footer__footer {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
  }
}

/* ============================================================
 * Footer-area sections (会社情報 / お問い合わせ) appear at the
 * bottom of every page in the OLTANA theme. Show them only on
 * the top page; on sub-pages they are redundant with the global
 * footer and the header CTA.
 * ============================================================ */
body:not(.home) .ol-footer__section {
  display: none !important;
}

/* ============================================================
 * Hide the top-page SERVICE section — its 4 items duplicate the
 * "あなたはどれ？" audience cards (same links, same audiences).
 * The nav "サービス" link is repointed to #ol-section-audience.
 * ============================================================ */
.home #olService,
.home #ol-section-service {
  display: none !important;
}

/* ============================================================
 * Full-bleed hero: stretch the first-view image edge to edge
 * and overlay the existing title text on the bright window
 * area (upper-left) of the photo.
 * ============================================================ */
.home .ol-firstview__section {
  position: relative;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.home #olFirstview,
.home .ol-firstview__inner {
  margin: 0 !important;
  padding: 0 !important;
}

/* Image fills the hero box, full width, no rounded corners */
.home .ol-firstview__image {
  position: relative;
  width: 100%;
  height: clamp(520px, 64vw, 760px);
  margin: 0 !important;
  padding: 0 !important;
}

.home .ol-firstview__image-inner,
.home .ol-firstview__shortcut-image,
.home .ol-firstview__shortcut-image picture {
  display: block;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.home .ol-firstview__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: 60% bottom;
  border-radius: 0 !important;
}

/* Title overlay, vertically centered on the left/bright side */
.home .ol-firstview__inner {
  position: static;
}

.home .ol-firstview__title {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 6;
  width: 100%;
  height: clamp(520px, 64vw, 760px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
  /* top right bottom left — extra bottom padding lifts the
     centered text up; larger left padding shifts it right onto
     the bright window area. */
  padding: 0 clamp(24px, 6vw, 96px) 240px clamp(56px, 11vw, 184px);
  margin: 0 !important;
  box-sizing: border-box;
}

/* Soft white scrim behind text so it stays readable over any
   part of the photo while keeping the airy look. */
.home .ol-firstview__title::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    100deg,
    rgba(255, 254, 249, 0.82) 0%,
    rgba(255, 254, 249, 0.62) 32%,
    rgba(255, 254, 249, 0.18) 55%,
    rgba(255, 254, 249, 0) 72%
  );
  z-index: -1;
  pointer-events: none;
}

.home .ol-firstview__title-subcopy {
  position: relative;
  font-size: clamp(13px, 1.4vw, 16px);
  letter-spacing: 0.14em;
  color: #6c6059;
  margin-bottom: 18px;
}

.home .ol-firstview__title-maincopy {
  position: relative;
  font-size: clamp(30px, 4.4vw, 52px) !important;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #6c6059;
  text-shadow: 0 1px 16px rgba(255, 254, 249, 0.7);
}

@media (max-width: 720px) {
  .home .ol-firstview__image,
  .home .ol-firstview__title {
    height: clamp(440px, 108vw, 580px);
  }

  /* Show the bright window toward the top, where the text sits */
  .home .ol-firstview__image img {
    object-position: 64% top;
  }

  /* Move text to the upper area (over the bright window) instead
     of vertically centering it over the busy laptop/plant. */
  .home .ol-firstview__title {
    justify-content: flex-start;
    padding: clamp(72px, 18vw, 104px) 22px 0;
  }

  /* Stronger scrim at the very top so the text reads cleanly. */
  .home .ol-firstview__title::before {
    background: linear-gradient(
      180deg,
      rgba(255, 254, 249, 0.92) 0%,
      rgba(255, 254, 249, 0.78) 32%,
      rgba(255, 254, 249, 0.35) 52%,
      rgba(255, 254, 249, 0) 72%
    );
  }

  .home .ol-firstview__title-subcopy {
    margin-bottom: 12px;
  }

  .home .ol-firstview__title-maincopy {
    font-size: clamp(23px, 6vw, 30px) !important;
    line-height: 1.6;
  }
}

/* ============================================================
 * Fix home page column layout: the OLTANA theme wraps the main
 * content in a flex row with an empty .ol-column-content-side
 * sidebar, pushing FLOW / FAQ / VOICE off-center on the page.
 * We hide the empty sidebar and let the main column span full
 * width so headings center on the actual page midline.
 * ============================================================ */
.home .ol-column-content-side {
  display: none !important;
}

.home .ol-column-content-wrapper {
  justify-content: center;
}

.home .ol-column-content {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
}

/* ============================================================
 * Unified centered section headings (top page only).
 * All section heading-wrappers are centered and use the same
 * pattern: small Japanese sub-label on top → large English
 * main heading below → thin accent line.
 * The OLTANA VOICE section has its sub/main swapped in markup,
 * so it is visually swapped via flex-direction here.
 * ============================================================ */

.home .ol-news__heading-wrapper,
.home .ol-service__heading-wrapper,
.home .ol-product__heading-wrapper,
.home .ol-story__heading-wrapper,
.home .ol-faq__heading-wrapper,
.home .ol-voice__heading-wrapper,
.home .ol-message__heading-wrapper,
.home .ol-media__heading-wrapper,
.home .ol-access__heading-wrapper,
.home .ol-price__heading-wrapper {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center !important;
  width: 100%;
  margin: 0 auto clamp(28px, 4vw, 48px) !important;
  padding: 0 16px;
}

/* Small Japanese sub-label */
.home .ol-news__heading-sub,
.home .ol-service__heading-sub,
.home .ol-product__heading-sub,
.home .ol-story__heading-sub,
.home .ol-faq__heading-sub,
.home .ol-message__heading-sub,
.home .ol-media__heading-sub,
.home .ol-access__heading-sub,
.home .ol-contact__heading-sub,
.home .ol-voice__heading,        /* VOICE: "お客様の声" plays the sub role */
.home .ol-price__heading-sub {
  display: block !important;
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.18em !important;
  color: rgba(108, 96, 89, 0.7) !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  text-align: center !important;
}

/* Large English main heading */
.home .ol-news__heading,
.home .ol-service__heading,
.home .ol-product__heading,
.home .ol-story__heading,
.home .ol-faq__heading,
.home .ol-message__heading,
.home .ol-media__heading,
.home .ol-access__heading,
.home .ol-contact__heading,
.home .ol-voice__heading-sub,    /* VOICE: "VOICE" plays the main role */
.home .ol-price__heading {
  display: block !important;
  font-family: "Onest", "Noto Sans JP", sans-serif !important;
  font-size: clamp(28px, 3.8vw, 42px) !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  color: #6c6059 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  text-align: center !important;
  line-height: 1.25;
}

/* Accent line below main heading */
.home .ol-news__heading-wrapper::after,
.home .ol-service__heading-wrapper::after,
.home .ol-product__heading-wrapper::after,
.home .ol-story__heading-wrapper::after,
.home .ol-faq__heading-wrapper::after,
.home .ol-voice__heading-wrapper::after,
.home .ol-message__heading-wrapper::after,
.home .ol-media__heading-wrapper::after,
.home .ol-access__heading-wrapper::after,
.home .ol-price__heading-wrapper::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  background: #d6bda5;
  margin: 18px auto 0;
}

/* Visually swap order for VOICE so "お客様の声" appears on top
   as a small label and "VOICE" appears below as the main.
   Note: theme markup uses .ol-price__heading-wrapper for the
   VOICE section wrapper, so we scope by parent container. */
.home .ol-voice__inner .ol-price__heading-wrapper {
  flex-direction: column-reverse;
}

/* Some sections have a description block – center it too. */
.home .ol-faq__desc,
.home .ol-voice__desc,
.home .ol-news__desc,
.home .ol-product__desc,
.home .ol-story__desc,
.home .ol-message__desc,
.home .ol-media__desc {
  text-align: center !important;
  max-width: 640px;
  margin: 14px auto 0 !important;
  color: rgba(108, 96, 89, 0.78);
  font-size: 14px;
  line-height: 1.9;
}

/* Show the PC-variant message heading sub explicitly. The
   theme's .ol-pc helper otherwise hides it on certain layouts. */
.home .ol-message__heading-sub.ol-pc {
  display: block !important;
}

/* When the ABOUT US heading has been hoisted by JS, ensure the
   body (photo + text) sits centered on the page as a group. */
.home .lbsc-message--centered .ol-message__heading-wrapper {
  margin-top: 0 !important;
  margin-bottom: 40px !important;
}

.home .lbsc-message--centered .ol-message__body {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(36px, 4vw, 56px);
  max-width: 980px;
  margin: 0 auto;
}

.home .lbsc-message--centered .ol-message__image {
  flex: 0 0 300px;
  width: 300px !important;
  margin: 0 !important;
}

/* Rounded portrait with a soft shadow (no hard card box) */
.home .lbsc-message--centered .ol-message__image-item1 {
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 26px 50px -30px rgba(108, 96, 89, 0.45);
}

.home .lbsc-message--centered .ol-message__image-item1 img {
  display: block;
  width: 100% !important;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 16px !important;
}

.home .lbsc-message--centered .ol-message__image-item2 {
  display: none !important;
}

.home .lbsc-message--centered .ol-message__caption {
  margin-top: 16px;
  text-align: center;
}

.home .lbsc-message--centered .ol-message__caption-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.home .ol-message__caption-job {
  font-size: 11.5px;
  letter-spacing: 0.16em;
  color: rgba(108, 96, 89, 0.6);
}

.home .ol-message__caption-name {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #6c6059;
}

/* Message body — readable rhythm + a styled profile link */
.home .ol-message__text {
  font-size: 14px !important;
  line-height: 2.05 !important;
  color: rgba(108, 96, 89, 0.85) !important;
  text-align: left;
  text-wrap: pretty;
  padding-top: 4px;
}

.home .ol-message__text a {
  display: inline-flex;
  align-items: center;
  margin-top: 6px;
  color: #b9986f !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(185, 152, 111, 0.4);
  padding-bottom: 1px;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.home .ol-message__text a:hover {
  color: #6c6059 !important;
  border-color: #6c6059;
}

/* Hide the duplicated mobile-only heading-sp inside the caption */
.home .lbsc-message--centered .ol-message__heading-sp {
  display: none !important;
}

.home .lbsc-message--centered .ol-message__content {
  flex: 1 1 auto;
  width: auto !important;
  max-width: 540px;
}

/* Style the "ABOUT US" / "Labosec合同会社について" heading like
   the other unified section headings, even though it uses the
   special .ol-message__lead element. */
.home .ol-message__lead {
  display: block !important;
  font-family: "Onest", "Noto Sans JP", sans-serif !important;
  font-size: clamp(28px, 3.8vw, 42px) !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  color: #6c6059 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  text-align: center !important;
  line-height: 1.25;
}

@media (max-width: 720px) {
  .home .lbsc-message--centered .ol-message__body {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .home .lbsc-message--centered .ol-message__image {
    flex: 0 0 auto;
    width: 240px !important;
    max-width: 72%;
  }

  .home .lbsc-message--centered .ol-message__content {
    max-width: 100%;
  }

  .home .ol-message__lead {
    font-size: 28px !important;
  }

  .home .ol-message__text {
    font-size: 13.5px !important;
    line-height: 1.95 !important;
  }
}

@media (max-width: 720px) {
  .home .ol-news__heading,
  .home .ol-service__heading,
  .home .ol-product__heading,
  .home .ol-story__heading,
  .home .ol-faq__heading,
  .home .ol-message__heading,
  .home .ol-media__heading,
  .home .ol-access__heading,
  .home .ol-contact__heading,
  .home .ol-voice__heading-sub,
  .home .ol-price__heading {
    font-size: 28px !important;
    letter-spacing: 0.08em !important;
  }

  .home .ol-news__heading-sub,
  .home .ol-service__heading-sub,
  .home .ol-product__heading-sub,
  .home .ol-story__heading-sub,
  .home .ol-faq__heading-sub,
  .home .ol-message__heading-sub,
  .home .ol-media__heading-sub,
  .home .ol-access__heading-sub,
  .home .ol-contact__heading-sub,
  .home .ol-voice__heading,
  .home .ol-price__heading-sub {
    font-size: 12px !important;
    letter-spacing: 0.16em !important;
    margin-bottom: 10px !important;
  }
}

/* ============================================================
 * INFORMATION (会社情報) — clean two-column layout.
 * Info panel (名称/住所/営業時間) as tidy label–value rows in a
 * card, paired with a rounded office photo. Stacks on mobile.
 * ============================================================ */
.home .ol-access__body {
  display: flex;
  align-items: stretch;
  gap: clamp(28px, 4vw, 56px);
  max-width: 1000px;
  margin: 0 auto;
}

.home .ol-access__info {
  flex: 1 1 50%;
  margin: 0 !important;
  padding: 8px 4px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.home .ol-access__info-item {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 16px;
  align-items: start;
  padding: 18px 4px;
  margin: 0 !important;
  border-bottom: 1px solid rgba(214, 189, 165, 0.28);
}

.home .ol-access__info-item:first-child {
  padding-top: 0;
}

.home .ol-access__info-item dt {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #b9986f;
  padding-top: 2px;
}

.home .ol-access__info-item dd {
  margin: 0 !important;
}

.home .ol-access__info-item .ol-text {
  font-size: 14.5px;
  line-height: 1.85;
  color: #6c6059;
}

/* Google Map link as a subtle pill */
.home .ol-access__map-button {
  margin-top: 10px;
}

.home .ol-access__map-button a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border: 1px solid rgba(214, 189, 165, 0.5);
  border-radius: 999px;
  font-size: 12.5px;
  color: #b9986f !important;
  text-decoration: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.home .ol-access__map-button a:hover {
  background: rgba(214, 189, 165, 0.12);
  border-color: #d6bda5;
}

/* Office photo */
.home .ol-access__image {
  flex: 1 1 50%;
  margin: 0 !important;
  overflow: hidden;
  border-radius: 14px;
  box-shadow: 0 22px 44px -28px rgba(108, 96, 89, 0.4);
}

.home .ol-access__image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-height: 260px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 14px !important;
}

@media (max-width: 768px) {
  .home .ol-access__body {
    flex-direction: column;
    gap: 28px;
  }

  .home .ol-access__image {
    order: -1;
    width: 100%;
  }

  .home .ol-access__image img {
    aspect-ratio: 16 / 10;
    min-height: 0;
  }

  .home .ol-access__info-item {
    grid-template-columns: 80px 1fr;
    gap: 12px;
    padding: 15px 2px;
  }

  .home .ol-access__info-item dt {
    font-size: 12.5px;
  }

  .home .ol-access__info-item .ol-text {
    font-size: 14px;
  }
}

/* ============================================================
 * BLOG (秘書の手帳) — card refinement.
 * Consistent thumbnail ratio, rounded corners, hover zoom/lift,
 * and a left-aligned title that matches the site's card tone.
 * ============================================================ */
.home .ol-media__list.ol-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px 24px;
  max-width: 1080px;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
}

@media (max-width: 900px) {
  .home .ol-media__list.ol-card-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 22px 18px;
  }
}

@media (max-width: 560px) {
  .home .ol-media__list.ol-card-list {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.home .ol-media__list .ol-card-item {
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch;
}

.home .ol-card-item-link {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  text-decoration: none;
}

.home .ol-card-item-image {
  width: 100%;
}

.home .ol-card-item-image {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 16px 32px -26px rgba(108, 96, 89, 0.4);
}

.home .ol-card-item-image img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 12px;
  transition: transform 0.5s ease;
}

.home .ol-card-item-link:hover .ol-card-item-image img {
  transform: scale(1.05);
}

/* The thumbnail already contains the title text, so hide the
   duplicated caption visually — but keep it in the DOM for
   screen readers and SEO (it labels the link). */
/* Home BLOG: show only the latest 3 posts; the rest live on the
   /blog/ archive reached via the "もっと見る" button. */
.home .ol-media__list.ol-card-list .ol-card-item:nth-child(n + 4) {
  display: none !important;
}

.lbsc-blog-more {
  display: flex;
  justify-content: center;
  margin-top: clamp(28px, 3.5vw, 44px);
}

.lbsc-blog-more__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 36px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #b9986f;
  background: #fffef9;
  text-decoration: none;
  border: 1.5px solid #d6bda5;
  border-radius: 999px;
  transition: background-color 0.22s ease, border-color 0.2s ease, transform 0.22s ease;
}

.lbsc-blog-more__arrow {
  transition: transform 0.22s ease;
}

.lbsc-blog-more__btn:hover {
  background: rgba(214, 189, 165, 0.16);
  border-color: #b9986f;
  transform: translateY(-2px);
}

.lbsc-blog-more__btn:hover .lbsc-blog-more__arrow {
  transform: translateX(4px);
}

/* Blog archive (/blog/): hide the duplicated text titles too
   (titles are baked into the thumbnails). */
body.blog .ol-card-item-title,
body.archive .ol-card-item-title,
body.category .ol-card-item-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Date label placed ABOVE the thumbnail (outside the image),
   top-left. Keeps the post recognizable without a text title. */
.lbsc-blog-date {
  display: block;
  text-align: left;
  margin: 0 0 8px;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(108, 96, 89, 0.6);
}

.home .ol-card-item-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.home .ol-card-item-link {
  gap: 0;
}

/* ============================================================
 * FEATURE (選ばれる理由) — editorial refinement.
 * Keeps the alternating image/text layout but makes the number
 * a clear accent, adds an underline to the title, gives the
 * photo a soft shadow + hover zoom, and improves body rhythm.
 * ============================================================ */
.home .ol-product__list {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(44px, 6vw, 84px);
}

.home .ol-product__item {
  align-items: center;
  gap: clamp(32px, 5vw, 64px);
}

.home .ol-product__content {
  display: flex;
  flex-direction: column;
}

/* Number + title header */
.home .ol-product__content-subtitle-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin-bottom: 18px;
}

.home .ol-product__content-subtitle-inner {
  margin: 0;
  padding: 0;
  line-height: 1;
}

.home .ol-product__content-subtitle {
  font-family: "Onest", "Noto Sans JP", sans-serif !important;
  font-size: clamp(44px, 5.4vw, 64px) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  color: rgba(214, 189, 165, 0.9) !important;
  letter-spacing: 0.02em;
  display: block;
}

.home .ol-product__content-title {
  position: relative;
  font-size: clamp(20px, 2.5vw, 27px) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  color: #6c6059 !important;
  line-height: 1.5;
  padding-bottom: 14px;
}

.home .ol-product__content-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 44px;
  height: 2px;
  background: #d6bda5;
}

.home .ol-product__item .ol-text {
  font-size: 14px !important;
  line-height: 2.05 !important;
  color: rgba(108, 96, 89, 0.82) !important;
  text-wrap: pretty;
}

/* Photo — consistent ratio, soft shadow, gentle hover zoom */
.home .ol-product__image {
  overflow: hidden;
  border-radius: 14px;
  box-shadow: 0 22px 44px -28px rgba(108, 96, 89, 0.4);
}

.home .ol-product__image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 14px !important;
  transition: transform 0.5s ease;
}

.home .ol-product__item:hover .ol-product__image img {
  transform: scale(1.04);
}

@media (max-width: 840px) {
  .home .ol-product__content-subtitle {
    font-size: 40px !important;
  }

  .home .ol-product__content-title {
    font-size: 19px !important;
  }

  .home .ol-product__item .ol-text {
    font-size: 13.5px !important;
    line-height: 1.95 !important;
  }
}

/* ============================================================
 * FLOW (ご利用の流れ, top page) — timeline / step layout.
 * ○ marker + large "01" + "Step 01" label + divider rows.
 * ============================================================ */
.home .ol-story__list {
  max-width: 720px;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: lbsc-flow;
}

.home .ol-story__item {
  counter-increment: lbsc-flow;
  display: grid;
  grid-template-columns: 22px 1fr;
  grid-template-areas:
    "dot num"
    "dot body";
  column-gap: 20px;
  align-items: start;
  margin: 0 !important;
  padding: 26px 4px !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(214, 189, 165, 0.3) !important;
  border-radius: 0 !important;
  list-style: none !important;
}

.home .ol-story__item:last-child {
  border-bottom: 0 !important;
}

/* ○ timeline marker */
.home .ol-story__item::before {
  content: "";
  display: block !important;
  grid-area: dot;
  align-self: start;
  width: 11px;
  height: 11px;
  margin-top: 9px;
  border-radius: 50%;
  border: 1.5px solid #d6bda5;
  background: #fffef9;
}

.home .ol-story__item::after {
  display: none !important;
}

/* number row: big "01" + "Step 01" pill */
.home .ol-story__number {
  grid-area: num;
  position: static !important;
  display: flex !important;
  align-items: center;
  gap: 14px;
  width: auto !important;
  height: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-indent: 0 !important;
  transform: none !important;
  inset: auto !important;
}

.home .ol-story__number::before {
  content: "STEP " counter(lbsc-flow, decimal-leading-zero);
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 28px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.06em;
  color: #c4a47c;
}

.home .ol-story__number::after {
  display: none !important;
}

.home .ol-story__content {
  grid-area: body;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.home .ol-story__h3 {
  font-size: 16.5px !important;
  font-weight: 600 !important;
  color: #6c6059 !important;
  letter-spacing: 0.03em;
  margin: 0 !important;
}

.home .ol-story__content .ol-text {
  font-size: 13.5px;
  line-height: 1.95;
  color: rgba(108, 96, 89, 0.8);
  margin: 0 !important;
}

@media (max-width: 720px) {
  .home .ol-story__item {
    column-gap: 14px;
    padding: 22px 2px !important;
  }
  .home .ol-story__number::before {
    font-size: 26px;
  }
  .home .ol-story__h3 {
    font-size: 15px !important;
  }
}

/* ============================================================
 * お客様の声 (VOICE) — card layout.
 * Each testimonial becomes a card: avatar + name header, quote
 * body, soft border & hover lift. PC 3 columns / mobile 1.
 * A soft beige ground is added to the section so the lighter
 * cards stand out clearly.
 * ============================================================ */
.home #ol-section-voice {
  background: linear-gradient(180deg, rgba(214, 189, 165, 0.1) 0%, rgba(214, 189, 165, 0.17) 100%);
  padding-top: clamp(52px, 6vw, 84px) !important;
  padding-bottom: clamp(56px, 7vw, 92px) !important;
}

.home .ol-voice__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 1120px;
}

@media (min-width: 900px) {
  .home .ol-voice__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
  }
}

.home .ol-voice__item {
  display: flex !important;
  flex-direction: column;
  gap: 16px;
  margin: 0 !important;
  padding: 30px 26px 28px !important;
  background: #ffffff !important;
  border: 1px solid rgba(214, 189, 165, 0.35) !important;
  border-radius: 14px;
  box-shadow: 0 18px 38px -22px rgba(108, 96, 89, 0.3);
  position: relative;
  overflow: hidden;
  list-style: none !important;
  transition: transform 0.25s ease, box-shadow 0.28s ease,
              border-color 0.25s ease;
}

.home .ol-voice__item::before,
.home .ol-voice__item::after {
  content: none !important;
}

.home .ol-voice__item:hover {
  transform: translateY(-4px);
  border-color: #d6bda5 !important;
  box-shadow: 0 22px 42px -24px rgba(108, 96, 89, 0.28);
}

/* Decorative quote mark */
.home .ol-voice__content {
  position: relative;
  padding-top: 14px;
}

.home .ol-voice__content::before {
  content: "\201C";
  position: absolute;
  top: -10px;
  left: -4px;
  font-family: "Onest", "Noto Sans JP", serif;
  font-size: 48px;
  line-height: 1;
  color: rgba(214, 189, 165, 0.55);
  pointer-events: none;
}

/* Avatar + name header row */
.home .ol-voice__lead {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin: 0 !important;
}

.home .ol-voice__image {
  flex: 0 0 auto;
  width: 56px !important;
  height: 56px !important;
  margin: 0 !important;
  border-radius: 50%;
  overflow: hidden;
}

.home .ol-voice__image::before {
  content: none !important;
}

.home .ol-voice__image img {
  width: 56px !important;
  height: 56px !important;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.home .ol-voice__item .ol-list-title {
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.home .ol-voice__item-title-text {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #6c6059;
}

.home .ol-voice__content .ol-text {
  font-size: 14px;
  line-height: 1.95;
  color: rgba(108, 96, 89, 0.85);
  text-wrap: pretty;
}

@media (max-width: 720px) {
  .home .ol-voice__item {
    padding: 26px 22px 24px !important;
  }
}

/* ============================================================
 * Pricing PAGE (/price/) — full料金案内ページ.
 * Uses the labosec-price-page body class. Centered layout in
 * keeping with the rest of the redesign.
 * ============================================================ */
body.labosec-price-page .ol-article__body {
  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.04) 100%);
  padding: clamp(40px, 6vw, 72px) clamp(20px, 5vw, 56px) !important;
  border-radius: 18px;
}

body.labosec-price-page .ol-article__title {
  text-align: center;
  font-size: clamp(28px, 3.8vw, 42px) !important;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #6c6059;
  padding: 28px 0 24px !important;
  margin: 0 0 8px !important;
  border-bottom: 0 !important;
}

body.labosec-price-page .ol-article__title::before {
  content: "Price";
  display: block;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 12px;
  text-transform: uppercase;
}

body.labosec-price-page .ol-article__title::after {
  content: "";
  display: block;
  width: 56px;
  height: 1px;
  background: #b9986f;
  margin: 22px auto 0;
}

.lbsc-pp {
  max-width: 820px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  color: #6c6059;
}

.lbsc-pp__lead {
  font-size: 15px;
  line-height: 2.0;
  text-align: center;
  color: rgba(108, 96, 89, 0.85);
  margin: 0 auto 48px !important;
  max-width: 720px;
  text-wrap: pretty;
}

.lbsc-pp__block {
  margin-bottom: 56px;
}

.lbsc-pp__h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: clamp(20px, 2.6vw, 25px) !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #6c6059;
  margin: 0 0 28px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

.lbsc-pp__h2-en {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 8px;
  font-weight: 500;
}

.lbsc-pp__h2::after {
  content: "";
  display: block;
  width: 40px;
  height: 1px;
  background: #d6bda5;
  margin: 16px auto 0;
}

.lbsc-pp__text {
  font-size: 14.5px;
  line-height: 2.0;
  color: rgba(108, 96, 89, 0.82);
  text-align: center;
  max-width: 720px;
  margin: 0 auto !important;
  text-wrap: pretty;
}

/* Rate box */
.lbsc-pp__rate {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: min(100%, 520px);
  margin: 0 auto 28px;
  padding: 32px 28px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.4);
  border-radius: 14px;
  box-shadow: 0 16px 32px -24px rgba(108, 96, 89, 0.22);
}

.lbsc-pp__rate-label {
  font-size: 13px;
  letter-spacing: 0.14em;
  color: #b9986f;
  font-weight: 600;
}

.lbsc-pp__rate-main {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  color: #6c6059;
}

.lbsc-pp__rate-num {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: clamp(44px, 7vw, 58px);
  font-weight: 600;
  line-height: 1;
}

.lbsc-pp__rate-yen {
  font-size: 20px;
  font-weight: 600;
}

.lbsc-pp__rate-unit {
  font-size: 15px;
  color: rgba(108, 96, 89, 0.8);
  margin-left: 2px;
}

.lbsc-pp__rate-note {
  font-size: 12px;
  line-height: 1.7;
  color: rgba(108, 96, 89, 0.6);
  margin-top: 4px;
  text-align: center;
}

/* Cost-feel cards */
.lbsc-pp__cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 768px) {
  .lbsc-pp__cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

.lbsc-pp__card {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 26px 22px !important;
  margin: 0 !important;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 12px;
  list-style: none !important;
}

.lbsc-pp__card::before,
.lbsc-pp__card::after {
  display: none !important;
}

.lbsc-pp__card-en {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(214, 189, 165, 0.95);
}

.lbsc-pp__card-title {
  font-size: 16px;
  font-weight: 600;
  color: #6c6059;
}

.lbsc-pp__card-desc {
  font-size: 13px;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.78);
  text-wrap: pretty;
}

/* Block lead text (under h2) */
.lbsc-pp__block-lead {
  font-size: 14.5px;
  line-height: 1.95;
  color: rgba(108, 96, 89, 0.85);
  margin: -8px 0 24px;
  text-wrap: pretty;
}

/* Service domains (4 categories) */
.lbsc-pp__domains {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  list-style: none !important;
  margin: 0 0 36px !important;
  padding: 0 !important;
}
@media (min-width: 768px) {
  .lbsc-pp__domains {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
.lbsc-pp__domain {
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.55);
  border-radius: 14px;
  padding: 26px 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 8px 22px -18px rgba(108, 96, 89, 0.25);
}
.lbsc-pp__domain-en {
  font-family: "Onest", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: #b9986f;
  text-transform: uppercase;
}
.lbsc-pp__domain-title {
  font-size: 17px;
  font-weight: 700;
  color: #6c6059;
  line-height: 1.45;
}
.lbsc-pp__domain-tagline {
  font-size: 13px;
  color: rgba(108, 96, 89, 0.75);
  letter-spacing: 0.02em;
  margin-bottom: 4px;
}
.lbsc-pp__domain-desc {
  font-size: 13.5px;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.85);
  margin: 4px 0 10px !important;
}
.lbsc-pp__domain-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px dashed rgba(214, 189, 165, 0.6);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.lbsc-pp__domain-list li {
  position: relative;
  padding-left: 16px;
  font-size: 13px;
  line-height: 1.7;
  color: #6c6059;
}
.lbsc-pp__domain-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d6bda5;
}

/* Spectrum: depth of involvement vs price */
.lbsc-pp__spectrum {
  background: rgba(255, 254, 249, 0.6);
  border: 1px solid rgba(214, 189, 165, 0.45);
  border-radius: 14px;
  padding: 24px 22px 22px;
}
.lbsc-pp__spectrum-title {
  font-size: 14px;
  font-weight: 700;
  color: #6c6059;
  letter-spacing: 0.04em;
  margin: 0 0 18px;
  text-align: center;
}
.lbsc-pp__spectrum-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.lbsc-pp__spectrum-end {
  font-size: 11.5px;
  letter-spacing: 0.06em;
  color: #b9986f;
  white-space: nowrap;
  font-weight: 600;
}
.lbsc-pp__spectrum-line {
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg, #b9986f 0%, #d6bda5 50%, #ead9c4 100%);
}
.lbsc-pp__spectrum-grid {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
@media (min-width: 768px) {
  .lbsc-pp__spectrum-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }
}
.lbsc-pp__spectrum-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 8px;
  text-align: center;
  border-radius: 10px;
  background: rgba(214, 189, 165, 0.12);
}
.lbsc-pp__spectrum-label {
  font-size: 12.5px;
  font-weight: 700;
  color: #6c6059;
  letter-spacing: 0.02em;
}
.lbsc-pp__spectrum-meta {
  font-size: 11px;
  line-height: 1.65;
  color: rgba(108, 96, 89, 0.75);
}
.lbsc-pp__spectrum-note {
  font-size: 11.5px;
  color: rgba(108, 96, 89, 0.65);
  text-align: center;
  margin: 14px 0 0;
}

/* Pricing plans (3 tiers) */
.lbsc-pp__plans {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 768px) {
  .lbsc-pp__plans {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: start;
  }
}

.lbsc-pp__plan {
  position: relative;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  padding: 30px 22px 26px !important;
  margin: 0 !important;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 14px;
  list-style: none !important;
}

.lbsc-pp__plan::before,
.lbsc-pp__plan::after {
  display: none !important;
}

.lbsc-pp__plan--featured {
  border-color: #d6bda5;
  box-shadow: 0 18px 36px -22px rgba(108, 96, 89, 0.28);
}

.lbsc-pp__plan-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 3px 12px;
  background: #b9986f;
  color: #fffef9;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  border-radius: 999px;
}

.lbsc-pp__plan-en {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(214, 189, 165, 0.95);
}

.lbsc-pp__plan-title {
  font-size: 17px;
  font-weight: 600;
  color: #6c6059;
}

.lbsc-pp__plan-lead {
  font-size: 12.5px;
  color: rgba(108, 96, 89, 0.72);
}

.lbsc-pp__plan-price {
  display: block;
  width: 100%;
  margin: 10px 0 8px;
  padding: 12px 0;
  border-top: 1px solid rgba(214, 189, 165, 0.3);
  border-bottom: 1px solid rgba(214, 189, 165, 0.3);
  font-size: 14px;
  font-weight: 600;
  color: #b9986f;
  line-height: 1.4;
}

.lbsc-pp__plan-price-num {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 30px;
  font-weight: 600;
}

.lbsc-pp__plan-price-unit {
  font-size: 13px;
  font-weight: 500;
  color: rgba(108, 96, 89, 0.7);
}

.lbsc-pp__plan-exlabel {
  font-size: 11.5px;
  letter-spacing: 0.1em;
  color: rgba(108, 96, 89, 0.55);
  margin-top: 2px;
}

.lbsc-pp__plan-ex {
  list-style: none !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  width: 100%;
}

.lbsc-pp__plan-ex li {
  font-size: 13px;
  line-height: 1.9;
  color: rgba(108, 96, 89, 0.8);
  margin: 0 !important;
  padding: 0 !important;
}

.lbsc-pp__plan-ex li::before,
.lbsc-pp__plan-ex li::after {
  display: none !important;
}

.lbsc-pp__plan-note {
  font-size: 12px;
  color: rgba(108, 96, 89, 0.6);
  text-align: center;
  margin: 18px 0 0 !important;
}

/* Example tasks grid (4 categories) */
.lbsc-pp__exgrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

@media (min-width: 720px) {
  .lbsc-pp__exgrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

.lbsc-pp__excard {
  padding: 24px 24px 22px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 12px;
  text-align: left;
}

.lbsc-pp__excard-title {
  font-size: 15.5px;
  font-weight: 600;
  color: #6c6059;
  letter-spacing: 0.03em;
  margin: 0 0 14px;
  padding: 0 0 0 14px;
  position: relative;
}

.lbsc-pp__excard-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  border-radius: 2px;
  background: #d6bda5;
}

.lbsc-pp__exlist {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.lbsc-pp__exlist li {
  position: relative;
  padding: 5px 0 5px 16px !important;
  margin: 0 !important;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(108, 96, 89, 0.82);
  text-align: left;
}

.lbsc-pp__exlist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d6bda5;
  opacity: 0.6;
}

.lbsc-pp__exlist li::after {
  display: none !important;
}

/* Trust points */
.lbsc-pp__trust {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 720px) {
  .lbsc-pp__trust {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

.lbsc-pp__trust-item {
  padding: 24px 26px;
  background: rgba(214, 189, 165, 0.08);
  border-radius: 12px;
  text-align: left;
  margin: 0 !important;
  list-style: none !important;
}

.lbsc-pp__trust-item::before,
.lbsc-pp__trust-item::after {
  display: none !important;
}

.lbsc-pp__trust-title {
  font-size: 15.5px;
  font-weight: 600;
  color: #6c6059;
  letter-spacing: 0.03em;
  margin: 0 0 10px;
  padding-left: 26px;
  position: relative;
}

.lbsc-pp__trust-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 17px;
  height: 17px;
  background-color: #b9986f;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
}

.lbsc-pp__trust-text {
  font-size: 13.5px;
  line-height: 1.9;
  color: rgba(108, 96, 89, 0.82);
  margin: 0;
  text-align: left;
}

/* Chips */
.lbsc-pp__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.lbsc-pp__chips li {
  padding: 9px 16px !important;
  margin: 0 !important;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.45);
  border-radius: 999px;
  font-size: 13px;
  color: #6c6059;
  list-style: none !important;
}

.lbsc-pp__chips li::before,
.lbsc-pp__chips li::after {
  display: none !important;
}

/* Flow steps */
.lbsc-pp__flow {
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 620px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.lbsc-pp__flow-item {
  display: flex !important;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 22px !important;
  margin: 0 !important;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 12px;
  text-align: left;
  list-style: none !important;
}

.lbsc-pp__flow-item::before,
.lbsc-pp__flow-item::after {
  display: none !important;
}

.lbsc-pp__flow-num {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(214, 189, 165, 0.18);
  color: #b9986f;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-weight: 600;
  font-size: 15px;
}

.lbsc-pp__flow-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lbsc-pp__flow-title {
  font-size: 15.5px;
  font-weight: 600;
  color: #6c6059;
}

.lbsc-pp__flow-desc {
  font-size: 13.5px;
  line-height: 1.8;
  color: rgba(108, 96, 89, 0.78);
}

/* CTA */
.lbsc-pp__cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
}

.lbsc-pp__cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px 40px;
  background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%);
  color: #fffef9 !important;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-decoration: none !important;
  border-radius: 999px;
  box-shadow: 0 12px 28px -16px rgba(108, 96, 89, 0.4),
              0 6px 14px -10px rgba(185, 152, 111, 0.5);
  transition: transform 0.22s ease, box-shadow 0.25s ease;
}

.lbsc-pp__cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px -16px rgba(108, 96, 89, 0.45),
              0 10px 20px -10px rgba(185, 152, 111, 0.55);
}

.lbsc-pp__cta-arrow {
  transition: transform 0.22s ease;
}

.lbsc-pp__cta-button:hover .lbsc-pp__cta-arrow {
  transform: translateX(4px);
}

.lbsc-pp__cta-note {
  font-size: 12.5px;
  color: rgba(108, 96, 89, 0.65);
  letter-spacing: 0.04em;
}

@media (max-width: 720px) {
  body.labosec-price-page .ol-article__body {
    padding: 28px 16px 36px !important;
    border-radius: 12px;
  }
  .lbsc-pp__block {
    margin-bottom: 44px;
  }
  .lbsc-pp__lead {
    font-size: 14px;
    line-height: 1.9;
  }
}

/* ============================================================
 * Pricing section (top page) — "PRICE".
 * Order-made service, so no fixed price table: shows an hourly
 * guideline, cost-feel cards, the reason for individual quotes,
 * example tasks, and a CTA. Matches the OLTANA palette.
 * ============================================================ */
.labosec-price__section {
  padding: clamp(56px, 7vw, 100px) clamp(20px, 4vw, 48px);
  background: linear-gradient(180deg, #fffef9 0%, rgba(214, 189, 165, 0.05) 100%);
  font-family: "Noto Sans JP", sans-serif;
  color: #6c6059;
}

.labosec-price__inner {
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.labosec-price__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 28px;
}

.labosec-price__sub {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.18em;
  color: rgba(108, 96, 89, 0.7);
  margin-bottom: 12px;
}

.labosec-price__title {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: clamp(28px, 3.8vw, 42px);
  font-weight: 500;
  letter-spacing: 0.1em;
  color: #6c6059;
  margin: 0;
  line-height: 1.25;
}

.labosec-price__title::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  background: #d6bda5;
  margin: 18px auto 0;
}

.labosec-price__lead {
  max-width: 680px;
  font-size: 14.5px;
  line-height: 2.0;
  color: rgba(108, 96, 89, 0.82);
  margin: 0 0 40px;
  text-wrap: pretty;
}

/* Hourly rate guideline */
.labosec-price__rate {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: min(100%, 540px);
  padding: 32px 28px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.4);
  border-radius: 14px;
  box-shadow: 0 16px 32px -24px rgba(108, 96, 89, 0.22);
  margin-bottom: 48px;
}

.labosec-price__rate-label {
  font-size: 13px;
  letter-spacing: 0.14em;
  color: #b9986f;
  font-weight: 600;
}

.labosec-price__rate-main {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  color: #6c6059;
}

.labosec-price__rate-num {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: clamp(44px, 7vw, 60px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
}

.labosec-price__rate-yen {
  font-size: 20px;
  font-weight: 600;
}

.labosec-price__rate-unit {
  font-size: 15px;
  color: rgba(108, 96, 89, 0.8);
  margin-left: 2px;
}

.labosec-price__rate-note {
  font-size: 12px;
  line-height: 1.7;
  color: rgba(108, 96, 89, 0.6);
  margin-top: 4px;
}

/* Cost-feel cards */
.labosec-price__cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  width: 100%;
  list-style: none;
  margin: 0 0 48px;
  padding: 0;
}

@media (min-width: 768px) {
  .labosec-price__cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

.labosec-price__card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 26px 22px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.32);
  border-radius: 12px;
  text-align: center;
  align-items: center;
}

.labosec-price__card-en {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 12.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(214, 189, 165, 0.95);
}

.labosec-price__card-title {
  font-size: 16px;
  font-weight: 600;
  color: #6c6059;
  letter-spacing: 0.03em;
}

.labosec-price__card-desc {
  font-size: 13px;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.78);
  text-wrap: pretty;
}

/* Plan cards (3 pricing tiers) */
.labosec-price__cards--plans .labosec-price__card {
  justify-content: flex-start;
  gap: 6px;
  padding: 30px 22px 26px;
  position: relative;
}

.labosec-price__card--featured {
  border-color: #d6bda5 !important;
  box-shadow: 0 18px 36px -22px rgba(108, 96, 89, 0.28);
}

.labosec-price__card-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 3px 12px;
  background: #b9986f;
  color: #fffef9;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  border-radius: 999px;
}

.labosec-price__card-lead {
  font-size: 12.5px;
  color: rgba(108, 96, 89, 0.72);
  letter-spacing: 0.02em;
}

.labosec-price__card-price {
  display: block;
  margin: 10px 0 6px;
  padding: 12px 0;
  border-top: 1px solid rgba(214, 189, 165, 0.3);
  border-bottom: 1px solid rgba(214, 189, 165, 0.3);
  width: 100%;
  font-size: 14px;
  font-weight: 600;
  color: #b9986f;
  line-height: 1.4;
}

.labosec-price__card-price-num {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.labosec-price__card-price-unit {
  font-size: 13px;
  font-weight: 500;
  color: rgba(108, 96, 89, 0.7);
  margin-left: 2px;
}

.labosec-price__card-examples {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  width: 100%;
  text-align: center;
}

.labosec-price__card-examples li {
  position: relative;
  font-size: 13px;
  line-height: 1.9;
  color: rgba(108, 96, 89, 0.8);
}

.labosec-price__note {
  font-size: 12px;
  color: rgba(108, 96, 89, 0.6);
  text-align: center;
  margin: 18px 0 0;
}

/* Reason for individual quotes */
.labosec-price__reason {
  width: 100%;
  max-width: 720px;
  padding: 28px 30px;
  background: rgba(214, 189, 165, 0.08);
  border-radius: 12px;
  margin-bottom: 44px;
}

.labosec-price__reason-title {
  font-size: 17px;
  font-weight: 600;
  color: #6c6059;
  letter-spacing: 0.04em;
  margin: 0 0 14px;
}

.labosec-price__reason-text {
  font-size: 14px;
  line-height: 2.0;
  color: rgba(108, 96, 89, 0.82);
  margin: 0;
  text-wrap: pretty;
}

/* Example task chips */
.labosec-price__examples {
  width: 100%;
  margin-bottom: 48px;
}

.labosec-price__examples-label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #6c6059;
  letter-spacing: 0.04em;
  margin-bottom: 18px;
}

.labosec-price__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.labosec-price__chips li {
  padding: 9px 16px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.45);
  border-radius: 999px;
  font-size: 13px;
  color: #6c6059;
  letter-spacing: 0.02em;
}

/* CTA */
.labosec-price__cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.labosec-price__cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px 40px;
  background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%);
  color: #fffef9;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 12px 28px -16px rgba(108, 96, 89, 0.4),
              0 6px 14px -10px rgba(185, 152, 111, 0.5);
  transition: transform 0.22s ease, box-shadow 0.25s ease;
}

.labosec-price__cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px -16px rgba(108, 96, 89, 0.45),
              0 10px 20px -10px rgba(185, 152, 111, 0.55);
}

.labosec-price__cta-arrow {
  transition: transform 0.22s ease;
}

.labosec-price__cta-button:hover .labosec-price__cta-arrow {
  transform: translateX(4px);
}

.labosec-price__cta-note {
  font-size: 12.5px;
  color: rgba(108, 96, 89, 0.65);
  letter-spacing: 0.04em;
}

/* Secondary (outlined) button — "料金についてもっと詳しく見る".
   Sits above the primary CTA, prominent but visually secondary. */
.labosec-price__detail-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 36px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #b9986f;
  background: #fffef9;
  text-decoration: none;
  border: 1.5px solid #d6bda5;
  border-radius: 999px;
  transition: background-color 0.22s ease, color 0.2s ease,
              border-color 0.2s ease, transform 0.22s ease;
}

.labosec-price__detail-arrow {
  transition: transform 0.22s ease;
}

.labosec-price__detail-link:hover {
  background: rgba(214, 189, 165, 0.16);
  border-color: #b9986f;
  transform: translateY(-2px);
}

.labosec-price__detail-link:hover .labosec-price__detail-arrow {
  transform: translateX(4px);
}

@media (max-width: 720px) {
  .labosec-price__title {
    font-size: 28px;
  }

  .labosec-price__lead {
    font-size: 14px;
    line-height: 1.9;
  }

  .labosec-price__rate {
    padding: 26px 20px;
  }

  .labosec-price__reason {
    padding: 22px 20px;
  }

  .labosec-price__cta-button {
    padding: 16px 28px;
    font-size: 14.5px;
  }
}

/* ============================================================
 * Header お問い合わせ CTA — filled to match the mobile footer
 * CTA bar (beige gradient + white text) instead of the pale
 * default theme styling.
 * ============================================================ */
.ol-header__cvbutton a.ol-btn-regular {
  background: #b9986f !important;
  background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%) !important;
  color: #fffef9 !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px -12px rgba(108, 96, 89, 0.4),
              0 4px 10px -8px rgba(185, 152, 111, 0.5);
  transition: transform 0.2s ease, box-shadow 0.25s ease,
              filter 0.2s ease;
}

.ol-header__cvbutton a.ol-btn-regular:hover {
  transform: translateY(-1px);
  filter: brightness(1.04);
  box-shadow: 0 12px 24px -12px rgba(108, 96, 89, 0.45),
              0 6px 14px -8px rgba(185, 152, 111, 0.55);
}

.ol-header__cvbutton a.ol-btn-regular .ol-contact-mail-text,
.ol-header__cvbutton a.ol-btn-regular i {
  color: #fffef9 !important;
}

/* ============================================================
 * Mobile fixed-bottom CTA bar — re-uses the OLTANA theme's
 * pre-existing #olCvButton element and styles it as a visible,
 * sticky bar on small viewports only.
 * ============================================================ */
#olCvButton {
  display: none;
}

@media (max-width: 720px) {
  #olCvButton.ol-cvbutton__sp-button {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 300;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    background: rgba(255, 254, 249, 0.96);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid rgba(214, 189, 165, 0.35);
    box-shadow: 0 -12px 28px -18px rgba(108, 96, 89, 0.25);
    transform: none !important;
    pointer-events: auto !important;
  }

  #olCvButton .ol-cvbutton__list {
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #olCvButton .ol-cvbutton__item {
    flex: 1 1 auto;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  #olCvButton .ol-cvbutton__mail {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 18px !important;
    background: #b9986f !important;
    background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%) !important;
    color: #fffef9 !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 22px -14px rgba(108, 96, 89, 0.45),
                0 5px 12px -8px rgba(185, 152, 111, 0.5);
    text-decoration: none !important;
    font-family: "Noto Sans JP", sans-serif !important;
  }

  #olCvButton .ol-cvbutton__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fffef9 !important;
    margin: 0 !important;
  }

  #olCvButton .ol-cvbutton__icon i {
    font-size: 18px;
    color: #fffef9 !important;
  }

  #olCvButton .ol-cvbutton__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.25;
  }

  #olCvButton .ol-cvbutton__maintext {
    font-size: 15px !important;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #fffef9 !important;
  }

  #olCvButton .ol-cvbutton__subtext {
    font-size: 10.5px !important;
    letter-spacing: 0.08em;
    color: rgba(255, 254, 249, 0.85) !important;
    margin-top: 2px;
  }

  /* Leave space at the bottom of the document so the fixed bar
     never overlaps the very last content. */
  body.home {
    padding-bottom: 84px;
  }

  /* Theme's PAGE TOP button might collide with the bar — push it
     up a bit on mobile. */
  #pageTop {
    bottom: 80px !important;
  }
}

/* ============================================================
 * Contact section (top page) — promote the CTA.
 * Keeps the OLTANA palette and existing copy; only layout,
 * hierarchy, button presence, and trust signals are upgraded.
 * ============================================================ */
.home #ol-section-contact {
  padding: clamp(56px, 7vw, 96px) clamp(20px, 4vw, 48px) clamp(64px, 8vw, 104px) !important;
  background: linear-gradient(180deg, rgba(255, 254, 249, 0) 0%, rgba(214, 189, 165, 0.1) 60%, rgba(214, 189, 165, 0.16) 100%);
  border-radius: 18px;
}

.home #ol-section-contact .ol-contact__inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Heading group */
.home #ol-section-contact .ol-contact__heading-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin: 0 0 28px;
}

.home #ol-section-contact .ol-contact__heading-wrapper-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.home #ol-section-contact .ol-contact__heading-sub {
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: rgba(214, 189, 165, 0.95);
  margin-bottom: 10px;
  text-transform: uppercase;
}

.home #ol-section-contact .ol-contact__heading {
  font-size: clamp(28px, 3.8vw, 40px) !important;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: #6c6059;
  margin: 0 0 18px !important;
}

.home #ol-section-contact .ol-contact__heading::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  background: #d6bda5;
  margin: 18px auto 0;
}

.home #ol-section-contact .ol-contact__desc {
  font-size: 15px;
  line-height: 1.95;
  color: #6c6059;
  margin: 0 !important;
  max-width: 560px;
  text-align: center !important;
}

/* Trust badges row, injected via JS into the heading wrapper */
.lbsc-contact-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 12px;
  margin: 22px 0 28px;
}

.lbsc-contact-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.45);
  border-radius: 999px;
  font-size: 12.5px;
  letter-spacing: 0.02em;
  color: #6c6059;
}

.lbsc-contact-badge::before {
  content: "";
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  background-color: #b9986f;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13.5 4 6 11.5 2.5 8 1 9.5l5 5L15 5.5z'/></svg>") center/contain no-repeat;
}

/* Body / button area */
.home #ol-section-contact .ol-contact__body {
  width: 100%;
  display: flex;
  justify-content: center;
}

.home #ol-section-contact .ol-contact__body-inner {
  width: 100%;
  max-width: 480px;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.home #ol-section-contact .ol-contact__mail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: 100%;
}

.home #ol-section-contact .ol-contact__mail-button {
  width: min(100%, 380px);
}

/* Suppress the OLTANA hover-style1 underline sweep on the
   お問い合わせ CTA buttons – it competes with the new filled
   button design and looks like an unintended underline. */
.home .ol-contact__mail-button.ol-btn-hover-style1::before,
.home .ol-contact__mail-button.ol-btn-hover-style1::after,
.home .ol-header__cvbutton.ol-btn-hover-style1::before,
.home .ol-header__cvbutton.ol-btn-hover-style1::after,
.home .ol-contact__mail-button.ol-btn-hover-style1 a::before,
.home .ol-contact__mail-button.ol-btn-hover-style1 a::after,
.home .ol-header__cvbutton.ol-btn-hover-style1 a::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* Keep our own arrow on the CTA button (re-add what was killed) */
.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium::after {
  content: "→" !important;
  display: inline-block !important;
  font-size: 18px;
  margin-left: 4px;
  background: none !important;
  transition: transform 0.22s ease;
}

.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium:hover::after {
  transform: translateX(4px);
}

/* The primary CTA button */
.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 20px 32px !important;
  background: #b9986f !important;
  background-image: linear-gradient(180deg, #c4a47c 0%, #b9986f 100%) !important;
  color: #fffef9 !important;
  font-size: 16px !important;
  font-weight: 600;
  letter-spacing: 0.14em;
  border-radius: 999px !important;
  box-shadow: 0 12px 28px -16px rgba(108, 96, 89, 0.4),
              0 6px 14px -10px rgba(185, 152, 111, 0.5);
  transition: transform 0.22s ease, box-shadow 0.25s ease,
              background-color 0.25s ease;
}

.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium::after {
  content: "→";
  font-size: 18px;
  margin-left: 4px;
  transition: transform 0.22s ease;
}

.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px -16px rgba(108, 96, 89, 0.45),
              0 10px 20px -10px rgba(185, 152, 111, 0.55);
}

.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium:hover::after {
  transform: translateX(4px);
}

.home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium i.oltana-icon-mail_outline {
  font-size: 18px;
}

.home #ol-section-contact .ol-contact-mail-text {
  color: #fffef9 !important;
}

/* Receipt-hours subtext */
.home #ol-section-contact .ol-contact__mail_subtext {
  font-size: 13px !important;
  line-height: 1.85;
  color: rgba(108, 96, 89, 0.7) !important;
  margin: 0 !important;
  text-align: center;
}

@media (max-width: 720px) {
  .home #ol-section-contact {
    padding: 48px 16px 56px !important;
    border-radius: 12px;
  }

  .home #ol-section-contact .ol-contact__heading {
    font-size: 24px !important;
  }

  .home #ol-section-contact .ol-contact__desc {
    font-size: 14px;
    line-height: 1.85;
  }

  .home #ol-section-contact .ol-contact__mail-button a.ol-btn-medium {
    padding: 18px 24px !important;
    font-size: 15px !important;
    letter-spacing: 0.1em;
  }

  .lbsc-contact-badge {
    font-size: 11.5px;
    padding: 6px 11px;
  }
}

/* ============================================================
 * FAQ section (top page) — card + accordion redesign.
 * Keeps the OLTANA palette and calm tone; only structure and
 * interaction are upgraded. Text content is unchanged.
 * ============================================================ */
.lbsc-faq--accordion {
  max-width: 860px;
  margin: 0 auto !important;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.lbsc-faq--accordion .ol-faq__item {
  background: #fffef9;
  border: 1px solid rgba(214, 189, 165, 0.4);
  border-radius: 12px;
  padding: 0 !important;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.28s ease;
}

.lbsc-faq--accordion .ol-faq__item:hover {
  border-color: #d6bda5;
}

.lbsc-faq--accordion .ol-faq__item.is-open {
  border-color: #d6bda5;
  box-shadow: 0 14px 30px -22px rgba(108, 96, 89, 0.26);
}

/* --- Question (clickable header) ----------------------------- */
.lbsc-faq--accordion .ol-faq__item-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 !important;
  padding: 20px 22px !important;
  cursor: pointer;
  border: 0 !important;
  background: none !important;
  -webkit-tap-highlight-color: transparent;
}

.lbsc-faq--accordion .ol-faq__item-head:focus-visible {
  outline: 2px solid #d6bda5;
  outline-offset: -2px;
}

/* Q badge (overrides theme's bare "Q") */
.lbsc-faq--accordion .ol-faq__item-head::before {
  content: "Q";
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(214, 189, 165, 0.18);
  color: #b9986f !important;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  position: static !important;
  margin: 0 !important;
  transition: background-color 0.25s ease;
}

.lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-head::before,
.lbsc-faq--accordion .ol-faq__item-head:hover::before {
  background: rgba(214, 189, 165, 0.32);
}

.lbsc-faq--accordion .ol-faq__item-head-inner {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.65;
  color: #6c6059;
  letter-spacing: 0.02em;
  line-break: strict;
  word-break: auto-phrase;
  overflow-wrap: anywhere;
}

.lbsc-faq--accordion .ol-faq__item-body-inner {
  font-weight: 500;
  line-break: strict;
  word-break: auto-phrase;
  overflow-wrap: anywhere;
}

/* Chevron toggle indicator */
.lbsc-faq--accordion .ol-faq__item-head::after {
  content: "";
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-right: 1.6px solid #b9986f;
  border-bottom: 1.6px solid #b9986f;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform 0.3s ease;
  margin-left: 6px;
}

.lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-head::after {
  transform: rotate(225deg) translate(-1px, -1px);
}

/* --- Answer (collapsible body) ------------------------------- */
.lbsc-faq--accordion .ol-faq__item-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.32s ease;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}

.lbsc-faq--accordion .ol-faq__item-body::before {
  display: none !important;
}

.lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-body {
  grid-template-rows: 1fr;
}

.lbsc-faq--accordion .ol-faq__item-body-inner {
  overflow: hidden;
  min-height: 0;
  position: relative;
}

/* Inner padding wrapper — applied via an extra inner box */
.lbsc-faq--accordion .ol-faq__item-body-inner {
  padding: 0 22px 0 66px;
}

.lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-body-inner {
  padding-top: 2px;
  padding-bottom: 22px;
}

/* A badge, aligned under the Q badge */
.lbsc-faq--accordion .ol-faq__item-body-inner::before {
  content: "A";
  position: absolute;
  left: 22px;
  top: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #d6bda5;
  color: #fffef9;
  font-family: "Onest", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 600;
}

.lbsc-faq--accordion .ol-faq__item-body-inner {
  font-size: 14px;
  line-height: 1.95;
  color: rgba(108, 96, 89, 0.92);
}

/* Thin divider between question and answer when open */
.lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-head {
  padding-bottom: 14px !important;
}

@media (max-width: 720px) {
  .lbsc-faq--accordion {
    gap: 10px;
  }

  .lbsc-faq--accordion .ol-faq__item-head {
    gap: 11px;
    padding: 16px 16px !important;
  }

  .lbsc-faq--accordion .ol-faq__item-head::before {
    width: 26px;
    height: 26px;
    font-size: 13px;
  }

  .lbsc-faq--accordion .ol-faq__item-head-inner {
    font-size: 14px;
    line-height: 1.6;
  }

  .lbsc-faq--accordion .ol-faq__item-body-inner {
    padding: 0 16px 0 16px;
    font-size: 13.5px;
  }

  .lbsc-faq--accordion .ol-faq__item.is-open .ol-faq__item-body-inner {
    padding-bottom: 18px;
  }

  /* On mobile the A badge sits inline at the top of the answer
     rather than in a left gutter, to keep text width usable. */
  .lbsc-faq--accordion .ol-faq__item-body-inner::before {
    position: static;
    margin-bottom: 8px;
    width: 26px;
    height: 26px;
    font-size: 13px;
  }
}

/* ------------------------------------------------------------
 * Top page audience cards: tighter mobile spacing
 * ------------------------------------------------------------ */
@media (max-width: 720px) {
  .labosec-audience__section {
    padding: 48px 16px 56px;
  }

  .labosec-audience__heading-wrapper {
    margin-bottom: 28px;
  }

  .labosec-audience__heading {
    font-size: 24px;
  }

  .labosec-audience__lead {
    font-size: 13.5px;
    line-height: 1.85;
  }

  .labosec-audience__card {
    padding: 20px 14px 18px;
    gap: 8px;
  }

  .labosec-audience__icon {
    width: 44px;
    height: 44px;
  }

  .labosec-audience__en {
    font-size: 11.5px;
    letter-spacing: 0.1em;
  }

  .labosec-audience__title {
    font-size: 15.5px;
  }

  .labosec-audience__desc {
    font-size: 12px;
    line-height: 1.75;
  }

  .labosec-audience__more {
    font-size: 12px;
  }
}

/* ============================================================
   Price page (/price/) — mobile compaction.
   Cards were too tall on mobile (theme injects margin:42px on
   <p>, and our domain/plan cards had generous padding/line-height).
   Tighten everything for ≤720px so users see more in less scroll.
   ============================================================ */
@media (max-width: 720px) {
  /* Block lead under each H2 */
  .lbsc-pp__block-lead {
    font-size: 13.5px;
    line-height: 1.85;
    margin: -4px 0 18px !important;
  }

  /* Service domain cards (4) */
  .lbsc-pp__domains {
    gap: 12px !important;
    margin: 0 0 24px !important;
  }
  .lbsc-pp__domain {
    padding: 18px 18px 16px !important;
    gap: 4px !important;
    border-radius: 12px !important;
  }
  .lbsc-pp__domain-en {
    font-size: 11px;
    letter-spacing: 0.16em;
  }
  .lbsc-pp__domain-title {
    font-size: 15.5px;
    line-height: 1.4;
  }
  .lbsc-pp__domain-tagline {
    font-size: 12.5px;
    margin-bottom: 2px !important;
  }
  /* Tighten the description and override the theme's p {margin:42px 0} */
  .lbsc-pp__domain-desc {
    font-size: 13px !important;
    line-height: 1.75 !important;
    margin: 4px 0 8px !important;
  }
  .lbsc-pp__domain-list {
    padding-top: 10px !important;
    gap: 4px !important;
  }
  .lbsc-pp__domain-list li {
    font-size: 12.5px;
    line-height: 1.6;
    padding-left: 14px;
  }
  .lbsc-pp__domain-list li::before {
    width: 5px;
    height: 5px;
    top: 0.65em;
  }

  /* Spectrum block */
  .lbsc-pp__spectrum {
    padding: 18px 16px 16px !important;
  }
  .lbsc-pp__spectrum-title {
    font-size: 13px;
    margin-bottom: 12px !important;
  }
  .lbsc-pp__spectrum-grid {
    gap: 8px !important;
  }
  .lbsc-pp__spectrum-col {
    padding: 8px 6px !important;
  }
  .lbsc-pp__spectrum-label {
    font-size: 11.5px;
  }
  .lbsc-pp__spectrum-meta {
    font-size: 10.5px;
    line-height: 1.55;
  }

  /* Plan cards (3 tiers) */
  .lbsc-pp__plans {
    gap: 12px !important;
  }
  .lbsc-pp__plan {
    padding: 22px 18px 20px !important;
    gap: 4px !important;
  }
  .lbsc-pp__plan-en {
    font-size: 11px;
  }
  .lbsc-pp__plan-title {
    font-size: 16px;
  }
  .lbsc-pp__plan-lead {
    font-size: 12.5px;
  }
  .lbsc-pp__plan-price {
    margin: 6px 0 4px !important;
  }
  .lbsc-pp__plan-exlabel {
    font-size: 11.5px;
    margin-top: 2px !important;
  }
  .lbsc-pp__plan-ex {
    margin: 2px 0 0 !important;
  }
  .lbsc-pp__plan-ex li {
    font-size: 12.5px !important;
    line-height: 1.65 !important;
  }

  /* Trust / Flow / CTA — also trim a bit */
  .lbsc-pp__trust-item {
    padding: 18px 18px !important;
  }
  .lbsc-pp__trust-title {
    font-size: 14.5px;
    margin-bottom: 6px !important;
  }
  .lbsc-pp__trust-text {
    font-size: 13px !important;
    line-height: 1.75 !important;
    margin: 0 !important;
  }

  /* Defensive: kill the theme's giant p margins inside the price body */
  body.labosec-price-page .lbsc-pp p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  body.labosec-price-page .lbsc-pp .lbsc-pp__domain-desc {
    margin: 4px 0 8px !important;
  }
  body.labosec-price-page .lbsc-pp .lbsc-pp__trust-text {
    margin: 0 !important;
  }
  body.labosec-price-page .lbsc-pp .lbsc-pp__lead {
    margin: 0 0 18px !important;
  }
  body.labosec-price-page .lbsc-pp .lbsc-pp__block-lead {
    margin: -4px 0 18px !important;
  }
  body.labosec-price-page .lbsc-pp .lbsc-pp__spectrum-note {
    margin: 10px 0 0 !important;
  }
}