/* Interior visual language V1
   A restrained "strategy current" system for the six product pages.
   Homepage and product overview remain untouched. */

body.inner-route:is(
  [data-route="annual-planning"],
  [data-route="business-review"],
  [data-route="compensation-performance-workshop"],
  [data-route="mechanism-building"],
  [data-route="talent-management-development"],
  [data-route="business-diagnosis"]
) {
  --polish-navy: #0a315f;
  --polish-blue: #176bc2;
  --polish-sky: #55b8df;
  --polish-ice: #eef6fb;
  --polish-lilac: #eef1fb;
  --polish-line: rgba(42, 101, 154, .17);
  --polish-shadow: 0 20px 48px rgba(28, 77, 120, .11);
}

/* Soft atmosphere, used selectively so the page does not become a stack of boxes. */
body.inner-route[data-route="annual-planning"] :is(.annual-focus-overview,.annual-focus-tools),
body.inner-route[data-route="business-review"] :is(.br-framework,.br-meeting),
body.inner-route[data-route="compensation-performance-workshop"] :is(.pw-agenda,.pw-rewards),
body.inner-route[data-route="mechanism-building"] :is(.mb-model,.mb-performance,.mb-implementation),
body.inner-route[data-route="talent-management-development"] :is(.tm-standard,.tm-learning,.tm-implementation),
body.inner-route[data-route="business-diagnosis"] :is(.diagnosis-symptoms,.diagnosis-priority) {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 8% 0%, rgba(76, 178, 222, .13), transparent 36%),
    radial-gradient(ellipse at 94% 100%, rgba(78, 102, 201, .09), transparent 34%),
    linear-gradient(145deg, #f8fbfe 0%, #eef5fa 58%, #f7f8fd 100%);
}

body.inner-route[data-route="annual-planning"] :is(.annual-focus-overview,.annual-focus-tools)::before,
body.inner-route[data-route="business-review"] :is(.br-framework,.br-meeting)::before,
body.inner-route[data-route="compensation-performance-workshop"] :is(.pw-agenda,.pw-rewards)::before,
body.inner-route[data-route="mechanism-building"] :is(.mb-model,.mb-performance,.mb-implementation)::before,
body.inner-route[data-route="talent-management-development"] :is(.tm-standard,.tm-learning,.tm-implementation)::before,
body.inner-route[data-route="business-diagnosis"] :is(.diagnosis-symptoms,.diagnosis-priority)::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(520px, 42vw);
  height: 170px;
  right: -7vw;
  top: 10%;
  border-radius: 50%;
  border: 34px solid rgba(69, 152, 207, .055);
  transform: rotate(-12deg);
  pointer-events: none;
}

/* A short gradient stroke anchors key chapters without turning every heading into a template. */
body.inner-route[data-route="annual-planning"] .annual-focus-overview header h2::after,
body.inner-route[data-route="business-review"] .br-framework .br-heading h2::after,
body.inner-route[data-route="compensation-performance-workshop"] .pw-agenda .pw-heading h2::after,
body.inner-route[data-route="mechanism-building"] .mb-model .mb-heading h2::after,
body.inner-route[data-route="talent-management-development"] .tm-standard .tm-heading h2::after,
body.inner-route[data-route="business-diagnosis"] .diagnosis-method-combined header h2::after {
  content: "";
  display: block;
  width: 74px;
  height: 5px;
  margin-top: 18px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--polish-blue), var(--polish-sky));
  box-shadow: 0 5px 16px rgba(40, 132, 190, .2);
}

/* Primary models feel like one composed object, not a pile of bordered rectangles. */
body.inner-route[data-route="annual-planning"] .annual-intelligence-model,
body.inner-route[data-route="business-review"] .br-method,
body.inner-route[data-route="compensation-performance-workshop"] :is(.pw-course-agenda,.pw-blueprint),
body.inner-route[data-route="mechanism-building"] :is(.mb-smart-model,.mb-model-stack,.mb-project-route),
body.inner-route[data-route="talent-management-development"] :is(.tm-growth-map,.tm-ninebox,.tm-calibration),
body.inner-route[data-route="business-diagnosis"] :is(.diagnosis-method-grid,.priority-matrix) {
  border: 1px solid rgba(91, 142, 183, .2);
  border-radius: 22px;
  box-shadow: var(--polish-shadow);
  overflow: hidden;
}

body.inner-route[data-route="annual-planning"] .annual-intelligence-model {
  background: rgba(255,255,255,.76);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
body.inner-route[data-route="annual-planning"] .annual-intelligence-model > .annual-model-core {
  border-radius: 18px 0 0 18px;
  background: linear-gradient(145deg, #0a3569 0%, #176bc2 62%, #4aaed3 140%);
  box-shadow: 16px 0 38px rgba(24, 83, 137, .14);
}
body.inner-route[data-route="annual-planning"] .annual-model-stages article {
  margin: 8px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(237,245,251,.82));
  transition: transform .22s ease, box-shadow .22s ease;
}
body.inner-route[data-route="annual-planning"] .annual-model-stages article:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(37, 91, 140, .1);
}

/* Tags and compact concepts become tactile labels instead of table cells. */
body.inner-route[data-route="annual-planning"] .annual-example-row > div {
  gap: 8px;
  padding: 10px 14px;
}
body.inner-route[data-route="annual-planning"] .annual-example-row > div span {
  border: 1px solid rgba(83, 142, 193, .24) !important;
  border-radius: 999px;
  background: linear-gradient(145deg, #fff, #edf5fb) !important;
  box-shadow: 0 5px 12px rgba(31, 83, 130, .055);
}
body.inner-route[data-route="annual-planning"] .annual-example-ledger {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 18px 42px rgba(27, 77, 122, .09);
}

/* Dark process bands use depth and rounded flow nodes. */
body.inner-route[data-route="business-review"] .br-failure-chain,
body.inner-route[data-route="compensation-performance-workshop"] .pw-failure-chain,
body.inner-route[data-route="mechanism-building"] .mb-failure,
body.inner-route[data-route="talent-management-development"] .tm-failure-track {
  overflow: hidden;
  border: 1px solid rgba(165, 202, 232, .28);
  border-radius: 22px;
  background: linear-gradient(115deg, rgba(255,255,255,.035), rgba(74,174,211,.075));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 22px 44px rgba(4, 28, 58, .16);
}
body.inner-route[data-route="business-review"] .br-failure-chain > div,
body.inner-route[data-route="compensation-performance-workshop"] .pw-failure-chain > li,
body.inner-route[data-route="mechanism-building"] .mb-failure > div,
body.inner-route[data-route="talent-management-development"] .tm-failure-track > div {
  border-color: rgba(165, 202, 232, .2);
}
body.inner-route[data-route="business-review"] .br-failure-chain > div:not(:last-child)::after,
body.inner-route[data-route="compensation-performance-workshop"] .pw-failure-chain > li:not(:last-child)::after,
body.inner-route[data-route="mechanism-building"] .mb-failure > div:not(:last-child)::after,
body.inner-route[data-route="talent-management-development"] .tm-failure-track > div:not(:last-child)::after {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  right: -15px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg, #2a85cb, #55b8df);
  box-shadow: 0 7px 17px rgba(3, 30, 64, .32);
  line-height: 1;
}

/* Light process groups read as flowing surfaces instead of repeated cards. */
body.inner-route[data-route="business-review"] :is(.br-meeting-stages,.br-transfer),
body.inner-route[data-route="compensation-performance-workshop"] :is(.pw-course-flow,.pw-workshop-map),
body.inner-route[data-route="mechanism-building"] :is(.mb-chain,.mb-timeline),
body.inner-route[data-route="talent-management-development"] :is(.tm-project-route,.tm-practice-ribbon),
body.inner-route[data-route="business-diagnosis"] :is(.diagnosis-chain.compact,.diagnosis-process) {
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(230,241,249,.86));
  box-shadow: 0 16px 36px rgba(24, 72, 114, .09);
}
body.inner-route[data-route="business-review"] .br-meeting-stages > div {
  border: 0;
  background: transparent;
}
body.inner-route[data-route="business-review"] .br-meeting-stages > div:nth-child(2) {
  background: linear-gradient(145deg, rgba(219,237,249,.88), rgba(242,247,252,.55));
}
body.inner-route[data-route="business-review"] .br-meeting-stages > div:not(:last-child)::after,
body.inner-route[data-route="business-review"] .br-transfer li:not(:last-child)::after,
body.inner-route[data-route="compensation-performance-workshop"] .pw-course-flow span:not(:last-child)::after {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  right: -14px;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg, var(--polish-blue), var(--polish-sky));
  box-shadow: 0 7px 16px rgba(24, 89, 145, .2);
}

/* Tables stay rigorous, but belong to the page as polished artifacts. */
body.inner-route:is(
  [data-route="annual-planning"],
  [data-route="business-review"],
  [data-route="compensation-performance-workshop"],
  [data-route="mechanism-building"],
  [data-route="talent-management-development"],
  [data-route="business-diagnosis"]
) :is(.annual-department-sheet,.br-table-scroll,.pw-table-scroll,.mb-scroll,.tm-table-scroll,.diagnosis-report) {
  border-radius: 18px;
  box-shadow: 0 16px 38px rgba(27, 75, 117, .085);
}
body.inner-route:is(
  [data-route="business-review"],
  [data-route="compensation-performance-workshop"],
  [data-route="mechanism-building"],
  [data-route="talent-management-development"]
) :is(.br-table-title,.pw-table-title,.mb-table-head,.tm-table-title) {
  border-radius: 16px 16px 0 0;
  background: linear-gradient(110deg, var(--polish-navy), #1b609a 72%, #3b9dbf);
}

/* Photography receives one consistent soft material treatment. */
body.inner-route:is(
  [data-route="annual-planning"],
  [data-route="business-review"],
  [data-route="compensation-performance-workshop"],
  [data-route="mechanism-building"],
  [data-route="talent-management-development"]
) :is(.annual-editorial-photo,.br-document,.pw-practice-layout figure,.mb-project-scene,.tm-practice figure) {
  border-radius: 20px;
  box-shadow: 0 22px 48px rgba(18, 58, 97, .14);
  overflow: hidden;
}

/* Buttons keep the brand color but gain depth and a softer silhouette. */
body.inner-route:is(
  [data-route="annual-planning"],
  [data-route="business-review"],
  [data-route="compensation-performance-workshop"],
  [data-route="mechanism-building"],
  [data-route="talent-management-development"],
  [data-route="business-diagnosis"]
) .button {
  border-radius: 999px;
  background: linear-gradient(110deg, #155eb0, #2f83c9);
  box-shadow: 0 12px 28px rgba(20, 91, 161, .22);
}

@media (max-width: 760px) {
  body.inner-route[data-route="annual-planning"] .annual-intelligence-model > .annual-model-core {
    border-radius: 18px 18px 0 0;
  }
  body.inner-route[data-route="business-review"] .br-failure-chain > div:not(:last-child)::after,
  body.inner-route[data-route="compensation-performance-workshop"] .pw-failure-chain > li:not(:last-child)::after,
  body.inner-route[data-route="mechanism-building"] .mb-failure > div:not(:last-child)::after,
  body.inner-route[data-route="talent-management-development"] .tm-failure-track > div:not(:last-child)::after,
  body.inner-route[data-route="business-review"] .br-meeting-stages > div:not(:last-child)::after,
  body.inner-route[data-route="business-review"] .br-transfer li:not(:last-child)::after,
  body.inner-route[data-route="compensation-performance-workshop"] .pw-course-flow span:not(:last-child)::after {
    right: 14px;
    bottom: -15px;
    top: auto;
  }
}

@media (prefers-reduced-transparency: reduce) {
  body.inner-route[data-route="annual-planning"] .annual-intelligence-model {
    background: #f3f8fc;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.inner-route[data-route="annual-planning"] .annual-model-stages article {
    transition: none;
  }
}