/* Native clinic knowledge index and reading view. */
.clinic-knowledge{--blog-green:#56825f;--blog-dark:#294d36;--blog-copy:#4a5549;--blog-cream:#f6f0dc;background:#fffefa;color:var(--blog-copy);font:400 17px/1.8 "IBM Plex Sans Thai",sans-serif;}
.clinic-knowledge *{box-sizing:border-box;}.clinic-blog-container{width:calc(100% - 64px);max-width:1264px;margin-inline:auto;}
.clinic-knowledge h1,.clinic-knowledge h2,.clinic-knowledge h3{font-family:"IBM Plex Sans Thai",sans-serif;letter-spacing:normal;}
.clinic-blog-breadcrumb {
	display: inline-flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 10px !important;
	width: max-content !important;
	max-width: calc(100% - 24px) !important;
	margin: 0 0 16px 0 !important;
	padding: 8px 12px !important;
	border-radius: 12px !important;
	background: transparent !important;
	align-self: flex-start !important;
	z-index: 2;
	transition: background-color 180ms ease, box-shadow 180ms ease !important;
	animation: vet-breadcrumb-enter 420ms ease-out both !important;
}

.clinic-blog-breadcrumb:hover,
.clinic-blog-breadcrumb:focus-within {
	background-color: rgba(86, 130, 95, 0.08) !important;
	box-shadow: 0 3px 12px rgba(86, 130, 95, 0.15) !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-home {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1 !important;
	color: #56825f !important;
	text-decoration: none !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-home .elementor-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	line-height: 1 !important;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 18px !important;
	color: #56825f !important;
	transform: translateY(1.5px);
	transition: transform 180ms ease, color 180ms ease !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-home svg {
	display: block !important;
	width: 18px !important;
	height: 18px !important;
	fill: #56825f !important;
	color: #56825f !important;
}

.clinic-blog-breadcrumb:hover .vet-breadcrumb-home .elementor-icon,
.clinic-blog-breadcrumb:hover .vet-breadcrumb-home svg {
	transform: translateY(-1.5px) !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-separator {
	display: inline-flex !important;
	align-items: center !important;
	line-height: 1 !important;
	margin: 0 !important;
	padding: 0 !important;
	font-family: "IBM Plex Sans Thai", sans-serif !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: #56825f !important;
	transform: translateY(0.5px);
	transition: transform 180ms ease, color 180ms ease !important;
}

.clinic-blog-breadcrumb:hover .vet-breadcrumb-separator {
	transform: translate(2px, 0.5px) !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-label,
.clinic-blog-breadcrumb .vet-breadcrumb-link {
	display: inline-flex !important;
	align-items: center !important;
	font-family: "IBM Plex Sans Thai", sans-serif !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	padding: 0 !important;
	color: #56825f !important;
	text-decoration: none !important;
	transition: color 180ms ease !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-link:hover {
	color: #3b5c42 !important;
}

.clinic-blog-breadcrumb .vet-breadcrumb-home:focus-visible,
.clinic-blog-breadcrumb .vet-breadcrumb-link:focus-visible {
	outline: 2px solid #56825f !important;
	outline-offset: 4px !important;
	border-radius: 3px !important;
}

.clinic-knowledge-header{position:relative;background:var(--blog-cream);padding:26px 0 54px;}
.clinic-knowledge-header:after{content:"";position:absolute;right:4%;bottom:38px;width:90px;height:77px;background:url('../images/paw-chocolate.svg') center/contain no-repeat;opacity:.08;pointer-events:none;}
.clinic-knowledge-header h1{margin:18px 0 12px;font-size:clamp(34px,4vw,52px);line-height:1.4;font-weight:600;color:var(--blog-green);}
.clinic-knowledge-header p{margin:0;max-width:680px;color:var(--blog-copy);font-size:18px;}
.clinic-article-list{padding-top:32px;padding-bottom:70px;}
.clinic-topic-nav{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:32px;}
.clinic-topic-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:7px 20px;border-radius:24px;border:1px solid #d5ddcf;color:#43684a;background:transparent;text-decoration:none;}
.clinic-topic-nav a[aria-current="page"],.clinic-topic-nav a:hover{background:#43684a;border-color:#43684a;color:white;}
.clinic-articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:52px 28px;}
.clinic-article-card{min-width:0;display:flex;flex-direction:column;align-items:flex-start;}
.clinic-article-image{display:block;width:100%;overflow:hidden;border-radius:18px;background:#eaf0e6;aspect-ratio:3/2;}
.clinic-article-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 0.65s cubic-bezier(0.25, 1, 0.5, 1);}
.clinic-article-card:hover .clinic-article-image img{transform:scale(1.03);}
.clinic-article-card-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:18px;color:#43684a;font-size:13px;}
.clinic-demo-tag{padding:1px 8px;border-radius:5px;background:#eaf0e6;color:#43684a;}
.clinic-article-card h2{margin:10px 0 12px;font-weight:600;font-size:23px;line-height:1.55;color:var(--blog-green);}
.clinic-article-card h2 a{color:inherit;text-decoration:none;}.clinic-article-card h2 a:hover{color:#b85d28;}
.clinic-article-excerpt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:16px;line-height:1.8;margin:0 0 18px;color:var(--blog-copy);}
.clinic-read-link{display:inline-flex;gap:12px;align-items:center;min-height:44px;color:#43684a;font-weight:600;text-decoration:none!important;}
.clinic-article-card>.clinic-read-link{margin-top:auto;}.clinic-read-link:hover{color:#b85d28;}
.clinic-read-link svg,.clinic-blog-button svg{flex-shrink:0;}
.clinic-blog-demo-note{font-size:13px;line-height:1.8;margin:44px 0 0;color:#66685d;}
.clinic-blog-button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:52px;padding:12px 24px;background:#43684a;color:white!important;border-radius:14px;font-weight:600;text-decoration:none!important;transition:background-color .18s ease,transform .18s ease;}
.clinic-blog-button:hover{background:#294d36;transform:translateY(-2px);}
.clinic-blog-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:46px;}.clinic-blog-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:10px;padding:6px 14px;color:#43684a;background:#eaf0e6;}.clinic-blog-pagination .current{background:#43684a;color:#fff;}
.clinic-blog-empty{padding:52px 0;text-align:center;}.clinic-blog-empty h2{color:var(--blog-green);font-size:28px;}
.clinic-knowledge-single-top{padding-top:26px;margin-bottom:8px;}
.clinic-reading-article{width:calc(100% - 64px);max-width:1000px;margin:42px auto 70px;}
.clinic-reading-header{text-align:center;max-width:900px;margin:0 auto 24px;}
.clinic-reading-topic{color:#43684a;font-size:15px;margin:0 0 12px;}
.clinic-reading-header h1{font-size:clamp(30px,3.6vw,44px);font-weight:600;line-height:1.5;color:var(--blog-green);margin:0 0 18px;}
.clinic-reading-meta{font-size:14px;color:#66685d;margin:0;}
.clinic-reading-demo{padding:12px 18px;margin:0 0 24px;border-radius:10px;background:var(--blog-cream);font-size:14px;color:#60351f;}
.clinic-reading-cover{margin:0 0 36px!important;}.clinic-reading-cover img{display:block;width:100%;height:auto;max-height:600px;object-fit:cover;border-radius:20px;}
.clinic-reading-body{max-width:760px;margin:0 auto;font-size:18px;line-height:1.95;overflow-wrap:anywhere;}
.clinic-reading-body p,.clinic-reading-body li{color:var(--blog-copy);}.clinic-reading-body h2{font-size:27px;font-weight:600;color:var(--blog-green);line-height:1.6;margin:36px 0 12px;}.clinic-reading-body h3{font-size:23px;color:var(--blog-dark);margin:28px 0 10px;}
.clinic-reading-body ul{padding-left:24px;}.clinic-reading-body li+li{margin-top:8px;}
.clinic-article-share{max-width:760px;margin:32px auto 0;padding-top:24px;border-top:1px solid #d5ddcf;display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:14px;}
.clinic-article-share a,.clinic-copy-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:7px 14px;border:1px solid #d5ddcf;border-radius:10px;color:#43684a;background:transparent;font:inherit;text-decoration:none;cursor:pointer;}
.clinic-article-share a:hover,.clinic-copy-link:hover{background:#eaf0e6;}.clinic-copy-status{font-size:13px;}
.clinic-reading-actions{max-width:760px;margin:28px auto 0;display:flex;align-items:center;flex-wrap:wrap;gap:20px;}
.clinic-blog-related{padding:48px 0 64px;background:#eaf0e6;}.clinic-related-title{margin:0 0 30px;font-size:32px;line-height:1.5;color:var(--blog-green);font-weight:600;}
.clinic-knowledge a:focus-visible,.clinic-knowledge button:focus-visible{outline:3px solid #b85d28!important;outline-offset:4px;}.clinic-knowledge ::selection{background:#43684a;color:#fff;}
body:has(.clinic-knowledge-index) .elementor-element-cliniccontact,body:has(.clinic-knowledge-single) .elementor-element-cliniccontact{--clinic-transition-color:#fffefa!important;}
body:has(.clinic-blog-related) .elementor-element-cliniccontact{--clinic-transition-color:#eaf0e6!important;}
@media(max-width:1024px){.clinic-articles-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.clinic-article-card h2{font-size:21px;}}
@media(max-width:600px){.clinic-blog-container,.clinic-reading-article{width:calc(100% - 40px);}.clinic-knowledge-header{padding:20px 0 32px;}.clinic-knowledge-header h1{margin-top:28px;font-size:36px;}.clinic-knowledge-header p{font-size:16px;}.clinic-knowledge-header:after{width:54px;height:46px;bottom:16px;}.clinic-articles-grid{grid-template-columns:minmax(0,1fr);gap:36px;}.clinic-article-list{padding-top:24px;padding-bottom:48px;}.clinic-topic-nav{gap:8px;padding-bottom:26px;}.clinic-topic-nav a{padding:6px 15px;font-size:15px;}.clinic-article-card h2{font-size:23px;}.clinic-reading-article{margin-top:28px;margin-bottom:48px;}.clinic-reading-header{text-align:left;}.clinic-reading-header h1{font-size:30px;}.clinic-reading-body{font-size:17px;line-height:1.9;}.clinic-reading-body h2{font-size:24px;}.clinic-reading-cover img{border-radius:16px;}.clinic-reading-actions{align-items:stretch;flex-direction:column;}.clinic-reading-actions .clinic-blog-button{width:100%;}.clinic-blog-breadcrumb{gap:8px;}.clinic-blog-breadcrumb .vet-breadcrumb-label,.clinic-blog-breadcrumb .vet-breadcrumb-link,.clinic-blog-breadcrumb .vet-breadcrumb-separator{font-size:16px!important;}.clinic-blog-breadcrumb .vet-breadcrumb-home svg{width:16px!important;height:16px!important;}.clinic-related-title{font-size:28px;}}
@media(prefers-reduced-motion:reduce){.clinic-article-image img,.clinic-blog-button{transition:none;transform:none!important;}}
/* One short arrival for the entire knowledge surface; no card staggering. */
@media (prefers-reduced-motion:no-preference) {
 .clinic-knowledge {animation:clinic-knowledge-arrive .6s ease-out both;}
 @keyframes clinic-knowledge-arrive {from{opacity:.25;}to{opacity:1;}}
}

/* ==========================================================================
   Homepage Blog Preview Section (สาระน่ารู้ - Impeccable Craftsmanship)
   ========================================================================== */

.clinic-home-blog-preview {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 10px 0 30px;
  box-sizing: border-box;
}

.clinic-home-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
  align-items: stretch;
}

.clinic-home-blog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 22px;
  border: 1px solid rgba(96, 53, 31, 0.08);
  box-shadow: 0 8px 24px -4px rgba(96, 53, 31, 0.06);
  overflow: hidden;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1),
              box-shadow 0.35s cubic-bezier(0.25, 1, 0.5, 1),
              border-color 0.35s ease;
}

.clinic-home-blog-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 36px -8px rgba(96, 53, 31, 0.12);
  border-color: rgba(86, 130, 95, 0.28);
}

.clinic-home-blog-card__thumb-link {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background-color: #f2ece4;
  text-decoration: none;
}

.clinic-home-blog-card__thumb {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.55s cubic-bezier(0.25, 1, 0.5, 1);
}

.clinic-home-blog-card:hover .clinic-home-blog-card__thumb {
  transform: scale(1.045);
}

.clinic-home-blog-card__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 24px 26px 26px;
  box-sizing: border-box;
}

.clinic-home-blog-card__tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.clinic-home-blog-card__tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  background-color: #ebf3ed;
  color: #56825f;
  font-family: "IBM Plex Sans Thai", sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  border-radius: 999px;
  letter-spacing: 0.01em;
}

.clinic-home-blog-card__tag--demo {
  background-color: #f7ede2;
  color: #8c532b;
}

.clinic-home-blog-card__title {
  font-family: "IBM Plex Sans Thai", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.45;
  margin: 0 0 12px;
  color: #2d2520;
}

.clinic-home-blog-card__title a {
  color: #2d2520;
  text-decoration: none;
  transition: color 0.2s ease;
}

.clinic-home-blog-card__title a:hover,
.clinic-home-blog-card:hover .clinic-home-blog-card__title a {
  color: #56825f;
}

.clinic-home-blog-card__excerpt {
  font-family: "IBM Plex Sans Thai", sans-serif;
  font-size: 15px;
  line-height: 1.65;
  color: #6d665f;
  margin: 0 0 20px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.clinic-home-blog-card__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  font-family: "IBM Plex Sans Thai", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #56825f;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.clinic-home-blog-card__more:hover,
.clinic-home-blog-card:hover .clinic-home-blog-card__more {
  color: #3b5f42;
}

.clinic-home-blog-card__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s cubic-bezier(0.25, 1, 0.5, 1);
}

.clinic-home-blog-card:hover .clinic-home-blog-card__arrow {
  transform: translateX(4px);
}

.clinic-home-blog-preview__cta {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

.clinic-home-blog-preview__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 13px 36px;
  background-color: #56825f;
  color: #ffffff !important;
  font-family: "IBM Plex Sans Thai", sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none !important;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(86, 130, 95, 0.22);
  transition: background-color 0.25s ease,
              transform 0.25s cubic-bezier(0.25, 1, 0.5, 1),
              box-shadow 0.25s ease;
}

.clinic-home-blog-preview__btn:hover {
  background-color: #43684a;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(86, 130, 95, 0.32);
}

@media (max-width: 1024px) {
  .clinic-home-blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
}

@media (max-width: 640px) {
  .clinic-home-blog-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  .clinic-home-blog-card__body {
    padding: 20px;
  }
  .clinic-home-blog-card__title {
    font-size: 18px;
  }
  .clinic-home-blog-preview__cta {
    margin-top: 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .clinic-home-blog-card,
  .clinic-home-blog-card__thumb,
  .clinic-home-blog-card__arrow,
  .clinic-home-blog-preview__btn {
    transition: none !important;
    transform: none !important;
  }
}