/* PANITH STYLESHEET STRUCTURE
 * 01. Design tokens and global base
 * 02. Header, navigation, buttons, and shared primitives
 * 03. Home page: hero, services, about, feature panels, team, testimonials
 * 04. Footer and responsive base rules
 * 05. Panith Core layouts: Knowledge Hub, articles, cards, forms, and CTAs
 * 06. Structured refinement overrides kept in cascade order
 *
 * WordPress Additional CSS is intentionally empty. Keep future styling changes
 * in this file so the theme remains portable and easier to maintain.
 * END PANITH STYLESHEET STRUCTURE */


/* [Panith CSS Section] 01 Design tokens and global base */
:root {
  --ink: #202124;
  --black: #121314;
  --muted: #53565a;
  --line: rgba(24, 25, 27, 0.16);
  --paper: #f7f5f0;
  --mist: #eef2f3;
  --white: #ffffff;
  --orange: #ff4b13;
  --yellow: #ffc800;
  --shadow: 0 22px 44px rgba(18, 19, 20, 0.15);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  overflow-x: clip;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Manrope", sans-serif;
  line-height: 1.35;
  overflow-x: clip;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 30;
  pointer-events: none;
  opacity: 0.22;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

button,
input {
  font: inherit;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1,
h2,
h3,
.brand {
  font-family: "Archivo", sans-serif;
  letter-spacing: 0;
}

.shell {
  width: min(912px, calc(100% - 108px));
  margin-inline: auto;
}


/* [Panith CSS Section] 02 Header and navigation */
.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(247, 245, 240, 0.88);
  backdrop-filter: blur(16px);
}

.nav {
  min-height: 72px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
}

.brand {
  font-size: 2rem;
  line-height: 1;
  font-weight: 900;
}

.nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 34px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.72rem;
  font-weight: 800;
}

.nav-links li {
  display: contents;
}

.nav-links a {
  padding: 10px 0;
}

.talk-button {
  justify-self: end;
  min-height: max(42px, calc(var(--panith-button-height, 48px) - 6px));
  padding: 0 max(18px, calc(var(--panith-button-padding-x, 25px) - 3px));
  display: inline-flex;
  align-items: center;
  border-radius: 7px;
  background: var(--black);
  color: var(--white);
  font-size: max(12px, calc(var(--panith-button-font-size, 14px) - 1px));
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(17, 18, 19, 0.14);
}

.menu-toggle {
  display: none;
}


/* [Panith CSS Section] 03 Buttons and links */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--panith-button-height, 48px);
  padding: 0 var(--panith-button-padding-x, 25px);
  border-radius: 8px;
  font-size: var(--panith-button-font-size, 14px);
  font-weight: 900;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn:hover,
.talk-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 15px 28px rgba(17, 18, 19, 0.18);
}

.btn-orange {
  background: var(--orange);
  color: var(--white) !important;
}

.btn-orange:visited,
.btn-orange:hover,
.btn-orange:focus-visible,
.btn-orange:active {
  background: var(--orange);
  color: var(--white) !important;
  text-decoration: none;
}

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.86rem;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 5px;
}

.link-arrow span {
  width: 72px;
  height: 1.8px;
  background: var(--ink);
  position: relative;
}

.link-arrow span::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  width: 11px;
  height: 11px;
  border-top: 2px solid var(--ink);
  border-right: 2px solid var(--ink);
  transform: translateY(-50%) rotate(45deg);
}


/* [Panith CSS Section] 04 Home hero */
.hero {
  min-height: 430px;
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(430px, 1.14fr);
  gap: 28px;
  align-items: center;
  padding: 20px 0 0;
}

.hero-copy {
  padding-top: 9px;
  max-width: 430px;
}

.hero h1 {
  font-size: clamp(3.15rem, 5vw, 3.82rem);
  line-height: 1.03;
  font-weight: 900;
}

.hero p {
  max-width: 330px;
  margin-top: 24px;
  color: #26282b;
  font-size: 0.95rem;
  line-height: 1.42;
  font-weight: 700;
}

.hero-actions {
  display: flex;
  align-items: center;
  gap: 29px;
  margin-top: 34px;
}

.hero-art {
  position: relative;
  justify-self: end;
  width: 510px;
  min-height: 422px;
}

.block {
  position: absolute;
  border-radius: 6px;
}

.block-orange {
  width: 306px;
  height: 390px;
  right: 62px;
  top: 2px;
  background: var(--orange);
  transform: rotate(-6deg);
}

.block-yellow {
  width: 222px;
  height: 252px;
  left: 70px;
  bottom: 5px;
  background: var(--yellow);
  border-radius: 9px;
}

.leader-photo {
  position: absolute;
  right: 98px;
  top: 14px;
  width: 292px;
  height: 396px;
  object-fit: cover;
  object-position: center top;
  clip-path: inset(0);
  filter: drop-shadow(0 20px 18px rgba(0, 0, 0, 0.12));
}

.code-photo,
.meeting-photo {
  position: absolute;
  z-index: 3;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: var(--shadow);
}

.code-photo {
  right: 0;
  top: 56px;
  width: 194px;
  height: 136px;
}

.meeting-photo {
  left: 1px;
  bottom: 15px;
  width: 156px;
  height: 138px;
  object-position: center;
}

.success-card {
  position: absolute;
  z-index: 4;
  right: 12px;
  bottom: 98px;
  width: 204px;
  min-height: 118px;
  padding: 20px 24px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
  transform: rotate(-7deg);
}

.success-card strong {
  display: block;
  font-family: "Archivo", sans-serif;
  font-size: 2.78rem;
  line-height: 1;
  font-weight: 900;
}

.success-card span {
  display: block;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 2px solid var(--ink);
  font-size: 1.02rem;
  font-weight: 900;
}

.doodle {
  position: absolute;
  z-index: 5;
  fill: none;
  stroke: var(--black);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.path-one {
  width: 112px;
  left: 105px;
  top: 95px;
  stroke-dasharray: 13 10;
}

.scribble {
  position: absolute;
  z-index: 5;
  right: 56px;
  bottom: 50px;
  width: 96px;
  fill: none;
  stroke: var(--black);
  stroke-width: 4;
  stroke-linecap: round;
}

.band-light {
  background: linear-gradient(180deg, #edf1f2 0%, #f7f5f0 100%);
}


/* [Panith CSS Section] 05 Home services */
.services {
  padding: 30px 0 36px;
}

.services h2,
.about h2,
.next-title h2,
.team h2,
.testimonials h2,
.cta h2 {
  font-size: clamp(2.05rem, 4vw, 3rem);
  line-height: 1.04;
  font-weight: 900;
}

.services h2 {
  max-width: 440px;
  margin-bottom: 18px;
  font-size: clamp(2.3rem, 4vw, 3.05rem);
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 48px);
}

.service-card {
  min-height: clamp(300px, 20vw, 375px);
  padding: clamp(42px, 4vw, 58px) clamp(34px, 3.5vw, 48px) clamp(30px, 3vw, 44px);
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(17, 18, 19, 0.08);
  box-shadow: 0 24px 54px rgba(20, 21, 22, 0.1);
  position: relative;
  overflow: hidden;
}

.service-card h3 {
  max-width: 100%;
  margin-top: auto;
  font-size: clamp(1.75rem, 2.4vw, 2.55rem);
  line-height: 1.04;
  font-weight: 900;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}

.service-card > a:not(.service-card-link) {
  width: 34px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  font-size: 1.65rem;
  line-height: 1;
  transition: transform 0.2s ease;
}

.service-card > a:not(.service-card-link):hover {
  transform: translateX(5px);
}

.service-card.hot {
  background: var(--orange);
  color: var(--black);
}

.service-card.sun {
  background: var(--yellow);
}

.service-card.clean {
  background: var(--white);
}

.service-card.dark {
  color: var(--white);
  background: radial-gradient(circle at 30% 20%, #323437, #151617 72%);
}

.service-card.dark h3 {
  color: var(--white);
}

.icon {
  width: 58px;
  height: 58px;
  display: block;
  color: currentColor;
}

.icon::before,
.icon::after {
  content: "";
  display: block;
}

.chart {
  border-left: 3px solid currentColor;
  border-bottom: 3px solid currentColor;
  position: relative;
}

.chart::before {
  position: absolute;
  left: 10px;
  bottom: 0;
  width: 8px;
  height: 18px;
  background: currentColor;
  box-shadow: 15px -10px 0 currentColor, 30px -25px 0 currentColor;
}

.chart::after {
  position: absolute;
  right: 0;
  top: 2px;
  width: 23px;
  height: 23px;
  border-top: 3px solid currentColor;
  border-right: 3px solid currentColor;
}

.clipboard {
  border: 3px solid currentColor;
  border-radius: 5px;
  position: relative;
  width: 45px;
  height: 55px;
  margin-left: 4px;
}

.clipboard::before {
  width: 20px;
  height: 11px;
  border: 3px solid currentColor;
  border-bottom: 0;
  border-radius: 7px 7px 0 0;
  margin: -13px auto 0;
  background: var(--yellow);
}

.clipboard::after {
  width: 22px;
  height: 28px;
  margin: 10px auto;
  background: repeating-linear-gradient(to bottom, currentColor 0 2px, transparent 2px 10px);
}

.globe {
  border: 3px solid currentColor;
  border-radius: 50%;
  position: relative;
}

.globe::before {
  width: 3px;
  height: 52px;
  background: currentColor;
  margin: 0 auto;
}

.globe::after {
  position: absolute;
  left: 6px;
  right: 6px;
  top: 50%;
  height: 3px;
  background: currentColor;
}

.cube {
  position: relative;
}

.cube::before {
  width: 41px;
  height: 41px;
  margin: 8px;
  border: 3px solid currentColor;
  transform: rotate(30deg) skewY(28deg);
}


/* [Panith CSS Section] 06 Home about section */
.about {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 62px;
  align-items: center;
  padding: 38px 0 34px;
}

.about-media {
  position: relative;
  min-height: 278px;
}

.about-media img {
  position: relative;
  z-index: 1;
  width: 414px;
  aspect-ratio: 1.58 / 1;
  object-fit: cover;
  border-radius: 0 0 8px 8px;
  margin-left: 0;
  margin-top: 4px;
}

.corner-shape {
  position: absolute;
  left: -58px;
  top: -36px;
  width: 188px;
  height: 286px;
  border-radius: 0 0 88px 0;
  background: var(--yellow);
}

.about-media svg {
  position: absolute;
  right: 52px;
  bottom: -7px;
  z-index: 2;
  width: 168px;
  fill: none;
  stroke: var(--black);
  stroke-width: 4;
  stroke-linecap: round;
}

.about-copy p {
  max-width: 352px;
  margin-top: 22px;
  color: #2d3033;
  font-size: 0.83rem;
  line-height: 1.38;
  font-weight: 700;
}

.stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 36px;
}

.stats div {
  padding-left: 25px;
  border-left: 1px solid var(--line);
}

.stats div:first-child {
  padding-left: 0;
  border-left: 0;
}

.stats strong {
  display: block;
  font-family: "Archivo", sans-serif;
  font-size: 2.2rem;
  line-height: 1;
  font-weight: 900;
}

.stats span {
  display: block;
  margin-top: 6px;
  color: #383b3f;
  font-size: 0.74rem;
  font-weight: 800;
}


/* [Panith CSS Section] 07 Home feature panels */
.next-level {
  background: radial-gradient(circle at 62% 18%, rgba(255, 255, 255, 0.05), transparent 26%), linear-gradient(135deg, #262729, #151617);
  color: var(--white);
  padding: 28px 0 34px;
}

.next-shell {
  min-height: 552px;
  position: relative;
}

.next-title {
  position: absolute;
  left: 14px;
  top: 20px;
  width: 250px;
  z-index: 3;
}

.next-title h2 {
  font-size: 2.05rem;
  line-height: 1.05;
}

.next-title span {
  position: relative;
  display: block;
  width: 145px;
  height: 15px;
  margin-top: 12px;
  border-radius: 50%;
  border-bottom: 4px solid var(--yellow);
  transform: rotate(-3deg);
}

.next-title span::after {
  content: "";
  position: absolute;
  left: 28px;
  bottom: -7px;
  width: 100px;
  border-bottom: 4px solid var(--yellow);
  border-radius: 50%;
  transform: rotate(-2deg);
}

.solution-panel {
  position: absolute;
  border-radius: 12px;
  color: var(--black);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  z-index: 1;
}

.panel-copy {
  position: relative;
  z-index: 1;
}

.panel-visual {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 12px 24px rgba(20, 21, 22, 0.12);
}

.panel-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.solution-panel h3 {
  font-size: 1.55rem;
  line-height: 0.98;
  font-weight: 900;
}

.solution-panel p {
  max-width: 180px;
  margin-top: 10px;
  font-size: 0.73rem;
  line-height: 1.33;
  font-weight: 800;
}

.automate {
  right: 68px;
  top: 0;
  width: 424px;
  min-height: 184px;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 200px 1fr;
  align-items: center;
  gap: 22px;
  background: var(--orange);
}

.automate svg {
  position: absolute;
  right: 23px;
  bottom: 18px;
  width: 58px;
  fill: none;
  stroke: var(--black);
  stroke-width: 3;
  stroke-linecap: round;
}

.automate .panel-visual {
  height: 142px;
  background: #fff;
  border: 1px solid rgba(20, 21, 22, 0.08);
}

.deliver {
  left: 70px;
  top: 214px;
  width: 456px;
  min-height: 178px;
  padding: 25px 24px 18px;
  background: var(--yellow);
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: center;
  gap: 18px;
  z-index: 2;
}

.deliver b {
  position: absolute;
  left: 195px;
  bottom: 22px;
  font-size: 2.3rem;
  font-weight: 400;
}

.deliver .panel-visual {
  height: 126px;
  background: #fffdf7;
  border: 1px solid rgba(20, 21, 22, 0.08);
}

.launch {
  right: 68px;
  bottom: 0;
  width: 536px;
  min-height: 178px;
  padding: 20px 20px 18px;
  display: grid;
  grid-template-columns: 180px 1fr;
  align-items: center;
  gap: 18px;
  background: var(--white);
}

.launch .panel-visual {
  height: 128px;
  background: #fbfbfb;
  border: 1px solid rgba(20, 21, 22, 0.08);
}


/* [Panith CSS Section] 08 Home team section */
.team {
  padding: 34px 0 32px;
  text-align: center;
}

.team h2 {
  margin-bottom: 24px;
  font-size: 2.25rem;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
}

.portrait {
  position: relative;
  height: 160px;
  border-radius: 9px;
  overflow: hidden;
}

.portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 20%, rgba(255, 255, 255, 0.42) 48%, transparent 72%);
  opacity: 0;
  transform: translateX(-120%) skewX(-12deg);
}

.portrait.orange {
  background: var(--orange);
}

.portrait.yellow {
  background: var(--yellow);
}

.portrait.grey {
  background: #e9eaeb;
}

.portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  transform-origin: center;
}

.person h3 {
  margin-top: 10px;
  font-size: 0.86rem;
  font-weight: 900;
}

.person p {
  color: #292b2e;
  font-size: 0.74rem;
  font-weight: 700;
}


/* [Panith CSS Section] 09 Testimonials */
.testimonials {
  padding: 24px 0 28px;
  background: #efe7da;
}

.testimonials h2 {
  text-align: center;
  margin-bottom: 18px;
  font-size: 2.2rem;
}

.quote-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 26px;
}

.quote-card {
  min-height: 124px;
  padding: 16px 18px;
  border-radius: 8px;
  background: var(--white);
  position: relative;
}

.quote-avatar {
  position: absolute;
  right: 15px;
  bottom: 14px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 8px 16px rgba(20, 21, 22, 0.14);
  transition: transform 260ms ease;
}

.quote-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.quote-card b {
  display: block;
  height: 16px;
  color: var(--orange);
  font-family: "Archivo", sans-serif;
  font-size: 2.4rem;
  line-height: 0.62;
}

.quote-card p {
  max-width: 210px;
  margin-top: 8px;
  font-size: 0.68rem;
  line-height: 1.2;
  font-weight: 800;
}

.stars {
  margin: 7px 0 3px;
  color: var(--yellow);
  letter-spacing: 1px;
  font-size: 0.78rem;
}

.quote-card strong,
.quote-card span {
  display: block;
  max-width: 160px;
  font-size: 0.72rem;
}

.quote-card strong {
  font-weight: 900;
}

.quote-card span {
  color: #373a3d;
  font-weight: 700;
}

.cta {
  padding: 19px 0 16px;
  color: var(--white);
  background: var(--black);
  border-top: 4px solid var(--yellow);
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.cta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

.cta h2 {
  position: relative;
  font-size: 1.72rem;
  line-height: 1.05;
}

.cta h2::after {
  content: "";
  display: block;
  width: 126px;
  height: 13px;
  margin-top: 5px;
  border-bottom: 3px solid var(--yellow);
  border-radius: 50%;
}

.cta .btn {
  min-height: var(--panith-button-height, 48px);
  min-width: 176px;
  font-size: var(--panith-button-font-size, 14px);
}

.cta p {
  margin-top: 11px;
  font-size: 0.82rem;
  font-weight: 800;
  text-align: center;
}

.footer {
  color: var(--white);
  background: #151617;
  padding: 18px 0 12px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.8fr 1.28fr 1.2fr 1.12fr;
  gap: 30px;
  padding-bottom: 15px;
}

.footer-brand {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--white);
  font-size: 1.55rem;
}

.footer p,
.footer a {
  display: block;
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.66rem;
  line-height: 1.35;
  font-weight: 700;
}

.footer h3 {
  margin-bottom: 10px;
  color: var(--white);
  font-size: 0.82rem;
  font-weight: 900;
}

.footer a {
  margin: 6px 0;
}

.socials {
  display: flex;
  gap: 9px;
  margin-top: 14px;
}

.socials a {
  width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.34);
  color: var(--white);
  font-size: 0.65rem;
}

.newsletter {
  margin-top: 8px;
}

.newsletter input {
  width: 100%;
  height: 24px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 4px;
  background: transparent;
  color: var(--white);
  font-size: 0.66rem;
}

.newsletter button {
  margin-top: 8px;
  min-height: 20px;
  padding: 0 18px;
  border: 0;
  border-radius: 3px;
  background: var(--yellow);
  color: var(--black);
  font-size: 0.62rem;
  font-weight: 900;
}

.copyright {
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-size: 0.68rem;
  font-weight: 700;
}


/* [Panith CSS Section] 11 Base responsive rules */
@media (max-width: 980px) {
  .shell {
    width: min(100% - 32px, 760px);
  }

  .nav {
    grid-template-columns: auto auto;
  }

  .menu-toggle {
    justify-self: end;
    display: grid;
    gap: 5px;
    width: 44px;
    height: 40px;
    place-content: center;
    border: 0;
    border-radius: 8px;
    background: var(--black);
  }

  .menu-toggle span {
    width: 20px;
    height: 2px;
    background: var(--white);
  }

  .nav-links,
  .talk-button {
    display: none;
  }

  .nav-links.is-open {
    display: grid;
    grid-column: 1 / -1;
    justify-content: stretch;
    gap: 0;
    padding: 12px 0 22px;
  }

  .nav-links.is-open a {
    padding: 13px 0;
    border-top: 1px solid var(--line);
  }

  .hero,
  .about {
    grid-template-columns: 1fr;
  }

  .hero {
    padding-top: 16px;
  }

  .hero-art {
    justify-self: center;
  }

  .about {
    gap: 30px;
  }

  .service-grid,
  .team-grid,
  .quote-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .next-shell {
    min-height: auto;
    display: grid;
    gap: 22px;
  }

  .next-title,
  .solution-panel {
    position: relative;
    inset: auto;
    width: auto;
  }

  .automate,
  .deliver,
  .launch {
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 24px;
  }

  .panel-visual {
    height: auto;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 620px) {
  .brand {
    font-size: 1.65rem;
  }

  .hero h1 {
    font-size: clamp(2.55rem, 12vw, 3.15rem);
    line-height: 1;
  }

  .hero-actions,
  .cta-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .service-grid,
  .team-grid,
  .quote-grid,
  .stats,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .stats div {
    padding: 14px 0 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .stats div:first-child {
    border-top: 0;
  }

  .hero-art {
    width: 100%;
    min-height: 390px;
    transform: none;
  }

  .block-orange {
    width: clamp(220px, 68vw, 300px);
    height: clamp(292px, 88vw, 375px);
    right: 18px;
    top: 16px;
  }

  .block-yellow {
    width: clamp(160px, 55vw, 220px);
    height: clamp(150px, 48vw, 220px);
    left: 8px;
    bottom: 8px;
  }

  .leader-photo {
    width: clamp(215px, 64vw, 285px);
    height: clamp(320px, 86vw, 382px);
    right: 52px;
    top: 18px;
  }

  .code-photo {
    width: clamp(128px, 38vw, 172px);
    height: clamp(90px, 27vw, 120px);
    top: 48px;
  }

  .meeting-photo {
    width: clamp(118px, 36vw, 150px);
    height: clamp(102px, 32vw, 132px);
    left: 6px;
    bottom: 22px;
  }

  .success-card {
    width: clamp(148px, 44vw, 178px);
    right: 6px;
    bottom: 82px;
    min-height: 96px;
    padding: 15px 17px;
  }

  .success-card strong {
    font-size: 2.15rem;
  }

  .success-card span {
    font-size: 0.88rem;
  }

  .path-one {
    left: 72px;
    top: 72px;
  }

  .scribble {
    right: 22px;
    bottom: 38px;
  }

  .about-media img {
    width: 100%;
  }
}

@media (min-width: 1200px) {
  .shell {
    width: min(1680px, calc(100% - 160px));
  }

  .nav {
    min-height: 108px;
  }

  .brand {
    font-size: 3rem;
  }

  .nav-links {
    gap: 58px;
    font-size: 1rem;
  }

  .talk-button {
    min-height: max(42px, calc(var(--panith-button-height, 48px) - 6px));
    padding: 0 max(18px, calc(var(--panith-button-padding-x, 25px) - 3px));
    border-radius: var(--panith-button-radius, 8px);
    font-size: max(12px, calc(var(--panith-button-font-size, 14px) - 1px));
  }

  .btn {
    min-height: var(--panith-button-height, 48px);
    padding: 0 var(--panith-button-padding-x, 25px);
    border-radius: var(--panith-button-radius, 8px);
    font-size: var(--panith-button-font-size, 14px);
  }

  .link-arrow {
    gap: 20px;
    font-size: 1.15rem;
  }

  .link-arrow span {
    width: 118px;
    height: 2.4px;
  }

  .hero {
    min-height: calc(100vh - 108px);
    grid-template-columns: minmax(0, 0.95fr) minmax(690px, 1.05fr);
    gap: 56px;
    padding: 0;
  }

  .hero-copy {
    max-width: 720px;
  }

  .hero h1 {
    font-size: clamp(5.7rem, 5.35vw, 6.65rem);
    line-height: 1.02;
  }

  .hero p {
    max-width: 560px;
    margin-top: 36px;
    font-size: 1.35rem;
  }

  .hero-actions {
    gap: 44px;
    margin-top: 48px;
  }

  .hero-art {
    width: 735px;
    min-height: 610px;
  }

  .block-orange {
    width: 440px;
    height: 562px;
    right: 94px;
    top: 0;
  }

  .block-yellow {
    width: 312px;
    height: 354px;
    left: 98px;
    bottom: 8px;
  }

  .leader-photo {
    width: 420px;
    height: 570px;
    right: 142px;
    top: 18px;
  }

  .code-photo {
    width: 282px;
    height: 198px;
    top: 76px;
  }

  .meeting-photo {
    width: 226px;
    height: 198px;
    bottom: 24px;
  }

  .success-card {
    right: 18px;
    bottom: 142px;
    width: 296px;
    min-height: 168px;
    padding: 30px 34px;
    border-radius: 16px;
  }

  .success-card strong {
    font-size: 4rem;
  }

  .success-card span {
    margin-top: 11px;
    padding-top: 11px;
    border-top-width: 3px;
    font-size: 1.45rem;
  }

  .path-one {
    width: 162px;
    left: 150px;
    top: 132px;
  }

  .scribble {
    width: 138px;
    right: 82px;
    bottom: 72px;
  }

  .services,
  .about,
  .next-level,
  .team,
  .testimonials {
    min-height: 100vh;
  }

  .services,
  .testimonials {
    display: flex;
    align-items: center;
  }

  .services {
    padding: 72px 0;
  }

  .services h2 {
    max-width: 760px;
    margin-bottom: 42px;
    font-size: 5rem;
  }

  .service-grid {
    gap: clamp(24px, 2.6vw, 34px);
  }

  .service-card {
    min-height: clamp(320px, 23vw, 404px);
    padding: clamp(42px, 3.4vw, 54px) clamp(32px, 2.4vw, 36px) clamp(30px, 2.6vw, 38px);
    border-radius: 18px;
  }

  .service-card h3 {
    max-width: 100%;
    font-size: clamp(1.85rem, 2.05vw, 2rem);
  }

  .service-card > a:not(.service-card-link) {
    width: 58px;
    height: 42px;
    font-size: 2.6rem;
  }

  .icon {
    width: 96px;
    height: 96px;
  }

  .clipboard {
    width: 74px;
    height: 90px;
  }

  .globe::before {
    height: 90px;
  }

  .cube::before {
    width: 70px;
    height: 70px;
    margin: 13px;
  }

  .chart::before {
    left: 16px;
    width: 12px;
    height: 32px;
    box-shadow: 25px -18px 0 currentColor, 50px -42px 0 currentColor;
  }

  .chart::after {
    width: 42px;
    height: 42px;
  }

  .about {
    gap: 118px;
    padding: 90px 0;
  }

  .about-media {
    min-height: 520px;
  }

  .about-media img {
    width: 760px;
  }

  .corner-shape {
    left: -104px;
    top: -66px;
    width: 344px;
    height: 520px;
    border-radius: 0 0 160px 0;
  }

  .about-media svg {
    right: 86px;
    bottom: -16px;
    width: 280px;
  }

  .about h2 {
    font-size: 4.8rem;
  }

  .about-copy p {
    max-width: 610px;
    margin-top: 38px;
    font-size: 1.22rem;
  }

  .stats {
    margin-top: 72px;
  }

  .stats div {
    padding-left: 48px;
  }

  .stats strong {
    font-size: 4rem;
  }

  .stats span {
    margin-top: 12px;
    font-size: 1.05rem;
  }

  .next-level {
    display: flex;
    align-items: center;
    padding: 72px 0;
  }

  .next-shell {
    min-height: 860px;
  }

  .next-title {
    left: 20px;
    top: 42px;
    width: 420px;
  }

  .next-title h2 {
    font-size: 3.9rem;
  }

  .next-title span {
    width: 260px;
    height: 24px;
    margin-top: 22px;
    border-bottom-width: 6px;
  }

  .next-title span::after {
    left: 52px;
    bottom: -10px;
    width: 180px;
    border-bottom-width: 6px;
  }

  .solution-panel {
    border-radius: 22px;
  }

  .solution-panel h3 {
    font-size: 2.7rem;
  }

  .solution-panel p {
    max-width: 300px;
    margin-top: 18px;
    font-size: 1.1rem;
  }

  .automate {
    right: 112px;
    width: 780px;
    min-height: 320px;
    padding: 30px 38px;
    grid-template-columns: 370px 1fr;
    gap: 42px;
  }

  .automate .panel-visual {
    height: 252px;
  }

  .automate svg {
    right: 42px;
    bottom: 34px;
    width: 108px;
  }

  .deliver {
    left: 108px;
    top: 348px;
    width: 790px;
    min-height: 304px;
    padding: 44px 42px 34px;
    grid-template-columns: 290px 1fr;
    gap: 36px;
  }

  .deliver .panel-visual {
    height: 220px;
  }

  .deliver b {
    left: 346px;
    bottom: 40px;
    font-size: 4.2rem;
  }

  .launch {
    right: 112px;
    width: 895px;
    min-height: 304px;
    padding: 36px 38px 34px;
    grid-template-columns: 320px 1fr;
    gap: 36px;
  }

  .launch .panel-visual {
    height: 224px;
  }

  .team {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 90px 0;
  }

  .team h2 {
    margin-bottom: 56px;
    font-size: 4.4rem;
  }

  .team-grid {
    gap: 46px;
  }

  .portrait {
    height: 330px;
    border-radius: 18px;
  }

  .person h3 {
    margin-top: 22px;
    font-size: 1.3rem;
  }

  .person p {
    font-size: 1.05rem;
  }

  .testimonials {
    padding: 90px 0;
  }

  .testimonials h2 {
    margin-bottom: 46px;
    font-size: 4.1rem;
  }

  .quote-grid {
    gap: 42px;
  }

  .quote-card {
    min-height: 250px;
    padding: 34px 38px;
    border-radius: 16px;
  }

  .quote-card b {
    height: 30px;
    font-size: 4.4rem;
  }

  .quote-card p {
    max-width: 360px;
    margin-top: 18px;
    font-size: 1.08rem;
  }

  .stars {
    margin: 18px 0 8px;
    font-size: 1.2rem;
  }

  .quote-card strong,
  .quote-card span {
    max-width: 260px;
    font-size: 1.02rem;
  }

  .quote-avatar {
    right: 28px;
    bottom: 28px;
    width: 82px;
    height: 82px;
  }

  .cta {
    min-height: 260px;
    display: flex;
    align-items: center;
    padding: 48px 0;
  }

  .cta h2 {
    font-size: 3rem;
  }

  .cta h2::after {
    width: 220px;
    height: 22px;
    border-bottom-width: 5px;
  }

.cta .btn {
  min-height: var(--panith-button-height, 48px);
  min-width: 260px;
  font-size: var(--panith-button-font-size, 14px);
}

  .cta p {
    margin-top: 18px;
    font-size: 1.15rem;
  }

  .footer {
    min-height: 360px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 42px 0 26px;
  }

  .footer-grid {
    gap: 58px;
    padding-bottom: 30px;
  }

  .footer-brand {
    margin-bottom: 20px;
    font-size: 2.45rem;
  }

  .footer h3 {
    margin-bottom: 18px;
    font-size: 1.2rem;
  }

  .footer p,
  .footer a {
    font-size: 0.92rem;
  }

  .socials a {
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
  }

  .newsletter input {
    height: 38px;
    font-size: 0.9rem;
  }

  .newsletter button {
    min-height: 30px;
    font-size: 0.78rem;
  }

  .copyright {
    padding-top: 18px;
    font-size: 0.92rem;
  }
}

/* Final responsive polish overrides */
.shell {
  width: min(1180px, calc(100% - 48px));
}

.site-header {
  border-bottom: 1px solid rgba(17, 18, 20, 0.08);
  background: rgba(251, 250, 246, 0.92);
}

.hero {
  min-height: min(780px, calc(100vh - 86px));
  grid-template-columns: minmax(0, 0.92fr) minmax(440px, 1.08fr);
  gap: clamp(34px, 5vw, 72px);
  padding: clamp(42px, 7vw, 90px) 0 clamp(46px, 6vw, 78px);
}

.hero h1 {
  max-width: 640px;
  font-size: clamp(4.1rem, 7vw, 6.75rem);
  line-height: 0.96;
  text-wrap: balance;
}

.hero p {
  max-width: 500px;
  font-size: clamp(1rem, 1.5vw, 1.3rem);
  line-height: 1.55;
}

.services,
.about,
.team,
.testimonials {
  padding: clamp(72px, 8vw, 112px) 0;
}

.service-card {
  min-height: 310px;
  padding: 36px 28px 28px;
  border-radius: 14px;
  box-shadow: 0 14px 40px rgba(18, 19, 20, 0.08);
}

.service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 70px rgba(18, 19, 20, 0.13);
}

.about {
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  gap: clamp(54px, 7vw, 96px);
}

.about-media img {
  width: 100%;
  min-height: 360px;
  border-radius: 14px;
  box-shadow: 0 22px 70px rgba(18, 19, 20, 0.13);
}

.next-level {
  padding: clamp(80px, 8vw, 120px) 0;
}

.quote-card {
  min-height: 218px;
  padding: 28px;
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(18, 19, 20, 0.06);
}

@media (max-width: 1180px) {
  .hero {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .shell {
    width: min(100% - 28px, 560px);
  }

  .hero h1 {
    font-size: clamp(3rem, 14vw, 4.3rem);
  }

  .hero-actions {
    align-items: stretch;
  }

  .hero-actions .btn,
  .hero-actions .link-arrow {
    width: 100%;
    justify-content: center;
  }

  .service-grid,
  .stats,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .automate,
  .deliver,
  .launch {
    grid-template-columns: 1fr;
  }
}


/* [Panith CSS Section] 90 Legacy visual repairs */
/* Codex UI repair */
.shell {
  width: min(1180px, calc(100% - 48px)) !important;
}

.hero {
  min-height: auto !important;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.95fr) !important;
  gap: 56px !important;
  padding: 72px 0 86px !important;
  overflow: hidden;
}

.hero-copy {
  max-width: 640px !important;
}

.hero h1 {
  font-size: clamp(3.05rem, 4.55vw, 4.9rem) !important;
  line-height: 0.98 !important;
  max-width: 620px !important;
}

.hero p {
  font-size: clamp(1rem, 1.25vw, 1.25rem) !important;
  max-width: 520px !important;
}

.hero-art {
  width: min(100%, 570px) !important;
  min-height: 520px !important;
}

.services,
.about,
.team,
.testimonials {
  min-height: 0 !important;
  padding: 86px 0 !important;
}

.services {
  display: block !important;
}

.services h2 {
  font-size: clamp(3rem, 4.6vw, 4.8rem) !important;
  max-width: 720px !important;
  margin-bottom: 42px !important;
}

.service-card {
  min-height: 300px !important;
  border-radius: 16px !important;
}

.next-level {
  min-height: 0 !important;
  padding: 96px 0 !important;
}

.next-shell {
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 28px;
  align-items: start;
}

.next-title {
  position: sticky !important;
  top: 120px !important;
  width: auto !important;
  left: auto !important;
}

.solution-panel {
  position: relative !important;
  inset: auto !important;
  width: calc(100% + 22px) !important;
}

.automate,
.deliver,
.launch {
  right: auto !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  min-height: 260px !important;
  margin-bottom: 28px;
}

.launch {
  margin-bottom: 0;
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr !important;
    padding: 48px 0 64px !important;
  }

  .hero-art {
    justify-self: center;
  }

  .next-shell {
    grid-template-columns: 1fr;
  }

  .next-title {
    position: relative !important;
    top: auto !important;
  }
}

@media (max-width: 620px) {
  .shell {
    width: min(100% - 28px, 560px) !important;
  }

  .hero h1 {
    font-size: clamp(2.25rem, 10.5vw, 3.15rem) !important;
  }

  .service-grid,
  .team-grid,
  .quote-grid {
    grid-template-columns: 1fr !important;
  }

  .service-card {
    min-height: 300px;
    padding: 38px 28px 28px;
  }

  .automate,
  .deliver,
  .launch {
    grid-template-columns: 1fr !important;
  }
}

/* Wider desktop layout */
@media (min-width: 981px) {
  .shell {
    width: min(1480px, calc(100% - 80px)) !important;
  }

  .hero {
    grid-template-columns: minmax(0, 1.08fr) minmax(520px, 0.92fr) !important;
    gap: clamp(64px, 6vw, 110px) !important;
  }

  .hero-copy {
    max-width: 760px !important;
  }

  .hero h1 {
    max-width: 740px !important;
  }

  .hero p {
    max-width: 620px !important;
  }

  .hero-art {
    width: min(100%, 650px) !important;
  }

  .services h2 {
    max-width: 860px !important;
  }

  .service-grid,
  .team-grid,
  .quote-grid {
    gap: clamp(28px, 3vw, 46px) !important;
  }

  .about {
    grid-template-columns: minmax(0, 1.12fr) minmax(420px, 0.88fr) !important;
    gap: clamp(72px, 7vw, 128px) !important;
  }

  .next-shell {
    grid-template-columns: 0.7fr 1.3fr !important;
    gap: clamp(40px, 5vw, 90px) !important;
  }
}

/* Match reference: compact overlapping next-level section */
@media (min-width: 981px) {
  .next-level {
    min-height: 0 !important;
    display: block !important;
    padding: 72px 0 82px !important;
  }

  .next-shell {
    position: relative !important;
    display: block !important;
    min-height: 720px !important;
  }

  .next-title {
    position: absolute !important;
    left: 0 !important;
    top: 26px !important;
    width: 360px !important;
    z-index: 4 !important;
  }

  .next-title h2 {
    font-size: clamp(2.45rem, 3.1vw, 3.45rem) !important;
    line-height: 1.02 !important;
  }

  .next-title span {
    width: 230px !important;
    height: 18px !important;
    margin-top: 18px !important;
  }

  .solution-panel {
    position: absolute !important;
    inset: auto !important;
    width: auto !important;
    margin: 0 !important;
    border-radius: 18px !important;
  }

  .solution-panel h3 {
    font-size: clamp(1.75rem, 2.25vw, 2.55rem) !important;
    line-height: 1.03 !important;
  }

  .solution-panel p {
    max-width: 270px !important;
    font-size: clamp(0.92rem, 1.05vw, 1.16rem) !important;
    line-height: 1.35 !important;
  }

  .automate {
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    width: min(760px, 56vw) !important;
    min-height: 250px !important;
    padding: 24px 34px !important;
    display: grid !important;
    grid-template-columns: minmax(280px, 0.95fr) minmax(210px, 1fr) !important;
    gap: 34px !important;
    align-items: center !important;
    z-index: 2 !important;
  }

  .automate .panel-visual {
    height: 200px !important;
  }

  .automate svg {
    width: 86px !important;
    right: 34px !important;
    bottom: 26px !important;
  }

  .deliver {
    top: 265px !important;
    left: 105px !important;
    right: auto !important;
    bottom: auto !important;
    width: min(790px, 58vw) !important;
    min-height: 250px !important;
    padding: 36px 36px 28px !important;
    display: grid !important;
    grid-template-columns: minmax(220px, 0.72fr) minmax(300px, 1fr) !important;
    gap: 28px !important;
    align-items: center !important;
    z-index: 3 !important;
  }

  .deliver .panel-visual {
    height: 190px !important;
  }

  .deliver b {
    left: 300px !important;
    bottom: 34px !important;
    font-size: 3.6rem !important;
  }

  .launch {
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    top: auto !important;
    width: min(930px, 66vw) !important;
    min-height: 250px !important;
    padding: 34px 36px 30px !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 0.72fr) minmax(390px, 1fr) !important;
    gap: 34px !important;
    align-items: center !important;
    z-index: 4 !important;
  }

  .launch .panel-visual {
    height: 190px !important;
  }
}

/* Consistent section heading scale */
.services h2,
.about h2,
.next-title h2,
.team h2,
.testimonials h2,
.cta h2 {
  font-size: clamp(2.55rem, 3.7vw, 4.1rem) !important;
  line-height: 1.04 !important;
  font-weight: 900 !important;
}

.services h2,
.team h2,
.testimonials h2 {
  margin-bottom: 42px !important;
}

@media (max-width: 620px) {
  .services h2,
  .about h2,
  .next-title h2,
  .team h2,
  .testimonials h2,
  .cta h2 {
    font-size: clamp(2.05rem, 10vw, 2.8rem) !important;
    line-height: 1.06 !important;
  }
}

/* Keep the dark feature section heading compact */
.next-title h2 {
  font-size: clamp(2.05rem, 2.45vw, 2.7rem) !important;
  line-height: 1.04 !important;
}

@media (max-width: 620px) {
  .next-title h2 {
    font-size: clamp(1.9rem, 9vw, 2.45rem) !important;
  }
}

/* Square-box styling for the dark feature panels */
.next-level .solution-panel,
.next-level .panel-visual {
  border-radius: 6px !important;
}

.next-level .automate,
.next-level .deliver,
.next-level .launch {
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.26) !important;
}

/* Contact form section */
.contact-section {
  background: linear-gradient(180deg, #f7f5f0 0%, #efe8da 100%);
  padding: clamp(72px, 8vw, 112px) 0 !important;
}

.contact-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.95fr) minmax(340px, 0.95fr);
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: 14px;
  background: #fffdf8;
  box-shadow: 0 24px 70px rgba(18, 19, 20, 0.1);
}

.contact-form-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(48px, 5vw, 76px);
  min-height: clamp(500px, 46vw, 640px);
}

.contact-form-panel::before {
  content: "";
  position: absolute;
  right: clamp(34px, 5vw, 72px);
  top: clamp(34px, 4vw, 58px);
  width: clamp(70px, 7vw, 118px);
  height: clamp(70px, 7vw, 118px);
  border-radius: 6px;
  background: var(--yellow);
  opacity: 0.24;
  transform: rotate(-7deg);
}

.section-kicker {
  position: relative;
  display: block;
  margin-bottom: 18px;
  color: var(--orange);
  font-family: "Archivo", sans-serif;
  font-size: clamp(0.82rem, 0.9vw, 1rem);
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.contact-form-panel h2,
.contact-info-panel h2 {
  position: relative;
  font-family: "Archivo", sans-serif !important;
  font-size: clamp(2.55rem, 3.7vw, 4.1rem) !important;
  line-height: 1.04 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

.contact-form-panel .section-kicker,
.contact-form-panel h2,
.contact-cta-panel {
  max-width: 780px;
}

.contact-form {
  position: relative;
  display: grid;
  gap: 24px;
  margin-top: clamp(34px, 4vw, 58px);
}

.contact-cta-panel {
  position: relative;
  display: grid;
  gap: clamp(18px, 2.2vw, 24px);
  margin-top: clamp(30px, 3.5vw, 46px);
}

.contact-cta-panel::before {
  content: "";
  width: 76px;
  height: 5px;
  border-radius: 999px;
  background: var(--orange);
}

.contact-cta-panel p {
  color: #303337;
  font-size: clamp(1rem, 1.12vw, 1.15rem);
  line-height: 1.6;
  font-weight: 800;
  max-width: 760px;
  margin: 0;
}

.contact-cta-panel .btn {
  justify-self: start;
  width: auto;
  min-width: min(100%, 310px);
  min-height: 58px;
  padding-inline: clamp(24px, 3vw, 44px);
}

.form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: 8px;
  background: #f4f1ea;
  color: var(--ink);
  font-family: "Manrope", sans-serif;
  font-size: clamp(0.98rem, 1vw, 1.12rem);
  font-weight: 700;
  outline: 2px solid transparent;
  transition: outline-color 0.2s ease, background 0.2s ease;
}

.contact-form input {
  min-height: 74px;
  padding: 0 28px;
}

.contact-form textarea {
  min-height: 154px;
  padding: 28px;
  resize: vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: #74777b;
  opacity: 1;
}

.contact-form input:focus,
.contact-form textarea:focus {
  background: #fff;
  border-color: rgba(255, 79, 18, 0.55);
  outline-color: rgba(255, 79, 18, 0.18);
}

.contact-form .btn {
  justify-self: start;
  min-width: 198px;
  font-family: "Manrope", sans-serif;
  font-weight: 900;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  text-transform: uppercase;
}

.contact-info-panel {
  position: relative;
  padding: clamp(50px, 5vw, 76px) clamp(42px, 4vw, 64px);
  background: var(--orange);
  color: var(--white);
}

.contact-info-panel::after {
  content: "";
  position: absolute;
  right: -52px;
  bottom: -72px;
  width: 180px;
  height: 260px;
  border-radius: 8px;
  background: var(--yellow);
  opacity: 0.22;
  transform: rotate(-10deg);
}

.contact-info-panel h2 {
  position: relative;
  z-index: 1;
  color: var(--white);
}

.contact-info-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(26px, 3vw, 42px);
  margin-top: clamp(34px, 4vw, 58px);
}

.contact-info-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.contact-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 2px solid currentColor;
  border-radius: 8px;
  color: var(--white);
  font-family: "Archivo", sans-serif;
  font-size: 1.35rem;
  line-height: 1;
  font-weight: 900;
}

.contact-info-item h3 {
  color: var(--white);
  font-family: "Archivo", sans-serif;
  font-size: clamp(1.22rem, 1.55vw, 1.55rem);
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: 0;
}

.contact-info-item p,
.contact-info-item a {
  margin-top: 12px;
  color: rgba(255, 255, 255, 0.92);
  font-family: "Manrope", sans-serif;
  font-size: clamp(0.96rem, 1.08vw, 1.1rem);
  line-height: 1.42;
  font-weight: 800;
}

/* Hero collage positioning polish */
@media (min-width: 981px) {
  .success-card {
    bottom: 48px !important;
  }

  .scribble {
    bottom: -28px !important;
  }

  .path-one {
    left: clamp(-110px, -6vw, -62px) !important;
    top: clamp(118px, 12vw, 152px) !important;
    width: clamp(150px, 14vw, 190px) !important;
  }
}

@media (max-width: 980px) {
  .contact-shell {
    grid-template-columns: 1fr;
  }

  .contact-form-panel {
    min-height: auto;
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  .contact-shell {
    width: min(100% - 28px, 560px) !important;
  }

  .contact-form-panel,
  .contact-info-panel {
    padding: 34px 22px;
  }

  .contact-form-panel::before {
    right: 18px;
    top: 24px;
    width: 58px;
    height: 58px;
    opacity: 0.18;
  }

  .contact-form-panel h2 {
    max-width: calc(100% - 70px);
  }

  .contact-cta-panel .btn {
    width: 100%;
    min-width: 0;
    max-width: 420px;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .contact-form input {
    min-height: 62px;
  }
}

/* Underline arrow button style */
.link-arrow {
  position: relative !important;
  display: inline-block !important;
  width: auto !important;
  padding: 0 22px 13px 0 !important;
  text-decoration: none !important;
  line-height: 1.1 !important;
}

.link-arrow span {
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 16px !important;
  background: none !important;
  overflow: visible !important;
}

.link-arrow span::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 4px !important;
  bottom: 4px !important;
  height: 10px !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 8.5C48 7.4 96 7.4 176 7.9' fill='none' stroke='%23202426' stroke-width='2.8' stroke-linecap='round'/%3E%3Cpath d='M4 12.3C52 10.8 104 10.7 174 11.2' fill='none' stroke='%23202426' stroke-width='1.5' stroke-linecap='round' opacity='.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

.link-arrow span::after {
  right: -2px !important;
  top: 3px !important;
  width: 15px !important;
  height: 15px !important;
  border-top: 3px solid var(--ink) !important;
  border-right: 3px solid var(--ink) !important;
  border-radius: 1px !important;
  transform: rotate(45deg) skew(-2deg, -2deg) !important;
}

@media (max-width: 620px) {
  .hero-actions .link-arrow {
    width: fit-content !important;
    align-self: flex-start !important;
    justify-content: flex-start !important;
  }
}

/* Remove Explore Services arrow decoration */
.link-arrow {
  padding: 0 !important;
}

.link-arrow span,
.link-arrow span::before,
.link-arrow span::after {
  display: none !important;
  content: none !important;
}

/* Refined service icons, arrow buttons, and popup */
.service-card {
  isolation: isolate;
}

.service-card .icon {
  width: clamp(58px, 5vw, 82px) !important;
  height: clamp(58px, 5vw, 82px) !important;
  margin-bottom: clamp(28px, 5vw, 58px);
}

.service-card > .service-custom-icon,
.service-card .service-card-link > .service-custom-icon {
  width: clamp(58px, 5vw, 82px) !important;
  height: clamp(58px, 5vw, 82px) !important;
  margin-bottom: clamp(28px, 5vw, 58px) !important;
  object-fit: contain;
}

.service-card .chart {
  border-left-width: 4px;
  border-bottom-width: 4px;
}

.service-card .chart::before {
  left: 15px;
  width: 14px;
  height: 30px;
  box-shadow: 24px -16px 0 currentColor, 48px -34px 0 currentColor;
}

.service-card .chart::after {
  right: -2px;
  top: 2px;
  width: 42px;
  height: 42px;
  border-top-width: 4px;
  border-right-width: 4px;
}

.service-card .clipboard {
  width: 66px !important;
  height: 82px !important;
  border-width: 4px;
  border-radius: 8px;
}

.service-card .clipboard::before {
  width: 28px;
  height: 14px;
  border-width: 4px;
  margin-top: -17px;
}

.service-card .clipboard::after {
  width: 30px;
  height: 34px;
  margin-top: 16px;
  background: repeating-linear-gradient(to bottom, currentColor 0 3px, transparent 3px 11px);
}

.service-card .globe {
  border-width: 4px;
}

.service-card .globe::before {
  width: 4px;
  height: 74px;
}

.service-card .globe::after {
  height: 4px;
}

.service-card .cube::before {
  width: 62px;
  height: 62px;
  margin: 10px;
  border-width: 4px;
}

.service-open {
  width: 62px;
  height: 40px;
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  border: 0;
  background: transparent;
  color: currentColor;
  font-family: "Archivo", sans-serif;
  font-size: 2.45rem;
  line-height: 1;
  font-weight: 900;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.service-open:hover,
.service-open:focus-visible {
  transform: translateX(7px);
}

.service-card.dark .service-open,
.service-card.dark .icon {
  color: var(--white);
}

body.modal-open {
  overflow: hidden;
}

.service-modal[hidden] {
  display: none;
}

/* Curved underline for Explore Services */
.link-arrow {
  position: relative !important;
  padding-bottom: 12px !important;
}

.link-arrow span {
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 10px !important;
  display: block !important;
  background: none !important;
}

.link-arrow span::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 11C45 5 104 6 156 9' fill='none' stroke='%23202426' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

.link-arrow span::after {
  content: none !important;
  display: none !important;
}

.service-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 24px;
}

.service-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 18, 19, 0.72);
  backdrop-filter: blur(8px);
}

.service-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(620px, 100%);
  max-height: calc(100vh - 80px);
  padding: clamp(34px, 5vw, 56px);
  border-radius: 12px;
  background: #fffdf8;
  color: var(--ink);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.34);
  display: flex;
  flex-direction: column;
}

.service-modal__dialog::before {
  content: "";
  position: absolute;
  right: 34px;
  top: 34px;
  width: 86px;
  height: 86px;
  border-radius: 8px;
  background: var(--yellow);
  opacity: 0.38;
  transform: rotate(-8deg);
}

.service-modal__dialog h2 {
  position: relative;
  max-width: 430px;
  font-size: clamp(2.2rem, 4vw, 3.2rem) !important;
  line-height: 1.04 !important;
  font-weight: 900 !important;
}

.service-modal__dialog p {
  position: relative;
  margin: 24px 0 32px;
  color: #2f3235;
  font-size: 1.05rem;
  line-height: 1.55;
  font-weight: 800;
  overflow-y: auto;
  flex: 1;
  scrollbar-width: thin;
}

.service-modal__close {
  position: absolute;
  right: 18px;
  top: 18px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 8px;
  background: var(--black);
  color: var(--white);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}

@media (max-width: 620px) {
  .service-card .icon {
    width: 68px !important;
    height: 68px !important;
  }

  .service-modal {
    padding: 16px;
  }
}

/* WordPress editable logo support */
.brand .custom-logo,
.custom-logo-link img {
  width: auto;
  max-width: 210px;
  max-height: 58px;
  object-fit: contain;
}

.footer-brand .custom-logo,
.footer .custom-logo-link img,
.footer-custom-logo {
  max-height: 52px;
}

/* Modern motion layer */
.panith-reveal {
  opacity: 0;
  transform: translateY(28px) scale(0.985);
  filter: blur(7px);
  transition:
    opacity var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1),
    transform var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1),
    filter var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

.team h2.panith-reveal,
.testimonials h2.panith-reveal {
  transform: translateY(20px);
}

.panith-heading-reveal {
  transform: translateY(26px) scale(0.98);
  transform-origin: left bottom;
}

.testimonials .panith-heading-reveal {
  transform-origin: center bottom;
}

.section-kicker.panith-heading-reveal {
  transform: translateY(14px);
}

.team .person.panith-reveal,
.panith-content-card.panith-reveal,
.panith-module.panith-reveal {
  transform: translateY(38px) rotateX(6deg) scale(0.95);
  transform-origin: center bottom;
}

.testimonials .quote-card.panith-reveal,
.panith-final-cta.panith-reveal,
.panith-download-box.panith-reveal,
.panith-consultation-form.panith-reveal {
  transform: translateY(34px) rotate(-1.5deg) scale(0.96);
}

.panith-reveal.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

.team .person.is-visible .portrait img {
  animation: panithPortraitSettle 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
  animation-delay: calc(var(--reveal-delay, 0ms) + 120ms);
}

.team .person.is-visible .portrait::after {
  animation: panithPortraitSweep 900ms cubic-bezier(0.22, 1, 0.36, 1) both;
  animation-delay: calc(var(--reveal-delay, 0ms) + 120ms);
}

.testimonials .quote-card.is-visible b {
  animation: panithQuotePop 620ms cubic-bezier(0.22, 1, 0.36, 1) both;
  animation-delay: calc(var(--reveal-delay, 0ms) + 120ms);
}

.testimonials .quote-card.is-visible.is-carousel-active {
  transform: translateY(-5px);
  box-shadow: 0 26px 60px rgba(18, 19, 20, 0.12);
}

.testimonials .quote-card.is-visible.is-carousel-active .quote-avatar {
  transform: translateY(-4px) scale(1.04);
}

@keyframes panithPortraitSettle {
  0% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes panithPortraitSweep {
  0% {
    opacity: 0;
    transform: translateX(-120%) skewX(-12deg);
  }
  35% {
    opacity: 0.38;
  }
  100% {
    opacity: 0;
    transform: translateX(130%) skewX(-12deg);
  }
}

@keyframes panithQuotePop {
  0% {
    opacity: 0;
    transform: translateY(12px) scale(0.82);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.service-card,
.panith-content-card,
.panith-module,
.panith-final-cta,
.panith-download-box,
.panith-facts-grid div,
.panith-filter-form,
.panith-consultation-form,
.solution-panel,
.quote-card,
.person,
.btn,
.talk-button {
  transition:
    transform 260ms ease,
    box-shadow 260ms ease,
    opacity var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1),
    filter var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1);
}

.service-card:hover,
.panith-content-card:hover,
.panith-module:hover,
.panith-facts-grid div:hover,
.quote-card:hover,
.person:hover {
  transform: translateY(-7px);
}

.panith-content-card a,
.service-card-link,
.read-more-inline,
.service-card-action,
.link-arrow,
.panith-reset-link,
.panith-toc a,
.panith-chapter-nav a {
  transition: color 180ms ease, transform 180ms ease, opacity 180ms ease;
}

.panith-content-card:hover .read-more-inline,
.service-card:hover .service-card-action,
.link-arrow:hover span,
.panith-chapter-nav a:hover {
  transform: translateX(4px);
}

.panith-module summary {
  transition: color 180ms ease, background 180ms ease;
}

.panith-module[open] .panith-card-grid {
  animation: panith-soft-open 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.panith-filter-form input:focus,
.panith-filter-form select:focus,
.panith-consultation-form input:focus,
.panith-consultation-form select:focus,
.panith-consultation-form textarea:focus {
  transform: translateY(-1px);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.hero-art .success-card {
  animation: panith-float 5.8s ease-in-out infinite;
}

.hero-art .doodle path,
.hero-art .scribble path,
.next-title span {
  stroke-dasharray: 420;
  stroke-dashoffset: 420;
  animation: panith-draw 1.5s ease forwards 0.35s;
}

@keyframes panith-float {
  0%, 100% {
    transform: translateY(0) rotate(-7deg);
  }

  50% {
    transform: translateY(-10px) rotate(-5deg);
  }
}

@keyframes panith-draw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes panith-soft-open {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.panith-reduced-motion * {
  animation: none !important;
  transition: none !important;
}

.panith-reduced-motion .panith-reveal {
  opacity: 1;
  transform: none;
  filter: none;
}

@media (prefers-reduced-motion: reduce) {
  .panith-reveal {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }

  .hero-art .success-card,
  .hero-art .doodle path,
  .hero-art .scribble path,
  .next-title span,
  .panith-module[open] .panith-card-grid {
    animation: none;
  }
}

/* Controlled horizontal scrolling for Testimonials */
.quote-grid {
  display: grid !important;
  grid-auto-flow: column;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0 2px 42px;
  scroll-padding-left: 2px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.team-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 24px !important;
  overflow: visible;
}

.quote-grid {
  gap: 26px !important;
  grid-auto-columns: calc((100% - 52px) / 3);
  grid-template-columns: none !important;
}

.quote-grid > .quote-card {
  min-width: 0;
  scroll-snap-align: start;
}

.team-grid > .person {
  padding-bottom: 10px;
}

.quote-grid::-webkit-scrollbar {
  display: none;
}

.quote-grid:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 8px;
}

.panith-carousel {
  position: relative;
}

.panith-carousel-control {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--panith-button-radius, 8px);
  background: var(--black);
  color: var(--white);
  font-weight: 900;
  transform: translateY(-50%);
  cursor: pointer;
}

.panith-carousel-prev {
  left: -18px;
}

.panith-carousel-next {
  right: -18px;
}

.panith-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin-top: 22px;
}

.panith-carousel-dots button {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(18, 19, 20, 0.25);
  cursor: pointer;
}

.panith-carousel-dots button[aria-current="true"] {
  background: var(--orange);
}

@media (max-width: 980px) {
  .team-grid {
    grid-auto-columns: calc((100% - 24px) / 2) !important;
  }

  .quote-grid {
    grid-auto-columns: calc((100% - 26px) / 2) !important;
  }
}

@media (max-width: 620px) {
  .team-grid,
  .quote-grid {
    grid-auto-columns: 100% !important;
  }
}

/* Final all-screen responsive layer */
main, section, .shell, .nav, .hero-copy, .hero-art, .service-card,
.solution-panel, .panel-copy, .panel-visual, .person, .quote-card,
.contact-form-panel, .contact-info-panel, .footer-grid > div {
  min-width: 0;
}

h1, h2, h3, p, a, span, strong {
  overflow-wrap: anywhere;
}

.team-grid, .quote-grid {
  max-width: 100%;
  touch-action: pan-x pan-y pinch-zoom;
  overscroll-behavior-inline: contain;
}

.person {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  align-items: center;
}

.portrait {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
}

.person h3, .person p {
  width: 100%;
  padding-inline: 8px;
  line-height: 1.3;
  text-align: center;
}

.person p { margin-top: 4px; }

.person-bio {
  width: 100%;
  margin-top: 12px;
  padding-inline: 8px;
  color: #383b3f;
  font-size: 0.88rem;
  line-height: 1.45;
  font-weight: 750;
  text-align: center;
}

.person-skills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  margin-top: 14px;
  padding-inline: 8px;
}

.person-skills span {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(18, 19, 20, 0.07);
  color: var(--ink);
  font-size: 0.68rem;
  font-weight: 900;
}

.person-links {
  display: flex;
  justify-content: center;
  gap: 12px;
  width: 100%;
  margin-top: 14px;
  padding-inline: 8px;
  opacity: 0.82;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.person:hover .person-links,
.person:focus-within .person-links {
  opacity: 1;
  transform: translateY(-2px);
}

.person-links a {
  color: var(--orange);
  font-size: 0.72rem;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.quote-card {
  height: 100%;
  padding-bottom: 104px;
}

.quote-card p, .quote-card strong, .quote-card span {
  max-width: calc(100% - 10px);
}

.quote-service {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 12px;
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(255, 75, 19, 0.12);
  color: var(--orange);
  font-size: 0.68rem !important;
  font-weight: 900 !important;
  text-transform: uppercase;
}

.contact-form input, .contact-form textarea, .newsletter input {
  min-width: 0;
  max-width: 100%;
}

@media (min-width: 981px) and (max-width: 1199px) {
  .portrait { max-height: 300px; }
  .quote-card { min-height: 280px; }
}

@media (max-width: 980px) {
  .shell, .contact-shell {
    width: min(100% - 40px, 760px) !important;
  }

  .nav { min-height: 72px; }

  .hero {
    gap: 24px !important;
    padding: 48px 0 64px !important;
    overflow: visible;
  }

  .hero-copy, .hero p { max-width: 100% !important; }

  .hero-art {
    width: min(100%, 570px) !important;
    min-height: 480px !important;
    justify-self: center;
  }

  .services, .about, .team, .testimonials { padding: 68px 0 !important; }

  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
  }

  .service-card {
    min-height: 320px !important;
    padding: 40px 30px 30px !important;
  }
  .about { gap: 44px; }
  .about-media { min-height: 0; }

  .about-media img {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .about-copy p {
    max-width: 620px;
    font-size: 1rem;
  }

  .next-level { padding: 72px 0 !important; }
  .next-shell { gap: 24px !important; }
  .next-title { margin-bottom: 12px; }

  .automate, .deliver, .launch {
    width: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr) !important;
    gap: 24px !important;
    padding: 28px !important;
  }

  .solution-panel .panel-visual {
    height: clamp(180px, 30vw, 230px) !important;
  }

  .solution-panel p {
    max-width: 100% !important;
    font-size: 1rem !important;
  }

  .portrait { max-height: 320px; }
  .person h3 { margin-top: 16px; font-size: 1.12rem; }
  .person p { font-size: .94rem; }

  .quote-card {
    min-height: 300px;
    padding: 28px 28px 104px;
  }

  .quote-card p {
    max-width: 100%;
    font-size: .98rem;
    line-height: 1.55;
  }

  .contact-form-panel, .contact-info-panel { padding: 48px 36px; }
  .footer { padding-block: 48px 24px; }
  .footer-grid { gap: 36px 28px; }
}

@media (max-width: 620px) {
  .shell, .contact-shell {
    width: min(100% - 28px, 560px) !important;
  }

  .nav { min-height: 64px; gap: 12px; }

  .nav-links.is-open {
    max-height: calc(100dvh - 64px);
    overflow-y: auto;
  }

  .hero { gap: 18px !important; padding: 36px 0 46px !important; }

  .hero h1 {
    max-width: 100% !important;
    font-size: clamp(2.15rem, 11vw, 3.1rem) !important;
    line-height: 1.02 !important;
  }

  .hero p { margin-top: 18px; font-size: 1rem !important; }
  .hero-actions { width: 100%; gap: 20px; margin-top: 26px; }
  .hero-actions .btn { width: 100%; }
  .hero-art { min-height: 390px !important; }

  .services, .about, .team, .testimonials, .contact-section {
    padding: 54px 0 !important;
  }

  .services h2, .team h2, .testimonials h2 { margin-bottom: 30px !important; }
  .service-grid { grid-template-columns: 1fr; }

  .service-card {
    min-height: 300px !important;
    padding: 38px 28px 28px !important;
  }

  .about { gap: 34px; }
  .corner-shape { left: -20px; top: -20px; width: 42%; height: 92%; }
  .about-media svg { right: 12px; width: 42%; }

  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .stats div, .stats div:first-child {
    padding: 0 8px;
    border-top: 0;
    border-left: 1px solid var(--line);
  }

  .stats div:first-child { padding-left: 0; border-left: 0; }
  .stats strong { font-size: clamp(1.45rem, 8vw, 2.15rem); }
  .stats span { font-size: .68rem; }
  .next-level { padding: 56px 0 !important; }

  .automate, .deliver, .launch {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 22px !important;
  }

  .solution-panel .panel-visual {
    height: auto !important;
    min-height: 170px;
    aspect-ratio: 16 / 10;
  }

  .team-grid, .quote-grid {
    padding-inline: 0;
    padding-bottom: 28px;
    scroll-padding-left: 0;
  }

  .portrait { max-height: none; }
  .person { padding-bottom: 14px !important; }
  .person h3 { margin-top: 14px; font-size: 1.08rem; }

  .quote-card {
    min-height: 320px;
    padding: 24px 22px 100px;
  }

  .quote-avatar { right: 22px; bottom: 22px; width: 64px; height: 64px; }
  .contact-shell { border-radius: 10px; }
  .contact-form-panel, .contact-info-panel { padding: 36px 20px; }
  .contact-form-panel::before { right: 18px; top: 24px; width: 58px; height: 58px; opacity: 0.18; }

  .contact-form-panel h2, .contact-info-panel h2 {
    font-size: clamp(2rem, 10vw, 2.65rem) !important;
  }

  .contact-form-panel h2 { max-width: calc(100% - 70px); }

  .contact-form { gap: 18px; margin-top: 30px; }
  .form-row { gap: 18px; }
  .contact-form input { min-height: 58px; padding-inline: 18px; }
  .contact-form textarea { min-height: 140px; padding: 18px; }
  .contact-form .btn { width: 100%; }
  .contact-cta-panel .btn { min-width: 0; max-width: 420px; }
  .contact-info-item { grid-template-columns: 46px minmax(0, 1fr); gap: 14px; }
  .contact-icon { width: 44px; height: 44px; font-size: 1rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .footer p, .footer a { font-size: .9rem; line-height: 1.5; }
  .footer h3 { font-size: 1rem; }
  .newsletter input { height: 48px; font-size: .9rem; }
  .newsletter button { min-height: 42px; font-size: .82rem; }
}

@media (max-width: 380px) {
  .shell, .contact-shell { width: calc(100% - 20px) !important; }
  .hero h1 { font-size: clamp(2rem, 10.5vw, 2.45rem) !important; }
  .hero-art { min-height: 360px !important; }
  .stats { grid-template-columns: 1fr; }

  .stats div, .stats div:first-child {
    padding: 12px 0 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .stats div:first-child { padding-top: 0; border-top: 0; }
}

/* Mobile and tablet image composition and Panith navigation */
section[id] { scroll-margin-top: 96px; }

@media (max-width: 980px) {
  .site-header { background: rgba(247, 245, 240, .97); }
  .nav { position: relative; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; }

  .menu-toggle {
    position: relative;
    z-index: 2;
    width: 48px;
    height: 48px;
    gap: 6px;
    border: 1px solid rgba(18, 19, 20, .16);
    border-radius: 8px;
    background: var(--black);
    transition: background .2s ease, transform .2s ease;
  }

  .menu-toggle span {
    width: 22px;
    height: 2px;
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
  }

  .menu-toggle.is-active { background: var(--orange); }
  .menu-toggle.is-active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  .menu-toggle.is-active span:nth-child(2) { opacity: 0; }
  .menu-toggle.is-active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

  .nav-links.is-open {
    display: grid;
    grid-column: 1 / -1;
    width: 100%;
    gap: 0;
    margin: 0;
    padding: 16px 0 8px;
    border-top: 2px solid var(--orange);
    border-bottom: 1px solid var(--line);
    background: var(--paper);
  }

  .nav-links.is-open a,
  .nav-links.is-open li a {
    display: flex;
    align-items: center;
    min-height: 54px;
    padding: 12px 4px;
    border-top: 1px solid var(--line);
    color: var(--ink);
    font-family: "Archivo", sans-serif;
    font-size: 1rem;
    font-weight: 900;
  }

  .nav-links.is-open > :first-child a,
  .nav-links.is-open > a:first-child { border-top: 0; }

  .nav:has(.nav-links.is-open) .talk-button {
    display: inline-flex;
    grid-column: 1 / -1;
    grid-row: 3;
    width: 100%;
    min-height: 50px;
    margin: 12px 0 20px;
    justify-content: center;
    border-radius: 8px;
    background: var(--orange);
    color: var(--white);
  }

  .hero-art {
    width: min(100%, 540px) !important;
    min-height: 0 !important;
    aspect-ratio: 1.14 / 1;
  }

  .hero-art .block-orange { top: 3%; right: 13%; width: 64%; height: 88%; }
  .hero-art .block-yellow { left: 5%; bottom: 4%; width: 42%; height: 49%; }
  .hero-art .leader-photo { top: 5%; right: 20%; width: 61%; height: 88%; }
  .hero-art .code-photo { top: 13%; right: 0; width: 42%; height: 31%; }
  .hero-art .meeting-photo { left: 0; bottom: 8%; width: 34%; height: 28%; }

  .hero-art .success-card {
    right: 1%;
    bottom: 20%;
    width: 43%;
    min-height: 0;
    padding: clamp(13px, 2.4vw, 20px);
  }

  .hero-art .success-card strong { font-size: clamp(2rem, 5vw, 2.78rem); }
  .hero-art .success-card span { margin-top: 5px; padding-top: 5px; font-size: clamp(.8rem, 1.8vw, 1rem); }
  .hero-art .path-one { left: 18%; top: 20%; width: 24%; }
  .hero-art .scribble { right: 11%; bottom: 9%; width: 20%; }
}

@media (max-width: 620px) {
  section[id] { scroll-margin-top: 82px; }
  .menu-toggle { width: 46px; height: 46px; }
  .nav-links.is-open { padding-top: 12px; }

  .nav-links.is-open a,
  .nav-links.is-open li a { min-height: 50px; font-size: .95rem; }

  .hero-art { width: 100% !important; max-width: 460px; aspect-ratio: 1.05 / 1; }
  .hero-art .path-one, .hero-art .scribble { display: none; }
}

/* Commercial WordPress readiness layer */
.screen-reader-text,
.screen-reader-text span {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  top: 12px;
  left: 12px;
  z-index: 9999;
  width: auto;
  height: auto;
  padding: 12px 16px;
  clip: auto;
  border-radius: 6px;
  background: var(--black);
  color: var(--white);
}

:where(a, button, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 3px;
}

.service-card:focus-within,
.panith-content-card:focus-within,
.person:focus-within,
.quote-card:focus-within,
.panith-module:focus-within,
.panith-final-cta:focus-within {
  box-shadow: 0 0 0 4px rgba(255, 75, 19, 0.18), 0 22px 44px rgba(18, 19, 20, 0.12);
}

main,
.panith-rich-text,
.panith-content-card,
.service-card,
.person,
.quote-card,
.panith-final-cta,
.panith-module summary,
.contact-info-item,
.footer {
  overflow-wrap: anywhere;
}

body.panith-layout-boxed {
  max-width: calc(var(--panith-shell, 1520px) + 72px);
  margin-inline: auto;
  background: #e9e5dc;
}

.site-main {
  padding-block: clamp(48px, 7vw, var(--panith-section-space, 72px));
}

.content-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  gap: clamp(28px, 4vw, 56px);
  align-items: start;
}

.content-layout-left {
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
}

.content-layout-left .content-primary {
  grid-column: 2;
}

.content-layout-left .site-sidebar {
  grid-column: 1;
  grid-row: 1;
}

.content-layout-none,
.content-layout-full {
  display: block;
}

.content-layout-full .content-primary,
.entry-page-full .entry-content {
  width: 100%;
}

.content-primary,
.entry-content,
.entry-summary {
  min-width: 0;
}

.archive-header,
.entry-page > .entry-header,
.entry-card,
.site-sidebar .widget,
.comment-respond,
.comments-area {
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: var(--panith-radius, 16px);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 16px 34px rgba(18, 19, 20, 0.06);
}

.archive-header,
.entry-page > .entry-header {
  padding: clamp(28px, 5vw, 52px);
  margin-bottom: clamp(24px, 4vw, 40px);
}

.entry-title {
  line-height: 1.04;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.post-list {
  display: grid;
  gap: clamp(20px, 3vw, 32px);
}

.post-list-grid {
  grid-template-columns: repeat(var(--panith-blog-columns, 3), minmax(0, 1fr));
}

.post-list-list {
  grid-template-columns: 1fr;
}

.entry-card {
  overflow: hidden;
}

.entry-card-body {
  padding: clamp(22px, 3vw, 34px);
}

.entry-media {
  display: block;
  overflow: hidden;
  color: inherit;
}

.entry-media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.entry-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 800;
}

.entry-summary,
.entry-content {
  margin-top: 22px;
  line-height: 1.65;
}

.entry-content {
  max-width: min(100%, 960px);
}

.entry-content > * + *,
.entry-summary > * + * {
  margin-top: 1.1em;
}

.entry-content .alignwide {
  max-width: min(100vw - 48px, var(--panith-shell, 1520px));
}

.entry-content .alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.page-builder-main,
.page-builder-main .entry-content {
  max-width: none;
  padding: 0;
  margin: 0;
}

.site-sidebar {
  min-width: 0;
}

.site-sidebar .widget {
  padding: 24px;
  margin-bottom: 22px;
}

.widget-title {
  margin-bottom: 14px;
  font-size: 1.1rem;
}

.widget ul {
  padding-left: 1.1rem;
}

.wp-block-image img,
.wp-block-cover,
.wp-block-gallery,
.woocommerce img {
  max-width: 100%;
  height: auto;
}

.wp-caption,
.gallery,
iframe,
embed,
object {
  max-width: 100%;
}

.panith-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 22px;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 800;
}

.nav-menu-wrap {
  min-width: 0;
}

.nav-links li {
  position: relative;
  display: block;
}

.nav-links .sub-menu,
.nav-links .children {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 25;
  min-width: 220px;
  margin: 0;
  padding: 10px;
  list-style: none;
  border: 1px solid rgba(18, 19, 20, 0.12);
  border-radius: 10px;
  background: var(--paper);
  box-shadow: 0 18px 40px rgba(18, 19, 20, 0.16);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}

.nav-links .sub-menu .sub-menu,
.nav-links .children .children {
  top: -10px;
  left: calc(100% + 8px);
}

.nav-links li:hover > .sub-menu,
.nav-links li:focus-within > .sub-menu,
.nav-links li:hover > .children,
.nav-links li:focus-within > .children {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.nav-links .sub-menu a,
.nav-links .children a {
  display: block;
  padding: 10px 12px;
  border-radius: 7px;
  white-space: normal;
}

.nav-links .sub-menu a:hover,
.nav-links .children a:hover {
  background: rgba(255, 75, 19, 0.1);
}

.submenu-toggle {
  display: none;
}

.header-widget-area {
  justify-self: end;
}

.header-search {
  justify-self: end;
  font-size: 1rem;
}

.footer-menu {
  padding: 10px 0 14px;
}

.footer-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-nav a {
  margin: 0;
}

.scroll-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 50;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--orange);
  color: var(--white);
  font-weight: 900;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.scroll-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.panith-preloader {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: grid;
  place-items: center;
  background: var(--paper);
  animation: panith-preloader-out 0.45s ease 0.6s forwards;
  pointer-events: none;
}

.panith-preloader span {
  width: 42px;
  height: 42px;
  border: 4px solid rgba(18, 19, 20, 0.12);
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: panith-spin 0.8s linear infinite;
}

@keyframes panith-spin {
  to { transform: rotate(360deg); }
}

@keyframes panith-preloader-out {
  to { opacity: 0; visibility: hidden; }
}

.woocommerce-content ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
}

.woocommerce-content ul.products::before,
.woocommerce-content ul.products::after {
  content: none;
}

.nav-open {
  overflow: hidden;
}

@media (max-width: 1180px) {
  .post-list-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .content-layout,
  .content-layout-left {
    grid-template-columns: 1fr;
  }

  .content-layout-left .content-primary,
  .content-layout-left .site-sidebar {
    grid-column: auto;
    grid-row: auto;
  }

  .nav-menu-wrap {
    display: none;
    grid-column: 1 / -1;
    width: 100%;
  }

  .nav-menu-wrap.is-open {
    display: block;
  }

  .nav-links,
  .nav-links.is-open {
    display: grid;
  }

  .nav-links .sub-menu,
  .nav-links .children {
    position: static;
    min-width: 0;
    padding: 0 0 0 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
  }

  .nav-links .submenu-open > .sub-menu,
  .nav-links .submenu-open > .children {
    display: grid;
  }

  .nav-links li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .nav-links li > a {
    min-width: 0;
  }

  .submenu-toggle {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 0;
    background: transparent;
    color: currentColor;
  }

  .submenu-toggle span {
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.2s ease;
  }

  .submenu-open > .submenu-toggle span {
    transform: rotate(225deg);
  }

  .header-widget-area,
  .header-search {
    display: none;
  }
}

@media (max-width: 760px) {
  .post-list-grid {
    grid-template-columns: 1fr;
  }

  .archive-header,
  .entry-page > .entry-header,
  .entry-card-body,
  .site-sidebar .widget {
    padding: 22px;
  }

  .entry-content .alignwide,
  .entry-content .alignfull {
    width: auto;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}

.rtl .nav-links .sub-menu {
  left: auto;
  right: 0;
}

.rtl .nav-links .sub-menu .sub-menu {
  left: auto;
  right: calc(100% + 8px);
}

/* Final requested visual fixes */
.next-level .next-title h2 {
  color: var(--white) !important;
}

.stats strong {
  font-size: clamp(1.55rem, 5.8vw, 2.2rem) !important;
  line-height: 0.95 !important;
  word-break: keep-all;
  overflow-wrap: normal;
}

.stats span {
  font-size: clamp(0.68rem, 2vw, 0.82rem) !important;
  line-height: 1.2 !important;
}

.stats em {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  min-height: 34px;
  margin-bottom: 10px;
  border-radius: 999px;
  background: rgba(255, 75, 19, 0.12);
  color: var(--orange);
  font-style: normal;
  font-size: 0.8rem;
  font-weight: 900;
}

@media (max-width: 620px) {
  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .stats div,
  .stats div:first-child {
    min-width: 0;
    padding-inline: clamp(6px, 2vw, 10px) !important;
  }

  .stats strong {
    font-size: clamp(1.25rem, 11vw, 1.9rem) !important;
  }
}

@media (max-width: 380px) {
  .stats strong {
    font-size: clamp(1.1rem, 10vw, 1.55rem) !important;
  }

  .stats span {
    font-size: 0.64rem !important;
  }
}

/* Panith Core public templates */
.panith-page-hero {
  padding: clamp(70px, 9vw, 132px) 0 clamp(44px, 7vw, 88px);
}

.panith-page-hero h1 {
  max-width: 980px;
  font-size: clamp(2.7rem, 6vw, 6rem);
  line-height: 0.98;
  font-weight: 900;
}

.panith-page-hero p {
  max-width: 760px;
  margin-top: 22px;
  color: #2f3235;
  font-size: clamp(1rem, 1.45vw, 1.28rem);
  line-height: 1.55;
  font-weight: 750;
}

.panith-section {
  padding: clamp(42px, 7vw, 92px) 0;
}

.panith-section > h2,
.panith-rich-text h2,
.panith-final-cta h2 {
  margin-bottom: 24px;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.03;
  font-weight: 900;
}

.panith-card-grid,
.panith-service-area-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
}

.service-card-link,
.panith-content-card a {
  width: 100%;
  height: auto;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  transform: none;
}

.panith-dynamic-service {
  padding: 0 !important;
  color: var(--ink);
}

.service-grid > .panith-dynamic-service:nth-child(4n + 1) {
  background: var(--orange);
}

.service-grid > .panith-dynamic-service:nth-child(4n + 2) {
  background: var(--yellow);
}

.service-grid > .panith-dynamic-service:nth-child(4n + 3) {
  background: var(--white);
}

.service-grid > .panith-dynamic-service:nth-child(4n) {
  color: var(--white);
  background: radial-gradient(circle at 30% 20%, #323437, #151617 72%);
}

.service-grid > .panith-dynamic-service:nth-child(4n) h3,
.service-grid > .panith-dynamic-service:nth-child(4n) .icon,
.service-grid > .panith-dynamic-service:nth-child(4n) .service-card-action {
  color: var(--white);
}

.panith-dynamic-service .service-card-link {
  width: 100% !important;
  height: 100% !important;
  padding: clamp(42px, 4vw, 58px) clamp(34px, 3.5vw, 48px) clamp(30px, 3vw, 44px);
}

.panith-dynamic-service .service-custom-icon {
  width: clamp(58px, 5vw, 82px) !important;
  height: clamp(58px, 5vw, 82px) !important;
  margin-bottom: clamp(28px, 5vw, 58px) !important;
}

.panith-dynamic-service h3 {
  width: 100%;
  max-width: none;
  margin-top: auto;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}

.panith-dynamic-service p {
  display: none;
}

.panith-dynamic-service ul {
  display: none;
}

.service-card-counts {
  display: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 18px 0 0;
}

.service-card-counts div {
  padding: 9px;
  border-radius: var(--panith-button-radius, 8px);
  background: rgba(18, 19, 20, 0.06);
}

.service-card-counts dt,
.service-card-counts dd {
  margin: 0;
}

.service-card-counts dt {
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 900;
  text-transform: uppercase;
}

.service-card-counts dd {
  margin-top: 3px;
  font-family: "Archivo", sans-serif;
  font-size: 1.25rem;
  font-weight: 900;
}

.service-card-action,
.read-more-inline {
  margin-top: auto;
  padding-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: "Archivo", sans-serif;
  font-size: 0;
  font-weight: 900;
}

.read-more-inline {
  font-size: 0.84rem;
}

.service-card-action::after {
  content: "\2192";
  width: auto;
  height: auto;
  background: transparent;
  font-size: 2.45rem;
  line-height: 1;
  transition: transform 0.2s ease;
}

.read-more-inline::after {
  content: "";
  width: 28px;
  height: 2px;
  background: currentColor;
  transition: transform 0.2s ease;
}

.service-card-link:hover .service-card-action::after,
.panith-content-card a:hover .read-more-inline::after {
  transform: translateX(7px);
}

@media (max-width: 1180px) {
  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .panith-dynamic-service .service-card-link {
    padding: 38px 28px 28px;
  }
}

.services-shared-cta,
.panith-final-cta {
  margin-top: clamp(28px, 5vw, 56px);
  padding: clamp(28px, 5vw, 54px);
  border-radius: var(--panith-radius, 16px);
  background: var(--black);
  color: var(--white);
}

.services-shared-cta h3,
.panith-final-cta h2 {
  color: var(--white) !important;
}

.services-shared-cta p,
.panith-final-cta p {
  max-width: 780px;
  margin: 12px 0 24px;
  color: rgba(255, 255, 255, 0.82);
  font-weight: 750;
  line-height: 1.55;
}

.panith-content-card {
  min-height: 270px;
  border: 1px solid rgba(18, 19, 20, 0.12);
  border-radius: var(--panith-radius, 16px);
  background: #fffdf8;
  overflow: hidden;
  transition:
    transform 260ms ease,
    box-shadow 260ms ease,
    opacity var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1),
    filter var(--panith-anim-speed, 620ms) cubic-bezier(0.22, 1, 0.36, 1);
}

.panith-content-card:hover {
  transform: translateY(-7px);
  box-shadow: 0 22px 44px rgba(18, 19, 20, 0.12);
}

.panith-content-card a {
  padding: 28px;
}

.case-study-card a {
  padding: 0;
}

.case-study-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.case-study-card .card-kicker,
.case-study-card h3,
.case-study-card p,
.case-study-card strong,
.case-study-card .read-more-inline {
  margin-inline: 28px;
}

.case-study-card .card-kicker {
  margin-top: 24px;
}

.case-study-card .read-more-inline {
  margin-bottom: 28px;
}

.card-kicker {
  display: block;
  margin-bottom: 12px;
  color: var(--orange);
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}

.panith-content-card h3 {
  font-size: clamp(1.35rem, 2vw, 2rem);
  line-height: 1.08;
}

.panith-content-card p,
.panith-content-card strong {
  margin-top: 14px;
  color: #303337;
  font-size: 0.96rem;
  line-height: 1.5;
}

.card-meta {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.card-meta b {
  color: var(--orange);
}

.panith-filter-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  margin-top: 28px;
  max-width: 900px;
}

.panith-filter-row {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 0 0 28px;
  max-width: none;
}

.panith-filter-form label {
  display: grid;
  gap: 8px;
  align-content: end;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 900;
}

.panith-filter-form label span {
  padding-left: 2px;
}

.panith-filter-row .btn {
  min-width: 130px;
}

.panith-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  align-self: end;
}

.panith-reset-link {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.panith-result-summary {
  margin: -4px 0 24px;
  color: var(--muted);
  font-weight: 850;
}

.panith-related-search-results {
  margin-top: clamp(42px, 6vw, 72px);
}

.panith-related-search-results h2 {
  margin-bottom: 24px;
}

.panith-filter-form input,
.panith-filter-form select,
.panith-consultation-form input,
.panith-consultation-form select,
.panith-consultation-form textarea {
  width: 100%;
  min-height: 54px;
  border: 1px solid rgba(18, 19, 20, 0.16);
  border-radius: var(--panith-button-radius, 8px);
  background: #fffdf8;
  color: var(--ink);
  padding: 0 18px;
  font: inherit;
  font-weight: 750;
}

.panith-consultation-form textarea {
  padding-top: 16px;
}

.panith-consultation-form label {
  display: grid;
  gap: 8px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 900;
}

.panith-consultation-form p {
  margin: 0;
}

.panith-consultation-form .form-row {
  align-items: start;
}

.panith-hp-field {
  position: absolute;
  left: -9999px;
}

.panith-form-message {
  padding: 14px 16px;
  border-radius: var(--panith-button-radius, 8px);
  font-weight: 850;
}

.panith-form-message-success {
  background: rgba(38, 141, 89, 0.14);
  color: #145b35;
}

.panith-form-message-error {
  background: rgba(255, 75, 19, 0.12);
  color: #9d2600;
}

.panith-consent label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  line-height: 1.5;
}

.panith-consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
}

.panith-empty-state {
  padding: clamp(24px, 4vw, 42px);
  border: 1px dashed rgba(18, 19, 20, 0.22);
  border-radius: var(--panith-radius, 16px);
  background: rgba(255, 255, 255, 0.38);
}

.panith-empty-state h2,
.panith-empty-state h3 {
  margin-bottom: 10px;
  font-size: clamp(1.45rem, 2.4vw, 2.2rem);
}

.panith-empty-state p {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.55;
}

.panith-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.panith-chip-grid a {
  padding: 12px 16px;
  border: 1px solid rgba(18, 19, 20, 0.14);
  border-radius: 999px;
  background: #fffdf8;
  font-weight: 850;
}

.panith-module-list {
  display: grid;
  gap: 18px;
}

.panith-module {
  border: 1px solid rgba(18, 19, 20, 0.14);
  border-radius: var(--panith-radius, 16px);
  background: #fffdf8;
  overflow: clip;
}

.panith-module summary {
  min-height: 62px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 18px 22px;
  cursor: pointer;
  font-family: "Archivo", sans-serif;
  font-size: clamp(1.15rem, 2vw, 1.65rem);
  font-weight: 900;
}

.panith-module summary::after {
  content: "";
  width: 12px;
  height: 12px;
  border-right: 3px solid currentColor;
  border-bottom: 3px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.panith-module summary span,
.panith-module summary small {
  grid-column: 1;
}

.panith-module summary small {
  color: var(--muted);
  font-family: "Manrope", sans-serif;
  font-size: 0.88rem;
  line-height: 1.45;
  font-weight: 800;
}

.panith-module summary::after {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.panith-module[open] summary::after {
  transform: rotate(225deg);
}

.panith-module .panith-card-grid {
  padding: 0 22px 22px;
}

.panith-rich-text {
  max-width: 900px;
}

.panith-rich-text p,
.panith-rich-text li {
  color: #303337;
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.72;
}

.panith-rich-text p + p,
.panith-rich-text ul,
.panith-rich-text ol {
  margin-top: 18px;
}

.panith-rich-text img,
.panith-rich-text video,
.panith-rich-text iframe {
  max-width: 100%;
}

.panith-rich-text table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  -webkit-overflow-scrolling: touch;
}

.panith-rich-text th,
.panith-rich-text td {
  padding: 12px 14px;
  border: 1px solid rgba(18, 19, 20, 0.14);
  text-align: left;
  vertical-align: top;
}

.panith-reading-layout {
  padding: clamp(48px, 7vw, 92px) 0;
}

.panith-article-header {
  max-width: 920px;
  margin-bottom: 42px;
}

.panith-article-header h1 {
  font-size: clamp(2.5rem, 5vw, 5rem);
  line-height: 1;
}

.panith-article-body {
  display: grid;
  grid-template-columns: minmax(190px, 260px) minmax(0, 900px);
  gap: 42px;
  align-items: start;
}

.panith-toc {
  position: sticky;
  top: 100px;
  padding: 18px;
  border-left: 3px solid var(--orange);
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 800;
}

.panith-toc summary {
  cursor: pointer;
  color: var(--ink);
  font-family: "Archivo", sans-serif;
  font-size: 1rem;
  font-weight: 900;
}

.panith-toc[hidden] {
  display: none;
}

.panith-toc-list {
  display: grid;
  gap: 9px;
  margin: 16px 0 0;
  padding-left: 18px;
}

.panith-toc-list a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.panith-toc-list .is-subheading {
  margin-left: 12px;
  color: var(--muted);
  font-size: 0.92em;
}

.panith-download-box {
  margin-top: 36px;
  padding: clamp(24px, 4vw, 38px);
  border: 1px solid rgba(18, 19, 20, 0.14);
  border-radius: var(--panith-radius, 16px);
  background: #fffdf8;
}

.panith-download-box h2 {
  margin-bottom: 12px;
}

.panith-resource-form {
  display: grid;
  gap: 16px;
  max-width: 520px;
  margin-top: 20px;
}

.panith-resource-form p {
  margin: 0;
}

.panith-resource-form label {
  display: grid;
  gap: 8px;
  font-size: 0.88rem;
  font-weight: 900;
}

.panith-resource-form input[type="email"] {
  width: 100%;
  min-height: 54px;
  border: 1px solid rgba(18, 19, 20, 0.16);
  border-radius: var(--panith-button-radius, 8px);
  background: #fffdf8;
  color: var(--ink);
  padding: 0 18px;
  font: inherit;
  font-weight: 750;
}

.panith-resource-form input[type="email"]:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 4px rgba(255, 75, 19, 0.14);
}

.panith-related-content {
  margin-top: clamp(42px, 7vw, 82px);
}

.panith-related-content h2 {
  margin-bottom: 24px;
  font-size: clamp(2rem, 4vw, 3.4rem);
}

.panith-chapter-nav {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  margin-top: clamp(42px, 7vw, 82px);
}

.panith-chapter-nav a {
  min-height: 74px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 16px 18px;
  border: 1px solid rgba(18, 19, 20, 0.14);
  border-radius: var(--panith-button-radius, 8px);
  background: #fffdf8;
  font-weight: 900;
}

.panith-chapter-nav span {
  color: var(--orange);
  font-size: 0.74rem;
  text-transform: uppercase;
}

.panith-chapter-nav > div:last-child {
  text-align: right;
}

.panith-chapter-back {
  text-align: center;
}

@media (max-width: 760px) {
  .panith-chapter-nav {
    grid-template-columns: 1fr;
  }

  .panith-chapter-nav > div:last-child {
    text-align: left;
  }
}

.panith-consultation-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(360px, 1.2fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: start;
}

.panith-consultation-copy ul {
  margin-top: 22px;
  padding-left: 20px;
  font-weight: 800;
  line-height: 1.7;
}

.panith-facts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
}

.panith-facts-grid div {
  padding: 20px;
  border-radius: var(--panith-radius, 16px);
  background: #fffdf8;
}

.panith-facts-grid strong,
.panith-facts-grid span {
  display: block;
}

.panith-facts-grid strong {
  color: var(--orange);
  font-size: 0.78rem;
  text-transform: uppercase;
}

.panith-facts-grid span {
  margin-top: 6px;
  font-weight: 900;
}

.panith-case-testimonial {
  margin: 0;
  padding: clamp(28px, 5vw, 54px);
  border-radius: var(--panith-radius, 16px);
  background: #fffdf8;
  box-shadow: 0 18px 42px rgba(18, 19, 20, 0.08);
}

.panith-case-testimonial p {
  color: var(--ink);
  font-family: "Archivo", sans-serif;
  font-size: clamp(1.5rem, 3vw, 2.55rem);
  line-height: 1.18;
  font-weight: 900;
}

.panith-case-testimonial cite {
  display: block;
  margin-top: 18px;
  color: var(--muted);
  font-style: normal;
  font-weight: 850;
}

@media (max-width: 980px) {
  .panith-filter-form,
  .panith-filter-row,
  .panith-consultation-layout,
  .panith-article-body {
    grid-template-columns: 1fr;
  }

  .panith-filter-actions,
  .panith-filter-actions .btn {
    width: 100%;
  }

  .panith-toc {
    position: static;
  }
}

@media (max-width: 620px) {
  .panith-page-hero {
    padding-top: 52px;
  }

  .panith-content-card a,
  .services-shared-cta,
  .panith-final-cta {
    padding: 22px;
  }
}

/* Admin typography control layer */
body {
  font-weight: var(--panith-body-font-weight, 700);
  letter-spacing: var(--panith-body-letter-spacing, 0);
  text-align: var(--panith-body-align, left);
}

h1,
.hero h1,
.panith-page-hero h1,
.entry-title {
  font-size: var(--panith-h1-size-desktop, 78px) !important;
  line-height: var(--panith-h1-line-height, 1.04) !important;
  font-weight: var(--panith-h1-weight, 900);
  letter-spacing: var(--panith-h1-letter-spacing, 0);
  text-transform: var(--panith-h1-transform, none);
  text-align: var(--panith-h1-align, left);
}

h2,
.services h2,
.about h2,
.team h2,
.testimonials h2,
.cta h2,
.contact-form-panel h2,
.contact-info-panel h2,
.panith-section-heading {
  font-size: var(--panith-h2-size-desktop, 58px) !important;
  line-height: var(--panith-h2-line-height, 1.04) !important;
  font-weight: var(--panith-h2-weight, 900);
  letter-spacing: var(--panith-h2-letter-spacing, 0);
  text-transform: var(--panith-h2-transform, none);
  text-align: var(--panith-h2-align, center);
}

h3,
.service-card h3,
.panith-content-card h3,
.services-shared-cta h3,
.panith-final-cta h3,
.panith-module summary {
  font-size: var(--panith-h3-size-desktop, 32px) !important;
  line-height: var(--panith-h3-line-height, 1.08) !important;
  font-weight: var(--panith-h3-weight, 900);
  letter-spacing: var(--panith-h3-letter-spacing, 0);
  text-transform: var(--panith-h3-transform, none);
}

h4 {
  font-size: var(--panith-h4-size-desktop, 24px);
  line-height: var(--panith-h4-line-height, 1.18);
  font-weight: var(--panith-h4-weight, 850);
  letter-spacing: var(--panith-h4-letter-spacing, 0);
  text-transform: var(--panith-h4-transform, none);
  text-align: var(--panith-h4-align, left);
}

h5 {
  font-size: var(--panith-h5-size-desktop, 20px);
  line-height: var(--panith-h5-line-height, 1.25);
  font-weight: var(--panith-h5-weight, 850);
  letter-spacing: var(--panith-h5-letter-spacing, 0);
  text-transform: var(--panith-h5-transform, none);
  text-align: var(--panith-h5-align, left);
}

h6,
.section-kicker,
.card-kicker,
.quote-service {
  font-size: var(--panith-h6-size-desktop, 17px);
  line-height: var(--panith-h6-line-height, 1.3);
  font-weight: var(--panith-h6-weight, 850);
  letter-spacing: var(--panith-h6-letter-spacing, 0);
  text-transform: var(--panith-h6-transform, uppercase);
}

.nav-links a,
.nav-links .sub-menu a,
.nav-links .children a,
.submenu-toggle {
  font-size: var(--panith-nav-size-desktop, 14px);
  line-height: var(--panith-nav-line-height, 1.35);
  font-weight: var(--panith-nav-weight, 900);
}

.btn,
.talk-button,
.wp-block-button__link {
  min-height: max(44px, var(--panith-button-height, 48px));
  height: auto;
  padding-block: max(10px, calc(var(--panith-button-height, 48px) * 0.2));
  font-size: var(--panith-button-font-size, 14px);
  line-height: 1.2;
  white-space: normal;
  text-align: center;
}

.hero p,
.about-copy p,
.services-shared-cta p,
.panith-final-cta p,
.contact-cta-panel p {
  font-size: var(--panith-section-subtitle-size-desktop, 19px) !important;
  line-height: var(--panith-section-subtitle-line-height, 1.55) !important;
  font-weight: var(--panith-section-subtitle-weight, 800);
}

.service-card h3,
.panith-content-card h3,
.case-study-card h3 {
  font-size: var(--panith-card-title-size-desktop, 32px);
  line-height: var(--panith-card-title-line-height, 1.08);
  font-weight: var(--panith-card-title-weight, 900);
}

.panith-content-card p,
.panith-content-card strong,
.entry-card p,
.service-modal__dialog p,
.person-bio {
  font-size: var(--panith-card-description-size-desktop, 16px);
  line-height: var(--panith-card-description-line-height, 1.5);
  font-weight: var(--panith-card-description-weight, 750);
}

.contact-form label,
.panith-consultation-form label,
.newsletter label {
  font-size: var(--panith-form-label-size-desktop, 14px);
  line-height: var(--panith-form-label-line-height, 1.3);
  font-weight: var(--panith-form-label-weight, 850);
}

.contact-form input,
.contact-form textarea,
.panith-consultation-form input,
.panith-consultation-form select,
.panith-consultation-form textarea,
.newsletter input {
  font-size: var(--panith-form-input-size-desktop, 17px);
  line-height: var(--panith-form-input-line-height, 1.45);
  font-weight: var(--panith-form-input-weight, 700);
}

.footer h3,
.footer h2 {
  font-size: var(--panith-footer-heading-size-desktop, 16px);
  line-height: var(--panith-footer-heading-line-height, 1.2);
  font-weight: var(--panith-footer-heading-weight, 900);
}

.footer p,
.footer a,
.footer li,
.copyright {
  font-size: var(--panith-footer-body-size-desktop, 15px);
  line-height: var(--panith-footer-body-line-height, 1.5);
  font-weight: var(--panith-footer-body-weight, 700);
}

.breadcrumbs,
.panith-breadcrumbs {
  font-size: var(--panith-breadcrumb-size-desktop, 14px);
  line-height: var(--panith-breadcrumb-line-height, 1.4);
  font-weight: var(--panith-breadcrumb-weight, 800);
}

.card-meta,
.entry-meta,
.panith-case-meta,
.panith-service-meta {
  font-size: var(--panith-meta-size-desktop, 13px);
  line-height: var(--panith-meta-line-height, 1.4);
  font-weight: var(--panith-meta-weight, 800);
}

.card-kicker,
.quote-service {
  font-size: var(--panith-chapter-number-size-desktop, 13px);
  line-height: var(--panith-chapter-number-line-height, 1.2);
  font-weight: var(--panith-chapter-number-weight, 900);
}

.quote-card p {
  font-size: var(--panith-testimonial-text-size-desktop, 16px);
  line-height: var(--panith-testimonial-text-line-height, 1.55);
  font-weight: var(--panith-testimonial-text-weight, 800);
}

.person h3 {
  font-size: var(--panith-team-name-size-desktop, 18px);
  line-height: var(--panith-team-name-line-height, 1.3);
  font-weight: var(--panith-team-name-weight, 900);
}

.person p {
  font-size: var(--panith-team-position-size-desktop, 15px);
  line-height: var(--panith-team-position-line-height, 1.4);
  font-weight: var(--panith-team-position-weight, 750);
}

.stats strong {
  font-size: var(--panith-stats-value-size-desktop, 35px) !important;
  line-height: var(--panith-stats-value-line-height, 1) !important;
  font-weight: var(--panith-stats-value-weight, 900);
}

.stats span {
  font-size: var(--panith-stats-label-size-desktop, 13px) !important;
  line-height: var(--panith-stats-label-line-height, 1.2) !important;
  font-weight: var(--panith-stats-label-weight, 900);
}

.hero h1 { text-align: var(--panith-hero-heading-align-desktop, left); }
.hero p { text-align: var(--panith-hero-text-align-desktop, left); }
.hero-actions { justify-content: var(--panith-hero-buttons-align-desktop, left); }
.about h2 { text-align: var(--panith-about-heading-align-desktop, left); }
.about-copy { text-align: var(--panith-about-content-align-desktop, left); }
.services h2 { text-align: var(--panith-services-heading-align-desktop, left); }
.service-card,
.service-card-link { text-align: var(--panith-service-card-align-desktop, left); }
.next-title,
.next-title h2 { text-align: var(--panith-benefits-heading-align-desktop, left); }
.panith-page-hero { text-align: var(--panith-knowledge-hub-heading-align-desktop, left); }
.panith-module summary { text-align: var(--panith-module-heading-align-desktop, left); }
.knowledge-card,
.knowledge-card a { text-align: var(--panith-chapter-card-align-desktop, left); }


/* [Panith CSS Section] 13 Knowledge article base */
.panith-reading-page .entry-title { text-align: var(--panith-chapter-page-heading-align-desktop, left); }
.panith-case-hero,
.case-study-card { text-align: var(--panith-case-study-heading-align-desktop, left); }
.team h2 { text-align: var(--panith-team-heading-align-desktop, center); }
.person { text-align: var(--panith-team-card-align-desktop, center); }
.testimonials h2 { text-align: var(--panith-testimonial-heading-align-desktop, center); }
.quote-card { text-align: var(--panith-testimonial-content-align-desktop, left); }
.stats { text-align: var(--panith-statistics-align-desktop, left); }
.services-shared-cta,
.panith-final-cta,
.cta { text-align: var(--panith-consultation-cta-align-desktop, left); }
.contact-shell { text-align: var(--panith-contact-align-desktop, left); }
.footer { text-align: var(--panith-footer-align-desktop, left); }

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
button,
span,
strong,
li,
dt,
dd,
input,
textarea,
select {
  overflow-wrap: anywhere;
}

.nav-links a,
.btn,
.talk-button,
.service-card h3,
.panith-content-card h3,
.person h3,
.quote-card p {
  hyphens: auto;
}

@media (max-width: 1024px) {
  h1,
  .hero h1,
  .panith-page-hero h1,
  .entry-title { font-size: var(--panith-h1-size-tablet, 58px) !important; }
  h2,
  .services h2,
  .about h2,
  .team h2,
  .testimonials h2,
  .cta h2,
  .contact-form-panel h2,
  .contact-info-panel h2,
  .panith-section-heading { font-size: var(--panith-h2-size-tablet, 46px) !important; }
  h3,
  .service-card h3,
  .panith-content-card h3,
  .services-shared-cta h3,
  .panith-final-cta h3,
  .panith-module summary { font-size: var(--panith-h3-size-tablet, 28px) !important; }
  h4 { font-size: var(--panith-h4-size-tablet, 22px); }
  h5 { font-size: var(--panith-h5-size-tablet, 18px); }
  h6,
  .section-kicker,
  .card-kicker,
  .quote-service { font-size: var(--panith-h6-size-tablet, 16px); }
  .nav-links a,
  .nav-links .sub-menu a,
  .nav-links .children a,
  .submenu-toggle { font-size: var(--panith-nav-size-tablet, 14px); }
  .hero p,
  .about-copy p,
  .services-shared-cta p,
  .panith-final-cta p,
  .contact-cta-panel p { font-size: var(--panith-section-subtitle-size-tablet, 17px) !important; }
  .service-card h3,
  .panith-content-card h3,
  .case-study-card h3 { font-size: var(--panith-card-title-size-tablet, 27px); }
  .panith-content-card p,
  .panith-content-card strong,
  .entry-card p,
  .service-modal__dialog p,
  .person-bio { font-size: var(--panith-card-description-size-tablet, 15px); }
  .contact-form label,
  .panith-consultation-form label,
  .newsletter label { font-size: var(--panith-form-label-size-tablet, 14px); }
  .contact-form input,
  .contact-form textarea,
  .panith-consultation-form input,
  .panith-consultation-form select,
  .panith-consultation-form textarea,
  .newsletter input { font-size: var(--panith-form-input-size-tablet, 16px); }
  .footer h3,
  .footer h2 { font-size: var(--panith-footer-heading-size-tablet, 16px); }
  .footer p,
  .footer a,
  .footer li,
  .copyright { font-size: var(--panith-footer-body-size-tablet, 14px); }
  .breadcrumbs,
  .panith-breadcrumbs { font-size: var(--panith-breadcrumb-size-tablet, 13px); }
  .card-meta,
  .entry-meta,
  .panith-case-meta,
  .panith-service-meta { font-size: var(--panith-meta-size-tablet, 12px); }
  .card-kicker,
  .quote-service { font-size: var(--panith-chapter-number-size-tablet, 12px); }
  .quote-card p { font-size: var(--panith-testimonial-text-size-tablet, 15px); }
  .person h3 { font-size: var(--panith-team-name-size-tablet, 17px); }
  .person p { font-size: var(--panith-team-position-size-tablet, 14px); }
  .stats strong { font-size: var(--panith-stats-value-size-tablet, 30px) !important; }
  .stats span { font-size: var(--panith-stats-label-size-tablet, 12px) !important; }

  .hero h1 { text-align: var(--panith-hero-heading-align-tablet, left); }
  .hero p { text-align: var(--panith-hero-text-align-tablet, left); }
  .hero-actions { justify-content: var(--panith-hero-buttons-align-tablet, left); }
  .about h2 { text-align: var(--panith-about-heading-align-tablet, left); }
  .about-copy { text-align: var(--panith-about-content-align-tablet, left); }
  .services h2 { text-align: var(--panith-services-heading-align-tablet, left); }
  .service-card,
  .service-card-link { text-align: var(--panith-service-card-align-tablet, left); }
  .next-title,
  .next-title h2 { text-align: var(--panith-benefits-heading-align-tablet, left); }
  .panith-page-hero { text-align: var(--panith-knowledge-hub-heading-align-tablet, left); }
  .panith-module summary { text-align: var(--panith-module-heading-align-tablet, left); }
  .knowledge-card,
  .knowledge-card a { text-align: var(--panith-chapter-card-align-tablet, left); }
  .panith-reading-page .entry-title { text-align: var(--panith-chapter-page-heading-align-tablet, left); }
  .panith-case-hero,
  .case-study-card { text-align: var(--panith-case-study-heading-align-tablet, left); }
  .team h2 { text-align: var(--panith-team-heading-align-tablet, center); }
  .person { text-align: var(--panith-team-card-align-tablet, center); }
  .testimonials h2 { text-align: var(--panith-testimonial-heading-align-tablet, center); }
  .quote-card { text-align: var(--panith-testimonial-content-align-tablet, left); }
  .stats { text-align: var(--panith-statistics-align-tablet, left); }
  .services-shared-cta,
  .panith-final-cta,
  .cta { text-align: var(--panith-consultation-cta-align-tablet, left); }
  .contact-shell { text-align: var(--panith-contact-align-tablet, left); }
  .footer { text-align: var(--panith-footer-align-tablet, left); }
}

@media (max-width: 767px) {
  h1,
  .hero h1,
  .panith-page-hero h1,
  .entry-title { font-size: var(--panith-h1-size-mobile, 38px) !important; }
  h2,
  .services h2,
  .about h2,
  .team h2,
  .testimonials h2,
  .cta h2,
  .contact-form-panel h2,
  .contact-info-panel h2,
  .panith-section-heading { font-size: var(--panith-h2-size-mobile, 34px) !important; }
  h3,
  .service-card h3,
  .panith-content-card h3,
  .services-shared-cta h3,
  .panith-final-cta h3,
  .panith-module summary { font-size: var(--panith-h3-size-mobile, 22px) !important; }
  h4 { font-size: var(--panith-h4-size-mobile, 19px); }
  h5 { font-size: var(--panith-h5-size-mobile, 16px); }
  h6,
  .section-kicker,
  .card-kicker,
  .quote-service { font-size: var(--panith-h6-size-mobile, 14px); }
  .nav-links a,
  .nav-links .sub-menu a,
  .nav-links .children a,
  .submenu-toggle { font-size: var(--panith-nav-size-mobile, 15px); }
  .hero p,
  .about-copy p,
  .services-shared-cta p,
  .panith-final-cta p,
  .contact-cta-panel p { font-size: var(--panith-section-subtitle-size-mobile, 16px) !important; }
  .service-card h3,
  .panith-content-card h3,
  .case-study-card h3 { font-size: var(--panith-card-title-size-mobile, 22px); }
  .panith-content-card p,
  .panith-content-card strong,
  .entry-card p,
  .service-modal__dialog p,
  .person-bio { font-size: var(--panith-card-description-size-mobile, 14px); }
  .contact-form label,
  .panith-consultation-form label,
  .newsletter label { font-size: var(--panith-form-label-size-mobile, 13px); }
  .contact-form input,
  .contact-form textarea,
  .panith-consultation-form input,
  .panith-consultation-form select,
  .panith-consultation-form textarea,
  .newsletter input { font-size: var(--panith-form-input-size-mobile, 15px); }
  .footer h3,
  .footer h2 { font-size: var(--panith-footer-heading-size-mobile, 15px); }
  .footer p,
  .footer a,
  .footer li,
  .copyright { font-size: var(--panith-footer-body-size-mobile, 14px); }
  .breadcrumbs,
  .panith-breadcrumbs { font-size: var(--panith-breadcrumb-size-mobile, 12px); }
  .card-meta,
  .entry-meta,
  .panith-case-meta,
  .panith-service-meta { font-size: var(--panith-meta-size-mobile, 12px); }
  .card-kicker,
  .quote-service { font-size: var(--panith-chapter-number-size-mobile, 12px); }
  .quote-card p { font-size: var(--panith-testimonial-text-size-mobile, 15px); }
  .person h3 { font-size: var(--panith-team-name-size-mobile, 16px); }
  .person p { font-size: var(--panith-team-position-size-mobile, 14px); }
  .stats strong { font-size: var(--panith-stats-value-size-mobile, 24px) !important; }
  .stats span { font-size: var(--panith-stats-label-size-mobile, 11px) !important; }

  .hero h1 { text-align: var(--panith-hero-heading-align-mobile, left); }
  .hero p { text-align: var(--panith-hero-text-align-mobile, left); }
  .hero-actions { justify-content: var(--panith-hero-buttons-align-mobile, left); }
  .about h2 { text-align: var(--panith-about-heading-align-mobile, left); }
  .about-copy { text-align: var(--panith-about-content-align-mobile, left); }
  .services h2 { text-align: var(--panith-services-heading-align-mobile, left); }
  .service-card,
  .service-card-link { text-align: var(--panith-service-card-align-mobile, left); }
  .next-title,
  .next-title h2 { text-align: var(--panith-benefits-heading-align-mobile, left); }
  .panith-page-hero { text-align: var(--panith-knowledge-hub-heading-align-mobile, left); }
  .panith-module summary { text-align: var(--panith-module-heading-align-mobile, left); }
  .knowledge-card,
  .knowledge-card a { text-align: var(--panith-chapter-card-align-mobile, left); }
  .panith-reading-page .entry-title { text-align: var(--panith-chapter-page-heading-align-mobile, left); }
  .panith-case-hero,
  .case-study-card { text-align: var(--panith-case-study-heading-align-mobile, left); }
  .team h2 { text-align: var(--panith-team-heading-align-mobile, center); }
  .person { text-align: var(--panith-team-card-align-mobile, center); }
  .testimonials h2 { text-align: var(--panith-testimonial-heading-align-mobile, center); }
  .quote-card { text-align: var(--panith-testimonial-content-align-mobile, left); }
  .stats { text-align: var(--panith-statistics-align-mobile, center); }
  .services-shared-cta,
  .panith-final-cta,
  .cta { text-align: var(--panith-consultation-cta-align-mobile, left); }
  .contact-shell { text-align: var(--panith-contact-align-mobile, left); }
  .footer { text-align: var(--panith-footer-align-mobile, left); }
}

/* Footer brand contrast repair */
.footer .footer-grid h2,
.footer .footer-grid h3,
.footer .widget-title,
footer.footer h2,
footer.footer h3 {
  color: #ffffff !important;
}

/* Hide team skill pills */
.team .person-skills {
  display: none !important;
}

/* Hide carousel arrow buttons */
.panith-carousel-control {
  display: none !important;
}
/* Auto-moving team carousel */
.team-grid {
  grid-auto-flow: column !important;
  grid-auto-columns: calc((100% - 26px) / 2) !important;
  grid-template-columns: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.team-grid::-webkit-scrollbar {
  display: none;
}

.team-grid > .person {
  min-width: 0;
  scroll-snap-align: start;
}

@media (max-width: 620px) {
  .team-grid {
    grid-auto-columns: 100% !important;
  }
}

/* Modern Knowledge Hub page refresh - brand aligned */


/* [Panith CSS Section] 12 Knowledge Hub base */
.panith-hub-page {
  position: relative;
  isolation: isolate;
  padding-top: 0;
  background:
    radial-gradient(circle at 8% 4%, rgba(255, 200, 0, 0.18), transparent 28vw),
    radial-gradient(circle at 92% 8%, rgba(255, 75, 19, 0.12), transparent 32vw),
    linear-gradient(180deg, var(--paper) 0%, #f2eee5 52%, #f7f5f0 100%);
}

.panith-hub-page::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: min(72vh, 700px);
  z-index: -1;
  background:
    radial-gradient(circle at 78% 18%, rgba(255, 200, 0, 0.22), transparent 24vw),
    linear-gradient(135deg, #151617 0%, #202124 72%, #151617 100%);
  clip-path: polygon(0 0, 100% 0, 100% 82%, 0 100%);
}

.panith-hub-page .panith-page-hero {
  width: min(1180px, calc(100% - 56px));
  min-height: clamp(500px, 68vh, 700px);
  display: grid;
  align-content: center;
  padding: clamp(72px, 10vw, 124px) 0 clamp(84px, 12vw, 140px);
  color: var(--white);
}

.panith-hub-page .section-kicker {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--yellow);
  backdrop-filter: blur(14px);
}

.panith-hub-page .section-kicker::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 6px rgba(255, 75, 19, 0.16);
}

.panith-hub-page .panith-page-hero h1 {
  max-width: 960px;
  margin-top: 22px;
  color: var(--white);
  font-size: clamp(3rem, 6.2vw, 6.4rem) !important;
  line-height: 0.96 !important;
  letter-spacing: 0;
  text-wrap: balance;
}

.panith-hub-page .panith-page-hero p {
  max-width: 720px;
  margin-top: 26px;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(1.02rem, 1.5vw, 1.24rem) !important;
  line-height: 1.65 !important;
}

.panith-hub-page .panith-page-hero .panith-filter-form {
  max-width: 860px;
  margin-top: 38px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  background: rgba(247, 245, 240, 0.12);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(16px);
}

.panith-hub-page .panith-page-hero input[type="search"] {
  min-height: 58px;
  border: 0;
  border-radius: 10px;
  background: #fffdf8;
  box-shadow: inset 0 0 0 1px rgba(18, 19, 20, 0.08);
}

.panith-hub-page .panith-section {
  width: min(1180px, calc(100% - 56px));
  margin-inline: auto;
  padding: clamp(56px, 8vw, 94px) 0;
}

.panith-hub-page .panith-section > h2,
.panith-hub-page .panith-related-search-results h2 {
  max-width: 780px;
  margin-bottom: 28px;
  color: var(--black);
  font-size: clamp(2rem, 3.6vw, 4rem) !important;
  line-height: 1.03 !important;
  text-align: left !important;
  text-wrap: balance;
}

.panith-hub-page .panith-section:nth-of-type(2) {
  padding-top: clamp(28px, 5vw, 60px);
}

.panith-hub-page .panith-filter-row {
  position: sticky;
  top: 88px;
  z-index: 5;
  margin-bottom: 30px;
  padding: 18px;
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: 16px;
  background: rgba(255, 253, 248, 0.88);
  box-shadow: 0 20px 54px rgba(18, 19, 20, 0.09);
  backdrop-filter: blur(16px);
}

.panith-hub-page .panith-filter-form label {
  color: var(--ink);
  font-size: 0.78rem;
  letter-spacing: 0;
}

.panith-hub-page .panith-filter-form input,
.panith-hub-page .panith-filter-form select {
  min-height: 52px;
  border-color: rgba(18, 19, 20, 0.12);
  border-radius: 10px;
  background-color: #fffdf8;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

.panith-hub-page .btn-orange {
  border-radius: 10px;
  box-shadow: 0 16px 30px rgba(255, 75, 19, 0.22);
}

.panith-hub-page .panith-result-summary {
  width: fit-content;
  margin: 0 0 24px;
  padding: 9px 13px;
  border: 1px solid rgba(18, 19, 20, 0.08);
  border-radius: 999px;
  background: #fffdf8;
  color: var(--muted);
  box-shadow: 0 10px 26px rgba(18, 19, 20, 0.06);
}

.panith-hub-page .panith-card-grid,
.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 30px);
}

.panith-hub-page .panith-service-area-grid .service-card {
  min-height: 300px !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(18, 19, 20, 0.1);
}

.panith-hub-page .panith-content-card {
  min-height: 310px;
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: 16px;
  background: #fffdf8;
  box-shadow: 0 18px 54px rgba(18, 19, 20, 0.08);
}

.panith-hub-page .panith-content-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 30px 76px rgba(18, 19, 20, 0.14);
}

.panith-hub-page .panith-content-card a {
  padding: 30px;
}

.panith-hub-page .card-kicker {
  width: fit-content;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 200, 0, 0.24);
  color: #7a300d;
  font-size: 0.72rem;
}

.panith-hub-page .panith-content-card h3 {
  margin-top: 20px;
  color: var(--black);
  font-size: clamp(1.35rem, 2vw, 2rem) !important;
  line-height: 1.12 !important;
  hyphens: none;
  text-wrap: balance;
}

.panith-hub-page .panith-content-card p {
  margin-top: 16px;
  color: #4b4f55;
}

.panith-hub-page .card-meta {
  margin-top: auto;
  padding-top: 22px;
  color: var(--muted);
}

.panith-hub-page .read-more-inline {
  margin-top: 18px;
  color: var(--orange);
}

.panith-hub-page .panith-related-search-results {
  margin-top: clamp(56px, 8vw, 96px);
  padding-top: clamp(38px, 6vw, 70px);
  border-top: 1px solid rgba(18, 19, 20, 0.12);
}

.panith-hub-page .case-study-card img {
  border-radius: 16px 16px 0 0;
}

.panith-hub-page .panith-empty-state {
  border: 1px solid rgba(18, 19, 20, 0.1);
  border-radius: 16px;
  background: #fffdf8;
  box-shadow: 0 18px 48px rgba(18, 19, 20, 0.07);
}

@media (max-width: 1024px) {
  .panith-hub-page .panith-card-grid,
  .panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .panith-hub-page .panith-filter-row {
    position: static;
  }
}

@media (max-width: 700px) {
  .panith-hub-page .panith-page-hero,
  .panith-hub-page .panith-section {
    width: min(100% - 28px, 560px);
  }

  .panith-hub-page::before {
    height: 640px;
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
  }

  .panith-hub-page .panith-page-hero {
    min-height: 560px;
    padding-top: 58px;
  }

  .panith-hub-page .panith-page-hero h1 {
    font-size: clamp(2.45rem, 13vw, 3.9rem) !important;
  }

  .panith-hub-page .panith-page-hero .panith-filter-form,
  .panith-hub-page .panith-filter-row,
  .panith-hub-page .panith-card-grid,
  .panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr;
  }

  .panith-hub-page .panith-page-hero .panith-filter-form {
    padding: 8px;
  }

  .panith-hub-page .panith-section > h2,
  .panith-hub-page .panith-related-search-results h2 {
    font-size: clamp(2rem, 11vw, 2.9rem) !important;
  }

  .panith-hub-page .panith-content-card {
    min-height: 260px;
  }
}
/* Knowledge Hub theme-match refinement */
.panith-hub-page {
  padding-top: 0 !important;
  background: var(--paper) !important;
}

.panith-hub-page::before {
  display: none !important;
  content: none !important;
}

.panith-hub-page .panith-page-hero {
  width: min(1180px, calc(100% - 56px)) !important;
  min-height: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px) !important;
  gap: clamp(34px, 6vw, 82px) !important;
  align-items: center !important;
  padding: clamp(58px, 8vw, 104px) 0 clamp(46px, 6vw, 76px) !important;
  color: var(--black) !important;
}

.panith-hub-page .panith-page-hero::after {
  content: "" !important;
  width: min(100%, 340px) !important;
  aspect-ratio: 1 / 1 !important;
  justify-self: end !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, transparent 0 49%, rgba(18, 19, 20, 0.16) 49% 51%, transparent 51%),
    linear-gradient(160deg, var(--orange) 0 52%, var(--yellow) 52% 100%) !important;
  box-shadow: 0 24px 54px rgba(20, 21, 22, 0.12) !important;
  transform: rotate(-4deg) !important;
}

.panith-hub-page .section-kicker {
  width: fit-content !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--orange) !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  backdrop-filter: none !important;
}

.panith-hub-page .section-kicker::before {
  content: "" !important;
  width: 42px !important;
  height: 3px !important;
  border-radius: 0 !important;
  background: var(--orange) !important;
  box-shadow: none !important;
}

.panith-hub-page .panith-page-hero h1 {
  max-width: 820px !important;
  margin-top: 18px !important;
  color: var(--black) !important;
  font-size: clamp(3.1rem, 6vw, 6rem) !important;
  line-height: 0.96 !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
}

.panith-hub-page .panith-page-hero p {
  max-width: 640px !important;
  margin-top: 24px !important;
  color: #2f3235 !important;
  font-size: clamp(1rem, 1.35vw, 1.18rem) !important;
  line-height: 1.56 !important;
  font-weight: 800 !important;
}

.panith-hub-page .panith-page-hero .panith-filter-form {
  grid-column: 1 / -1 !important;
  max-width: none !important;
  margin-top: clamp(28px, 5vw, 48px) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.panith-hub-page .panith-page-hero input[type="search"] {
  min-height: 62px !important;
  border: 2px solid var(--black) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: var(--black) !important;
  box-shadow: none !important;
}

.panith-hub-page .btn-orange {
  min-height: 62px !important;
  border-radius: 8px !important;
  background: var(--orange) !important;
  box-shadow: 0 12px 24px rgba(255, 75, 19, 0.2) !important;
}

.panith-hub-page .panith-section {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding: clamp(42px, 7vw, 82px) 0 !important;
}

.panith-hub-page .panith-section > h2,
.panith-hub-page .panith-related-search-results h2 {
  max-width: 760px !important;
  margin-bottom: 28px !important;
  color: var(--black) !important;
  font-size: clamp(2.35rem, 4.5vw, 4.8rem) !important;
  line-height: 1.02 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

.panith-hub-page .panith-filter-row {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin-bottom: 30px !important;
  padding: 20px !important;
  border: 2px solid rgba(18, 19, 20, 0.12) !important;
  border-radius: 10px !important;
  background: #fffdf8 !important;
  box-shadow: 0 18px 40px rgba(18, 19, 20, 0.07) !important;
  backdrop-filter: none !important;
}

.panith-hub-page .panith-filter-form label {
  color: var(--black) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
}

.panith-hub-page .panith-filter-form input,
.panith-hub-page .panith-filter-form select {
  min-height: 52px !important;
  border: 1px solid rgba(18, 19, 20, 0.18) !important;
  border-radius: 8px !important;
  background: var(--paper) !important;
  box-shadow: none !important;
}

.panith-hub-page .panith-result-summary {
  width: fit-content !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}

.panith-hub-page .panith-card-grid,
.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(20px, 2.5vw, 34px) !important;
}

.panith-hub-page .panith-content-card {
  min-height: 300px !important;
  border: 1px solid rgba(18, 19, 20, 0.1) !important;
  border-radius: 10px !important;
  background: #fffdf8 !important;
  box-shadow: 0 18px 42px rgba(18, 19, 20, 0.08) !important;
}

.panith-hub-page .panith-content-card:nth-child(4n + 1) {
  background: var(--orange) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.panith-hub-page .panith-content-card:nth-child(4n + 2) {
  background: var(--yellow) !important;
  color: var(--black) !important;
}

.panith-hub-page .panith-content-card:nth-child(4n) {
  background: linear-gradient(135deg, #262729, #151617) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.panith-hub-page .panith-content-card:nth-child(4n + 1) h3,
.panith-hub-page .panith-content-card:nth-child(4n + 1) p,
.panith-hub-page .panith-content-card:nth-child(4n + 1) span,
.panith-hub-page .panith-content-card:nth-child(4n + 1) strong,
.panith-hub-page .panith-content-card:nth-child(4n + 1) b,
.panith-hub-page .panith-content-card:nth-child(4n + 1) a,
.panith-hub-page .panith-content-card:nth-child(4n) h3,
.panith-hub-page .panith-content-card:nth-child(4n) p,
.panith-hub-page .panith-content-card:nth-child(4n) span,
.panith-hub-page .panith-content-card:nth-child(4n) strong,
.panith-hub-page .panith-content-card:nth-child(4n) b,
.panith-hub-page .panith-content-card:nth-child(4n) a,
.panith-hub-page .panith-content-card:nth-child(4n) .card-meta {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.panith-hub-page .panith-content-card a {
  padding: 30px !important;
}

.panith-hub-page .card-kicker {
  width: fit-content !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: currentColor !important;
  font-size: 0.76rem !important;
  opacity: 0.72 !important;
}

.panith-hub-page .panith-content-card h3 {
  margin-top: 22px !important;
  color: currentColor !important;
  font-size: clamp(1.35rem, 2vw, 2rem) !important;
  line-height: 1.1 !important;
  hyphens: none !important;
}

.panith-hub-page .panith-content-card p {
  margin-top: 16px !important;
  color: currentColor !important;
  opacity: 0.78 !important;
}

.panith-hub-page .card-meta {
  margin-top: auto !important;
  padding-top: 22px !important;
  color: currentColor !important;
  opacity: 0.78 !important;
}

.panith-hub-page .read-more-inline {
  margin-top: 18px !important;
  color: currentColor !important;
}

.panith-hub-page .panith-service-area-grid .service-card {
  border-radius: 10px !important;
}

@media (max-width: 1024px) {
  .panith-hub-page .panith-page-hero {
    grid-template-columns: 1fr !important;
  }

  .panith-hub-page .panith-page-hero::after {
    justify-self: start !important;
    width: min(100%, 260px) !important;
  }

  .panith-hub-page .panith-filter-row,
  .panith-hub-page .panith-card-grid,
  .panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .panith-hub-page .panith-page-hero,
  .panith-hub-page .panith-section {
    width: min(100% - 28px, 560px) !important;
  }

  .panith-hub-page .panith-page-hero {
    padding-top: 52px !important;
  }

  .panith-hub-page .panith-page-hero h1 {
    font-size: clamp(2.45rem, 13vw, 3.9rem) !important;
  }

  .panith-hub-page .panith-page-hero .panith-filter-form,
  .panith-hub-page .panith-filter-row,
  .panith-hub-page .panith-card-grid,
  .panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Knowledge Hub reference-style correction */
.panith-hub-page {
  background: #f7f5f0 !important;
}

.panith-hub-page::before,
.panith-hub-page .panith-page-hero::after {
  display: none !important;
  content: none !important;
}

.panith-hub-page .panith-page-hero {
  width: min(1120px, calc(100% - 56px)) !important;
  min-height: auto !important;
  display: block !important;
  padding: clamp(54px, 8vw, 92px) 0 28px !important;
  color: #202124 !important;
  text-align: center !important;
}

.panith-hub-page .section-kicker {
  justify-content: center !important;
  margin-inline: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #ff4b13 !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
}

.panith-hub-page .section-kicker::before {
  display: none !important;
}

.panith-hub-page .panith-page-hero h1 {
  max-width: 900px !important;
  margin: 12px auto 0 !important;
  color: #202124 !important;
  font-size: clamp(2.7rem, 5vw, 5.4rem) !important;
  line-height: 0.98 !important;
  text-align: center !important;
}

.panith-hub-page .panith-page-hero p {
  max-width: 760px !important;
  margin: 20px auto 0 !important;
  color: #53565a !important;
  font-size: clamp(1rem, 1.3vw, 1.2rem) !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

.panith-hub-page .panith-page-hero .panith-filter-form {
  max-width: 780px !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.panith-hub-page .panith-page-hero input[type="search"] {
  min-height: 56px !important;
  border: 1px solid rgba(32, 33, 36, 0.22) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
}

.panith-hub-page .btn-orange {
  min-height: 56px !important;
  border-radius: 8px !important;
  background: #ff4b13 !important;
  color: #fff !important;
}

.panith-hub-page > .panith-section:first-of-type {
  width: 100% !important;
  padding: 22px 0 34px !important;
  border-bottom: 1px solid rgba(32, 33, 36, 0.12) !important;
}

.panith-hub-page > .panith-section:first-of-type > h2 {
  display: none !important;
}

.panith-hub-page .panith-service-area-grid {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.panith-hub-page .panith-service-area-grid .service-card {
  min-height: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(32, 33, 36, 0.2) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.panith-hub-page .panith-service-area-grid .service-card-link {
  min-height: 52px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 16px !important;
  text-align: center !important;
}

.panith-hub-page .panith-service-area-grid .service-custom-icon,
.panith-hub-page .panith-service-area-grid .icon,
.panith-hub-page .panith-service-area-grid p,
.panith-hub-page .panith-service-area-grid ul,
.panith-hub-page .panith-service-area-grid dl,
.panith-hub-page .panith-service-area-grid .service-card-action {
  display: none !important;
}

.panith-hub-page .panith-service-area-grid h3 {
  margin: 0 !important;
  color: #202124 !important;
  font-size: 1rem !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  text-align: center !important;
}

.panith-hub-page > .panith-section:nth-of-type(2) {
  width: min(1180px, calc(100% - 56px)) !important;
  padding: 34px 0 82px !important;
}

.panith-hub-page > .panith-section:nth-of-type(2) > h2 {
  display: none !important;
}

.panith-hub-page .panith-filter-row {
  margin: 0 0 28px !important;
  padding: 18px !important;
  border: 1px solid rgba(32, 33, 36, 0.14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.panith-hub-page .panith-filter-form input,
.panith-hub-page .panith-filter-form select {
  min-height: 48px !important;
  border-radius: 7px !important;
  background: #f7f5f0 !important;
}

.panith-hub-page .panith-result-summary {
  margin: 0 0 20px !important;
  color: #53565a !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.panith-hub-page > .panith-section:nth-of-type(2) > .panith-card-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr) !important;
  gap: 22px !important;
  align-items: stretch !important;
}

.panith-hub-page .knowledge-card {
  min-height: 220px !important;
  border: 1px solid rgba(32, 33, 36, 0.14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  box-shadow: 0 14px 34px rgba(18, 19, 20, 0.06) !important;
}

.panith-hub-page .knowledge-card a {
  padding: 28px !important;
}

.panith-hub-page .knowledge-card:first-child {
  grid-row: span 2 !important;
  min-height: 560px !important;
  background: #fffdf8 !important;
}

.panith-hub-page .knowledge-card:first-child a::before {
  content: "" !important;
  display: block !important;
  width: calc(100% + 56px) !important;
  height: 330px !important;
  margin: -28px -28px 30px !important;
  border-bottom: 1px solid rgba(32, 33, 36, 0.1) !important;
  background:
    radial-gradient(circle at 78% 36%, #ff8a1d 0 68px, transparent 70px),
    linear-gradient(#2c3033 0 0) 31% 58% / 56% 40px no-repeat,
    linear-gradient(#ff4b13 0 0) 61% 58% / 22% 40px no-repeat,
    linear-gradient(#2c3033 0 0) 26% 53% / 64% 20px no-repeat,
    linear-gradient(90deg, #2c3033 0 28%, #f3f6f8 28% 100%) center 62% / 70% 128px no-repeat,
    linear-gradient(#2c3033 0 0) 50% 62% / 72% 150px no-repeat,
    radial-gradient(circle at 13% 62%, #ff4b13 0 48px, transparent 50px),
    linear-gradient(135deg, #f7f5f0 0%, #fff2d8 100%) !important;
}

.panith-hub-page .knowledge-card:first-child h3 {
  font-size: clamp(2rem, 3vw, 3rem) !important;
}

.panith-hub-page .card-kicker {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #ff4b13 !important;
  opacity: 1 !important;
  font-size: 0.8rem !important;
  font-weight: 900 !important;
}

.panith-hub-page .knowledge-card h3 {
  margin-top: 14px !important;
  color: #202124 !important;
  font-size: clamp(1.35rem, 2vw, 1.9rem) !important;
  line-height: 1.12 !important;
}

.panith-hub-page .knowledge-card p {
  margin-top: 14px !important;
  color: #53565a !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.panith-hub-page .card-meta {
  margin-top: auto !important;
  color: #53565a !important;
}

.panith-hub-page .read-more-inline {
  color: #202124 !important;
  font-weight: 900 !important;
}

.panith-hub-page .read-more-inline::after {
  background: #202124 !important;
}

.panith-hub-page .panith-related-search-results {
  margin-top: 56px !important;
  padding-top: 44px !important;
  border-top: 1px solid rgba(32, 33, 36, 0.14) !important;
}

@media (max-width: 1024px) {
  .panith-hub-page .panith-service-area-grid,
  .panith-hub-page .panith-filter-row,
  .panith-hub-page > .panith-section:nth-of-type(2) > .panith-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .panith-hub-page .panith-page-hero,
  .panith-hub-page > .panith-section:nth-of-type(2),
  .panith-hub-page .panith-service-area-grid {
    width: min(100% - 28px, 560px) !important;
  }

  .panith-hub-page .panith-page-hero .panith-filter-form,
  .panith-hub-page .panith-service-area-grid,
  .panith-hub-page .panith-filter-row,
  .panith-hub-page > .panith-section:nth-of-type(2) > .panith-card-grid {
    grid-template-columns: 1fr !important;
  }

  .panith-hub-page .knowledge-card:first-child {
    min-height: 0 !important;
  }

  .panith-hub-page .knowledge-card:first-child a::before {
    height: 220px !important;
  }
}
/* FINAL Knowledge Hub hero text visibility fix */
html body main#content.panith-hub-page,
html body main#content.panith-hub-page .panith-page-hero,
html body main#content.panith-hub-page .panith-page-hero *,
html body main#content.panith-hub-page .panith-page-hero h1,
html body main#content.panith-hub-page .panith-page-hero p,
html body main#content.panith-hub-page .panith-page-hero span,
html body main#content.panith-hub-page .panith-page-hero label,
html body main#content.panith-hub-page .panith-page-hero input,
html body main#content.panith-hub-page .panith-page-hero input::placeholder {
  color: #202124 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-page-hero .section-kicker {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-page-hero .btn,
html body main#content.panith-hub-page .panith-page-hero .btn * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-page-hero h1 {
  font-weight: 900 !important;
}

/* Panith Codex visual polish 2026-07-22 */
:root {
  --ink: #2C2D2D;
  --black: #2C2D2D;
  --muted: #55585A;
  --panith-muted: #777A7C;
  --line: #E8E5DE;
  --paper: #FAFAF8;
  --mist: #F7F7F4;
  --white: #FFFFFF;
  --orange: #FC6607;
  --yellow: #F7D018;
  --panith-dark-orange: #D94F00;
  --shadow: 0 16px 38px rgba(44, 45, 45, 0.10);
}

body {
  background: #FAFAF8 !important;
  color: #55585A !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

body::before { opacity: 0.08 !important; }

h1, h2, h3, .brand {
  color: #2C2D2D !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

p, .about-copy p, .contact-cta-panel p, .solution-panel p, .quote-card p,
.footer p, .footer a, .person p, .stats span {
  font-weight: 400 !important;
  color: #55585A;
}

.site-header {
  background: rgba(250, 250, 248, 0.94) !important;
  border-bottom: 1px solid #E8E5DE;
  backdrop-filter: blur(14px);
}

.nav-links { font-size: 15px !important; font-weight: 500 !important; gap: clamp(24px, 3vw, 42px) !important; }
.nav-links a { position: relative; color: #2C2D2D !important; }
.nav-links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5px;
  height: 2px;
  border-radius: 999px;
  background: #FC6607;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 180ms ease;
}
.nav-links a:hover::after, .nav-links .current-menu-item > a::after { transform: scaleX(1); }

.btn, .talk-button {
  min-height: 48px !important;
  padding-inline: clamp(22px, 2.2vw, 32px) !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  box-shadow: 0 10px 24px rgba(252, 102, 7, 0.18) !important;
}
.btn-orange, .talk-button { background: #FC6607 !important; color: #FFFFFF !important; }
.btn-orange:hover, .btn-orange:focus-visible, .talk-button:hover, .talk-button:focus-visible { background: #D94F00 !important; color: #FFFFFF !important; }
.link-arrow { color: #FC6607 !important; font-size: 16px !important; font-weight: 600 !important; text-decoration: none !important; }
.link-arrow span::before { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 11C45 5 104 6 156 9' fill='none' stroke='%23FC6607' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; }

.hero { min-height: auto !important; padding: clamp(54px, 6vw, 82px) 0 clamp(40px, 5vw, 64px) !important; }
.hero-copy { max-width: 680px !important; }
.hero h1 {
  max-width: 650px !important;
  font-size: clamp(54px, 4.1vw, 58px) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}
.hero p { max-width: 560px !important; color: #55585A !important; font-size: 17px !important; line-height: 1.6 !important; font-weight: 400 !important; }
.success-card strong { color: #2C2D2D !important; font-weight: 700 !important; }
.success-card span { color: #2C2D2D !important; font-weight: 600 !important; }

.band-light, .testimonials, .contact-section { background: #F7F7F4 !important; }
.services, .about, .team, .testimonials, .contact-section { padding-block: clamp(58px, 6vw, 88px) !important; }
.services h2, .about h2, .team h2, .testimonials h2, .contact-form-panel h2, .contact-info-panel h2 {
  font-size: clamp(34px, 3.1vw, 40px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  color: #2C2D2D !important;
}

.service-card {
  border: 1px solid rgba(232, 229, 222, 0.65) !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(44, 45, 45, 0.10) !important;
  padding: clamp(34px, 3.2vw, 46px) !important;
}
.service-card:hover, .person:hover, .quote-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 18px 42px rgba(44, 45, 45, 0.13) !important;
  border-color: rgba(252, 102, 7, 0.34) !important;
}
.service-card h3 {
  font-size: clamp(20px, 1.55vw, 22px) !important;
  line-height: 1.18 !important;
  font-weight: 600 !important;
  overflow-wrap: normal !important;
}
.service-card.hot { background: #FC6607 !important; color: #FFFFFF !important; }
.service-card.sun { background: #F7D018 !important; color: #2C2D2D !important; }
.service-card.clean { background: #FFFFFF !important; color: #2C2D2D !important; border-color: #E8E5DE !important; }
.service-card.dark { background: #2C2D2D !important; color: #FFFFFF !important; }
.service-card.hot h3, .service-card.dark h3, .service-card.hot .icon, .service-card.dark .icon, .service-card.hot .service-open, .service-card.dark .service-open { color: #FFFFFF !important; }
.service-card.sun h3, .service-card.clean h3, .service-card.sun .icon, .service-card.clean .icon, .service-card.sun .service-open, .service-card.clean .service-open { color: #2C2D2D !important; }
.service-card .icon, .service-custom-icon { width: 64px !important; height: 64px !important; }
.service-open { font-weight: 600 !important; }

.next-level { background: #2C2D2D !important; }
.solution-panel { border-radius: 8px !important; box-shadow: 0 18px 42px rgba(0, 0, 0, 0.20) !important; }
.solution-panel h3 { color: #2C2D2D !important; font-size: clamp(24px, 2vw, 31px) !important; font-weight: 600 !important; line-height: 1.06 !important; }
.solution-panel p { color: #55585A !important; font-size: 16px !important; line-height: 1.55 !important; }
.automate { background: #FC6607 !important; }
.deliver { background: #F7D018 !important; }
.launch { background: #FFFFFF !important; }
.automate h3, .automate p { color: #2C2D2D !important; }

.person { padding: 0 0 14px !important; border-radius: 16px; transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease !important; }
.person-bio, .person-skills, .person-links { display: none !important; }
.person h3 { margin-top: 16px !important; color: #2C2D2D !important; font-size: 18px !important; font-weight: 600 !important; }
.person p { color: #777A7C !important; font-size: 15px !important; line-height: 1.4 !important; }
.portrait { border-radius: 16px !important; border: 1px solid #E8E5DE; box-shadow: 0 12px 28px rgba(44, 45, 45, 0.08); }

.quote-card { border: 1px solid #E8E5DE !important; border-radius: 16px !important; box-shadow: 0 12px 28px rgba(44, 45, 45, 0.08) !important; }
.quote-card p { font-size: 16px !important; line-height: 1.6 !important; color: #55585A !important; }
.quote-card b, .quote-service { color: #FC6607 !important; }
.quote-card strong { color: #2C2D2D !important; font-weight: 600 !important; }
.quote-card span { color: #777A7C !important; font-weight: 400 !important; }
.stars { display: none !important; }

.contact-shell { background: #FFFFFF !important; border: 1px solid #E8E5DE !important; border-radius: 16px !important; box-shadow: 0 18px 42px rgba(44, 45, 45, 0.10) !important; }
.contact-info-panel { background: #FC6607 !important; color: #FFFFFF !important; }
.contact-info-panel h2, .contact-info-panel h3, .contact-info-panel p, .contact-info-panel a { color: #FFFFFF !important; }
.contact-info-item { gap: 22px !important; }
.contact-icon { background: rgba(255,255,255,0.16) !important; color: #FFFFFF !important; border: 1px solid rgba(255,255,255,0.28) !important; font-weight: 600 !important; }
.contact-icon svg, .socials svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.footer { background: #2C2D2D !important; color: #FFFFFF !important; padding-block: clamp(48px, 5vw, 72px) 24px !important; }
.footer-grid { gap: clamp(28px, 3vw, 44px) !important; align-items: start; }
.footer h3 { color: #FFFFFF !important; font-size: 15px !important; font-weight: 600 !important; margin-bottom: 14px !important; }
.footer p, .footer a { color: rgba(255,255,255,0.74) !important; font-size: 15px !important; line-height: 1.65 !important; font-weight: 400 !important; }
.footer a:hover { color: #FFFFFF !important; }
.socials { gap: 10px !important; margin-top: 18px !important; }
.socials a { width: 38px !important; height: 38px !important; border-radius: 8px !important; border-color: rgba(255,255,255,0.22) !important; color: #FFFFFF !important; background: rgba(255,255,255,0.06); }
.socials a:hover { background: #FC6607 !important; border-color: #FC6607 !important; transform: translateY(-2px); }
.socials a span { font-size: 11px; font-weight: 600; }
.socials a img { width: 20px !important; height: 20px !important; }
.newsletter input { min-height: 44px !important; font-size: 15px !important; border-color: rgba(255,255,255,0.24) !important; }
.newsletter button { min-height: 42px !important; border-radius: 8px !important; background: #FC6607 !important; color: #FFFFFF !important; font-size: 15px !important; font-weight: 600 !important; }
.copyright { font-weight: 400 !important; color: rgba(255,255,255,0.62) !important; }

.panith-reveal { filter: blur(0) !important; transform: translateY(14px) !important; transition-duration: 360ms !important; }
.panith-heading-reveal { transform: translateY(12px) !important; }
.panith-reveal.is-visible { transform: translateY(0) !important; filter: blur(0) !important; }

@media (min-width: 1200px) {
  .hero { grid-template-columns: minmax(0, 0.9fr) minmax(620px, 1.1fr) !important; min-height: auto !important; }
  .hero h1 { font-size: clamp(54px, 3.8vw, 58px) !important; }
  .hero-art { width: 640px !important; min-height: 540px !important; }
}

@media (max-width: 980px) {
  .nav-links.is-open { background: #FAFAF8 !important; border-top-color: #FC6607 !important; }
  .menu-toggle { background: #2C2D2D !important; }
  .menu-toggle.is-active { background: #FC6607 !important; }
  .hero h1 { font-size: clamp(40px, 7vw, 52px) !important; }
  .service-card { min-height: 280px !important; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 620px) {
  .hero h1 { font-size: clamp(34px, 10vw, 42px) !important; }
  .services, .about, .team, .testimonials, .contact-section { padding-block: 48px !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .contact-info-item { align-items: start !important; }
}
/* End Panith Codex visual polish 2026-07-22 */
/* Panith dynamic service card colour bridge 2026-07-22 */
.service-grid > .panith-dynamic-service:nth-child(4n+1) { background: #FC6607 !important; color: #FFFFFF !important; }
.service-grid > .panith-dynamic-service:nth-child(4n+2) { background: #F7D018 !important; color: #2C2D2D !important; }
.service-grid > .panith-dynamic-service:nth-child(4n+3) { background: #FFFFFF !important; color: #2C2D2D !important; border-color: #E8E5DE !important; }
.service-grid > .panith-dynamic-service:nth-child(4n+4) { background: #2C2D2D !important; color: #FFFFFF !important; }
.service-grid > .panith-dynamic-service:nth-child(4n+1) .service-card-link,
.service-grid > .panith-dynamic-service:nth-child(4n+1) h3,
.service-grid > .panith-dynamic-service:nth-child(4n+1) p,
.service-grid > .panith-dynamic-service:nth-child(4n+1) li,
.service-grid > .panith-dynamic-service:nth-child(4n+1) .service-card-action,
.service-grid > .panith-dynamic-service:nth-child(4n+4) .service-card-link,
.service-grid > .panith-dynamic-service:nth-child(4n+4) h3,
.service-grid > .panith-dynamic-service:nth-child(4n+4) p,
.service-grid > .panith-dynamic-service:nth-child(4n+4) li,
.service-grid > .panith-dynamic-service:nth-child(4n+4) .service-card-action { color: #FFFFFF !important; }
.service-grid > .panith-dynamic-service:nth-child(4n+2) .service-card-link,
.service-grid > .panith-dynamic-service:nth-child(4n+2) h3,
.service-grid > .panith-dynamic-service:nth-child(4n+2) p,
.service-grid > .panith-dynamic-service:nth-child(4n+2) li,
.service-grid > .panith-dynamic-service:nth-child(4n+2) .service-card-action,
.service-grid > .panith-dynamic-service:nth-child(4n+3) .service-card-link,
.service-grid > .panith-dynamic-service:nth-child(4n+3) h3,
.service-grid > .panith-dynamic-service:nth-child(4n+3) p,
.service-grid > .panith-dynamic-service:nth-child(4n+3) li,
.service-grid > .panith-dynamic-service:nth-child(4n+3) .service-card-action { color: #2C2D2D !important; }
.panith-dynamic-service .service-card-link { display: flex; min-height: 100%; flex-direction: column; gap: 16px; }
.panith-dynamic-service .service-card-link p { font-size: 16px !important; line-height: 1.55 !important; font-weight: 400 !important; margin: 0 !important; }
.panith-dynamic-service .service-card-action { margin-top: auto; font-size: 15px !important; font-weight: 600 !important; }
/* End Panith dynamic service card colour bridge 2026-07-22 */
/* Panith all-pages visual polish 2026-07-22 */
.site-main:not(#content),
.site-main,
.panith-hub-page,
.panith-service-page,
.panith-reading-page,
.panith-case-studies-page,
.blog .site-main,
.archive .site-main,
.search .site-main,
.single .site-main,
.page .site-main {
  background: #FAFAF8;
  color: #55585A;
}

.panith-page-hero,
.archive-header,
.search-header,
.error-404,
.page-header,
.entry-card,
.panith-section,
.panith-reading-layout {
  color: #55585A;
}

.panith-page-hero {
  padding: clamp(64px, 7vw, 104px) 0 clamp(42px, 5vw, 72px) !important;
  border-bottom: 1px solid #E8E5DE;
}

.panith-page-hero h1,
.archive-header h1,
.search-header h1,
.page-header h1,
.error-404 h1,
.entry-title,
.panith-article-header h1 {
  max-width: 900px;
  color: #2C2D2D !important;
  font-size: clamp(40px, 4.8vw, 58px) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.panith-page-hero p,
.archive-header p,
.search-header p,
.page-header p,
.error-404 p,
.panith-article-header p {
  max-width: 760px;
  margin-top: 18px;
  color: #55585A !important;
  font-size: 17px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

.panith-section {
  padding-block: clamp(48px, 5.6vw, 82px) !important;
}

.panith-section + .panith-section {
  border-top: 1px solid #E8E5DE;
}

.panith-section > h2,
.panith-related-search-results h2,
.panith-related-content h2,
.panith-article-footer h2,
.panith-module summary span,
.entry-card .entry-title,
.widget-title {
  color: #2C2D2D !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.panith-section > h2,
.panith-related-search-results h2,
.panith-related-content h2,
.panith-article-footer h2 {
  font-size: clamp(30px, 3vw, 40px) !important;
  line-height: 1.14 !important;
  margin-bottom: clamp(22px, 3vw, 36px) !important;
}

.panith-card-grid {
  gap: clamp(20px, 2.4vw, 32px) !important;
}

.panith-content-card,
.entry-card,
.panith-module,
.panith-download-box,
.panith-empty-state,
.panith-filter-form,
.panith-final-cta,
.panith-toc,
.panith-chapter-nav,
.panith-chip-grid a,
.service-card-counts,
.panith-facts-grid > div {
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 12px 30px rgba(44, 45, 45, 0.08) !important;
}

.panith-content-card:hover,
.entry-card:hover,
.panith-chip-grid a:hover,
.panith-module:hover,
.panith-facts-grid > div:hover {
  transform: translateY(-4px);
  border-color: rgba(252, 102, 7, 0.34) !important;
  box-shadow: 0 18px 42px rgba(44, 45, 45, 0.12) !important;
}

.panith-content-card h2,
.panith-content-card h3,
.panith-content-card .panith-card-title,
.entry-card h2,
.entry-card h1,
.panith-empty-state h2,
.panith-empty-state h3,
.panith-download-box h2,
.panith-final-cta h2 {
  color: #2C2D2D !important;
  font-weight: 600 !important;
  line-height: 1.18 !important;
}

.panith-content-card p,
.panith-content-card li,
.entry-summary,
.entry-summary p,
.panith-rich-text,
.panith-rich-text p,
.panith-rich-text li,
.panith-empty-state p,
.panith-download-box p,
.panith-final-cta p,
.panith-result-summary,
.entry-meta,
.panith-breadcrumbs,
.panith-toc p,
.panith-module small {
  color: #55585A !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  font-weight: 400 !important;
}

.entry-meta,
.panith-breadcrumbs,
.panith-card-meta,
.panith-card-type,
.panith-result-summary,
.panith-module small {
  color: #777A7C !important;
}

.panith-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
  font-size: 14px !important;
}

.panith-breadcrumbs a,
.panith-reset-link,
.read-more-inline,
.panith-toc a,
.panith-chapter-nav a,
.panith-card-grid a:not(.btn) {
  color: #2C2D2D !important;
}

.panith-breadcrumbs a:hover,
.panith-reset-link:hover,
.read-more-inline:hover,
.panith-toc a:hover,
.panith-chapter-nav a:hover,
.panith-card-grid a:not(.btn):hover {
  color: #FC6607 !important;
}

.panith-filter-form {
  padding: clamp(18px, 2.2vw, 28px) !important;
  gap: 18px !important;
}

.panith-filter-form label span,
.panith-filter-form .customize-control-title,
.panith-filter-form span {
  color: #2C2D2D !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.panith-filter-form input,
.panith-filter-form select,
.search-form input,
.entry-card input,
.panith-consultation-form input,
.panith-consultation-form select,
.panith-consultation-form textarea {
  min-height: 48px;
  border: 1px solid #E8E5DE !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  color: #2C2D2D !important;
  font-size: 16px !important;
  font-weight: 400 !important;
}

.panith-filter-form input:focus,
.panith-filter-form select:focus,
.search-form input:focus,
.panith-consultation-form input:focus,
.panith-consultation-form textarea:focus {
  border-color: #FC6607 !important;
  box-shadow: 0 0 0 4px rgba(252, 102, 7, 0.12) !important;
}

.panith-chip-grid {
  gap: 12px !important;
}

.panith-chip-grid a {
  padding: 10px 14px !important;
  color: #2C2D2D !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.panith-chip-grid a:hover {
  background: #FFF3EC !important;
  color: #D94F00 !important;
}

.panith-module {
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(44, 45, 45, 0.07) !important;
}

.panith-module summary {
  padding: clamp(18px, 2.2vw, 26px) !important;
  background: #FFFFFF !important;
  color: #2C2D2D !important;
}

.panith-module[open] summary {
  border-bottom: 1px solid #E8E5DE;
}

.panith-module .panith-card-grid {
  padding: clamp(18px, 2.2vw, 26px) !important;
  background: #FAFAF8;
}

.panith-reading-layout {
  padding-block: clamp(54px, 6vw, 92px) !important;
}

.panith-article-header {
  padding-bottom: clamp(28px, 4vw, 48px) !important;
  border-bottom: 1px solid #E8E5DE;
}

.panith-article-body {
  gap: clamp(28px, 4vw, 52px) !important;
}

.panith-rich-text {
  color: #55585A !important;
}

.panith-rich-text h2,
.panith-rich-text h3,
.panith-rich-text h4 {
  color: #2C2D2D !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

.panith-rich-text h2 { font-size: clamp(28px, 2.6vw, 36px) !important; }
.panith-rich-text h3 { font-size: clamp(22px, 2vw, 28px) !important; }
.panith-rich-text a { color: #FC6607 !important; text-decoration-color: rgba(252,102,7,.35); text-underline-offset: 4px; }
.panith-rich-text blockquote { border-left: 4px solid #FC6607; background: #FFF3EC; border-radius: 0 12px 12px 0; }

.panith-toc {
  padding: 20px !important;
  position: sticky;
  top: 100px;
  box-shadow: 0 10px 24px rgba(44,45,45,.07) !important;
}

.panith-toc summary {
  color: #2C2D2D !important;
  font-weight: 600 !important;
}

.panith-download-box,
.panith-final-cta {
  padding: clamp(24px, 3vw, 42px) !important;
}

.panith-final-cta {
  background: #2C2D2D !important;
  color: #FFFFFF !important;
  border-color: #2C2D2D !important;
}

.panith-final-cta h2,
.panith-final-cta p {
  color: #FFFFFF !important;
}

.panith-final-cta .btn-orange { background: #FC6607 !important; }
.panith-final-cta .btn-orange:hover { background: #D94F00 !important; }

.entry-card {
  overflow: hidden;
}

.entry-card-body {
  padding: clamp(22px, 3vw, 34px) !important;
}

.entry-media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.read-more,
.search-submit,
.wp-block-button__link {
  background: #FC6607 !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}

.read-more:hover,
.search-submit:hover,
.wp-block-button__link:hover {
  background: #D94F00 !important;
  color: #FFFFFF !important;
}

.sidebar .widget,
.widget,
.comments-area,
.comment-respond,
.post-navigation,
.posts-navigation,
.pagination {
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 10px 26px rgba(44,45,45,.07) !important;
}

.pagination .page-numbers,
.nav-links .page-numbers {
  border-radius: 8px !important;
  color: #2C2D2D !important;
}

.pagination .current,
.nav-links .current {
  background: #FC6607 !important;
  color: #FFFFFF !important;
}

body:not(.home) .service-grid > .panith-dynamic-service:nth-child(4n+1),
.panith-service-area-grid > .panith-dynamic-service:nth-child(4n+1) { background: #FC6607 !important; color: #FFFFFF !important; }
body:not(.home) .service-grid > .panith-dynamic-service:nth-child(4n+2),
.panith-service-area-grid > .panith-dynamic-service:nth-child(4n+2) { background: #F7D018 !important; color: #2C2D2D !important; }
body:not(.home) .service-grid > .panith-dynamic-service:nth-child(4n+3),
.panith-service-area-grid > .panith-dynamic-service:nth-child(4n+3) { background: #FFFFFF !important; color: #2C2D2D !important; }
body:not(.home) .service-grid > .panith-dynamic-service:nth-child(4n+4),
.panith-service-area-grid > .panith-dynamic-service:nth-child(4n+4) { background: #2C2D2D !important; color: #FFFFFF !important; }

@media (max-width: 980px) {
  .panith-page-hero { padding-top: 48px !important; }
  .panith-page-hero h1,
  .panith-article-header h1,
  .entry-title { font-size: clamp(34px, 7vw, 48px) !important; }
  .panith-article-body { grid-template-columns: 1fr !important; }
  .panith-toc { position: static; }
}

@media (max-width: 620px) {
  .panith-page-hero { padding-block: 40px 34px !important; }
  .panith-page-hero h1,
  .panith-article-header h1,
  .entry-title { font-size: clamp(30px, 9vw, 40px) !important; }
  .panith-filter-row { grid-template-columns: 1fr !important; }
  .panith-filter-actions { align-items: stretch !important; }
  .panith-filter-actions .btn,
  .panith-filter-actions button { width: 100%; }
  .panith-card-grid { grid-template-columns: 1fr !important; }
}
/* End Panith all-pages visual polish 2026-07-22 */


/* [Panith CSS Section] 91 Sitewide navigation and responsive refinements */
/* Codex section-aware navigation 2026-07-22 */
.site-header .nav-links > li > a,
.site-header .nav-links > a {
  font-weight: 600 !important;
  color: #2C2D2D !important;
  text-decoration: none !important;
  transition: color 180ms ease !important;
}

.site-header .nav-links a::after {
  content: none !important;
  display: none !important;
  height: 0 !important;
  background: transparent !important;
  transform: none !important;
}

.site-header .nav-links > li > a:hover,
.site-header .nav-links > li > a:focus-visible,
.site-header .nav-links > li > a.is-nav-active,
.site-header .nav-links > a:hover,
.site-header .nav-links > a:focus-visible,
.site-header .nav-links > a.is-nav-active {
  color: #FC6607 !important;
}

html body .site-header nav.nav .nav-menu-wrap .nav-links > li > a.is-nav-active,
html body .site-header nav.nav .nav-menu-wrap .nav-links > a.is-nav-active {
  color: #FC6607 !important;
}

@media (max-width: 980px) {
  .site-header .nav-links.is-open > li > a,
  .site-header .nav-links.is-open > a {
    font-weight: 600 !important;
  }
}
/* End Codex section-aware navigation 2026-07-22 */

/* Codex mobile proportion and navigation polish 2026-07-22 */
@media (max-width: 620px) {
  html body.home .hero .hero-actions .link-arrow {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  html body.home .services .service-grid {
    justify-items: center !important;
    gap: 20px !important;
  }

  html body.home .services .service-grid > article.service-card.panith-dynamic-service {
    width: min(100%, 340px) !important;
    height: 286px !important;
    min-height: 286px !important;
    aspect-ratio: auto !important;
    border-radius: 18px !important;
  }

  html body.home .services .service-grid > article.service-card.panith-dynamic-service .service-card-link {
    height: 100% !important;
    min-height: 0 !important;
    padding: 28px !important;
    gap: 18px !important;
  }

  html body.home .services .service-grid > article.service-card.panith-dynamic-service .service-custom-icon,
  html body.home .services .service-grid > article.service-card.panith-dynamic-service .icon {
    width: 56px !important;
    height: 56px !important;
    flex: 0 0 56px !important;
  }

  html body.home .services .service-grid > article.service-card.panith-dynamic-service h3 {
    margin: 0 !important;
    font-size: 24px !important;
    line-height: 1.16 !important;
    font-weight: 700 !important;
  }

  html body.home .services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
    min-height: 0 !important;
    margin-top: auto !important;
    padding-top: 0 !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-auto-rows: 300px !important;
    gap: 20px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service {
    width: 100% !important;
    height: 300px !important;
    min-height: 300px !important;
    aspect-ratio: auto !important;
    border-radius: 18px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
    height: 100% !important;
    min-height: 0 !important;
    padding: 24px !important;
    gap: 14px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-custom-icon,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .icon {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service h3 {
    margin: 0 !important;
    font-size: 21px !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;
    text-align: left !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service p {
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action {
    min-height: 0 !important;
    margin-top: auto !important;
    padding-top: 0 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
  }

  html body.single-panith_service .site-header,
  html body.nav-open .site-header {
    min-height: 72px !important;
  }

  html body.single-panith_service .site-header .nav {
    min-height: 72px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    gap: 8px !important;
  }

  html body.single-panith_service .site-header .brand {
    min-width: 0 !important;
  }

  html body.single-panith_service .site-header .custom-logo-link,
  html body.single-panith_service .site-header .custom-logo {
    width: 132px !important;
    max-width: 132px !important;
    height: auto !important;
  }

  html body.single-panith_service .site-header .talk-button {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    box-shadow: 0 7px 16px rgba(252, 102, 7, 0.16) !important;
  }

  html body.single-panith_service .site-header .menu-toggle {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: 44px !important;
    height: 44px !important;
  }

  html body.single-panith_service .site-header .nav-menu-wrap {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }

  html body.nav-open {
    overflow: hidden !important;
    touch-action: none !important;
  }

  html body.nav-open .site-header {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
  }

  html body.nav-open .site-header,
  html body.nav-open .site-header .nav {
    overflow: visible !important;
  }

  html body.nav-open .site-header .nav {
    position: static !important;
  }

  html body.nav-open .site-header .nav-menu-wrap.is-open {
    position: absolute !important;
    top: 72px !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
    height: calc(100dvh - 72px) !important;
    min-height: calc(100dvh - 72px) !important;
    display: block !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    background: #FAFAF8 !important;
  }

  html body.nav-open .site-header .nav-links.is-open {
    width: min(100% - 32px, 520px) !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 18px 0 28px !important;
    border-top: 0 !important;
  }
}
/* End Codex mobile proportion and navigation polish 2026-07-22 */

/* Codex desktop visual balance pass 2026-07-22 */
html body main#content.panith-hub-page > .panith-page-hero {
  width: min(1120px, calc(100% - 48px)) !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  margin-inline: auto !important;
  padding: clamp(64px, 7vw, 92px) 0 clamp(52px, 6vw, 76px) !important;
  border-bottom: 0 !important;
  background: #FAFAF8 !important;
  text-align: center !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker {
  width: auto !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  color: #FC6607 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-align: center !important;
  -webkit-text-fill-color: #FC6607 !important;
}

html body main#content.panith-hub-page > .panith-page-hero h1 {
  width: auto !important;
  max-width: 820px !important;
  margin: 0 auto !important;
  color: #2C2D2D !important;
  font-size: clamp(48px, 5.2vw, 68px) !important;
  line-height: 1.04 !important;
  font-weight: 700 !important;
  text-align: center !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page > .panith-page-hero > p {
  width: auto !important;
  max-width: 700px !important;
  margin: 22px auto 0 !important;
  color: #55585A !important;
  font-size: 17px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
  text-align: center !important;
  -webkit-text-fill-color: #55585A !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  margin: 30px auto 0 !important;
}

html body.home #contact.contact-section {
  padding-block: clamp(60px, 6vw, 82px) !important;
  background: #F7F7F4 !important;
}

html body.home #contact .contact-shell {
  width: min(1180px, calc(100% - 48px)) !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.75fr) !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin-inline: auto !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 16px 38px rgba(44, 45, 45, 0.09) !important;
  overflow: hidden !important;
}

html body.home #contact .contact-form-panel {
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  padding: clamp(44px, 5vw, 68px) !important;
  background: #FFFFFF !important;
  text-align: left !important;
}

html body.home #contact .contact-form-panel::before,
html body.home #contact .contact-form-panel::after {
  content: none !important;
  display: none !important;
}

html body.home #contact .contact-form-panel .section-kicker {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #FC6607 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}

html body.home #contact .contact-form-panel h2 {
  margin: 0 !important;
  color: #2C2D2D !important;
  font-size: clamp(34px, 3vw, 40px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  text-align: left !important;
}

html body.home #contact .contact-cta-panel {
  width: 100% !important;
  max-width: 690px !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

html body.home #contact .contact-cta-panel::before {
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 3px !important;
  margin: 0 0 24px !important;
  border-radius: 3px !important;
  background: #FC6607 !important;
}

html body.home #contact .contact-cta-panel p {
  max-width: 680px !important;
  margin: 0 0 18px !important;
  color: #55585A !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  font-weight: 400 !important;
}

html body.home #contact .contact-cta-panel .btn {
  margin-top: 8px !important;
}

html body.home #contact .contact-info-panel {
  min-height: 0 !important;
  padding: clamp(38px, 4vw, 52px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #FC6607 !important;
  box-shadow: none !important;
}

html body.home #contact .contact-info-panel h2 {
  margin: 0 0 30px !important;
  color: #FFFFFF !important;
  font-size: clamp(30px, 2.5vw, 36px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  text-align: left !important;
}

html body.home #contact .contact-info-list {
  display: grid !important;
  gap: 24px !important;
}

html body.home #contact .contact-info-item {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 16px !important;
  margin: 0 !important;
}

html body.home #contact .contact-icon {
  width: 52px !important;
  height: 52px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

html body.home #contact .contact-icon img {
  width: 38px !important;
  height: 38px !important;
  object-fit: contain !important;
}

html body.home #contact .contact-info-item h3 {
  margin: 0 0 4px !important;
  color: #FFFFFF !important;
  font-size: 21px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

html body.home #contact .contact-info-item p,
html body.home #contact .contact-info-item a {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
  overflow-wrap: anywhere !important;
}

html body.home #services .service-grid > article.panith-dynamic-service .service-card-link {
  gap: 14px !important;
}

html body.home #services .service-grid > article.panith-dynamic-service p {
  display: block !important;
  margin: -4px 0 0 !important;
  color: currentColor !important;
  font-size: 14px !important;
  line-height: 1.48 !important;
  font-weight: 400 !important;
  opacity: 0.86 !important;
}

html body.home #services .service-grid > article.panith-dynamic-service .service-card-action {
  margin-top: auto !important;
  padding-top: 4px !important;
}

html body.home #services .service-grid > article.panith-dynamic-service:nth-child(2) .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid > article.panith-dynamic-service:nth-child(2) .service-custom-icon {
  filter: brightness(0) saturate(100%) !important;
}

html body.single-panith_service .panith-page-hero .section-kicker {
  margin: 0 0 16px !important;
  padding: 0 !important;
  color: #FC6607 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}

html body.single-panith_service .panith-final-cta {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(28px, 4vw, 56px) !important;
  padding: clamp(38px, 4.5vw, 56px) !important;
  border-radius: 16px !important;
  background: #2C2D2D !important;
}

html body.single-panith_service .panith-final-cta h2 {
  max-width: 820px !important;
  margin: 0 !important;
  color: #FFFFFF !important;
  font-size: clamp(32px, 3.1vw, 44px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
}

html body.single-panith_service .panith-final-cta .btn {
  margin: 0 !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  html body main#content.panith-hub-page > .panith-page-hero {
    width: min(100% - 32px, 560px) !important;
    padding: 48px 0 42px !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero h1 {
    font-size: clamp(38px, 11vw, 48px) !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero > p {
    margin-top: 18px !important;
    font-size: 16px !important;
  }

  html body.home #contact .contact-shell {
    width: min(100% - 28px, 560px) !important;
    grid-template-columns: 1fr !important;
  }

  html body.home #contact .contact-form-panel,
  html body.home #contact .contact-info-panel {
    padding: 30px !important;
  }

  html body.home #contact .contact-info-panel h2 {
    margin-bottom: 24px !important;
  }

  html body.home #contact .contact-info-list {
    gap: 20px !important;
  }

  html body.home #services .service-grid > article.panith-dynamic-service .service-card-link {
    gap: 12px !important;
  }

  html body.home #services .service-grid > article.panith-dynamic-service p {
    margin-top: -2px !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.panith-dynamic-service .service-custom-icon,
  html body main#content.panith-hub-page .panith-service-area-grid > article.panith-dynamic-service p,
  html body main#content.panith-hub-page .panith-service-area-grid > article.panith-dynamic-service .service-card-action {
    display: block !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.panith-dynamic-service p {
    margin: 0 !important;
    color: currentColor !important;
    opacity: 0.84 !important;
  }

  html body.single-panith_service .panith-final-cta {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 30px !important;
  }

  html body.single-panith_service .panith-final-cta h2 {
    font-size: clamp(28px, 8vw, 34px) !important;
  }

  html body.single-panith_service .panith-final-cta .btn {
    width: fit-content !important;
  }
}
/* Reduced reveal latency for polished sections */
html body.home #services .panith-reveal,
html body.home #contact .panith-reveal,
html body main#content.panith-hub-page .panith-reveal,
html body.single-panith_service .panith-page-hero .panith-reveal,
html body.single-panith_service .panith-final-cta.panith-reveal,
html body.single-panith_service .panith-final-cta .panith-reveal {
  --reveal-delay: 0ms !important;
  transition-delay: 0ms !important;
  transition-duration: 220ms !important;
  filter: none !important;
}
/* End Codex desktop visual balance pass 2026-07-22 */


/* [Panith CSS Section] 92 Knowledge Hub refinements */
/* Codex Knowledge Hub modern hero refinement 2026-07-22 */
html body main#content.panith-hub-page > .panith-page-hero {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(64px, 6vw, 84px) 24px clamp(58px, 6vw, 78px) !important;
  border-bottom: 1px solid #E8E5DE !important;
  background: #FAFAF8 !important;
  overflow: hidden !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker {
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 18px !important;
  color: #FC6607 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-align: center !important;
  -webkit-text-fill-color: #FC6607 !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  display: block !important;
  border-radius: 3px !important;
  background: #F7D018 !important;
}

html body main#content.panith-hub-page > .panith-page-hero h1 {
  width: min(100%, 860px) !important;
  max-width: 860px !important;
  align-self: center !important;
  margin: 0 auto !important;
  color: #2C2D2D !important;
  font-size: clamp(46px, 4.7vw, 62px) !important;
  line-height: 1.06 !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page > .panith-page-hero > p {
  width: min(100%, 680px) !important;
  max-width: 680px !important;
  align-self: center !important;
  margin: 22px auto 0 !important;
  color: #55585A !important;
  font-size: 17px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
  text-align: center !important;
  -webkit-text-fill-color: #55585A !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
  width: min(100%, 680px) !important;
  max-width: 680px !important;
  min-height: 68px !important;
  align-self: center !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 30px auto 0 !important;
  padding: 6px !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  box-shadow: 0 12px 30px rgba(44, 45, 45, 0.08) !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form input[type="search"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 54px !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 7px !important;
  outline: 0 !important;
  background: transparent !important;
  color: #2C2D2D !important;
  font-size: 16px !important;
  box-shadow: none !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form input[type="search"]:focus {
  background: #FAFAF8 !important;
  box-shadow: inset 0 0 0 1px rgba(252, 102, 7, 0.38) !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn {
  width: auto !important;
  min-width: 132px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn:hover,
html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn:focus-visible {
  background: #D94F00 !important;
}

@media (max-width: 620px) {
  html body main#content.panith-hub-page > .panith-page-hero {
    padding: 46px 18px 50px !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero .section-kicker {
    margin-bottom: 14px !important;
    font-size: 12px !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero h1 {
    width: 100% !important;
    font-size: clamp(36px, 10vw, 44px) !important;
    line-height: 1.08 !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero > p {
    margin-top: 18px !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin-top: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form input[type="search"],
  html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn {
    width: 100% !important;
    min-height: 52px !important;
    border: 1px solid #E8E5DE !important;
    background: #FFFFFF !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn {
    border-color: #FC6607 !important;
    background: #FC6607 !important;
  }
}
/* High-specificity correction for legacy Knowledge Hub hero rules */
html body main#content.panith-hub-page > section.panith-page-hero.shell > span.section-kicker.panith-reveal {
  color: #FC6607 !important;
  -webkit-text-fill-color: #FC6607 !important;
}

html body main#content.panith-hub-page > section.panith-page-hero.shell > h1.panith-reveal {
  width: min(100%, 860px) !important;
  max-width: 860px !important;
  margin-top: 0 !important;
  margin-right: auto !important;
  margin-bottom: 0 !important;
  margin-left: auto !important;
  color: #2C2D2D !important;
  font-size: clamp(46px, 4.7vw, 62px) !important;
  line-height: 1.06 !important;
  text-align: center !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page > section.panith-page-hero.shell > p.panith-reveal {
  margin-right: auto !important;
  margin-left: auto !important;
  color: #55585A !important;
  -webkit-text-fill-color: #55585A !important;
}

@media (max-width: 620px) {
  html body main#content.panith-hub-page > section.panith-page-hero.shell > h1.panith-reveal {
    font-size: clamp(36px, 10vw, 44px) !important;
    line-height: 1.08 !important;
  }
}
/* End Codex Knowledge Hub modern hero refinement 2026-07-22 */

/* Codex About paragraph editing support 2026-07-22 */
html body.home .about-copy .about-copy-text {
  max-width: 610px !important;
  margin-top: 24px !important;
  color: #55585A !important;
}

html body.home .about-copy .about-copy-text p {
  max-width: none !important;
  margin: 0 !important;
  color: #55585A !important;
  font-size: clamp(17px, 1.2vw, 20px) !important;
  line-height: 1.68 !important;
  font-weight: 400 !important;
}

html body.home .about-copy .about-copy-text p + p {
  margin-top: 16px !important;
}

@media (max-width: 620px) {
  html body.home .about-copy .about-copy-text {
    max-width: 100% !important;
    margin-top: 20px !important;
  }

  html body.home .about-copy .about-copy-text p {
    font-size: 16px !important;
    line-height: 1.62 !important;
  }
}
/* End Codex About paragraph editing support 2026-07-22 */


/* Codex contact icon colour alignment 2026-07-22 */
html body.home #contact .contact-info-panel .contact-icon,
html body.home #contact .contact-info-panel .contact-icon svg,
html body.home #contact .contact-info-panel .contact-icon svg * {
  color: #FFFFFF !important;
  fill: none !important;
  stroke: #FFFFFF !important;
}

html body.home #contact .contact-info-panel .contact-icon {
  -webkit-text-fill-color: #FFFFFF !important;
}

html body.home #contact .contact-info-panel .contact-icon img {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
}
/* End Codex contact icon colour alignment 2026-07-22 */

/* Codex reading TOC numbering polish 2026-07-22 */
html body .panith-toc .panith-toc-list {
  list-style: none !important;
  counter-reset: none !important;
  padding-left: 0 !important;
  gap: 10px !important;
}

html body .panith-toc .panith-toc-list li {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  column-gap: 6px !important;
  margin: 0 !important;
  color: #55585A !important;
}

html body .panith-toc .panith-toc-list li::before {
  content: var(--toc-number) "." !important;
  color: #777A7C !important;
  font-weight: 700 !important;
  text-align: right !important;
  line-height: 1.42 !important;
}

html body .panith-toc .panith-toc-list li.is-subheading {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  margin-left: 8px !important;
  font-size: 0.92em !important;
}

html body .panith-toc .panith-toc-list li.is-subheading::before {
  content: var(--toc-number) !important;
}

html body .panith-toc .panith-toc-list a {
  color: #2C2D2D !important;
  line-height: 1.42 !important;
  overflow-wrap: anywhere !important;
}
/* End Codex reading TOC numbering polish 2026-07-22 */


/* [Panith CSS Section] 93 Knowledge article and related-content refinements */
/* Codex chapter navigation brand correction 2026-07-27 */
html body .panith-article-footer .panith-chapter-nav {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: clamp(14px, 2vw, 22px) !important;
  margin: clamp(36px, 5vw, 64px) 0 !important;
  padding: clamp(18px, 2.4vw, 26px) !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 18px !important;
  background:
    linear-gradient(135deg, rgba(252, 102, 7, 0.045), transparent 36%),
    #FFFFFF !important;
  box-shadow: 0 14px 34px rgba(44, 45, 45, 0.08) !important;
  overflow: hidden !important;
}

html body .panith-article-footer .panith-chapter-nav::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 6px !important;
  background: linear-gradient(90deg, #FC6607 0 54%, #F7D018 54% 100%) !important;
}

html body .panith-article-footer .panith-chapter-nav > div {
  min-width: 0 !important;
  display: flex !important;
}

html body .panith-article-footer .panith-chapter-nav > div:empty {
  display: block !important;
}

html body .panith-article-footer .panith-chapter-nav a {
  min-width: 0 !important;
  text-decoration: none !important;
}

html body .panith-article-footer .panith-chapter-nav > div > a {
  width: 100% !important;
  min-height: 86px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 18px 20px !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 14px !important;
  background: #FAFAF8 !important;
  color: #2C2D2D !important;
  box-shadow: none !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease !important;
}

html body .panith-article-footer .panith-chapter-nav > div:first-child > a {
  text-align: left !important;
}

html body .panith-article-footer .panith-chapter-nav > div:last-child > a {
  text-align: right !important;
}

html body .panith-article-footer .panith-chapter-nav > div > a:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(252, 102, 7, 0.36) !important;
  box-shadow: 0 12px 28px rgba(44, 45, 45, 0.08) !important;
  color: #2C2D2D !important;
}

html body .panith-article-footer .panith-chapter-nav > div > a span {
  display: block !important;
  color: #FC6607 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

html body .panith-article-footer .panith-chapter-nav .panith-chapter-back {
  min-height: 58px !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 0 clamp(22px, 2.4vw, 32px) !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  box-shadow: 0 14px 28px rgba(252, 102, 7, 0.22) !important;
  -webkit-text-fill-color: #FFFFFF !important;
  transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease !important;
}

html body .panith-article-footer .panith-chapter-nav .panith-chapter-back::before {
  content: "" !important;
  width: 18px !important;
  height: 18px !important;
  display: inline-block !important;
  border-left: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  transform: rotate(45deg) !important;
}

html body .panith-article-footer .panith-chapter-nav .panith-chapter-back:hover,
html body .panith-article-footer .panith-chapter-nav .panith-chapter-back:focus-visible {
  transform: translateY(-2px) !important;
  background: #D94F00 !important;
  color: #FFFFFF !important;
  box-shadow: 0 18px 34px rgba(252, 102, 7, 0.28) !important;
}

html body .panith-article-footer .panith-chapter-nav:has(> div:first-child:empty):has(> div:last-child:empty) {
  width: fit-content !important;
  max-width: min(100%, 560px) !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  margin-inline: auto !important;
  padding: 22px !important;
}

html body .panith-article-footer .panith-chapter-nav:has(> div:first-child:empty):has(> div:last-child:empty) > div {
  display: none !important;
}

html body .panith-article-footer .panith-chapter-nav:has(> div:first-child:empty):has(> div:last-child:empty) .panith-chapter-back {
  width: 100% !important;
}

@supports not selector(:has(*)) {
  html body .panith-article-footer .panith-chapter-nav > div:empty {
    visibility: hidden !important;
  }
}

@media (max-width: 760px) {
  html body .panith-article-footer .panith-chapter-nav {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 18px !important;
  }

  html body .panith-article-footer .panith-chapter-nav > div:empty {
    display: none !important;
  }

  html body .panith-article-footer .panith-chapter-nav > div > a,
  html body .panith-article-footer .panith-chapter-nav .panith-chapter-back {
    width: 100% !important;
    text-align: left !important;
    justify-content: center !important;
  }

  html body .panith-article-footer .panith-chapter-nav > div:last-child > a {
    text-align: left !important;
  }
}
/* End Codex chapter navigation brand correction 2026-07-27 */
/* Codex related-card reference orange-tile correction 2026-07-27 */
html body .panith-related-content {
  width: 100% !important;
  margin-top: clamp(34px, 4vw, 54px) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .panith-related-content > h2 {
  position: relative !important;
  display: block !important;
  margin: 0 0 clamp(20px, 2.5vw, 30px) !important;
  padding-left: 54px !important;
  color: #2C2D2D !important;
  font-size: clamp(30px, 3vw, 40px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  text-align: left !important;
}

html body .panith-related-content > h2::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.62em !important;
  width: 34px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: #FC6607 !important;
  box-shadow: 14px 0 0 #F7D018 !important;
}

html body .panith-related-content > .panith-card-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)) !important;
  gap: clamp(18px, 2vw, 26px) !important;
  align-items: stretch !important;
}

html body .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service,
html body .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service:nth-child(n),
html body.single-panith_knowledge .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service:nth-child(n),
html body:not(.home) .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service:nth-child(n) {
  width: min(100%, 420px) !important;
  max-width: 420px !important;
  min-height: 420px !important;
  height: auto !important;
  justify-self: start !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  box-shadow: 0 18px 44px rgba(44, 45, 45, 0.14) !important;
  overflow: hidden !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service::before,
html body .panith-related-content article.service-card.panith-dynamic-service::after {
  content: none !important;
  display: none !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 24px 56px rgba(44, 45, 45, 0.18) !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service .service-card-link {
  position: relative !important;
  z-index: 1 !important;
  min-height: 420px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  padding: 48px 38px 36px !important;
  color: #FFFFFF !important;
  text-align: left !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service .service-card-link::before {
  content: none !important;
  display: none !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service .service-custom-icon,
html body .panith-related-content article.service-card.panith-dynamic-service .icon {
  width: 58px !important;
  height: 58px !important;
  flex: 0 0 58px !important;
  margin: 0 0 54px !important;
  color: #FFFFFF !important;
  filter: brightness(0) invert(1) !important;
  object-fit: contain !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service h3,
html body .panith-related-content article.service-card.panith-dynamic-service:nth-child(n) h3 {
  display: block !important;
  max-width: 310px !important;
  margin: 0 !important;
  color: #FFFFFF !important;
  font-size: clamp(26px, 2.3vw, 30px) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  text-align: left !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service p,
html body .panith-related-content article.service-card.panith-dynamic-service li {
  display: block !important;
  max-width: 330px !important;
  margin: 18px 0 0 !important;
  color: #FFFFFF !important;
  font-size: 18px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  opacity: 0.98 !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service ul,
html body .panith-related-content article.service-card.panith-dynamic-service .service-card-counts {
  display: none !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service .service-card-action {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  margin-top: auto !important;
  padding-top: 28px !important;
  color: #FFFFFF !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

html body .panith-related-content article.service-card.panith-dynamic-service .service-card-action::after {
  content: "" !important;
  width: 48px !important;
  height: 18px !important;
  display: inline-block !important;
  flex: 0 0 48px !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 52 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 10h48M40 2l9 8-9 8' fill='none' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 760px) {
  html body .panith-related-content > h2 {
    padding-left: 46px !important;
    font-size: clamp(27px, 8vw, 34px) !important;
  }

  html body .panith-related-content > .panith-card-grid {
    grid-template-columns: 1fr !important;
  }

  html body .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service,
  html body .panith-related-content > .panith-card-grid > article.service-card.panith-dynamic-service:nth-child(n) {
    width: 100% !important;
    max-width: 420px !important;
    min-height: 390px !important;
  }

  html body .panith-related-content article.service-card.panith-dynamic-service .service-card-link {
    min-height: 390px !important;
    padding: 38px 30px 30px !important;
  }
}
/* End Codex related-card reference orange-tile correction 2026-07-27 */


/* [Panith CSS Section] 94 Service-card refinements */
/* Codex service-grid reference-card correction 2026-07-27 */
html body.home #services .service-grid,
html body main#content.panith-hub-page .panith-service-area-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(26px, 3vw, 52px) !important;
  align-items: stretch !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service {
  width: 100% !important;
  max-width: none !important;
  min-height: clamp(390px, 28vw, 430px) !important;
  height: auto !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 18px 44px rgba(44, 45, 45, 0.12) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-link,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
  min-height: clamp(390px, 28vw, 430px) !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: clamp(38px, 3vw, 48px) clamp(30px, 2.7vw, 40px) clamp(30px, 2.6vw, 38px) !important;
  text-align: left !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-custom-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .icon,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .icon {
  width: 58px !important;
  height: 58px !important;
  flex: 0 0 58px !important;
  margin: 0 0 clamp(48px, 4vw, 62px) !important;
  object-fit: contain !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service h3 {
  max-width: 100% !important;
  margin: 0 !important;
  font-size: clamp(24px, 1.8vw, 30px) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  text-align: left !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service p {
  display: block !important;
  max-width: 100% !important;
  margin: 16px 0 0 !important;
  font-size: clamp(16px, 1.15vw, 18px) !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  opacity: 0.88 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service ul,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-counts,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service ul,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-counts {
  display: none !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin-top: auto !important;
  padding-top: 30px !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  content: "" !important;
  width: 48px !important;
  height: 18px !important;
  display: inline-block !important;
  flex: 0 0 48px !important;
  background-color: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 52 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 10h48M40 2l9 8-9 8' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 52 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 10h48M40 2l9 8-9 8' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+1),
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) {
  background: #FC6607 !important;
  color: #FFFFFF !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) h3,
html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) p,
html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) h3,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) p,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+1) .service-card-action {
  color: #FFFFFF !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+2),
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+2) {
  background: #F7D018 !important;
  color: #2C2D2D !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+3),
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+3) {
  background: #FFFFFF !important;
  color: #2C2D2D !important;
  border: 1px solid #E8E5DE !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+4),
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) {
  background: #2C2D2D !important;
  color: #FFFFFF !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) h3,
html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) p,
html body.home #services .service-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) h3,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) p,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service:nth-child(4n+4) .service-card-action {
  color: #FFFFFF !important;
}

@media (max-width: 1180px) {
  html body.home #services .service-grid,
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid,
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service {
    min-height: 360px !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-link,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
    min-height: 360px !important;
    padding: 32px 28px 28px !important;
  }
}
/* End Codex service-grid reference-card correction 2026-07-27 */
/* Codex final CTA compact brand correction 2026-07-27 */
html body .panith-article-footer > .panith-final-cta,
html body.single-panith_service .panith-final-cta,
html body .panith-section .panith-final-cta {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(22px, 4vw, 56px) !important;
  margin-top: clamp(34px, 4vw, 58px) !important;
  padding: clamp(34px, 4vw, 52px) clamp(34px, 5vw, 64px) !important;
  border: 0 !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 92% 16%, rgba(247, 208, 24, 0.14), transparent 150px),
    linear-gradient(135deg, #2C2D2D 0%, #202124 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 18px 44px rgba(44, 45, 45, 0.16) !important;
  overflow: hidden !important;
}

html body .panith-article-footer > .panith-final-cta::before,
html body.single-panith_service .panith-final-cta::before,
html body .panith-section .panith-final-cta::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 8px !important;
  height: 100% !important;
  background: linear-gradient(180deg, #FC6607 0%, #F7D018 100%) !important;
}

html body .panith-article-footer > .panith-final-cta::after,
html body.single-panith_service .panith-final-cta::after,
html body .panith-section .panith-final-cta::after {
  content: "" !important;
  position: absolute !important;
  right: clamp(26px, 4vw, 54px) !important;
  top: -44px !important;
  width: 130px !important;
  height: 130px !important;
  border-radius: 50% !important;
  background: rgba(252, 102, 7, 0.12) !important;
  pointer-events: none !important;
}

html body .panith-article-footer > .panith-final-cta h2,
html body.single-panith_service .panith-final-cta h2,
html body .panith-section .panith-final-cta h2 {
  position: relative !important;
  display: block !important;
  visibility: visible !important;
  max-width: 850px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #FFFFFF !important;
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1.14 !important;
  font-weight: 700 !important;
  text-align: left !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

html body .panith-article-footer > .panith-final-cta h2:empty::before,
html body.single-panith_service .panith-final-cta h2:empty::before,
html body .panith-section .panith-final-cta h2:empty::before {
  content: "Ready to move from insight to implementation?" !important;
}

html body .panith-article-footer > .panith-final-cta p,
html body.single-panith_service .panith-final-cta p,
html body .panith-section .panith-final-cta p {
  position: relative !important;
  max-width: 680px !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 16px !important;
  line-height: 1.58 !important;
  font-weight: 400 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
}

html body .panith-article-footer > .panith-final-cta .btn,
html body.single-panith_service .panith-final-cta .btn,
html body .panith-section .panith-final-cta .btn {
  position: relative !important;
  z-index: 1 !important;
  width: auto !important;
  min-width: max-content !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 clamp(24px, 3vw, 34px) !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  box-shadow: 0 14px 30px rgba(252, 102, 7, 0.26) !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

html body .panith-article-footer > .panith-final-cta .btn:hover,
html body.single-panith_service .panith-final-cta .btn:hover,
html body .panith-section .panith-final-cta .btn:hover {
  transform: translateY(-2px) !important;
  background: #D94F00 !important;
  color: #FFFFFF !important;
}

html body .panith-article-footer > .panith-final-cta:not(:has(h2:not(:empty))) .btn,
html body.single-panith_service .panith-final-cta:not(:has(h2:not(:empty))) .btn,
html body .panith-section .panith-final-cta:not(:has(h2:not(:empty))) .btn {
  justify-self: end !important;
}

@media (max-width: 760px) {
  html body .panith-article-footer > .panith-final-cta,
  html body.single-panith_service .panith-final-cta,
  html body .panith-section .panith-final-cta {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    padding: 30px 26px 30px 36px !important;
  }

  html body .panith-article-footer > .panith-final-cta .btn,
  html body.single-panith_service .panith-final-cta .btn,
  html body .panith-section .panith-final-cta .btn {
    width: fit-content !important;
    min-width: 0 !important;
    white-space: normal !important;
  }
}
/* End Codex final CTA compact brand correction 2026-07-27 */


/* [Panith CSS Section] 95 Theme consistency refinements */
/* Codex theme heading consistency correction 2026-07-27 */
html body main#content.panith-hub-page,
html body main#content.panith-service-page,
html body main#content.panith-reading-page,
html body main#content.panith-case-studies-page {
  background: #FAFAF8 !important;
}

html body main#content.panith-hub-page > .panith-page-hero,
html body main#content.panith-service-page > .panith-page-hero,
html body .panith-reading-page .panith-article-header,
html body .panith-case-studies-page .panith-page-hero {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding: clamp(58px, 7vw, 92px) 0 clamp(42px, 5vw, 68px) !important;
  border-bottom: 1px solid #E8E5DE !important;
  background: transparent !important;
  text-align: left !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker,
html body main#content.panith-service-page > .panith-page-hero .section-kicker,
html body .panith-reading-page .panith-article-header .section-kicker,
html body .panith-case-studies-page .panith-page-hero .section-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #FC6607 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  -webkit-text-fill-color: #FC6607 !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker::before,
html body main#content.panith-service-page > .panith-page-hero .section-kicker::before,
html body .panith-reading-page .panith-article-header .section-kicker::before,
html body .panith-case-studies-page .panith-page-hero .section-kicker::before {
  content: "" !important;
  width: 36px !important;
  height: 4px !important;
  display: inline-block !important;
  flex: 0 0 36px !important;
  border-radius: 999px !important;
  background: #FC6607 !important;
  box-shadow: 14px 0 0 #F7D018 !important;
}

html body main#content.panith-hub-page > .panith-page-hero h1,
html body main#content.panith-service-page > .panith-page-hero h1,
html body .panith-reading-page .panith-article-header h1,
html body .panith-case-studies-page .panith-page-hero h1,
html body .archive-header h1,
html body .search-header h1,
html body .page-header h1 {
  width: auto !important;
  max-width: 880px !important;
  margin: 0 !important;
  color: #2C2D2D !important;
  font-family: "Archivo", sans-serif !important;
  font-size: clamp(40px, 4.5vw, 58px) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page > .panith-page-hero > p,
html body main#content.panith-service-page > .panith-page-hero > p,
html body .panith-reading-page .panith-article-header > p,
html body .panith-case-studies-page .panith-page-hero > p,
html body .archive-header p,
html body .search-header p,
html body .page-header p {
  max-width: 720px !important;
  margin: 20px 0 0 !important;
  color: #55585A !important;
  font-size: clamp(16px, 1.2vw, 18px) !important;
  line-height: 1.62 !important;
  font-weight: 400 !important;
  text-align: left !important;
  -webkit-text-fill-color: #55585A !important;
}

html body main#content.panith-hub-page .panith-section,
html body main#content.panith-service-page .panith-section,
html body .panith-reading-page .panith-article-footer,
html body .panith-case-studies-page .panith-section {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding-block: clamp(46px, 5.8vw, 78px) !important;
}

html body main#content.panith-hub-page .panith-section > h2,
html body main#content.panith-service-page .panith-section > h2,
html body .panith-reading-page .panith-article-footer > section > h2,
html body .panith-related-content > h2,
html body .panith-related-search-results h2,
html body .panith-case-studies-page .panith-section > h2 {
  position: relative !important;
  display: block !important;
  max-width: 760px !important;
  margin: 0 0 clamp(22px, 3vw, 36px) !important;
  padding-left: 54px !important;
  color: #2C2D2D !important;
  font-family: "Archivo", sans-serif !important;
  font-size: clamp(32px, 3.4vw, 46px) !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-wrap: balance !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page .panith-section > h2::before,
html body main#content.panith-service-page .panith-section > h2::before,
html body .panith-reading-page .panith-article-footer > section > h2::before,
html body .panith-related-content > h2::before,
html body .panith-related-search-results h2::before,
html body .panith-case-studies-page .panith-section > h2::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.62em !important;
  width: 34px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: #FC6607 !important;
  box-shadow: 14px 0 0 #F7D018 !important;
}

html body main#content.panith-hub-page .panith-section > h2[style],
html body main#content.panith-service-page .panith-section > h2[style],
html body .panith-reading-page .panith-article-footer > section > h2[style] {
  color: #2C2D2D !important;
}

html body main#content.panith-hub-page .panith-filter-row,
html body main#content.panith-hub-page .panith-filter-form {
  margin-top: 0 !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  margin: 32px 0 0 !important;
  align-self: start !important;
}

@media (max-width: 760px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-service-page > .panith-page-hero,
  html body .panith-reading-page .panith-article-header,
  html body .panith-case-studies-page .panith-page-hero,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-service-page .panith-section,
  html body .panith-reading-page .panith-article-footer,
  html body .panith-case-studies-page .panith-section {
    width: min(100% - 32px, 560px) !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero h1,
  html body main#content.panith-service-page > .panith-page-hero h1,
  html body .panith-reading-page .panith-article-header h1,
  html body .panith-case-studies-page .panith-page-hero h1 {
    font-size: clamp(34px, 10vw, 44px) !important;
    line-height: 1.08 !important;
  }

  html body main#content.panith-hub-page .panith-section > h2,
  html body main#content.panith-service-page .panith-section > h2,
  html body .panith-reading-page .panith-article-footer > section > h2,
  html body .panith-related-content > h2,
  html body .panith-related-search-results h2,
  html body .panith-case-studies-page .panith-section > h2 {
    padding-left: 46px !important;
    font-size: clamp(28px, 8vw, 36px) !important;
  }
}
/* End Codex theme heading consistency correction 2026-07-27 */
/* Codex knowledge hub viewport fit correction 2026-07-27 */
html body main#content.panith-hub-page {
  overflow-x: clip !important;
}

html body main#content.panith-hub-page > .panith-page-hero {
  width: min(1180px, calc(100% - 48px)) !important;
  min-height: 0 !important;
  margin-inline: auto !important;
  padding: clamp(38px, 5vw, 62px) 0 clamp(28px, 4vw, 44px) !important;
  border-bottom: 1px solid #E8E5DE !important;
}

html body main#content.panith-hub-page > .panith-page-hero h1 {
  max-width: 760px !important;
  font-size: clamp(36px, 4vw, 52px) !important;
  line-height: 1.08 !important;
}

html body main#content.panith-hub-page > .panith-page-hero > p {
  max-width: 640px !important;
  margin-top: 14px !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker {
  margin-bottom: 12px !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
  width: min(100%, 680px) !important;
  max-width: 680px !important;
  min-height: 56px !important;
  margin-top: 22px !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form input[type="search"] {
  min-height: 46px !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form .btn {
  min-height: 46px !important;
}

html body main#content.panith-hub-page .panith-section {
  width: min(1180px, calc(100% - 48px)) !important;
  padding-block: clamp(28px, 4vw, 48px) !important;
}

html body main#content.panith-hub-page .panith-section + .panith-section {
  border-top: 1px solid #E8E5DE !important;
}

html body main#content.panith-hub-page .panith-section > h2,
html body main#content.panith-hub-page .panith-related-search-results h2 {
  max-width: 680px !important;
  margin-bottom: clamp(16px, 2vw, 24px) !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  line-height: 1.1 !important;
}

html body main#content.panith-hub-page .panith-filter-row {
  margin-bottom: 20px !important;
  padding: 14px !important;
  gap: 12px !important;
}

html body main#content.panith-hub-page .panith-filter-form input,
html body main#content.panith-hub-page .panith-filter-form select {
  min-height: 44px !important;
}

html body main#content.panith-hub-page .panith-result-summary {
  margin-bottom: 16px !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 28px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service {
  min-height: clamp(300px, 22vw, 340px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
  min-height: clamp(300px, 22vw, 340px) !important;
  padding: clamp(26px, 2.3vw, 34px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .icon {
  width: 50px !important;
  height: 50px !important;
  flex-basis: 50px !important;
  margin-bottom: clamp(28px, 3vw, 42px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(21px, 1.6vw, 26px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service p {
  margin-top: 12px !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action {
  padding-top: 20px !important;
  font-size: 16px !important;
}

html body main#content.panith-hub-page .panith-card-grid {
  gap: clamp(16px, 2vw, 24px) !important;
}

html body main#content.panith-hub-page .knowledge-card,
html body main#content.panith-hub-page .panith-content-card,
html body main#content.panith-hub-page .case-study-card {
  min-height: 0 !important;
}

html body main#content.panith-hub-page .knowledge-card a,
html body main#content.panith-hub-page .panith-content-card a,
html body main#content.panith-hub-page .case-study-card a {
  padding: clamp(22px, 2.4vw, 30px) !important;
}

@media (min-width: 981px) and (max-height: 820px) {
  html body main#content.panith-hub-page > .panith-page-hero {
    padding-top: 30px !important;
    padding-bottom: 28px !important;
  }

  html body main#content.panith-hub-page .panith-section {
    padding-block: 30px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
    min-height: 290px !important;
  }
}

@media (max-width: 1180px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-hub-page .panith-section {
    width: min(100% - 28px, 560px) !important;
  }

  html body main#content.panith-hub-page > .panith-page-hero {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-link {
    min-height: 320px !important;
  }
}
/* End Codex knowledge hub viewport fit correction 2026-07-27 */
/* Codex knowledge hub full-width filter card polish 2026-07-27 */
html body main#content.panith-hub-page > .panith-page-hero,
html body main#content.panith-hub-page .panith-section,
html body main#content.panith-hub-page .panith-service-area-grid {
  width: min(100% - 48px, 1680px) !important;
  max-width: 1680px !important;
  margin-inline: auto !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(24px, 2.6vw, 48px) !important;
}

html body main#content.panith-hub-page .panith-section {
  padding-block: clamp(28px, 3.4vw, 46px) !important;
}

html body main#content.panith-hub-page .panith-section > h2,
html body main#content.panith-hub-page .panith-related-search-results h2 {
  margin-bottom: clamp(22px, 2.5vw, 34px) !important;
}

html body main#content.panith-hub-page .panith-filter-row {
  width: 100% !important;
  margin: 0 0 28px !important;
  padding: clamp(18px, 2vw, 24px) !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 14px 34px rgba(44, 45, 45, 0.08) !important;
}

html body main#content.panith-hub-page .panith-filter-form,
html body main#content.panith-hub-page .panith-filter-row .panith-filter-form {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) minmax(220px, 0.9fr) minmax(240px, 1fr) auto !important;
  align-items: end !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body main#content.panith-hub-page .panith-filter-form label {
  display: grid !important;
  gap: 9px !important;
  margin: 0 !important;
  color: #2C2D2D !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

html body main#content.panith-hub-page .panith-filter-form input,
html body main#content.panith-hub-page .panith-filter-form select {
  width: 100% !important;
  min-height: 54px !important;
  padding: 0 18px !important;
  border: 1px solid #DCD7CE !important;
  border-radius: 10px !important;
  background: #FAFAF8 !important;
  color: #2C2D2D !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

html body main#content.panith-hub-page .panith-filter-form input:focus,
html body main#content.panith-hub-page .panith-filter-form select:focus {
  border-color: #FC6607 !important;
  background: #FFFFFF !important;
  box-shadow: 0 0 0 4px rgba(252, 102, 7, 0.12) !important;
  outline: 0 !important;
}

html body main#content.panith-hub-page .panith-filter-actions,
html body main#content.panith-hub-page .panith-filter-form .panith-filter-actions {
  display: flex !important;
  align-items: end !important;
  gap: 10px !important;
  margin: 0 !important;
}

html body main#content.panith-hub-page .panith-filter-actions .btn,
html body main#content.panith-hub-page .panith-filter-form button,
html body main#content.panith-hub-page .panith-filter-form input[type="submit"] {
  min-width: 150px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 28px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 26px rgba(252, 102, 7, 0.22) !important;
  cursor: pointer !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

html body main#content.panith-hub-page .panith-filter-actions .btn:hover,
html body main#content.panith-hub-page .panith-filter-form button:hover,
html body main#content.panith-hub-page .panith-filter-form input[type="submit"]:hover {
  transform: translateY(-2px) !important;
  background: #D94F00 !important;
  color: #FFFFFF !important;
}

html body main#content.panith-hub-page .knowledge-card h3,
html body main#content.panith-hub-page .knowledge-card .panith-card-title,
html body main#content.panith-hub-page .panith-content-card h3,
html body main#content.panith-hub-page .panith-content-card .panith-card-title {
  color: #2C2D2D !important;
  font-size: clamp(22px, 1.9vw, 30px) !important;
  line-height: 1.14 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  text-wrap: balance !important;
}

html body main#content.panith-hub-page .knowledge-card:first-child h3,
html body main#content.panith-hub-page .knowledge-card:first-child .panith-card-title {
  font-size: clamp(24px, 2.2vw, 34px) !important;
  line-height: 1.14 !important;
}

html body main#content.panith-hub-page .knowledge-card p,
html body main#content.panith-hub-page .panith-content-card p {
  font-size: 15px !important;
  line-height: 1.55 !important;
}

html body main#content.panith-hub-page .knowledge-card a,
html body main#content.panith-hub-page .panith-content-card a {
  padding: clamp(22px, 2.2vw, 30px) !important;
}

@media (min-width: 1681px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-hub-page .panith-service-area-grid {
    width: min(100% - 64px, 1760px) !important;
    max-width: 1760px !important;
  }
}

@media (max-width: 1180px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-hub-page .panith-service-area-grid {
    width: min(100% - 36px, 980px) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body main#content.panith-hub-page .panith-filter-form,
  html body main#content.panith-hub-page .panith-filter-row .panith-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body main#content.panith-hub-page .panith-filter-actions,
  html body main#content.panith-hub-page .panith-filter-actions .btn {
    width: 100% !important;
  }
}

@media (max-width: 700px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-hub-page .panith-service-area-grid {
    width: min(100% - 24px, 560px) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid,
  html body main#content.panith-hub-page .panith-filter-form,
  html body main#content.panith-hub-page .panith-filter-row .panith-filter-form {
    grid-template-columns: 1fr !important;
  }

  html body main#content.panith-hub-page .panith-filter-actions .btn,
  html body main#content.panith-hub-page .panith-filter-form button,
  html body main#content.panith-hub-page .panith-filter-form input[type="submit"] {
    width: 100% !important;
  }

  html body main#content.panith-hub-page .knowledge-card h3,
  html body main#content.panith-hub-page .knowledge-card:first-child h3,
  html body main#content.panith-hub-page .panith-content-card h3 {
    font-size: clamp(22px, 7vw, 28px) !important;
  }
}
/* End Codex knowledge hub full-width filter card polish 2026-07-27 */
/* Codex knowledge hub system consistency 2026-07-27 */
html body main#content.panith-hub-page,
html body main#content.panith-service-page,
html body main#content.panith-reading-page,
html body main#content.panith-case-studies-page,
html body.single-panith_knowledge,
html body.single-panith_service,
html body.post-type-archive-panith_case_study {
  background: #FAFAF8 !important;
  color: #55585A !important;
  overflow-x: clip !important;
}

html body main#content.panith-hub-page > .panith-page-hero,
html body main#content.panith-service-page > .panith-page-hero,
html body main#content.panith-case-studies-page > .panith-page-hero,
html body main#content.panith-reading-page .panith-reading-layout,
html body main#content.panith-reading-page .panith-article-header,
html body main#content.panith-reading-page .panith-article-footer,
html body main#content.panith-hub-page .panith-section,
html body main#content.panith-service-page .panith-section,
html body main#content.panith-case-studies-page .panith-section {
  width: min(100% - 48px, 1680px) !important;
  max-width: 1680px !important;
  margin-inline: auto !important;
}

html body main#content.panith-hub-page > .panith-page-hero,
html body main#content.panith-service-page > .panith-page-hero,
html body main#content.panith-case-studies-page > .panith-page-hero,
html body main#content.panith-reading-page .panith-article-header {
  min-height: 0 !important;
  padding: clamp(38px, 5vw, 66px) 0 clamp(28px, 4vw, 48px) !important;
  border-bottom: 1px solid #E8E5DE !important;
  background: transparent !important;
  text-align: left !important;
}

html body main#content.panith-hub-page .section-kicker,
html body main#content.panith-service-page .section-kicker,
html body main#content.panith-reading-page .section-kicker,
html body main#content.panith-case-studies-page .section-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #FC6607 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  -webkit-text-fill-color: #FC6607 !important;
}

html body main#content.panith-hub-page .section-kicker::before,
html body main#content.panith-service-page .section-kicker::before,
html body main#content.panith-reading-page .section-kicker::before,
html body main#content.panith-case-studies-page .section-kicker::before {
  content: "" !important;
  width: 36px !important;
  height: 4px !important;
  flex: 0 0 36px !important;
  border-radius: 999px !important;
  background: #FC6607 !important;
  box-shadow: 14px 0 0 #F7D018 !important;
}

html body main#content.panith-hub-page h1,
html body main#content.panith-service-page h1,
html body main#content.panith-reading-page .panith-article-header h1,
html body main#content.panith-case-studies-page h1 {
  max-width: 860px !important;
  margin: 0 !important;
  color: #2C2D2D !important;
  font-family: "Archivo", sans-serif !important;
  font-size: clamp(36px, 4vw, 54px) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page .panith-page-hero > p,
html body main#content.panith-service-page .panith-page-hero > p,
html body main#content.panith-reading-page .panith-article-header > p,
html body main#content.panith-case-studies-page .panith-page-hero > p {
  max-width: 720px !important;
  margin: 16px 0 0 !important;
  color: #55585A !important;
  font-size: 16px !important;
  line-height: 1.58 !important;
  font-weight: 400 !important;
  text-align: left !important;
  -webkit-text-fill-color: #55585A !important;
}

html body main#content.panith-hub-page .panith-section,
html body main#content.panith-service-page .panith-section,
html body main#content.panith-case-studies-page .panith-section,
html body main#content.panith-reading-page .panith-article-footer {
  padding-block: clamp(30px, 4vw, 54px) !important;
}

html body main#content.panith-hub-page .panith-section + .panith-section,
html body main#content.panith-service-page .panith-section + .panith-section,
html body main#content.panith-case-studies-page .panith-section + .panith-section {
  border-top: 1px solid #E8E5DE !important;
}

html body main#content.panith-hub-page .panith-section > h2,
html body main#content.panith-service-page .panith-section > h2,
html body main#content.panith-case-studies-page .panith-section > h2,
html body main#content.panith-reading-page .panith-article-footer > section > h2,
html body .panith-related-content > h2,
html body .panith-related-search-results h2 {
  position: relative !important;
  display: block !important;
  max-width: 760px !important;
  margin: 0 0 clamp(20px, 2.5vw, 34px) !important;
  padding-left: 54px !important;
  color: #2C2D2D !important;
  font-family: "Archivo", sans-serif !important;
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  text-align: left !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
  -webkit-text-fill-color: #2C2D2D !important;
}

html body main#content.panith-hub-page .panith-section > h2::before,
html body main#content.panith-service-page .panith-section > h2::before,
html body main#content.panith-case-studies-page .panith-section > h2::before,
html body main#content.panith-reading-page .panith-article-footer > section > h2::before,
html body .panith-related-content > h2::before,
html body .panith-related-search-results h2::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.62em !important;
  width: 34px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: #FC6607 !important;
  box-shadow: 14px 0 0 #F7D018 !important;
}

html body main#content.panith-hub-page .panith-filter-row,
html body main#content.panith-service-page .panith-filter-row,
html body main#content.panith-case-studies-page .panith-filter-row {
  width: 100% !important;
  margin: 0 0 28px !important;
  padding: clamp(18px, 2vw, 24px) !important;
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 14px 34px rgba(44, 45, 45, 0.08) !important;
}

html body main#content.panith-hub-page .panith-filter-form,
html body main#content.panith-service-page .panith-filter-form,
html body main#content.panith-case-studies-page .panith-filter-form {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) minmax(220px, 0.9fr) minmax(240px, 1fr) auto !important;
  align-items: end !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body main#content.panith-hub-page .panith-filter-form label,
html body main#content.panith-service-page .panith-filter-form label,
html body main#content.panith-case-studies-page .panith-filter-form label {
  display: grid !important;
  gap: 9px !important;
  margin: 0 !important;
  color: #2C2D2D !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

html body main#content.panith-hub-page .panith-filter-form input,
html body main#content.panith-hub-page .panith-filter-form select,
html body main#content.panith-service-page .panith-filter-form input,
html body main#content.panith-service-page .panith-filter-form select,
html body main#content.panith-case-studies-page .panith-filter-form input,
html body main#content.panith-case-studies-page .panith-filter-form select {
  width: 100% !important;
  min-height: 54px !important;
  padding: 0 18px !important;
  border: 1px solid #DCD7CE !important;
  border-radius: 10px !important;
  background: #FAFAF8 !important;
  color: #2C2D2D !important;
  font-size: 16px !important;
  font-weight: 400 !important;
}

html body main#content.panith-hub-page .panith-filter-actions .btn,
html body main#content.panith-hub-page .panith-filter-form button,
html body main#content.panith-service-page .panith-filter-actions .btn,
html body main#content.panith-service-page .panith-filter-form button,
html body main#content.panith-case-studies-page .panith-filter-actions .btn,
html body main#content.panith-case-studies-page .panith-filter-form button {
  min-width: 150px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 28px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #FC6607 !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 26px rgba(252, 102, 7, 0.22) !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

html body main#content.panith-hub-page .panith-card-grid,
html body main#content.panith-service-page .panith-card-grid,
html body main#content.panith-case-studies-page .panith-card-grid,
html body main#content.panith-reading-page .panith-card-grid {
  display: grid !important;
  gap: clamp(18px, 2vw, 28px) !important;
}

html body main#content.panith-hub-page .knowledge-card,
html body main#content.panith-hub-page .panith-content-card,
html body main#content.panith-service-page .knowledge-card,
html body main#content.panith-service-page .panith-content-card,
html body main#content.panith-reading-page .knowledge-card,
html body main#content.panith-reading-page .panith-content-card,
html body main#content.panith-case-studies-page .case-study-card {
  border: 1px solid #E8E5DE !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 12px 30px rgba(44, 45, 45, 0.08) !important;
  overflow: hidden !important;
}

html body main#content.panith-hub-page .knowledge-card a,
html body main#content.panith-hub-page .panith-content-card a,
html body main#content.panith-service-page .knowledge-card a,
html body main#content.panith-service-page .panith-content-card a,
html body main#content.panith-reading-page .knowledge-card a,
html body main#content.panith-reading-page .panith-content-card a,
html body main#content.panith-case-studies-page .case-study-card a {
  padding: clamp(22px, 2.2vw, 30px) !important;
}

html body main#content.panith-hub-page .knowledge-card h3,
html body main#content.panith-hub-page .panith-content-card h3,
html body main#content.panith-service-page .knowledge-card h3,
html body main#content.panith-service-page .panith-content-card h3,
html body main#content.panith-reading-page .knowledge-card h3,
html body main#content.panith-reading-page .panith-content-card h3,
html body main#content.panith-case-studies-page .case-study-card h3 {
  color: #2C2D2D !important;
  font-size: clamp(22px, 1.9vw, 30px) !important;
  line-height: 1.14 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

html body main#content.panith-hub-page .knowledge-card p,
html body main#content.panith-hub-page .panith-content-card p,
html body main#content.panith-service-page .knowledge-card p,
html body main#content.panith-service-page .panith-content-card p,
html body main#content.panith-reading-page .knowledge-card p,
html body main#content.panith-reading-page .panith-content-card p,
html body main#content.panith-case-studies-page .case-study-card p {
  color: #55585A !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
}

html body main#content.panith-reading-page .panith-article-body {
  width: min(100% - 48px, 1680px) !important;
  max-width: 1680px !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) !important;
  gap: clamp(28px, 4vw, 56px) !important;
}

html body main#content.panith-reading-page .panith-rich-text {
  max-width: 920px !important;
}

html body main#content.panith-reading-page .panith-rich-text h2 {
  font-size: clamp(28px, 2.5vw, 38px) !important;
}

html body main#content.panith-reading-page .panith-rich-text h3 {
  font-size: clamp(22px, 2vw, 30px) !important;
}

html body main#content.panith-service-page .panith-final-cta,
html body main#content.panith-reading-page .panith-final-cta,
html body main#content.panith-case-studies-page .panith-final-cta {
  width: 100% !important;
}

@media (min-width: 1681px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-service-page > .panith-page-hero,
  html body main#content.panith-case-studies-page > .panith-page-hero,
  html body main#content.panith-reading-page .panith-reading-layout,
  html body main#content.panith-reading-page .panith-article-header,
  html body main#content.panith-reading-page .panith-article-footer,
  html body main#content.panith-reading-page .panith-article-body,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-service-page .panith-section,
  html body main#content.panith-case-studies-page .panith-section {
    width: min(100% - 64px, 1760px) !important;
    max-width: 1760px !important;
  }
}

@media (max-width: 1180px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-service-page > .panith-page-hero,
  html body main#content.panith-case-studies-page > .panith-page-hero,
  html body main#content.panith-reading-page .panith-reading-layout,
  html body main#content.panith-reading-page .panith-article-header,
  html body main#content.panith-reading-page .panith-article-footer,
  html body main#content.panith-reading-page .panith-article-body,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-service-page .panith-section,
  html body main#content.panith-case-studies-page .panith-section {
    width: min(100% - 36px, 980px) !important;
  }

  html body main#content.panith-hub-page .panith-filter-form,
  html body main#content.panith-service-page .panith-filter-form,
  html body main#content.panith-case-studies-page .panith-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body main#content.panith-reading-page .panith-article-body {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 700px) {
  html body main#content.panith-hub-page > .panith-page-hero,
  html body main#content.panith-service-page > .panith-page-hero,
  html body main#content.panith-case-studies-page > .panith-page-hero,
  html body main#content.panith-reading-page .panith-reading-layout,
  html body main#content.panith-reading-page .panith-article-header,
  html body main#content.panith-reading-page .panith-article-footer,
  html body main#content.panith-reading-page .panith-article-body,
  html body main#content.panith-hub-page .panith-section,
  html body main#content.panith-service-page .panith-section,
  html body main#content.panith-case-studies-page .panith-section {
    width: min(100% - 24px, 560px) !important;
  }

  html body main#content.panith-hub-page h1,
  html body main#content.panith-service-page h1,
  html body main#content.panith-reading-page .panith-article-header h1,
  html body main#content.panith-case-studies-page h1 {
    font-size: clamp(34px, 10vw, 44px) !important;
  }

  html body main#content.panith-hub-page .panith-filter-form,
  html body main#content.panith-service-page .panith-filter-form,
  html body main#content.panith-case-studies-page .panith-filter-form {
    grid-template-columns: 1fr !important;
  }
}
/* End Codex knowledge hub system consistency 2026-07-27 */
/* Codex knowledge hub hero center correction 2026-07-27 */
html body main#content.panith-hub-page > .panith-page-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

html body main#content.panith-hub-page > .panith-page-hero .section-kicker {
  align-self: center !important;
  justify-content: center !important;
}

html body main#content.panith-hub-page > .panith-page-hero h1,
html body main#content.panith-hub-page > .panith-page-hero > p {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

html body main#content.panith-hub-page > .panith-page-hero .panith-filter-form {
  width: min(100%, 860px) !important;
  max-width: 860px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-self: center !important;
}
/* End Codex knowledge hub hero center correction 2026-07-27 */
/* Codex clear filters button correction 2026-07-27 */
html body main#content.panith-hub-page .panith-reset-link,
html body main#content.panith-service-page .panith-reset-link,
html body main#content.panith-case-studies-page .panith-reset-link,
html body main#content.panith-hub-page .panith-filter-actions a:not(.btn),
html body main#content.panith-service-page .panith-filter-actions a:not(.btn),
html body main#content.panith-case-studies-page .panith-filter-actions a:not(.btn) {
  min-height: 54px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border: 1px solid #DCD7CE !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  color: #2C2D2D !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(44, 45, 45, 0.07) !important;
  -webkit-text-fill-color: #2C2D2D !important;
  transition: transform 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease !important;
}

html body main#content.panith-hub-page .panith-reset-link:hover,
html body main#content.panith-service-page .panith-reset-link:hover,
html body main#content.panith-case-studies-page .panith-reset-link:hover,
html body main#content.panith-hub-page .panith-filter-actions a:not(.btn):hover,
html body main#content.panith-service-page .panith-filter-actions a:not(.btn):hover,
html body main#content.panith-case-studies-page .panith-filter-actions a:not(.btn):hover {
  transform: translateY(-2px) !important;
  border-color: rgba(252, 102, 7, 0.42) !important;
  color: #D94F00 !important;
  box-shadow: 0 12px 24px rgba(44, 45, 45, 0.1) !important;
  -webkit-text-fill-color: #D94F00 !important;
}

html body main#content.panith-hub-page .panith-reset-link::before,
html body main#content.panith-service-page .panith-reset-link::before,
html body main#content.panith-case-studies-page .panith-reset-link::before {
  content: "×" !important;
  font-size: 20px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
}

@media (max-width: 1180px) {
  html body main#content.panith-hub-page .panith-reset-link,
  html body main#content.panith-service-page .panith-reset-link,
  html body main#content.panith-case-studies-page .panith-reset-link {
    width: 100% !important;
  }
}
/* End Codex clear filters button correction 2026-07-27 */
/* Codex service-card page-specific sizing correction 2026-07-27 */
html body.home #services .service-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(28px, 3vw, 56px) !important;
  align-items: stretch !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service {
  min-height: clamp(440px, 31vw, 540px) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  min-height: clamp(440px, 31vw, 540px) !important;
  padding: clamp(44px, 4vw, 58px) clamp(34px, 3vw, 48px) clamp(34px, 3vw, 44px) !important;
  display: flex !important;
  flex-direction: column !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(58px, 4.2vw, 72px) !important;
  height: clamp(58px, 4.2vw, 72px) !important;
  margin: 0 0 clamp(58px, 5vw, 78px) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(30px, 2.35vw, 38px) !important;
  line-height: 1.08 !important;
  margin: 0 0 22px !important;
  max-width: 10.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  font-size: clamp(18px, 1.28vw, 21px) !important;
  line-height: 1.36 !important;
  margin: 0 !important;
  max-width: 14em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  margin-top: auto !important;
  padding-top: 34px !important;
  font-size: clamp(18px, 1.2vw, 21px) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(44px, 3.5vw, 58px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid,
html body main#content.panith-hub-page .service-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(20px, 2.2vw, 34px) !important;
  align-items: stretch !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service {
  min-height: clamp(255px, 18vw, 310px) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service > .service-card-link,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  min-height: clamp(255px, 18vw, 310px) !important;
  padding: clamp(24px, 2vw, 32px) !important;
  display: flex !important;
  flex-direction: column !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-icon,
html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .panith-service-icon,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(42px, 3.2vw, 54px) !important;
  height: clamp(42px, 3.2vw, 54px) !important;
  margin: 0 0 clamp(26px, 2.6vw, 34px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service h3,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(20px, 1.45vw, 24px) !important;
  line-height: 1.12 !important;
  margin: 0 0 12px !important;
  max-width: 11em !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service p,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service p {
  font-size: clamp(14px, 1vw, 16px) !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  max-width: 18em !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  margin-top: auto !important;
  padding-top: 18px !important;
  font-size: clamp(14px, 1vw, 16px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service .service-card-action::after,
html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(32px, 2.4vw, 42px) !important;
}

@media (max-width: 1180px) {
  html body.home #services .service-grid,
  html body main#content.panith-hub-page .panith-service-area-grid,
  html body main#content.panith-hub-page .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid,
  html body main#content.panith-hub-page .panith-service-area-grid,
  html body main#content.panith-hub-page .service-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service,
  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    min-height: 390px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service,
  html body main#content.panith-hub-page .panith-service-area-grid > article.service-card.panith-dynamic-service > .service-card-link,
  html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service,
  html body main#content.panith-hub-page .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    min-height: 285px !important;
  }
}
/* End Codex service-card page-specific sizing correction 2026-07-27 */
/* Codex home service card visual balance correction 2026-07-27 */
html body.home #services .service-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(26px, 2.8vw, 52px) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service {
  min-height: clamp(390px, 29vw, 470px) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 48px rgba(35, 35, 35, 0.12) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  min-height: clamp(390px, 29vw, 470px) !important;
  padding: clamp(34px, 3vw, 44px) clamp(28px, 2.7vw, 40px) clamp(26px, 2.5vw, 36px) !important;
  justify-content: flex-start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(48px, 3.5vw, 62px) !important;
  height: clamp(48px, 3.5vw, 62px) !important;
  margin: 0 0 clamp(54px, 4.4vw, 68px) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(24px, 1.72vw, 31px) !important;
  line-height: 1.1 !important;
  margin: 0 0 18px !important;
  max-width: 12.5em !important;
  letter-spacing: 0 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  font-size: clamp(16px, 1.08vw, 19px) !important;
  line-height: 1.38 !important;
  max-width: 17em !important;
  margin: 0 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  margin-top: auto !important;
  padding-top: 24px !important;
  font-size: clamp(16px, 1.05vw, 18px) !important;
  line-height: 1.1 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(38px, 3vw, 52px) !important;
}

@media (min-width: 1181px) and (max-width: 1500px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
    font-size: clamp(23px, 1.55vw, 28px) !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
    font-size: clamp(15px, 1vw, 17px) !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service,
  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    min-height: 340px !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
  html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
    margin-bottom: 42px !important;
  }
}
/* End Codex home service card visual balance correction 2026-07-27 */
/* Codex service card final rhythm correction 2026-07-27 */
html body.home #services .service-grid {
  gap: clamp(24px, 2.6vw, 44px) !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service,
html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  min-height: clamp(405px, 26vw, 445px) !important;
  aspect-ratio: 1 / 1 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  padding: clamp(34px, 2.7vw, 42px) clamp(28px, 2.4vw, 38px) clamp(28px, 2.3vw, 34px) !important;
  display: grid !important;
  grid-template-rows: clamp(56px, 4vw, 68px) minmax(140px, auto) 1fr auto !important;
  align-items: start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(50px, 3.4vw, 60px) !important;
  height: clamp(50px, 3.4vw, 60px) !important;
  margin: 0 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  align-self: end !important;
  font-size: clamp(23px, 1.5vw, 28px) !important;
  line-height: 1.12 !important;
  margin: 0 0 14px !important;
  max-width: 14em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  align-self: start !important;
  font-size: clamp(15px, 1vw, 17px) !important;
  line-height: 1.42 !important;
  max-width: 19em !important;
  margin: 0 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  align-self: end !important;
  margin-top: 0 !important;
  padding-top: 16px !important;
  font-size: clamp(15px, 1vw, 17px) !important;
  width: 100% !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(34px, 2.8vw, 48px) !important;
}

@media (max-width: 1180px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service,
  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    min-height: 360px !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service,
  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    min-height: 320px !important;
    aspect-ratio: auto !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    grid-template-rows: 54px auto 1fr auto !important;
  }
}
/* End Codex service card final rhythm correction 2026-07-27 */
/* Codex home service true square correction 2026-07-27 */
html body.home #services .service-grid {
  gap: clamp(22px, 2.4vw, 42px) !important;
  align-items: start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 18px !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  padding: clamp(28px, 2.35vw, 38px) clamp(24px, 2.1vw, 34px) clamp(24px, 2vw, 32px) !important;
  display: grid !important;
  grid-template-rows: clamp(46px, 3.2vw, 58px) 1fr auto !important;
  row-gap: clamp(18px, 1.6vw, 26px) !important;
  align-items: start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(44px, 3vw, 54px) !important;
  height: clamp(44px, 3vw, 54px) !important;
  margin: 0 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-content,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-content {
  align-self: center !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(21px, 1.34vw, 25px) !important;
  line-height: 1.1 !important;
  margin: 0 0 clamp(12px, 1vw, 16px) !important;
  max-width: 13.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  font-size: clamp(14px, 0.92vw, 16px) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  max-width: 18.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  align-self: end !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: clamp(14px, 0.95vw, 16px) !important;
  line-height: 1.1 !important;
  width: 100% !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(30px, 2.4vw, 42px) !important;
}

@media (max-width: 1180px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    aspect-ratio: 1 / 1 !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    aspect-ratio: 1 / 1 !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    padding: 28px !important;
    row-gap: 18px !important;
  }
}
/* End Codex home service true square correction 2026-07-27 */
/* Codex home service smaller left square correction 2026-07-27 */
html body.home #services .service-grid {
  max-width: 1680px !important;
  margin-inline: auto !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(20px, 2.2vw, 36px) !important;
  align-items: start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service {
  width: 100% !important;
  max-width: 360px !important;
  justify-self: center !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 18px !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  min-height: 0 !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  padding: clamp(26px, 2.1vw, 34px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  width: clamp(42px, 2.8vw, 52px) !important;
  height: clamp(42px, 2.8vw, 52px) !important;
  margin: 0 0 clamp(52px, 4vw, 66px) !important;
  align-self: flex-start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-content,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-content {
  align-self: stretch !important;
  text-align: left !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  align-self: flex-start !important;
  text-align: left !important;
  font-size: clamp(20px, 1.22vw, 24px) !important;
  line-height: 1.12 !important;
  margin: 0 0 12px !important;
  max-width: 12.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  text-align: left !important;
  font-size: clamp(13px, 0.86vw, 15px) !important;
  line-height: 1.42 !important;
  margin: 0 !important;
  max-width: 18em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  margin-top: auto !important;
  padding-top: 18px !important;
  align-self: stretch !important;
  text-align: left !important;
  font-size: clamp(13px, 0.9vw, 15px) !important;
  line-height: 1.1 !important;
  width: 100% !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  width: clamp(28px, 2.2vw, 40px) !important;
}

@media (min-width: 1500px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    max-width: 380px !important;
  }
}

@media (max-width: 1180px) {
  html body.home #services .service-grid {
    grid-template-columns: repeat(2, minmax(0, 360px)) !important;
    justify-content: center !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid {
    grid-template-columns: minmax(0, 340px) !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    max-width: 340px !important;
  }
}
/* End Codex home service smaller left square correction 2026-07-27 */
/* Codex home service alignment grid correction 2026-07-27 */
html body.home #services .service-grid > article.service-card.panith-dynamic-service {
  max-width: 350px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 18px !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  padding: clamp(26px, 2vw, 32px) !important;
  display: grid !important;
  grid-template-rows: 54px 76px 98px 1fr 24px !important;
  grid-template-columns: 1fr !important;
  row-gap: 0 !important;
  align-items: start !important;
  justify-items: start !important;
  text-align: left !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-icon,
html body.home #services .service-grid > article.service-card.panith-dynamic-service .panith-service-icon {
  grid-row: 1 !important;
  width: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  align-self: start !important;
  justify-self: start !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  grid-row: 2 !important;
  align-self: end !important;
  justify-self: start !important;
  text-align: left !important;
  font-size: clamp(19px, 1.12vw, 22px) !important;
  line-height: 1.12 !important;
  margin: 0 0 14px !important;
  max-width: 13.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  grid-row: 3 !important;
  align-self: start !important;
  justify-self: start !important;
  text-align: left !important;
  font-size: clamp(13px, 0.82vw, 14px) !important;
  line-height: 1.42 !important;
  margin: 0 !important;
  max-width: 19em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  grid-row: 5 !important;
  align-self: end !important;
  justify-self: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  text-align: left !important;
  font-size: clamp(13px, 0.86vw, 15px) !important;
  line-height: 1 !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action::after {
  flex: 0 0 clamp(30px, 2.1vw, 38px) !important;
  width: clamp(30px, 2.1vw, 38px) !important;
  margin-left: auto !important;
}

@media (min-width: 1500px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    max-width: 360px !important;
  }
}

@media (max-width: 1180px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    max-width: 340px !important;
  }
}

@media (max-width: 700px) {
  html body.home #services .service-grid > article.service-card.panith-dynamic-service {
    max-width: 330px !important;
  }

  html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
    grid-template-rows: 52px 74px 100px 1fr 24px !important;
    padding: 26px !important;
  }
}
/* End Codex home service alignment grid correction 2026-07-27 */


/* [Panith CSS Section] 96 Migrated legacy Additional CSS */
/* Codex migrated Additional CSS to theme file 2026-07-27 */
/* Panith Knowledge Hub clean final layout */
body .panith-hub-page {
  background: #f7f5f0 !important;
  color: #202124 !important;
  padding-top: 0 !important;
}

body .panith-hub-page::before,
body .panith-hub-page .panith-page-hero::after,
body .panith-hub-page .knowledge-card:first-child a::before {
  display: none !important;
  content: none !important;
}

body .panith-hub-page .panith-page-hero {
  width: min(1180px, calc(100% - 56px)) !important;
  min-height: auto !important;
  display: block !important;
  padding: clamp(54px, 8vw, 92px) 0 clamp(36px, 6vw, 62px) !important;
  color: #202124 !important;
  text-align: center !important;
}

body .panith-hub-page .section-kicker {
  display: block !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #ff4b13 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow: none !important;
}

body .panith-hub-page .section-kicker::before {
  display: none !important;
}

body .panith-hub-page .panith-page-hero h1 {
  max-width: 980px !important;
  margin: 14px auto 0 !important;
  color: #202124 !important;
  font-size: clamp(44px, 5.4vw, 86px) !important;
  line-height: .98 !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

body .panith-hub-page .panith-page-hero p {
  max-width: 860px !important;
  margin: 22px auto 0 !important;
  color: #53565a !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  line-height: 1.6 !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

body .panith-hub-page .panith-page-hero .panith-filter-form {
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin: 34px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 14px !important;
}

body .panith-hub-page .panith-page-hero input[type="search"] {
  width: 100% !important;
  min-height: 64px !important;
  padding: 0 26px !important;
  border: 2px solid rgba(32, 33, 36, .22) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  font-size: 18px !important;
  box-shadow: none !important;
}

body .panith-hub-page .btn-orange {
  min-width: 168px !important;
  min-height: 64px !important;
  border-radius: 8px !important;
  background: #ff4b13 !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(255, 75, 19, .18) !important;
}

body .panith-hub-page > .panith-section:first-of-type {
  width: min(1180px, calc(100% - 56px)) !important;
  padding: clamp(32px, 5vw, 56px) 0 !important;
  border-bottom: 0 !important;
}

body .panith-hub-page > .panith-section:first-of-type > h2,
body .panith-hub-page > .panith-section:nth-of-type(2) > h2,
body .panith-hub-page .panith-related-search-results h2 {
  display: block !important;
  max-width: 820px !important;
  margin: 0 0 28px !important;
  color: #202124 !important;
  font-size: clamp(38px, 4.5vw, 76px) !important;
  line-height: 1.02 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

body .panith-hub-page .panith-service-area-grid,
body .service-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(22px, 3vw, 42px) !important;
}

body .panith-hub-page .panith-service-area-grid .service-card {
  min-height: clamp(300px, 20vw, 375px) !important;
  padding: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 54px rgba(20, 21, 22, .1) !important;
  overflow: hidden !important;
}

body .panith-hub-page .panith-service-area-grid .service-card-link {
  min-height: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  padding: clamp(42px, 4vw, 58px) clamp(28px, 3vw, 42px) clamp(30px, 3vw, 44px) !important;
  text-align: left !important;
}

body .service-card,
body .service-card h3,
body .service-card p,
body .service-card li,
body .service-card span,
body .service-card strong,
body .service-card a,
body .service-card .icon,
body .service-card .service-card-action,
body .service-card .service-open,
body .service-card-link,
body .service-card-link h3,
body .service-card-link p,
body .service-card-link li,
body .service-card-link span,
body .service-card-link strong {
  color: #ffffff !important;
}

body .service-card .service-custom-icon {
  filter: brightness(0) invert(1) !important;
}

body .service-card.clean,
body .service-card.clean h3,
body .service-card.clean p,
body .service-card.clean li,
body .service-card.clean span,
body .service-card.clean strong,
body .service-card.clean a,
body .service-card.clean .icon,
body .service-card.clean .service-card-action,
body .service-card.clean .service-open,
body .service-card.clean .service-card-link,
body .service-card.clean .service-card-link h3,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3),
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) h3,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) p,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) li,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) span,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) strong,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) a,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .icon,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .service-card-action,
body.home .service-grid > .service-card:nth-child(4n + 3),
body.home .service-grid > .service-card:nth-child(4n + 3) h3,
body.home .service-grid > .service-card:nth-child(4n + 3) p,
body.home .service-grid > .service-card:nth-child(4n + 3) li,
body.home .service-grid > .service-card:nth-child(4n + 3) span,
body.home .service-grid > .service-card:nth-child(4n + 3) strong,
body.home .service-grid > .service-card:nth-child(4n + 3) a,
body.home .service-grid > .service-card:nth-child(4n + 3) .icon,
body.home .service-grid > .service-card:nth-child(4n + 3) .service-open,
body.home .service-grid > .service-card:nth-child(4n + 3) .service-card-action,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3),
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) h3,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) p,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) li,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) span,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) strong,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) a,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) .icon,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) .service-card-action {
  color: #202124 !important;
}

body .service-card.clean .service-custom-icon,
body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .service-custom-icon,
body.home .service-grid > .service-card:nth-child(4n + 3) .service-custom-icon,
body.home .service-grid > .panith-dynamic-service:nth-child(4n + 3) .service-custom-icon {
  filter: none !important;
}

body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 1) {
  background: #ff4b13 !important;
  color: #fff !important;
}

body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) {
  background: #ffc800 !important;
  color: #202124 !important;
}

body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) {
  background: #fffdf8 !important;
  color: #202124 !important;
}

body .panith-hub-page .panith-service-area-grid .service-card:nth-child(4n) {
  background: radial-gradient(circle at 30% 20%, #323437, #151617 72%) !important;
  color: #fff !important;
}

body .panith-hub-page .panith-service-area-grid p,
body .panith-hub-page .panith-service-area-grid ul,
body .panith-hub-page .panith-service-area-grid dl {
  display: none !important;
}

body .panith-hub-page .panith-service-area-grid .service-card-action {
  display: inline-flex !important;
  margin-top: 22px !important;
  font-weight: 900 !important;
}

body .panith-hub-page .panith-service-area-grid h3 {
  margin-top: auto !important;
  font-size: clamp(25px, 2vw, 38px) !important;
  line-height: 1.04 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

body .panith-hub-page > .panith-section:nth-of-type(2) {
  width: min(1180px, calc(100% - 56px)) !important;
  padding: clamp(36px, 6vw, 80px) 0 !important;
}

body .panith-hub-page .panith-filter-row {
  margin: 0 0 28px !important;
  padding: 18px !important;
  border: 1px solid rgba(32, 33, 36, .14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

body .panith-hub-page .panith-filter-form input,
body .panith-hub-page .panith-filter-form select {
  min-height: 48px !important;
  border-radius: 7px !important;
  background: #f7f5f0 !important;
}

body .panith-hub-page .panith-result-summary {
  margin: 0 0 20px !important;
  color: #53565a !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body .panith-hub-page .panith-card-grid:not(.panith-service-area-grid) {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
}

body .panith-hub-page .knowledge-card {
  min-height: 260px !important;
  border: 1px solid rgba(32, 33, 36, .14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  box-shadow: 0 14px 34px rgba(18, 19, 20, .06) !important;
}

body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)),
body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) h3,
body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) p,
body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) span,
body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) a {
  color: #202124 !important;
}

body .panith-hub-page .knowledge-card a {
  padding: 28px !important;
}

body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) .card-kicker,
body .panith-hub-page .knowledge-card:not(:nth-child(4n + 1)):not(:nth-child(4n)) .read-more-inline {
  color: #ff4b13 !important;
}

@media (max-width: 1180px) {
  body .panith-hub-page .panith-service-area-grid,
  body .service-grid,
  body .panith-hub-page .panith-filter-row,
  body .panith-hub-page .panith-card-grid:not(.panith-service-area-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  body .panith-hub-page .panith-page-hero,
  body .panith-hub-page > .panith-section:first-of-type,
  body .panith-hub-page > .panith-section:nth-of-type(2) {
    width: min(100% - 28px, 560px) !important;
  }

  body .panith-hub-page .panith-page-hero .panith-filter-form,
  body .panith-hub-page .panith-service-area-grid,
  body .service-grid,
  body .panith-hub-page .panith-filter-row,
  body .panith-hub-page .panith-card-grid:not(.panith-service-area-grid) {
    grid-template-columns: 1fr !important;
  }

  body .panith-hub-page .panith-page-hero .btn-orange {
    width: 100% !important;
  }
}
/* FINAL Knowledge Hub hero text visibility fix */
html body main#content.panith-hub-page,
html body main#content.panith-hub-page .panith-page-hero,
html body main#content.panith-hub-page .panith-page-hero *,
html body main#content.panith-hub-page .panith-page-hero h1,
html body main#content.panith-hub-page .panith-page-hero p,
html body main#content.panith-hub-page .panith-page-hero span,
html body main#content.panith-hub-page .panith-page-hero label,
html body main#content.panith-hub-page .panith-page-hero input,
html body main#content.panith-hub-page .panith-page-hero input::placeholder {
  color: #202124 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-page-hero .section-kicker {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-page-hero .btn,
html body main#content.panith-hub-page .panith-page-hero .btn * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-page-hero h1 {
  font-weight: 900 !important;
}
/* Knowledge Hub service cards single row and white filter text */
html body main#content.panith-hub-page > .panith-section:first-of-type {
  width: min(1480px, calc(100% - 56px)) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  width: 100% !important;
  max-width: none !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 32px !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card {
  min-width: 0 !important;
}

html body main#content.panith-hub-page .panith-filter-actions .btn,
html body main#content.panith-hub-page .panith-filter-actions .btn *,
html body main#content.panith-hub-page .panith-filter-row button,
html body main#content.panith-hub-page .panith-filter-row button *,
html body main#content.panith-hub-page button.btn-orange,
html body main#content.panith-hub-page button.btn-orange *,
html body main#content.panith-hub-page .btn-orange,
html body main#content.panith-hub-page .btn-orange * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 1280px) {
  html body main#content.panith-hub-page > .panith-section:first-of-type {
    width: min(1180px, calc(100% - 56px)) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Knowledge Hub service cards exact reference style */
html body main#content.panith-hub-page > .panith-section:first-of-type {
  width: min(1840px, calc(100% - 32px)) !important;
  max-width: none !important;
  padding: 38px 0 58px !important;
}

html body main#content.panith-hub-page > .panith-section:first-of-type > h2 {
  display: none !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(28px, 2.8vw, 52px) !important;
  align-items: stretch !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card {
  min-width: 0 !important;
  min-height: clamp(430px, 31vw, 560px) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 64px rgba(18, 19, 20, 0.13) !important;
  overflow: hidden !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 1) {
  background: #ff4b13 !important;
  color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) {
  background: #ffc800 !important;
  color: #202124 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) {
  background: #fffdf8 !important;
  color: #202124 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n) {
  background: radial-gradient(circle at 35% 20%, #303235, #151617 72%) !important;
  color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-link {
  height: 100% !important;
  min-height: inherit !important;
  display: grid !important;
  grid-template-rows: auto 1fr auto !important;
  align-content: stretch !important;
  padding: clamp(44px, 4vw, 70px) clamp(44px, 4vw, 64px) clamp(46px, 4vw, 70px) !important;
  color: currentColor !important;
  text-align: left !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid .icon {
  display: block !important;
  width: clamp(64px, 5vw, 88px) !important;
  height: clamp(64px, 5vw, 88px) !important;
  margin: 0 0 clamp(58px, 8vw, 116px) !important;
  color: currentColor !important;
  object-fit: contain !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 1) .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n) .service-custom-icon {
  filter: brightness(0) invert(1) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) .service-custom-icon {
  filter: none !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .service-custom-icon {
  filter: none !important;
}

html body main#content.panith-hub-page .panith-service-area-grid h3 {
  align-self: center !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: currentColor !important;
  font-size: clamp(2rem, 2.45vw, 3.05rem) !important;
  line-height: 1.02 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  hyphens: none !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 1) h3,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n) h3,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 1) .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n) .service-card-action {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) h3,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 2) .icon {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) h3,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .service-card-action,
html body main#content.panith-hub-page .panith-service-area-grid .service-card:nth-child(4n + 3) .icon {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid p,
html body main#content.panith-hub-page .panith-service-area-grid ul,
html body main#content.panith-hub-page .panith-service-area-grid dl {
  display: none !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action {
  align-self: end !important;
  display: inline-flex !important;
  width: fit-content !important;
  margin: clamp(40px, 6vw, 76px) 0 0 !important;
  color: currentColor !important;
  font-size: 0 !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action::after {
  content: "→" !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: currentColor !important;
  font-size: clamp(2rem, 2.5vw, 3rem) !important;
  line-height: 1 !important;
  transform: none !important;
}

@media (max-width: 1280px) {
  html body main#content.panith-hub-page > .panith-section:first-of-type {
    width: min(1180px, calc(100% - 56px)) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body main#content.panith-hub-page > .panith-section:first-of-type {
    width: min(100% - 28px, 560px) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid .service-card {
    min-height: 360px !important;
  }
}
/* Knowledge Hub service cards fit-to-screen refinement */
html body main#content.panith-hub-page > .panith-section:first-of-type {
  width: min(100% - 28px, 1720px) !important;
  padding-inline: 0 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(14px, 1.6vw, 28px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card {
  min-height: clamp(330px, 27vw, 470px) !important;
  border-radius: 16px !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-link {
  padding: clamp(28px, 3vw, 48px) clamp(24px, 2.8vw, 44px) clamp(28px, 3vw, 48px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid .icon {
  width: clamp(50px, 4vw, 74px) !important;
  height: clamp(50px, 4vw, 74px) !important;
  margin-bottom: clamp(34px, 5.5vw, 78px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid h3 {
  font-size: clamp(1.55rem, 2vw, 2.55rem) !important;
  line-height: 1.05 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action {
  margin-top: clamp(26px, 4vw, 52px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action::after {
  font-size: clamp(1.7rem, 2vw, 2.5rem) !important;
}

@media (max-width: 1280px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid .service-card {
    min-height: 360px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid .service-card-link {
    padding: 28px 24px !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid h3 {
    font-size: clamp(1.35rem, 1.8vw, 2rem) !important;
  }
}

@media (max-width: 900px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Knowledge Hub service cards match homepage sizing */
html body main#content.panith-hub-page > .panith-section:first-of-type {
  width: min(1180px, calc(100% - 56px)) !important;
  padding: 42px 0 56px !important;
}

html body main#content.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(22px, 3vw, 48px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card {
  min-height: clamp(300px, 20vw, 375px) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 54px rgba(20, 21, 22, 0.1) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-link {
  padding: clamp(42px, 4vw, 58px) clamp(34px, 3.5vw, 48px) clamp(30px, 3vw, 44px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-custom-icon,
html body main#content.panith-hub-page .panith-service-area-grid .icon {
  width: clamp(58px, 5vw, 82px) !important;
  height: clamp(58px, 5vw, 82px) !important;
  margin-bottom: clamp(28px, 5vw, 58px) !important;
}

html body main#content.panith-hub-page .panith-service-area-grid h3 {
  font-size: clamp(1.75rem, 2.4vw, 2.55rem) !important;
  line-height: 1.04 !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action {
  margin-top: 22px !important;
}

html body main#content.panith-hub-page .panith-service-area-grid .service-card-action::after {
  font-size: 1.65rem !important;
}

@media (max-width: 1180px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  html body main#content.panith-hub-page > .panith-section:first-of-type {
    width: min(100% - 28px, 560px) !important;
  }

  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Knowledge Hub service cards two per row */
html body main#content.panith-hub-page .panith-service-area-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width: 620px) {
  html body main#content.panith-hub-page .panith-service-area-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Panith service detail pages match Knowledge Hub style */
html body.single-panith_service main#content.panith-service-page,
html body.single-panith_service .panith-service-page {
  background: #f7f5f0 !important;
  color: #202124 !important;
  padding-top: 0 !important;
}

html body.single-panith_service .panith-service-hero,
html body.single-panith_service .panith-page-hero,
html body.single-panith_service .panith-service-page > .shell:first-child {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding: clamp(54px, 8vw, 92px) 0 clamp(34px, 5vw, 62px) !important;
  color: #202124 !important;
  text-align: center !important;
}

html body.single-panith_service .section-kicker,
html body.single-panith_service .card-kicker,
html body.single-panith_service .panith-service-meta {
  color: #ff4b13 !important;
  -webkit-text-fill-color: #ff4b13 !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

html body.single-panith_service h1,
html body.single-panith_service .entry-title,
html body.single-panith_service .panith-service-hero h1,
html body.single-panith_service .panith-page-hero h1 {
  max-width: 980px !important;
  margin-inline: auto !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  font-size: clamp(44px, 5.4vw, 86px) !important;
  line-height: .98 !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.single-panith_service .panith-service-hero p,
html body.single-panith_service .panith-page-hero p,
html body.single-panith_service .entry-summary,
html body.single-panith_service .panith-service-intro {
  max-width: 860px !important;
  margin: 22px auto 0 !important;
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  line-height: 1.6 !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.single-panith_service .panith-service-actions,
html body.single-panith_service .hero-actions,
html body.single-panith_service .cta-row,
html body.single-panith_service .panith-service-cta-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: clamp(18px, 3vw, 42px) !important;
  margin-top: 32px !important;
}

html body.single-panith_service .btn,
html body.single-panith_service .btn-orange,
html body.single-panith_service a.btn,
html body.single-panith_service button.btn {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: 60px !important;
  min-width: 190px !important;
  border-radius: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 900 !important;
}

html body.single-panith_service .btn-orange,
html body.single-panith_service .btn-orange *,
html body.single-panith_service .panith-service-actions .btn-orange,
html body.single-panith_service .hero-actions .btn-orange {
  background: #ff4b13 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(255, 75, 19, .18) !important;
}

html body.single-panith_service .link-arrow,
html body.single-panith_service .link-arrow *,
html body.single-panith_service a[href*="book-a-consultation"]:not(.btn-orange),
html body.single-panith_service a[href*="book-a-consultation"]:not(.btn-orange) * {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

html body.single-panith_service .link-arrow span {
  display: block !important;
}

html body.single-panith_service .panith-section,
html body.single-panith_service .panith-service-section,
html body.single-panith_service .entry-content,
html body.single-panith_service .panith-related-content {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding-block: clamp(36px, 6vw, 80px) !important;
}

html body.single-panith_service .panith-content-card,
html body.single-panith_service .panith-module,
html body.single-panith_service .panith-final-cta,
html body.single-panith_service .panith-download-box,
html body.single-panith_service .panith-facts-grid div,
html body.single-panith_service .knowledge-card,
html body.single-panith_service .case-study-card {
  border: 1px solid rgba(32, 33, 36, .14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  box-shadow: 0 14px 34px rgba(18, 19, 20, .06) !important;
}

html body.single-panith_service .panith-content-card *,
html body.single-panith_service .panith-module *,
html body.single-panith_service .panith-download-box *,
html body.single-panith_service .knowledge-card *,
html body.single-panith_service .case-study-card * {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  text-shadow: none !important;
}

html body.single-panith_service .panith-card-grid,
html body.single-panith_service .panith-facts-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
}

html body.single-panith_service h2,
html body.single-panith_service .panith-section-heading,
html body.single-panith_service .panith-related-content h2 {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

html body.single-panith_service p,
html body.single-panith_service li,
html body.single-panith_service dd,
html body.single-panith_service dt {
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
}

html body.single-panith_service .panith-final-cta {
  background: linear-gradient(135deg, #202124, #151617) !important;
  color: #ffffff !important;
}

html body.single-panith_service .panith-final-cta *,
html body.single-panith_service .panith-final-cta h2,
html body.single-panith_service .panith-final-cta h3,
html body.single-panith_service .panith-final-cta p {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.single-panith_service .panith-final-cta .btn-orange,
html body.single-panith_service .panith-final-cta .btn-orange * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 980px) {
  html body.single-panith_service .panith-card-grid,
  html body.single-panith_service .panith-facts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  html body.single-panith_service .panith-service-hero,
  html body.single-panith_service .panith-page-hero,
  html body.single-panith_service .panith-section,
  html body.single-panith_service .panith-service-section,
  html body.single-panith_service .entry-content,
  html body.single-panith_service .panith-related-content {
    width: min(100% - 28px, 560px) !important;
  }

  html body.single-panith_service .panith-card-grid,
  html body.single-panith_service .panith-facts-grid {
    grid-template-columns: 1fr !important;
  }

  html body.single-panith_service .panith-service-actions,
  html body.single-panith_service .hero-actions,
  html body.single-panith_service .cta-row,
  html body.single-panith_service .panith-service-cta-row {
    align-items: stretch !important;
  }

  html body.single-panith_service .btn,
  html body.single-panith_service .link-arrow {
    width: 100% !important;
    justify-content: center !important;
  }
}
/* Compact Team section sizing */
body .team {
  padding-top: clamp(36px, 5vw, 64px) !important;
  padding-bottom: clamp(36px, 5vw, 64px) !important;
  min-height: 0 !important;
}

body .team h2 {
  margin-bottom: clamp(24px, 4vw, 42px) !important;
  font-size: clamp(2.25rem, 4.2vw, 4.4rem) !important;
  line-height: 1.02 !important;
}

body .team-grid {
  gap: clamp(18px, 2.6vw, 32px) !important;
  padding-bottom: 18px !important;
}

body .team-grid > .person {
  padding-bottom: 6px !important;
}

body .team .portrait {
  max-height: 360px !important;
  aspect-ratio: 4 / 2.7 !important;
  border-radius: 14px !important;
}

body .team .person h3 {
  margin-top: 14px !important;
  font-size: clamp(1rem, 1.3vw, 1.18rem) !important;
}

body .team .person p,
body .team .person-bio {
  font-size: clamp(0.86rem, 1vw, 0.98rem) !important;
  line-height: 1.42 !important;
}

@media (min-width: 981px) {
  body .team .portrait {
    height: clamp(230px, 24vw, 360px) !important;
  }
}

@media (max-width: 620px) {
  body .team {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
  }

  body .team h2 {
    font-size: clamp(2rem, 10vw, 2.8rem) !important;
  }
}
/* Team carousel show 3 cards on desktop */
body .team-grid {
  grid-auto-columns: calc((100% - 48px) / 3) !important;
}

@media (max-width: 980px) {
  body .team-grid {
    grid-auto-columns: calc((100% - 24px) / 2) !important;
  }
}

@media (max-width: 620px) {
  body .team-grid {
    grid-auto-columns: 100% !important;
  }
}
/* Panith Book a Consultation page match Knowledge Hub style */
html body.page-template-page-book-a-consultation main#content.panith-consultation-page,
html body.page-template-page-book-a-consultation .panith-consultation-page {
  background: #f7f5f0 !important;
  color: #202124 !important;
  padding-top: 0 !important;
}

html body.page-template-page-book-a-consultation .panith-page-hero {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  padding: clamp(54px, 8vw, 92px) 0 clamp(34px, 5vw, 62px) !important;
  text-align: center !important;
  color: #202124 !important;
}

html body.page-template-page-book-a-consultation .panith-page-hero .section-kicker {
  color: #ff4b13 !important;
  -webkit-text-fill-color: #ff4b13 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

html body.page-template-page-book-a-consultation .panith-page-hero h1 {
  max-width: 980px !important;
  margin: 14px auto 0 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  font-size: clamp(44px, 5.4vw, 86px) !important;
  line-height: .98 !important;
  font-weight: 900 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.page-template-page-book-a-consultation .panith-page-hero p {
  max-width: 860px !important;
  margin: 22px auto 0 !important;
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  line-height: 1.6 !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-layout {
  width: min(1180px, calc(100% - 56px)) !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr) !important;
  gap: clamp(28px, 5vw, 64px) !important;
  align-items: start !important;
  padding: clamp(36px, 6vw, 80px) 0 !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-copy,
html body.page-template-page-book-a-consultation .contact-form-panel {
  border: 1px solid rgba(32, 33, 36, .14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: #202124 !important;
  box-shadow: 0 14px 34px rgba(18, 19, 20, .06) !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-copy {
  padding: clamp(26px, 4vw, 42px) !important;
}

html body.page-template-page-book-a-consultation .contact-form-panel {
  padding: clamp(26px, 4vw, 48px) !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-copy h2,
html body.page-template-page-book-a-consultation .contact-form-panel h2,
html body.page-template-page-book-a-consultation .contact-form-panel h3,
html body.page-template-page-book-a-consultation .panith-consultation-copy h3 {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-copy p,
html body.page-template-page-book-a-consultation .panith-consultation-copy li,
html body.page-template-page-book-a-consultation .contact-form-panel p,
html body.page-template-page-book-a-consultation .contact-form-panel label,
html body.page-template-page-book-a-consultation .contact-form-panel span {
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
  font-weight: 800 !important;
}

html body.page-template-page-book-a-consultation .panith-consultation-form,
html body.page-template-page-book-a-consultation .contact-form {
  display: grid !important;
  gap: 18px !important;
}

html body.page-template-page-book-a-consultation .form-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

html body.page-template-page-book-a-consultation input,
html body.page-template-page-book-a-consultation select,
html body.page-template-page-book-a-consultation textarea {
  min-height: 54px !important;
  border: 1px solid rgba(32, 33, 36, .18) !important;
  border-radius: 8px !important;
  background: #f7f5f0 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
  box-shadow: none !important;
}

html body.page-template-page-book-a-consultation textarea {
  min-height: 150px !important;
  padding-top: 14px !important;
}

html body.page-template-page-book-a-consultation input::placeholder,
html body.page-template-page-book-a-consultation textarea::placeholder {
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
  opacity: .78 !important;
}

html body.page-template-page-book-a-consultation .btn,
html body.page-template-page-book-a-consultation .btn-orange,
html body.page-template-page-book-a-consultation button,
html body.page-template-page-book-a-consultation input[type="submit"] {
  min-height: 60px !important;
  border-radius: 8px !important;
  background: #ff4b13 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 900 !important;
  box-shadow: 0 12px 24px rgba(255, 75, 19, .18) !important;
}

html body.page-template-page-book-a-consultation .panith-consent,
html body.page-template-page-book-a-consultation .panith-consent * {
  color: #53565a !important;
  -webkit-text-fill-color: #53565a !important;
}

@media (max-width: 980px) {
  html body.page-template-page-book-a-consultation .panith-consultation-layout {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px) {
  html body.page-template-page-book-a-consultation .panith-page-hero,
  html body.page-template-page-book-a-consultation .panith-consultation-layout {
    width: min(100% - 28px, 560px) !important;
  }

  html body.page-template-page-book-a-consultation .form-row {
    grid-template-columns: 1fr !important;
  }
}
/* Force consultation button text white */
html body a[href*="book-a-consultation"].btn,
html body a[href*="book-a-consultation"].btn:visited,
html body a[href*="book-a-consultation"].btn:hover,
html body a[href*="book-a-consultation"].btn:focus,
html body a[href*="book-a-consultation"].btn:active,
html body a[href*="book-a-consultation"].talk-button,
html body a[href*="book-a-consultation"].talk-button:visited,
html body a[href*="book-a-consultation"].talk-button:hover,
html body a[href*="book-a-consultation"].talk-button:focus,
html body a[href*="book-a-consultation"].talk-button:active,
html body .btn[href*="book-a-consultation"],
html body .btn[href*="book-a-consultation"] *,
html body .talk-button[href*="book-a-consultation"],
html body .talk-button[href*="book-a-consultation"] *,
html body .panith-final-cta a[href*="book-a-consultation"],
html body .panith-final-cta a[href*="book-a-consultation"] *,
html body .panith-service-actions a[href*="book-a-consultation"].btn,
html body .panith-service-actions a[href*="book-a-consultation"].btn *,
html body .hero-actions a[href*="book-a-consultation"].btn,
html body .hero-actions a[href*="book-a-consultation"].btn * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}
/* End Codex migrated Additional CSS to theme file 2026-07-27 */


/* [Panith CSS Section] 97 Current Knowledge Hub page refinements */
/* Codex knowledge hub width filter related square correction 2026-07-27 */
html body .panith-hub-page > .shell,
html body .panith-hub-page .panith-section,
html body .panith-reading-page .panith-reading-layout {
  width: min(1760px, calc(100% - 36px)) !important;
  max-width: none !important;
}

html body .panith-hub-page .panith-page-hero {
  width: min(1680px, calc(100% - 36px)) !important;
}

html body .panith-reading-page .panith-reading-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

html body .panith-reading-page .panith-article-header,
html body .panith-reading-page .panith-article-body,
html body .panith-reading-page .panith-article-footer {
  width: min(1180px, 100%) !important;
  margin-inline: auto !important;
}

html body .panith-reading-page .panith-related-content {
  width: min(1760px, 100%) !important;
  margin-inline: auto !important;
}

html body .panith-hub-page .panith-filter-form {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  align-items: end !important;
  gap: 14px !important;
  padding: clamp(18px, 2vw, 26px) !important;
  border: 1px solid rgba(18, 19, 20, 0.12) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 20px 48px rgba(18, 19, 20, 0.08) !important;
  backdrop-filter: blur(12px) !important;
}

html body .panith-hub-page .panith-page-hero .panith-filter-form {
  max-width: 980px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  padding: 8px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.94) !important;
}

html body .panith-hub-page .panith-filter-row {
  grid-template-columns: minmax(240px, 1.18fr) minmax(190px, 0.72fr) minmax(220px, 0.82fr) minmax(170px, auto) !important;
  margin: 0 0 26px !important;
}

html body .panith-hub-page .panith-filter-row:has(label:nth-of-type(4)) {
  grid-template-columns: minmax(220px, 1fr) minmax(170px, 0.72fr) minmax(200px, 0.82fr) minmax(190px, 0.82fr) minmax(150px, auto) !important;
}

html body .panith-hub-page .panith-filter-form label {
  display: grid !important;
  gap: 8px !important;
  align-content: end !important;
  color: var(--ink) !important;
  font-size: 0.82rem !important;
  font-weight: 900 !important;
}

html body .panith-hub-page .panith-filter-form label span {
  padding-left: 3px !important;
  color: #2b2d30 !important;
}

html body .panith-hub-page .panith-filter-form input,
html body .panith-hub-page .panith-filter-form select {
  min-height: 54px !important;
  border: 1px solid rgba(18, 19, 20, 0.14) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: var(--ink) !important;
  padding: 0 18px !important;
  font-weight: 780 !important;
  box-shadow: none !important;
}

html body .panith-hub-page .panith-filter-form input:focus,
html body .panith-hub-page .panith-filter-form select:focus {
  outline: none !important;
  border-color: var(--orange) !important;
  box-shadow: 0 0 0 4px rgba(255, 75, 19, 0.12) !important;
}

html body .panith-hub-page .panith-filter-actions {
  display: flex !important;
  align-items: end !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 54px !important;
}

html body .panith-hub-page .panith-filter-form .btn,
html body .panith-hub-page .panith-filter-form button[type="submit"] {
  min-width: 144px !important;
  min-height: 54px !important;
  padding: 0 26px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--orange) !important;
  color: var(--white) !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 26px rgba(255, 75, 19, 0.2) !important;
}

html body .panith-hub-page .panith-reset-link {
  min-height: 54px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  border: 1px solid rgba(18, 19, 20, 0.16) !important;
  border-radius: 8px !important;
  background: #fffdf8 !important;
  color: var(--ink) !important;
  font-size: 0.88rem !important;
  font-weight: 950 !important;
  text-decoration: none !important;
}

html body .panith-reading-page .panith-related-content {
  margin-top: clamp(34px, 5vw, 58px) !important;
}

html body .panith-reading-page .panith-related-content h2 {
  margin-bottom: 20px !important;
  font-size: clamp(2.25rem, 4.6vw, 4.6rem) !important;
  line-height: 0.98 !important;
}

html body .panith-reading-page .panith-related-content .panith-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 300px)) !important;
  justify-content: start !important;
  gap: clamp(18px, 2vw, 28px) !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service {
  width: 100% !important;
  max-width: 300px !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 18px !important;
  justify-self: start !important;
  box-shadow: 0 18px 42px rgba(18, 19, 20, 0.12) !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service > .service-card-link {
  height: 100% !important;
  min-height: 0 !important;
  padding: 26px !important;
  display: grid !important;
  grid-template-rows: 48px 76px 78px 1fr 24px !important;
  align-items: start !important;
  text-align: left !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .icon,
html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .panith-service-icon,
html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .service-custom-icon {
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service h3 {
  align-self: end !important;
  margin: 0 0 12px !important;
  font-size: clamp(20px, 1.35vw, 23px) !important;
  line-height: 1.1 !important;
  max-width: 12em !important;
  text-align: left !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service p {
  margin: 0 !important;
  font-size: clamp(13px, 0.9vw, 15px) !important;
  line-height: 1.36 !important;
  max-width: 18em !important;
  text-align: left !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service ul,
html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .service-card-counts {
  display: none !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .service-card-action {
  grid-row: 5 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px !important;
  width: 100% !important;
  font-size: clamp(13px, 0.9vw, 15px) !important;
  line-height: 1 !important;
}

html body .panith-reading-page .panith-related-content .service-card.panith-dynamic-service .service-card-action::after {
  flex: 0 0 34px !important;
  width: 34px !important;
  margin-left: auto !important;
}

html body .panith-reading-page .panith-related-content .panith-content-card,
html body .panith-reading-page .panith-related-content .knowledge-card,
html body .panith-reading-page .panith-related-content .case-study-card {
  width: 100% !important;
  max-width: 300px !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 18px !important;
  padding: 24px !important;
  overflow: hidden !important;
}

html body .panith-reading-page .panith-related-content .panith-content-card h3,
html body .panith-reading-page .panith-related-content .knowledge-card h3,
html body .panith-reading-page .panith-related-content .case-study-card h3 {
  font-size: clamp(20px, 1.35vw, 23px) !important;
  line-height: 1.1 !important;
}

html body .panith-reading-page .panith-related-content .panith-content-card p,
html body .panith-reading-page .panith-related-content .knowledge-card p,
html body .panith-reading-page .panith-related-content .case-study-card p {
  font-size: clamp(13px, 0.9vw, 15px) !important;
  line-height: 1.38 !important;
}

@media (max-width: 1180px) {
  html body .panith-hub-page .panith-filter-row,
  html body .panith-hub-page .panith-filter-row:has(label:nth-of-type(4)) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  html body .panith-hub-page > .shell,
  html body .panith-hub-page .panith-section,
  html body .panith-hub-page .panith-page-hero,
  html body .panith-reading-page .panith-reading-layout {
    width: min(100% - 28px, 680px) !important;
  }

  html body .panith-hub-page .panith-page-hero .panith-filter-form,
  html body .panith-hub-page .panith-filter-row,
  html body .panith-hub-page .panith-filter-row:has(label:nth-of-type(4)) {
    grid-template-columns: 1fr !important;
  }

  html body .panith-hub-page .panith-filter-actions,
  html body .panith-hub-page .panith-filter-form .btn,
  html body .panith-hub-page .panith-filter-form button[type="submit"],
  html body .panith-hub-page .panith-reset-link {
    width: 100% !important;
  }

  html body .panith-reading-page .panith-related-content .panith-card-grid {
    grid-template-columns: minmax(0, 300px) !important;
  }
}
/* End Codex knowledge hub width filter related square correction 2026-07-27 */


/* [Panith CSS Section] 98 Current Home page refinements */
/* Codex home service text and team size correction 2026-07-27 */
html body.home #services .service-grid > article.service-card.panith-dynamic-service > .service-card-link {
  grid-template-rows: 54px 82px 106px 1fr 26px !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service h3 {
  font-size: clamp(21px, 1.25vw, 24px) !important;
  line-height: 1.1 !important;
  margin-bottom: 13px !important;
  max-width: 13.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service p {
  font-size: clamp(14px, 0.9vw, 16px) !important;
  line-height: 1.42 !important;
  max-width: 18.5em !important;
}

html body.home #services .service-grid > article.service-card.panith-dynamic-service .service-card-action {
  font-size: clamp(14px, 0.92vw, 16px) !important;
}

html body.home .team {
  padding: 28px 0 28px !important;
}

html body.home .team h2 {
  margin-bottom: 20px !important;
  font-size: clamp(1.9rem, 3vw, 2.2rem) !important;
}

html body.home .team-grid {
  grid-auto-columns: clamp(190px, 22vw, 250px) !important;
  gap: 18px !important;
  align-items: start !important;
}

html body.home .team-grid > .person {
  max-width: 250px !important;
  justify-self: center !important;
}

html body.home .team .person,
html body.home .team-grid > .person {
  padding: 0 !important;
}

html body.home .team .portrait {
  height: clamp(118px, 13vw, 142px) !important;
  border-radius: 8px !important;
}

html body.home .team .person h3 {
  margin-top: 8px !important;
  font-size: 0.78rem !important;
  line-height: 1.15 !important;
}

html body.home .team .person p {
  margin-top: 3px !important;
  font-size: 0.68rem !important;
  line-height: 1.35 !important;
}

@media (max-width: 620px) {
  html body.home .team-grid {
    grid-auto-columns: min(78vw, 250px) !important;
  }
}
/* End Codex home service text and team size correction 2026-07-27 */
/* Codex Knowledge Hub themed content card colours 2026-07-27 */
html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 1) {
  background: #ff4b13 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 2) {
  background: #ffc800 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 3) {
  background: #fffdf8 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n) {
  background: linear-gradient(135deg, #262729, #151617) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 1) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd),
html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 2) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd),
html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 3) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd) {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 1) .read-more-inline::after,
html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n) .read-more-inline::after {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 2) .read-more-inline::after,
html body main#content.panith-hub-page .panith-card-grid:not(.panith-service-area-grid) > .panith-content-card.knowledge-card:nth-child(4n + 3) .read-more-inline::after {
  background: #202124 !important;
  border-color: #202124 !important;
}
/* End Codex Knowledge Hub themed content card colours 2026-07-27 */
/* Codex service page themed content card colours 2026-07-27 */
html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 1) {
  background: #ff4b13 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 2) {
  background: #ffc800 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 3) {
  background: #fffdf8 !important;
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n) {
  background: linear-gradient(135deg, #262729, #151617) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 1) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd),
html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 2) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd),
html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 3) :is(a, a:visited, a:hover, a:focus, a:focus-visible, a:active, h1, h2, h3, h4, h5, h6, p, span, strong, b, em, small, time, li, dt, dd) {
  color: #202124 !important;
  -webkit-text-fill-color: #202124 !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 1) .read-more-inline::after,
html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n) .read-more-inline::after {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 2) .read-more-inline::after,
html body main#content.panith-service-page .panith-card-grid > .panith-content-card.knowledge-card:nth-child(4n + 3) .read-more-inline::after {
  background: #202124 !important;
  border-color: #202124 !important;
}
/* End Codex service page themed content card colours 2026-07-27 */

/* Codex Knowledge card chapter service labels 2026-07-27 */
.knowledge-card .card-kicker-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.knowledge-card .card-kicker-row .card-kicker,
.knowledge-card .card-service-kicker {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  border: 0;
  color: currentColor;
  -webkit-text-fill-color: currentColor;
  font-size: 12px;
  line-height: 1.15;
  font-weight: 900;
  text-transform: uppercase;
}

.knowledge-card .card-service-kicker {
  font-weight: 800;
  opacity: 0.92;
}
/* End Codex Knowledge card chapter service labels 2026-07-27 */

/* Codex home team carousel 3-up full row correction 2026-07-27 */
html body.home .team .team-grid {
  width: 100% !important;
  grid-auto-columns: calc((100% - 64px) / 3) !important;
  gap: 32px !important;
  align-items: start !important;
  justify-content: start !important;
}

html body.home .team .team-grid > .person {
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

html body.home .team .portrait {
  width: 100% !important;
  height: clamp(170px, 16vw, 235px) !important;
  max-height: none !important;
  aspect-ratio: 16 / 10 !important;
  border-radius: 10px !important;
}

html body.home .team .person h3 {
  margin-top: 14px !important;
  font-size: clamp(1rem, 1.2vw, 1.2rem) !important;
}

html body.home .team .person p {
  font-size: clamp(0.92rem, 1vw, 1.05rem) !important;
}

@media (max-width: 980px) {
  html body.home .team .team-grid {
    grid-auto-columns: calc((100% - 24px) / 2) !important;
    gap: 24px !important;
  }
}

@media (max-width: 620px) {
  html body.home .team .team-grid {
    grid-auto-columns: 100% !important;
  }
}
/* End Codex home team carousel 3-up full row correction 2026-07-27 */

/* Codex home team portrait composition correction 2026-07-27 */
html body.home .team .team-grid {
  grid-auto-columns: calc((100% - 56px) / 3) !important;
  gap: 28px !important;
}

html body.home .team .team-grid > .person {
  text-align: center !important;
}

html body.home .team .portrait {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  max-height: none !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #f3f1ec !important;
}

html body.home .team .portrait img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 28% !important;
  display: block !important;
}

html body.home .team .person:first-child .portrait img {
  object-position: center 18% !important;
}

html body.home .team .person h3 {
  margin-top: 16px !important;
}

@media (max-width: 980px) {
  html body.home .team .team-grid {
    grid-auto-columns: calc((100% - 24px) / 2) !important;
    gap: 24px !important;
  }
}

@media (max-width: 620px) {
  html body.home .team .team-grid {
    grid-auto-columns: 100% !important;
  }
}
/* End Codex home team portrait composition correction 2026-07-27 */