:root {
	--cnvs-themecolor: #EB9086;
	--cnvs-themecolor-rgb: rgb(235, 144, 134);
	--color-purple: #7C5C74;
	--color-gold: #9B8D83;
	--color-gold-light: #EED7B6;
	--color-cream: #fffdf5;
	--color-text: #1a2e22;
	--color-muted: #9B8D83;
	--font-display: 'Bebas Neue', sans-serif;
	--font-body: 'Roboto', 'Sarabun', sans-serif;
	--cnvs-slider-caption-font-weight: 400;
	--cnvs-font-size-h1:	2.5rem;
	--cnvs-font-size-h2:	1.875rem;
	--cnvs-font-size-h3:	1.625rem;
	--cnvs-font-size-h4:	1.375rem;
	--cnvs-font-size-h5:	1.125rem;
	--cnvs-font-size-h6:	0.875rem;
	--cnvs-font-size-small:	calc(var(--cnvs-font-size-body) * 0.875);
}

:root {
	--bs-link-color:	var(--cnvs-themecolor);
	--bs-link-color-rgb:	var(--cnvs-themecolor-rgb);
	--bs-link-hover-color:	var(--cnvs-heading-color);
	--bs-body-font-size: 0.875rem;
	--bs-body-font-weight: 400;
	--cnvs-white:	#fff;
	--cnvs-black:	#000;
	--cnvs-headings-font-weight: 400;
	/* Font Families */
	--cnvs-body-font: 'Roboto', 'Sarabun', sans-serif;
	--cnvs-primary-font: 'Bebas Neue', sans-serif;
	--cnvs-secondary-font: 'Roboto', 'Sarabun', sans-serif;
	--cnvs-line-height-base:	1.4;
	--cnvs-line-height-content:	1.4;
	--cnvs-copyrights-font-size: 0.75rem;
	/* flex slider */
	--cnvs-slider-caption-p-size: 1.15rem;
	/* margin */
	--cnvs-content-padding:	3rem;
}

address {
	margin-bottom: 1rem;
	font-style: normal;
	line-height: inherit;
	font-size: 0.85rem;
}

body {
	line-height: 1.5;
	font-size: var(--cnvs-font-size-body);
	font-family: var(--cnvs-body-font);
	background: var(--cnvs-body-bg);
	font-weight: var(--bs-body-font-weight);
  }

#header {
	--cnvs-primary-menu-font-weight: 400;
	--cnvs-primary-menu-font-size: 1rem;
	--cnvs-primary-menu-ls:	1px;
	--cnvs-sticky-header-height: var(--cnvs-header-height);
	--cnvs-header-border-color:	rgba(var(--cnvs-contrast-rgb), 0);
	--cnvs-header-transparent-border-color: rgba(var(--cnvs-contrast-rgb), 0);
	--cnvs-primary-menu-padding-x:	15px;
}

#copyrights {
    padding: calc(var(--cnvs-content-padding) * 0.5) 0;
    background-color: #000;
    font-size: var(--cnvs-copyrights-font-size);
    line-height: var(--cnvs-line-height-content);
	color: var(--cnvs-color-gold-light);
}

.is-expanded-menu .full-header #logo {
    padding-right: 30px;
    border-right: 0px solid var(--cnvs-header-border-color);
}

.is-expanded-menu .full-header .primary-menu .menu-container {
    padding-right: 0.5rem;
    margin-right: 0.5rem;
    border-right: 0px solid var(--cnvs-header-border-color);
}

.slider-caption.slider-caption-center {
    position: relative;
    max-width: 1024px;
    text-align: center;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.slider-caption p {
    margin-top: 2.5rem;
    margin-bottom: 0.75rem;
    font-size: var(--cnvs-slider-caption-p-size);
}

.widget_nav_menu li, .widget_links li, .widget_meta li, .widget_archive li, .widget_recent_comments li, .widget_recent_entries li, .widget_categories li, .widget_pages li, .widget_rss li {
    display: flex;
    padding: 0.15rem 0;
    font-size: 0.875rem;
}

/* basic layout */
h1, .h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  color: var(--cnvs-heading-color);
  font-weight: var(--cnvs-headings-font-weight);
  line-height: var(--cnvs-line-height-base);
  margin: 0 0 10px 0;
  font-family: var(--cnvs-primary-font);
}

p, pre, ul, ol, dl, dd, blockquote, address, table, fieldset, form {margin-bottom: 60px;}

.widget p {
    line-height: 1.4;
}

.post-grid .entry-title h2, .post-grid .entry-title .h2 {
	--cnvs-post-title-font-size: 1.375rem;
	letter-spacing: 0;
	font-weight: var(--cnvs-post-title-font-weight);
}

.heading-block {
	--cnvs-heading-block-border: 2px solid var(--cnvs-themecolor);
	--cnvs-heading-block-font-weight: 400;
  }

.heading-block > span:not(.before-heading) {
    display: block;
    margin-top: 0.5rem;
    font-weight: 400;
	font-style: italic;
    color: var(--cnvs-heading-block-span-color);
}

.counter {
	--cnvs-counter-xl-font-size: 90px;
}

#page-title,
.page-title {
  --cnvs-page-title-padding: 4rem;
  --cnvs-page-title-parallax-padding: 6.25rem;
  --cnvs-page-title-mini-padding: 1.5rem;
  --cnvs-page-title-bg: var(--cnvs-contrast-bg-offset);
  --cnvs-page-title-color: var(--cnvs-contrast-900);
  --cnvs-page-title-font-size: 2.25rem;
  --cnvs-page-title-font-weight: 400;
  --cnvs-page-title-spacing: 0;
  --cnvs-page-title-subtitle-size: 1rem;
  --cnvs-page-title-parallax-font-size: calc(2rem + 1vw);
  --cnvs-page-title-parallax-subtitle-size: 1.25rem;
  --cnvs-page-title-mini-size: 1.25rem;
  --cnvs-page-title-border-color: rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-page-title-center-mx-width: 48rem;
  position: relative;
  padding: var(--cnvs-page-title-padding) 0;
  background-color: var(--cnvs-page-title-bg);
  border-bottom: 1px solid var(--cnvs-page-title-border-color);
}

.fancy-title::before, .fancy-title::after {
    content: "";
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    height: 0;
    border-top: calc(var(--cnvs-fancy-title-border-size) * 1) solid rgb(236 143 134);
}

.text-color {color: #EB9086;}
.text-gold-light {color: var(--color-gold-light);}
.text-gold {color: var(--color-gold);}

.team-image {
	position: relative;
	overflow: hidden;
  }
.team-image > a,
.team-image img {
	display: block;
	width: 100%;
}
.img-grayscale-art {
	/* ค่าตั้งต้น: ขาวดำ High Contrast */
	filter: grayscale(100%) contrast(1.1) brightness(0.95);
	/* ใส่ Transition เพื่อให้การขยายและเปลี่ยนสีนุ่มนวล */
	transition: all 0.6s cubic-bezier(0.25, 1, 0.5, 1);
	display: block;
}
/* เมื่อเมาส์วางที่ .team-image ให้สั่ง .img-grayscale-art ที่อยู่ข้างในทำงาน */
.team-image:hover .img-grayscale-art {
	filter: grayscale(0%) contrast(1) brightness(1);
	transform: scale(1.1); /* ขยายรูปแต่อยู่ในกรอบเพราะ overflow: hidden ของตัวแม่ */
  }

.img-art-hover:hover {
    /* สภาวะเมื่อวางเมาส์: คืนค่าสีปกติทั้งหมด */
    filter: grayscale(0%) contrast(1) brightness(1);
}

.dark {
	--cnvs-section-bg: var(--cnvs-contrast-0);
}

@media (max-width: 767.98px) {
    h4, .h4 {
        font-size: 1.375rem;
    }
}