/* ==========================================================================
   NAKAJP Phase 5.2B — Six main LP systems completion
   Baseline: Phase 5.2
   Scope: body.jp-phase52b
   Purpose: page-specific desktop depth, mobile scan-first, contrast closure
   Tracking/form behavior: none
   ========================================================================== */

body.jp-phase52b {
  --jp52b-ink: var(--jp-green-ink, #26362c);
  --jp52b-body: #465249;
  --jp52b-moss: var(--jp-moss, #435a49);
  --jp52b-sage: var(--jp-sage, #899789);
  --jp52b-mist: var(--jp-green-mist, #eef2ec);
  --jp52b-soft: var(--jp-green-soft, #e4ebe3);
  --jp52b-forest: var(--jp-forest, #2f4336);
  --jp52b-paper: #f7f3eb;
  --jp52b-line: rgba(67, 90, 73, 0.18);
  --jp52b-gold: #a9853a;
  --jp52b-shadow: 0 18px 50px rgba(38, 54, 44, 0.08);
}

/* --------------------------------------------------------------------------
   Accessible light/dark detail modifiers
   -------------------------------------------------------------------------- */
body.jp-phase52b details.jp-responsive-detail--on-light {
  --jp-detail-line: rgba(47, 67, 54, 0.22);
  --jp-detail-focus: #435a49;
  color: #465249 !important;
}

body.jp-phase52b details.jp-responsive-detail--on-light > summary {
  color: #26362c !important;
}

body.jp-phase52b details.jp-responsive-detail--on-light > summary::after {
  color: var(--jp52b-moss);
  border-color: rgba(67, 90, 73, 0.32);
  background: rgba(238, 242, 236, 0.72);
}

body.jp-phase52b details.jp-responsive-detail--on-dark {
  --jp-detail-line: rgba(247, 243, 235, 0.28);
  --jp-detail-focus: #f7f3eb;
  color: rgba(247, 243, 235, 0.88);
  border-top-color: rgba(247, 243, 235, 0.28) !important;
}

body.jp-phase52b details.jp-responsive-detail--on-dark > summary {
  color: #fffaf0 !important;
}

body.jp-phase52b details.jp-responsive-detail--on-dark > summary::after {
  color: #fffaf0;
  border-color: rgba(255, 250, 240, 0.44);
  background: rgba(255, 255, 255, 0.08);
}

body.jp-phase52b details.jp-responsive-detail--on-dark[open] > summary::after {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 250, 240, 0.62);
}

body.jp-phase52b details.jp-responsive-detail--on-dark > summary:focus-visible {
  outline-color: rgba(255, 250, 240, 0.72);
}

/* Interface text must never inherit low-contrast deep accent on a light surface. */
body.jp-phase52b section.jp52b-surface-light .eyebrow,
body.jp-phase52b section.jp52b-surface-light .section-label,
body.jp-phase52b section.jp52b-surface-light .mobile-compact-kicker {
  color: #435a49 !important;
}

body.jp-phase52b section.jp52b-surface-light h2,
body.jp-phase52b section.jp52b-surface-light h3 {
  color: #26362c !important;
}

body.jp-phase52b section.jp52b-surface-light p,
body.jp-phase52b section.jp52b-surface-light li {
  color: #465249 !important;
}

/* Shared editorial constraints, not a universal layout. */
@media (min-width: 1024px) {
  body.jp-phase52b .lp52b-measure :where(p, li) {
    max-width: 68ch;
  }

  body.jp-phase52b .lp52b-heading-zone {
    margin-bottom: clamp(34px, 3vw, 52px);
  }
}

@media (max-width: 768px) {
  body.jp-phase52b .lp52b-mobile-scan :where(p:not(.eyebrow):not(.mobile-compact-kicker)) {
    max-width: 42ch;
  }

  body.jp-phase52b .jp-responsive-detail__content {
    padding-bottom: 8px;
  }
}

/* ==========================================================================
   LP001 — Brand / Trust
   ========================================================================== */
body.lp-system-lp001 #foundation .proof-cta__actions .jp52b-cta-on-light,
body.lp-system-lp001 #foundation .proof-cta__actions .btn--ghost.jp52b-cta-on-light {
  color: #fffaf0 !important;
  background: var(--jp52b-forest) !important;
  border-color: var(--jp52b-forest) !important;
  box-shadow: 0 10px 24px rgba(47, 67, 54, 0.18);
}

body.lp-system-lp001 #foundation .proof-cta__actions .jp52b-cta-on-light:hover,
body.lp-system-lp001 #foundation .proof-cta__actions .jp52b-cta-on-light:focus-visible {
  color: #fff !important;
  background: #26382d !important;
  border-color: #26382d !important;
}

@media (min-width: 1024px) {
  body.lp-system-lp001 #showroom .showroom-layout,
  body.lp-system-lp001 #team .team-intro,
  body.lp-system-lp001 #profile-book .profile-book-layout {
    column-gap: clamp(36px, 5vw, 76px);
  }

  body.lp-system-lp001 #showroom {
    --lp52b-proof-ratio: 1.18fr 0.82fr;
  }

  body.lp-system-lp001 #team {
    --lp52b-proof-ratio: 0.88fr 1.12fr;
  }
}

@media (max-width: 768px) {
  body.lp-system-lp001 #foundation details.more-standards,
  body.lp-system-lp001 #workflow details.mobile-more-steps {
    margin-top: 18px;
  }

  body.lp-system-lp001 #profile-book {
    padding-block: 58px;
  }
}

/* ==========================================================================
   LP002 — Pain / Functional diagnosis variants
   ========================================================================== */
body.lp-system-lp002 .lp002-method.jp52b-surface-light,
body.lp-system-lp002 .lp002d-method.jp52b-surface-light {
  background:
    radial-gradient(circle at 82% 14%, rgba(137, 151, 137, 0.17), transparent 34%),
    linear-gradient(180deg, #eef2ec 0%, #e7ede6 100%) !important;
}

body.lp-system-lp002 .lp002-method.jp52b-surface-light :where(.lp002-section-head p, .mobile-compact-intro),
body.lp-system-lp002 .lp002d-method.jp52b-surface-light :where(.section-header p, .mobile-compact-intro) {
  color: #465249 !important;
}

/* LP002A — contrast diagnosis */
@media (min-width: 1024px) {
  body.lp-variant-lp002a #pain .lp002-signs-layout--contrast {
    display: grid;
    grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr);
    gap: clamp(40px, 6vw, 84px);
    align-items: center;
  }

  body.lp-variant-lp002a #pain .lp002-contrast-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--jp52b-line);
    border-bottom: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002a #pain .lp002-contrast-card {
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body.lp-variant-lp002a #pain .lp002-contrast-card + .lp002-contrast-card {
    border-left: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002a #method .lp002-method-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
  }

  body.lp-variant-lp002a #method .lp002-method-steps article {
    padding-inline: 24px;
    border-radius: 0;
    box-shadow: none;
    border: 0;
    border-top: 2px solid rgba(67, 90, 73, 0.38);
  }
}

/* LP002B — scenario sequence */
@media (min-width: 1024px) {
  body.lp-variant-lp002b #pre-check-before-final .ads-content-head-split {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: clamp(42px, 6vw, 86px);
  }

  body.lp-variant-lp002b #pre-check-before-final .nakajp-depth-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002b #pre-check-before-final .nakajp-depth-grid article {
    border-radius: 0;
    box-shadow: none;
    border: 0;
    border-bottom: 1px solid var(--jp52b-line);
    padding: 26px 28px;
  }

  body.lp-variant-lp002b #pre-check-before-final .nakajp-depth-grid article:nth-child(odd) {
    border-right: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002b #method .lp002-method-steps {
    position: relative;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
  }

  body.lp-variant-lp002b #method .lp002-method-steps::before {
    content: "";
    position: absolute;
    top: 24px;
    left: 4%;
    right: 4%;
    height: 1px;
    background: rgba(67, 90, 73, 0.32);
  }

  body.lp-variant-lp002b #method .lp002-method-steps article {
    position: relative;
    z-index: 1;
    background: transparent;
    box-shadow: none;
    border: 0;
  }
}

/* LP002C — three-factor diagnostic */
@media (min-width: 1024px) {
  body.lp-variant-lp002c #pain .lp002-diagnostic-hero {
    display: grid;
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
    gap: clamp(42px, 6vw, 86px);
    align-items: start;
  }

  body.lp-variant-lp002c #pain .lp002-diagnostic-mini {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-block: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002c #pain .lp002-diagnostic-mini article {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 26px 22px;
  }

  body.lp-variant-lp002c #pain .lp002-diagnostic-mini article + article {
    border-left: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002c #method .lp002-method-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }
}

/* LP002 base — routine map */
@media (min-width: 1024px) {
  body.lp-variant-lp002 #method .lp002-method-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    counter-reset: routine-step;
    border-top: 1px solid rgba(67, 90, 73, 0.28);
  }

  body.lp-variant-lp002 #method .lp002-method-steps article {
    counter-increment: routine-step;
    padding: 30px 24px 18px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body.lp-variant-lp002 #method .lp002-method-steps article + article {
    border-left: 1px solid rgba(67, 90, 73, 0.18);
  }
}

/* LP002D — four-layer gap map */
@media (min-width: 1024px) {
  body.lp-variant-lp002d #gap-map .lp002d-gap-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    counter-reset: gap-layer;
    border-top: 1px solid var(--jp52b-line);
    border-bottom: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002d #gap-map .lp002d-gap-grid article {
    counter-increment: gap-layer;
    padding: 28px 24px 24px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }

  body.lp-variant-lp002d #gap-map .lp002d-gap-grid article + article {
    border-left: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp002d #gap-map .lp002d-gap-grid article::before {
    content: "0" counter(gap-layer);
    display: block;
    margin-bottom: 14px;
    color: var(--jp52b-moss);
    font: 700 0.78rem/1.2 var(--font-sans, sans-serif);
    letter-spacing: 0.14em;
  }
}

/* ==========================================================================
   LP003 — Build readiness / risk-control variants
   ========================================================================== */
@media (min-width: 1024px) {
  body.lp-variant-lp003a #daily-situations .nakajp-depth-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-block: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp003a #daily-situations .nakajp-depth-grid article {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 28px 26px;
  }

  body.lp-variant-lp003a #daily-situations .nakajp-depth-grid article + article {
    border-left: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp003a #workflow .workflow-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
  }
}

@media (min-width: 1024px) {
  body.lp-variant-lp003b #missing-quote-items .nakajp-depth-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border: 1px solid rgba(67, 90, 73, 0.16);
    border-radius: 22px;
    overflow: hidden;
  }

  body.lp-variant-lp003b #missing-quote-items .nakajp-depth-grid article {
    min-height: 180px;
    padding: 30px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: rgba(255, 255, 255, 0.64);
  }

  body.lp-variant-lp003b #missing-quote-items .nakajp-depth-grid article:nth-child(odd) {
    border-right: 1px solid rgba(67, 90, 73, 0.16);
  }

  body.lp-variant-lp003b #missing-quote-items .nakajp-depth-grid article:nth-child(-n+2) {
    border-bottom: 1px solid rgba(67, 90, 73, 0.16);
  }

  body.lp-variant-lp003b #workflow .workflow-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--jp52b-line);
  }
}

@media (min-width: 1024px) {
  body.lp-variant-lp003c #material-standard-table .nakajp-depth-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-block: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp003c #material-standard-table .nakajp-depth-grid--3 article {
    padding: 28px 26px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body.lp-variant-lp003c #material-standard-table .nakajp-depth-grid--3 article:not(:nth-child(3n+1)) {
    border-left: 1px solid var(--jp52b-line);
  }

  body.lp-variant-lp003c #material-standard-table .nakajp-depth-grid--3 article:nth-child(-n+3) {
    border-bottom: 1px solid var(--jp52b-line);
  }
}

/* ==========================================================================
   LP004 — Style selection
   ========================================================================== */
body.lp-system-lp004 #style-details .lp004-selector-panel[hidden],
body.lp-system-lp004 #style-details .lp004-selector-panel[aria-hidden="true"] {
  display: none !important;
}

@media (min-width: 1024px) {
  body.lp-system-lp004 #style-details .lp004-style-supporting .jp-responsive-detail__content {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  body.lp-system-lp004 #style-details .lp004-selector-panel:not([hidden])[aria-hidden="false"] {
    display: block;
  }

  body.lp-system-lp004 #style-details .lp004-style-supporting {
    margin-top: 16px;
  }

  body.lp-system-lp004 #style-details .lp004-style-supporting > summary {
    font-size: 0.94rem;
  }
}

/* ==========================================================================
   LP005 — Quote review
   ========================================================================== */
@media (min-width: 1024px) {
  body.lp-system-lp005 .reason-explain-layout {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: clamp(34px, 5vw, 72px);
    align-items: stretch;
  }

  body.lp-system-lp005 .reason-copy-card {
    box-shadow: none;
  }

  body.lp-system-lp005 #scope .scope-outcome-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}

body.lp-system-lp005 details.lp52b-reason-proof-detail {
  border-top: 0;
  margin-top: 0;
}

@media (min-width: 769px) {
  body.lp-system-lp005 details.lp52b-reason-proof-detail {
    height: 100%;
  }

  body.lp-system-lp005 details.lp52b-reason-proof-detail > .jp-responsive-detail__content {
    height: 100%;
  }

  body.lp-system-lp005 details.lp52b-reason-proof-detail .reason-visual-panel {
    height: 100%;
  }
}

@media (max-width: 768px) {
  body.lp-system-lp005 details.lp52b-reason-proof-detail {
    margin-top: 18px;
    border-top: 1px solid var(--jp52b-line);
  }

  body.lp-system-lp005 details.lp52b-reason-proof-detail .reason-visual-panel {
    margin-top: 8px;
  }

  body.lp-system-lp005 #scope .scope-outcome-grid {
    display: block;
  }

  body.lp-system-lp005 #scope .scope-outcome-card + .scope-outcome-card {
    margin-top: 18px;
  }
}

/* ==========================================================================
   LP006 — SEO / Google Search service
   ========================================================================== */
body.lp-system-lp006 .article-wrap.container,
body.lp-system-lp006 .article-main {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

body.lp-system-lp006 #styles {
  background:
    radial-gradient(circle at 85% 18%, rgba(137, 151, 137, 0.20), transparent 34%),
    linear-gradient(180deg, #eef2ec 0%, #e6ece5 100%) !important;
}

body.lp-system-lp006 #service {
  background: #f8f5ef !important;
}

body.lp-system-lp006 #service .lp006-process-timeline {
  box-shadow: 0 16px 38px rgba(38, 54, 44, 0.07);
  border-color: rgba(67, 90, 73, 0.10);
}

body.lp-system-lp006 #service .process-callout {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
}

body.lp-system-lp006 #quality-control {
  background:
    radial-gradient(circle at 12% 8%, rgba(137, 151, 137, 0.13), transparent 30%),
    linear-gradient(180deg, #2f4336 0%, #293b30 100%) !important;
}

body.lp-system-lp006 #quality-control .lp006-quality-media,
body.lp-system-lp006 #quality-control .lp006-quality-media-wrap,
body.lp-system-lp006 #quality-control .construction-proof-media {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.lp-system-lp006 #quality-control .lp006-quality-panel {
  background: #f7f2e8;
  border-color: transparent;
}

@media (min-width: 1024px) {
  body.lp-system-lp006 #service > .container,
  body.lp-system-lp006 #quality-control > .container,
  body.lp-system-lp006 #styles > .container {
    padding-block: 6px;
  }
}

@media (max-width: 768px) {
  body.lp-system-lp006 #service .lp006-process-timeline {
    box-shadow: none;
  }

  body.lp-system-lp006 #quality-control .lp006-quality-media,
  body.lp-system-lp006 #quality-control .lp006-quality-media-wrap {
    padding-inline: 0 !important;
  }
}

/* ==========================================================================
   Mobile scan-first tuning by family
   ========================================================================== */
@media (max-width: 768px) {
  body.lp-system-lp002 .mobile-copy.mobile-compact-section,
  body.lp-system-lp003 .mobile-copy.mobile-compact-section {
    padding-block: 54px;
  }

  body.lp-system-lp002 .mobile-compact-list,
  body.lp-system-lp003 .mobile-compact-list {
    display: grid;
    gap: 0;
  }

  body.lp-system-lp002 .mobile-compact-list > li,
  body.lp-system-lp003 .mobile-compact-list > li {
    padding-block: 13px;
    border-bottom: 1px solid rgba(67, 90, 73, 0.14);
  }

  body.lp-system-lp002 .mobile-compact-list > li:last-child,
  body.lp-system-lp003 .mobile-compact-list > li:last-child {
    border-bottom: 0;
  }

  body.lp-system-lp003 .jp-responsive-table-wrap {
    border: 1px solid rgba(67, 90, 73, 0.18);
    border-radius: 12px;
    background: #fff;
  }
}

/* Reduced motion preserves all content. */
@media (prefers-reduced-motion: reduce) {
  body.jp-phase52b *,
  body.jp-phase52b *::before,
  body.jp-phase52b *::after {
    scroll-behavior: auto !important;
  }
}

/* Phase 5.2B P0 contrast closure — explicit page/section selectors */
body.jp-phase52b.page-vao-o-roi-moi-thay-bat-tien #method .lp002-section-head h2,
body.jp-phase52b.page-nha-bi-toi-bat-tien #method .lp002-section-head h2,
body.jp-phase52b.page-tranh-phat-sinh-khi-thi-cong #solution .section-title h2,
body.jp-phase52b.page-zero-gap-thiet-ke-khong-lech-thuc-te #method h2 {
  color: #26362c !important;
}

body.jp-phase52b.page-vao-o-roi-moi-thay-bat-tien #method .lp002-section-head p,
body.jp-phase52b.page-nha-bi-toi-bat-tien #method .lp002-section-head p,
body.jp-phase52b.page-tranh-phat-sinh-khi-thi-cong #solution .section-title p,
body.jp-phase52b.page-zero-gap-thiet-ke-khong-lech-thuc-te #method .section-header p {
  color: #465249 !important;
}

body.jp-phase52b.page-vao-o-roi-moi-thay-bat-tien #method .lp002-section-head .eyebrow,
body.jp-phase52b.page-nha-bi-toi-bat-tien #method .lp002-section-head .eyebrow,
body.jp-phase52b.page-tranh-phat-sinh-khi-thi-cong #solution .section-title .section-label,
body.jp-phase52b.page-zero-gap-thiet-ke-khong-lech-thuc-te #method .section-label {
  color: #435a49 !important;
}