.elementor-kit-7{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#FFFFFF;--e-global-color-accent:#61CE70;--e-global-color-39eec29:#4C0909;--e-global-color-ee0b150:#4C090980;--e-global-color-143e43b:#FF0000;--e-global-color-7f86440:#A50000;--e-global-color-8ed11f9:#FF4646;--e-global-color-148ee67:#240000;--e-global-color-c178527:#1B0000;--e-global-color-fbdf4c6:#130000;--e-global-color-13b1a73:#000B03;--e-global-color-92bf6b9:#6D1214;--e-global-color-f779b44:#1D0404;--e-global-color-3b0c939:#ACACAC33;--e-global-color-fb4c1f7:#FFFFFF;--e-global-color-66a3547:#FF3B3B;--e-global-color-d7b45a4:#130000;--e-global-color-e727148:#480002;--e-global-color-647ac22:#FFFFFF;--e-global-color-4c3b27a:#D4D4D4;--e-global-color-0cadd59:#8A8A8A;--e-global-color-2aab125:#FF9D9D;--e-global-color-4cf10f9:#FF3B3B;--e-global-color-742d221:#C40000;--e-global-color-836900d:#D4D4D4;--e-global-color-0b431ff:#FF3B3B;--e-global-color-98e8381:#1D0404;--e-global-color-295b9a0:#353535;--e-global-color-1193166:#000000;--e-global-color-18cc72d:#000000E6;--e-global-color-0e55e88:#FFFFFF;--e-global-color-a5b8472:#FF555D;--e-global-color-18cb536:#5C0508;--e-global-color-f470ee9:#FF6F76;--e-global-color-84afa6d:#741E21;--e-global-color-75e3932:#FF7D82D1;--e-global-color-cffe8dd:#5C0508;--e-global-color-c11a2cb:#FFFFFF;--e-global-color-3c6a015:#858585;--e-global-color-f7c2e61:#FFFFFF;--e-global-color-32030ff:#969696;--e-global-color-0e00fa5:#FFFFFFEB;--e-global-color-df6fac7:#FF2525;--e-global-color-0823b2f:#01FF00;--e-global-color-28e6239:#FA0101;--e-global-color-70e2447:#1D040400;--e-global-color-fd0b1dc:#F6514F;--e-global-color-5892ed7:#FFFFFF29;--e-global-color-c30d4df:#360000;--e-global-color-e55e28a:#FF1919;--e-global-color-30861e5:#FF7777;--e-global-color-a46cec9:#FF1919;--e-global-color-962e054:#360000;--e-global-color-301acc1:#FFD6DE;--e-global-color-78e181a:#FF3B6B99;--e-global-color-4d9e44d:#FF1744E6;--e-global-color-253a157:#9497A0;--e-global-color-983f460:#FFFFFF;--e-global-color-6543bbb:#D4D6DE;--e-global-color-b1688a6:#F4F4F4;--e-global-color-ec61e52:#FF999E;--e-global-color-997d8e9:#FF5159;--e-global-color-ad197ab:#ED1720;--e-global-color-675dc18:#FF6F76;--e-global-color-5e83acd:#540000;--e-global-color-55490a9:#505050;--e-global-color-d07fd5a:#262626;--e-global-color-baae0a6:#FF6A6A;--e-global-color-1a7b3f8:#FF1D1D;--e-global-color-15dbf2a:#FFFFFF;--e-global-color-9001af2:#FFFFFF;--e-global-color-0e1ffd6:#6D6D6D;--e-global-color-2066920:#FF5259A8;--e-global-color-53743ec:#02020257;--e-global-color-9e64169:#280400;--e-global-color-8f05563:#FF0000;--e-global-color-68d9e51:#2B0000;--e-global-color-5bf3fe5:#120000;--e-global-color-c7b3ea2:#FFFFFF;--e-global-color-ba7dfde:#F1F1F1;--e-global-color-8820b38:#F1F1F1;--e-global-color-f4e608c:#6B0002;--e-global-color-abee314:#2B0001;--e-global-color-fd5a110:#1D1D1D;--e-global-color-f0056bf:#820002;--e-global-color-6a7a53d:#6B0002;--e-global-color-6d374c9:#2B0001;--e-global-color-94de7f9:#FDDD3B;--e-global-color-491ed3c:#FFE45E;--e-global-color-857d8d1:#E0710A;--e-global-color-4b1d10b:#FF0404;--e-global-color-c27a717:#FF7070;--e-global-color-5ed522c:#FFA44F;--e-global-color-1a5a206:#FFCC70;--e-global-color-e0b8e5a:#0000004D;--e-global-color-945008f:#FFFFFF;--e-global-color-06085dd:#FF6A6A;--e-global-color-ce67c82:#FF3B43;--e-global-color-46113e3:#DF141D;--e-global-color-54189af:#97090F;--e-global-color-f2afdb3:#390507;--e-global-color-2700acb:#FF5259A8;--e-global-color-cc34b25:#4B000557;--e-global-color-1109871:#28000342;--e-global-color-df1589c:#FF0000;--e-global-color-7536c20:#2B0000;--e-global-color-684e62f:#120000;--e-global-color-b8b89b0:#FCDD9A;--e-global-color-5be5c5e:#ECCA77;--e-global-color-215c24f:#8B6832;--e-global-color-1ad1db1:#9A7438;--e-global-color-764e5ea:#4A3510;--e-global-color-cdc9961:#FCDD9A99;--e-global-color-e4b6b32:#ECCA77;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-39eec29 );font-family:"Anuphan", Sans-serif;font-size:0.9rem;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 a{color:var( --e-global-color-0823b2f );}.elementor-kit-7 a:hover{color:var( --e-global-color-28e6239 );}.elementor-kit-7 h1{font-size:24px;line-height:1.5em;}.elementor-kit-7 h2{font-size:23px;line-height:1.5em;}.elementor-kit-7 h3{font-size:22px;line-height:1.5em;}.elementor-kit-7 h4{font-size:21px;line-height:1.5em;}.elementor-kit-7 h5{font-size:20px;line-height:1.5em;}.elementor-kit-7 h6{font-size:19px;line-height:1.5em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1120px;}.e-con{--container-max-width:1120px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-7{font-size:0.9rem;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-7{font-size:0.9rem;}.elementor-kit-7 h1{line-height:1.4em;}.elementor-kit-7 h2{line-height:1.4em;}.elementor-kit-7 h3{line-height:1.4em;}.elementor-kit-7 h4{line-height:1.4em;}.elementor-kit-7 h5{line-height:1.4em;}.elementor-kit-7 h6{line-height:1.4em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ชั้นพื้นหลังหลัก (ทุกขนาดจอ) */
body::after {
  /* ===== สวิตช์พื้นหลัง =====
     bg 1 = var(--bg-1)   สีเดียวจาก site bg
     bg 2 = var(--bg-2)   รูป + ชั้นสี overlay
     bg 3 = var(--bg-3)   ไล่สีแบบ 3            */
  --bg-switch: var(--bg-3);

  /* bg 1: ไม่แสดงอะไร ให้เห็นสี site bg ข้างใต้ */
  --bg-1: transparent;

  /* bg 2: ชั้นสี overlay ทับรูป */
  --bg-2:
    linear-gradient(
      var(--e-global-color-ee0b150),
      var(--e-global-color-ee0b150)),
    url("/wp-content/uploads/2026/09/bg-uspin69.webp") 50% 50% / cover no-repeat;

  /* bg 3: ไล่สี */
  --bg-3:
    radial-gradient(circle at 50% 12%,
      color-mix(in srgb, var(--e-global-color-143e43b) 12%, transparent),
      transparent 16%),
    radial-gradient(circle at 12% 45%,
      color-mix(in srgb, var(--e-global-color-7f86440) 14%, transparent),
      transparent 24%),
    radial-gradient(circle at 88% 42%,
      color-mix(in srgb, var(--e-global-color-8ed11f9) 8%, transparent),
      transparent 24%),
    linear-gradient(180deg,
      var(--e-global-color-148ee67) 0%,
      var(--e-global-color-c178527) 38%,
      var(--e-global-color-fbdf4c6) 70%,
      var(--e-global-color-13b1a73) 100%);

  content: "";
  position: fixed;
  inset: 0;
  background: var(--bg-switch);
  pointer-events: none;
  z-index: -1;
}

/* กันหน้าล้นออกนอกจอ */
html, body {
  overflow-x: hidden;
}

/*ปุ่มปิด Sidemenu1*/
.cs-sidemenu1 .dialog-close-button{
    background:
    radial-gradient(120% 170% at 50% -45%,
      rgba(255, 255, 255, .13),
      transparent 48%),
    linear-gradient(180deg,
      #ff555d 0%,
      #ff3942 17%,
      #ed1720 36%,
      #c40d15 56%,
      #92080d 78%,
      #5c0508 100%);
    border: 1px solid #ff7d82d1;
    border-radius: 30px;
    padding: 5px;
}

/*ปุ่มปิด Sidemenu2*/
.cs-sidemenu2 .dialog-close-button {
  background:
    radial-gradient(120% 170% at 50% -45%,
      rgba(255, 255, 255, .13),
      transparent 48%),
    linear-gradient(180deg,
      #ff555d 0%,
      #ff3942 17%,
      #ed1720 36%,
      #c40d15 56%,
      #92080d 78%,
      #5c0508 100%);
  border: 1px solid #ff7d82d1;
  padding: 8px;
}

/*แถบข้างไล่สี Sidemenu border slice*/
.sidemenu-bs .dialog-widget-content:before{
    background:
        linear-gradient(45deg,
            transparent 0%,
            var(--e-global-color-df6fac7) 50%,
            transparent 100%);
    width: 2px;
    position: absolute;
    right: 0;
    top: 50%;
    height: 100%;
    transform: translateY(-50%);
    content: "";
    z-index: 999;
}


/*Border-slice*/
.slice-box-top{
    border-image:
        linear-gradient(90deg,
            var(--e-global-color-c30d4df),
            var(--e-global-color-e55e28a) 30%,
            var(--e-global-color-30861e5) 50%,
            var(--e-global-color-a46cec9) 70%,
            var(--e-global-color-962e054)) 1;
    border-top: 2px solid !important;
}

.slice-box-bottom{
    border-image:
        linear-gradient(90deg,
            var(--e-global-color-c30d4df),
            var(--e-global-color-e55e28a) 30%,
            var(--e-global-color-30861e5) 50%,
            var(--e-global-color-a46cec9) 70%,
            var(--e-global-color-962e054)) 1;
    border-bottom: 2px solid !important;
}

/* ============================================
   เส้นขอบแสงวิ่ง
   วิธีใช้: พิมพ์ชื่อคลาสที่ Advanced > CSS Classes
   .glow-bottom = ขอบล่าง
   .glow-top    = ขอบบน
   อยากได้ทั้งสองด้าน พิมพ์ทั้งสองคลาส
   หมายเหตุ: ตั้ง Border ใน Elementor เป็น 0 ทั้งหมด
   ============================================ */

/* ---- ขอบล่าง: วิ่งซ้าย > ขวา ---- */
.glow-bottom {
  position: relative;
  /* เส้นพื้น */
  border-bottom: 2px solid var(--e-global-color-30861e5) !important;
}

.glow-bottom::after {
  content: "";
  position: absolute;
  /* ต้องเท่ากับ height */
  bottom: -2px;
  left: 0;
  /* ความยาวแถบแสง */
  width: 40%;
  /* ความหนาเส้น */
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--e-global-color-78e181a) 30%,
    var(--e-global-color-301acc1) 50%,
    transparent 100%);
  filter: drop-shadow(0 0 6px var(--e-global-color-4d9e44d));
  /* 1s = ความเร็ว */
  animation: glowRun 1s linear infinite;
  pointer-events: none;
  z-index: 1;
}

/* ---- ขอบบน: วิ่งขวา > ซ้าย ---- */
.glow-top {
  position: relative;
  /* เส้นพื้น */
  border-top: 2px solid var(--e-global-color-30861e5) !important;
}

.glow-top::before {
  content: "";
  position: absolute;
  /* ต้องเท่ากับ height */
  top: -2px;
  right: 0;
  width: 40%;
  height: 2px;
  background: linear-gradient(270deg,
    transparent 0%,
    var(--e-global-color-78e181a) 30%,
    var(--e-global-color-301acc1) 50%,
    transparent 100%);
  filter: drop-shadow(0 0 6px var(--e-global-color-4d9e44d));
  animation: glowRunBack 1s linear infinite;
  pointer-events: none;
  z-index: 1;
}

/* ---- ระยะทางวิ่ง (ไม่ต้องแก้) ---- */
@keyframes glowRun {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(250%); }
}

@keyframes glowRunBack {
  0%   { transform: translateX(250%); }
  100% { transform: translateX(-100%); }
}

/* ---- หัวข้อไล่สี (ไม่มีแสง 1) ---- */
.title-tgr h1.elementor-heading-title,
.title-tgr h2.elementor-heading-title,
.title-tgr h3.elementor-heading-title,
.title-tgr h4.elementor-heading-title,
.title-tgr h5.elementor-heading-title{
    background-image: linear-gradient(120deg,
        var(--e-global-color-253a157) 0%,
        var(--e-global-color-983f460) 50%,
        var(--e-global-color-6543bbb) 100%) !important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ---- หัวข้อไล่สี (ไม่มีแสง 2) ---- */
.title-tgr2 h1.elementor-heading-title,
.title-tgr2 h2.elementor-heading-title,
.title-tgr2 h3.elementor-heading-title,
.title-tgr2 h4.elementor-heading-title,
.title-tgr2 h5.elementor-heading-title{
    background: linear-gradient(120deg,
        var(--e-global-color-253a157) 0%,
        var(--e-global-color-983f460) 18%,
        var(--e-global-color-6543bbb) 36%,
        var(--e-global-color-b1688a6) 49%,
        var(--e-global-color-ec61e52) 66%,
        var(--e-global-color-997d8e9) 83%,
        var(--e-global-color-ad197ab) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ---- หัวข้อไล่สี + แสงกวาด ---- */
.title-tgr2-shine h1.elementor-heading-title,
.title-tgr2-shine h2.elementor-heading-title,
.title-tgr2-shine h3.elementor-heading-title,
.title-tgr2-shine h4.elementor-heading-title,
.title-tgr2-shine h5.elementor-heading-title {
  background:
    linear-gradient(120deg,
      transparent 42%,
      rgba(255, 255, 255, .85) 50%,
      transparent 58%),
    linear-gradient(120deg,
      var(--e-global-color-253a157) 0%,
      var(--e-global-color-983f460) 18%,
      var(--e-global-color-6543bbb) 36%,
      var(--e-global-color-b1688a6) 49%,
      var(--e-global-color-ec61e52) 66%,
      var(--e-global-color-997d8e9) 83%,
      var(--e-global-color-ad197ab) 100%);
  background-size: 250% 100%, 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shineText 3s ease-in-out infinite;
}

/* ============================================
   แถบแสงกวาด
   .shine-btn        = ปุ่ม Elementor
   .shine-box-right  = กล่อง (วิ่งซ้าย > ขวา)
   .shine-box-left   = กล่อง (วิ่งขวา > ซ้าย)
   .shine-text       = ตัวอักษร
   ============================================ */

/* ---- ปุ่ม ---- */
.shine-btn .elementor-button {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.shine-btn .elementor-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, .6) 50%,
    rgba(255, 255, 255, 0) 60%);
  background-size: 250% 100%;
  animation: shineRun 3s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
}

.shine-btn .elementor-button-content-wrapper {
  position: relative;
  z-index: 2;
}

/* ---- กล่อง: วิ่งซ้าย > ขวา ---- */
.shine-box-right {
  position: relative;
  overflow: hidden;
}

.shine-box-right::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, .15) 50%,
    rgba(255, 255, 255, 0) 60%);
  background-size: 250% 100%;
  animation: shineRun 3s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
}

.shine-box-right > *,
.shine-box-right .elementor-widget,
.shine-box-right .elementor-widget-container {
  position: relative;
  z-index: 2;
}

/* ---- กล่อง: วิ่งขวา > ซ้าย ---- */
.shine-box-left {
  position: relative;
  overflow: hidden;
}

.shine-box-left::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, .15) 50%,
    rgba(255, 255, 255, 0) 60%);
  background-size: 250% 100%;
  animation: shineRunLeft 3s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
}

.shine-box-left > *,
.shine-box-left .elementor-widget,
.shine-box-left .elementor-widget-container {
  position: relative;
  z-index: 2;
}

/* ---- ตัวอักษร ---- */
.shine-text .elementor-heading-title,
.shine-text.elementor-heading-title {
  position: relative;
  z-index: 2;
  background: linear-gradient(120deg,
    var(--e-global-color-primary) 40%,
    var(--e-global-color-675dc18) 48%,
    var(--e-global-color-5e83acd) 52%,
    var(--e-global-color-primary) 60%);
  background-size: 250% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shineText 3s ease-in-out infinite;
}

/* ---- จังหวะการวิ่ง ---- */
@keyframes shineRun {
  0%   { background-position: 150% 0; opacity: 0; }
  15%  { opacity: .07; }
  46%  { opacity: .94; }
  72%  { opacity: .16; }
  100% { background-position: -50% 0; opacity: 0; }
}

@keyframes shineRunLeft {
  0%   { background-position: -50% 0; opacity: 0; }
  15%  { opacity: .07; }
  46%  { opacity: .94; }
  72%  { opacity: .16; }
  100% { background-position: 150% 0; opacity: 0; }
}

@keyframes shineText {
  0%   { background-position: 150% 0; }
  100% { background-position: -50% 0; }
}

/*block gradient*/
.bgr{
    background:
  radial-gradient(80% 170% at 50% 0%,
    rgba(255, 57, 66, .10),
    transparent 52%),
  linear-gradient(90deg,
    transparent 0%,
    #020202 8%,
    #080101 17%,
    #140203 26%,
    #270304 35%,
    #4b0507 43%,
    #78070b 49%,
    #ad0b11 54%,
    #ed1720 58%,
    #ad0b11 62%,
    #78070b 67%,
    #4b0507 72%,
    #270304 79%,
    #140203 86%,
    #080101 92%,
    transparent 100%);
    border: 1px solid #ed172047;
  -webkit-mask-image: linear-gradient(90deg,
    transparent 0%,
    #000 12%,
    #000 88%,
    transparent 100%);
  mask-image: linear-gradient(90deg,
    transparent 0%,
    #000 12%,
    #000 88%,
    transparent 100%);
}

/*Table*/
.divtable{
  overflow-x: auto;
}

.divtable th,
.divtable td,
.divtable tbody {
    color: var(--e-global-color-text);
    background-color: transparent !important;
    text-align: center;
    vertical-align: middle;
}

/*Btn effect*/
@keyframes wink-wink{
    0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    }

    100% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    }
}

.wink-wink a{
    animation: wink-wink .4s linear infinite alternate;
}

/* การ์ดโพสต์สไตล์ rdc — ใส่ class: custom-ac-post ที่ widget Archive Posts */
.custom-ac-post .elementor-post__card {
    background:
        linear-gradient(180deg,
            color-mix(in srgb, var(--e-global-color-68d9e51) 96%, transparent) 0%,
            color-mix(in srgb, var(--e-global-color-5bf3fe5) 98%, transparent) 100%);
    /* ความเข้มขอบ 0 – 100%  !important กันค่าจาก widget ทับ */
    border: 1px solid color-mix(in srgb, var(--e-global-color-8f05563) 24%, transparent) !important;
    box-shadow:
        0 16px 36px rgba(0, 0, 0, .48),
        0 0 24px color-mix(in srgb, var(--e-global-color-8f05563) 12%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .06);
    transition: border-color .3s ease, box-shadow .3s ease;
}

/* ตัดระยะห่างใต้รูปของ widget ให้รูปติดส่วนเนื้อหา */
.custom-ac-post .elementor-post__thumbnail__link {
    margin-bottom: 0 !important;
}

/* แสงใต้รูป */
.custom-ac-post .elementor-post__text {
    /* ระยะจากรูปถึงหัวข้อ  0 = ชิดรูป */
    padding-top: 10px !important;

    background:
        /* กว้าง 50%  สูง 40%  ของส่วนเนื้อหา */
        radial-gradient(ellipse 50% 40% at 50% 0%,
            /* ความเข้มแสง 0 – 100% */
            color-mix(in srgb, var(--e-global-color-8f05563) 30%, transparent),
            transparent 100%);
}

/* hover */
.custom-ac-post .elementor-post__card:hover {
    /* ความเข้มขอบตอน hover 0 – 100% */
    border-color: color-mix(in srgb, var(--e-global-color-8f05563) 36%, transparent) !important;
    box-shadow:
        0 20px 42px rgba(0, 0, 0, .54),
        0 0 30px color-mix(in srgb, var(--e-global-color-8f05563) 18%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* เงาเรืองหัวข้อการ์ดโพสต์ */
.custom-ac-post .elementor-post__title a {
    text-shadow:
        /* เรืองชั้นใน ตามสีหัวข้อ */
        0 0 12px color-mix(in srgb, currentColor 28%, transparent),
        /* เรืองชั้นนอก ตามสี ac-post แสงและขอบ */
        0 0 22px color-mix(in srgb, var(--e-global-color-8f05563) 10%, transparent);
}

/* เนื้อหาย่อ: ตัดตามจำนวนบรรทัด + เงาดำ */
.custom-ac-post .elementor-post__excerpt p {
    display: -webkit-box;
    /* จำนวนบรรทัดที่แสดง */
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 5px 5px 16px rgba(0, 0, 0, .6);
}

/* เส้นคั่นเหนือวันที่ สีเดียวกับขอบการ์ด */
.custom-ac-post .elementor-post__meta-data {
    border-top-color: color-mix(in srgb, var(--e-global-color-8f05563) 24%, transparent) !important;
    transition: border-color .3s ease;
}

/* เส้นคั่นเหนือวันที่ ตอน hover การ์ด */
.custom-ac-post .elementor-post__card:hover .elementor-post__meta-data {
    border-top-color: color-mix(in srgb, var(--e-global-color-8f05563) 36%, transparent) !important;
}

/*Archive Posts Pagination normal*/
.custom-pgn .page-numbers {
    background:
        linear-gradient(90deg,
            var(--e-global-color-55490a9) 0%,
            var(--e-global-color-d07fd5a) 100%);
    display: inline-block;
    margin: 5px 0px;
    padding: 10px 10px;
    border-radius: 10px;
}

/*Archive Posts Pagination hover*/
.custom-pgn .page-numbers:hover {
    background:
        linear-gradient(90deg,
            var(--e-global-color-baae0a6) 0%,
            var(--e-global-color-1a7b3f8) 100%);
    text-shadow:
        0 0 5px var(--e-global-color-15dbf2a),
        0 0 10px var(--e-global-color-9001af2);
}

/*Archive Posts Pagination active*/
.custom-pgn nav .current{
    background:
        linear-gradient(90deg,
            var(--e-global-color-baae0a6) 0%,
            var(--e-global-color-1a7b3f8) 100%);
    text-shadow:
        0 0 5px var(--e-global-color-15dbf2a),
        0 0 10px var(--e-global-color-9001af2);
}

/*cat btn*/
.cat-btn .elementor-widget-container h5{
    font-family: var(--e-global-typography-primary-font-family);
    font-weight: var(--e-global-typography-primary-font-weight);
    color: var(--e-global-color-primary);
}

.cat-btn .elementor-widget-container ul{
    padding: 0;
    margin: 0;
}

/* =========================================================
   แท็บเล็ต (จอไม่เกิน 1024px)
   ========================================================= */
@media screen and (max-width: 1024px){
    .cat-btn .elementor-widget-container ul{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    /* หัวข้ออยู่กลาง + เส้นซ้ายขวา */
    .cat-btn .elementor-widget-container h5{
        display: flex;
        /* เส้นอยู่กลางความสูงตัวอักษร */
        align-items: center;
        /* จัดทั้งหมดไว้ตรงกลาง */
        justify-content: center;
        /* ระยะห่างระหว่างเส้นกับตัวหนังสือ */
        gap: 12px;
        text-align: center;
        /* ห้ามตัวหนังสือขึ้นบรรทัดใหม่  ให้เส้นหดแทน */
        white-space: nowrap;
        /* แท็บเล็ต : ระยะเว้นจากขอบซ้ายขวา  ยิ่งมาก = เส้นยิ่งสั้น  (0 – 30%) */
        padding-inline: 10%;
    }

    /* เส้นซ้าย และ เส้นขวา */
    .cat-btn .elementor-widget-container h5::before,
    .cat-btn .elementor-widget-container h5::after{
        /* จำเป็น ห้ามลบ */
        content: "";
        /* เส้นยาวเต็มพื้นที่ที่เหลือ  ห้ามแก้ */
        flex: 1;
        /* ความหนาเส้น */
        height: 0.5px;
        /* สีเส้น */
        background: var(--e-global-color-5892ed7);
        /* ความชัดเส้น  0 – 1 */
        opacity: 1;
    }
}

/* =========================================================
   มือถือ (จอไม่เกิน 767px)  ต้องอยู่หลังก้อนแท็บเล็ตเสมอ
   ========================================================= */
@media screen and (max-width: 767px){
    .cat-btn .elementor-widget-container h5{
        /* มือถือ : ระยะเว้นจากขอบซ้ายขวา  ยิ่งมาก = เส้นยิ่งสั้น  (0 – 20%) */
        padding-inline: 5%;
    }
}

.cat-btn .elementor-widget-container li{
    list-style: none;
    padding: 0;
    margin: 0;
}

/*cat btn normal*/
.cat-btn .elementor-widget-container ul li a{
    text-align: center;
    padding: 10px 1px;
    margin: 0px 2px;
    margin-bottom: 10px;
    display: block;
    color: var(--e-global-color-text);
    background:
        linear-gradient(180deg,
            var(--e-global-color-55490a9) 0%,
            var(--e-global-color-d07fd5a) 100%);
    border-radius: 8px;
    font-size: 16px;

    /* ให้แผ่นเคลือบวางทับได้ */
    position: relative;
    overflow: hidden;

    /* ขอบ */
    border: 1px solid var(--e-global-color-0e1ffd6);

    /* เงา */
    box-shadow:
        /* สีปุ่มหมวดหมู่ - เงาขอบล่าง */
        inset 0 -4px 0 var(--e-global-color-53743ec),
        /* เงามืดด้านล่างในปุ่ม */
        inset 0 -10px 18px rgba(0, 0, 0, .20),
        /* สีปุ่มหมวดหมู่ - เงาขอบนอก */
        0 1px 3px var(--e-global-color-9e64169);
}

/* แผ่นเคลือบใส  ชุดเดียวกับ post navigation */
.cat-btn .elementor-widget-container ul li a::before{
    /* จำเป็น ห้ามลบ */
    content: "";
    position: absolute;
    left: 1px;
    right: 1px;
    top: 1px;
    /* ความสูงแผ่นเคลือบ  0 – 100% */
    height: 48%;
    /* ให้คลิกทะลุได้ */
    pointer-events: none;
    /* บนโค้งตามปุ่ม (8px - 1) ล่างโค้งน้อย */
    border-radius: 7px 7px 4px 4px;

    /* ไล่ขาวจางลงจนใส  เลข .18 / .04 = ความขาว 0 – 1 */
    background: linear-gradient(180deg,
        rgba(255, 255, 255, .18) 0%,
        rgba(255, 255, 255, .04) 65%,
        transparent 100%);
    /* ความชัดรวม  0 – 1 */
    opacity: .76;
}

/*cat btn hover*/
.cat-btn .elementor-widget-container ul li a:hover{
    background: linear-gradient(180deg,
        var(--e-global-color-baae0a6) 0%,
        var(--e-global-color-1a7b3f8) 100%);
    filter: saturate(1.2);
    text-shadow:
        0 0 5px var(--e-global-color-15dbf2a),
        0 0 10px var(--e-global-color-9001af2);
    border: 1px solid var(--e-global-color-2066920);
}

/*cat btn active*/
.cat-btn .elementor-widget-container .current-cat a{
    background: linear-gradient(180deg,
        var(--e-global-color-baae0a6) 0%,
        var(--e-global-color-1a7b3f8) 100%);
    filter: saturate(1.2);
    text-shadow:
        0 0 5px var(--e-global-color-15dbf2a),
        0 0 10px var(--e-global-color-9001af2);
    border: 1px solid var(--e-global-color-2066920);
}

/* =====================================================
   แถบหัวข้อการ์ดเกม — ใส่ class: game-card-header
   สีทั้งหมดดึงจาก Global Colors (gch) แก้ที่ Site Settings
   ===================================================== */
.game-card-header {
    /* จำเป็น ให้แผ่นเคลือบวางทับได้ */
    position: relative;
    /* จำเป็น ตัดแผ่นเคลือบไม่ให้ล้น */
    overflow: hidden;
    /* ระยะในแถบ  บน-ล่าง  ซ้าย-ขวา */
    padding: 10px 18px;
    /* มุมโค้ง  0 = เหลี่ยม */
    border-radius: 14px;

    /* สีพื้น ไล่จากบนลงล่าง (ตัวเลข % = ตำแหน่งสี) */
    background: linear-gradient(180deg,
        /* gch - พื้น 1 บนสุด */
        var(--e-global-color-ce67c82) 0%,
        /* gch - พื้น 2 */
        var(--e-global-color-46113e3) 36%,
        /* gch - พื้น 3 */
        var(--e-global-color-54189af) 70%,
        /* gch - พื้น 4 ล่างสุด */
        var(--e-global-color-f2afdb3) 100%);

    /* ขอบ */
    /* gch - ขอบ */
    border: 1px solid var(--e-global-color-2700acb);

    box-shadow:
        /* เส้นสว่างขอบบน */
        inset 0 1px 0 rgba(255, 255, 255, .18),
        /* gch - เงาขอบล่าง */
        inset 0 -4px 0 var(--e-global-color-cc34b25),
        /* เงามืดด้านล่างในแถบ */
        inset 0 -10px 18px rgba(0, 0, 0, .20),
        /* gch - เงานอก */
        0 1px 3px var(--e-global-color-1109871);
}

/* ---- แผ่นเคลือบใสด้านบน ---- */
.game-card-header::before {
    /* จำเป็น ห้ามลบ */
    content: "";
    position: absolute;
    /* ห่างขอบซ้าย */
    left: 4px;
    /* ห่างขอบขวา */
    right: 4px;
    /* ห่างขอบบน */
    top: 4px;
    /* ความสูง  0 – 100% */
    height: 32%;
    /* ให้คลิกทะลุได้ */
    pointer-events: none;
    /* มุมโค้ง  ควรน้อยกว่าแถบนิดหน่อย */
    border-radius: 12px;

    /* ไล่ขาวจางลงจนใส  เลข .18 / .04 = ความขาว 0 – 1 */
    background: linear-gradient(180deg,
        rgba(255, 255, 255, .18) 0%,
        rgba(255, 255, 255, .04) 65%,
        transparent 100%);
    /* ความชัดรวม  0 – 1 */
    opacity: .76;
}

/* ---- ตัวหนังสืออยู่เหนือแผ่นเคลือบ (ห้ามลบ) ---- */
.game-card-header .elementor-heading-title {
    position: relative;
    z-index: 1;
}

/* ---- ไอคอนรูปหน้าหัวข้อ ---- */
.game-card-header .gch-icon {
    /* ขนาดไอคอน  เทียบกับตัวอักษร  0.8 – 2 */
    height: 1.2em;
    width: auto;
    /* จัดให้อยู่กลางบรรทัด */
    vertical-align: middle;
    /* ระยะห่างจากตัวอักษร */
    margin-right: .3em;

    /* เงา  ขวา  ลง  ความฟุ้ง  สี (เลขท้าย 0 – 1 = ความเข้ม) */
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, .35));
}

/* ===================================================
   Footer menu 1 + 2
   =================================================== */

/* ===== ค่าหลัก (แก้ที่นี่ที่เดียว) ===== */
:root {
    /* ขนาดวงกลม เล็กสุด-ยืดตามจอ-ใหญ่สุด */
    --ft-mid-size: clamp(52px, 14vw, 72px);
    /* ช่องว่างรอบวงกลม */
    --ft-gap: 5px;
    /* ระยะจากขอบล่างถึงขอบล่างวงกลม */
    --ft-bottom: 20px;
    /* แผ่นเว้ามุดใต้เมนูซ้าย-ขวาข้างละเท่านี้ */
    --ft-overlap: 2px;
    /* เส้นขอบเว้า ไม่เอาใส่ 0px */
    --ft-line: 0px;
}

/* ===== สีร่วม (แถบซ้าย-ขวา เมนู 1 + เมนู 2 + แถบเมนู 3) ===== */
.ft-menu-left,
.ft-menu-right,
.ft-menu-2,
.ft-menu-3 {
    background: linear-gradient(180deg,
        var(--e-global-color-f0056bf) 0%,
        var(--e-global-color-6a7a53d) 50%,
        var(--e-global-color-6d374c9) 100%) !important;
}

/* ===== สีปุ่มกลาง (ใช้ร่วมกัน เมนู 1 + เมนู 2) ===== */
.ft-menu-mid,
.ft-menu-2-mid {
    background: linear-gradient(180deg,
        var(--e-global-color-94de7f9) 0%,
        var(--e-global-color-491ed3c) 50%,
        var(--e-global-color-857d8d1) 100%);
    border-color: var(--e-global-color-5ed522c);
    box-shadow: 0 0 10px var(--e-global-color-1a5a206);
}

/* ===== สีปุ่มกลาง แบบแยก (ใส่ class ft-mid-own-color เพิ่มเมื่อไม่อยากใช้สีร่วม) ===== */
.ft-menu-mid.ft-mid-own-color {
    /* พื้นหลัง: สีเดียวกับเมนูซ้าย-ขวา */
    background: linear-gradient(180deg,
        var(--e-global-color-f0056bf) 0%,
        var(--e-global-color-6a7a53d) 50%,
        var(--e-global-color-6d374c9) 100%);

    border-color: var(--e-global-color-4b1d10b);
    box-shadow: 0 0 10px var(--e-global-color-c27a717);
}

/* ===== สไตล์ขอบปุ่มกลาง แยกกัน ===== */
.ft-menu-mid {
    border-style: solid;
    border-width: 2px;
}

.ft-menu-2-mid {
    border-style: solid;
    border-width: 0px 1px;
}

/* ===== layout ร่วมของซ้าย-ขวา เมนู 1 ===== */
.ft-menu-left,
.ft-menu-right {
    display: flex;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0;
    z-index: 2;
    padding-bottom: 6px;
    border-top: 3px solid var(--e-global-color-5ed522c);
    transition: filter .2s;
}

/* ===== สวิตช์: เมนูซ้าย-ขวาใช้สีขอบชุดแยก ===== */
/* ใส่ class ft-left-own-border ที่เมนูซ้าย / ft-right-own-border ที่เมนูขวา */
.ft-menu-left.ft-left-own-border,
.ft-menu-right.ft-right-own-border {
    border-top-color: var(--e-global-color-4b1d10b);
}

/* ===== มุมโค้งเมนูซ้าย-ขวา ===== */
/* outer = มุมด้านนอก (ชิดขอบจอ), inner = มุมด้านใน (ชิดวงกลม) */
/* คอม */
:root {
    --ft-radius-outer: 10px;
    --ft-radius-inner: 42px;
}

/* แท็บเล็ต */
@media (max-width: 1024px) {
    :root {
        --ft-radius-outer: 10px;
        --ft-radius-inner: 44px;
    }
}

/* มือถือ */
@media (max-width: 767px) {
    :root {
        --ft-radius-outer: 10px;
        --ft-radius-inner: 30px;
    }
}

.ft-menu-left {
    border-radius: var(--ft-radius-outer) var(--ft-radius-inner) 0 0;
}
.ft-menu-right {
    border-radius: var(--ft-radius-inner) var(--ft-radius-outer) 0 0;
}

/* ===== ช่องกลาง (ตัวครอบ) กว้างตามวงกลมอัตโนมัติ ===== */
.ft-menu-mid-wrap {
    width: calc(var(--ft-mid-size) + var(--ft-gap) * 2) !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    position: relative !important;
    padding: 0 !important;
    /* อยู่ใต้เมนูซ้าย-ขวา */
    z-index: 1;
}

/* ให้แผ่นเว้ายึดตำแหน่งจากตัวครอบ */
.ft-menu-mid-wrap .elementor-widget-html {
    position: static !important;
}

/* ===== วงกลมเข้าเล่น — วัดจากขอบล่าง ===== */
.ft-menu-mid {
    position: absolute !important;
    top: auto !important;
    bottom: var(--ft-bottom);
    left: 50%;
    transform: translateX(-50%);
    width: var(--ft-mid-size) !important;
    height: var(--ft-mid-size) !important;
    margin: 0 !important;
    z-index: 3;
    border-radius: 50%;
}

.ft-menu-mid-img {
    position: absolute;
    width: calc(var(--ft-mid-size) * 1.08) !important;
    max-width: inherit !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: calc(var(--ft-mid-size) * -0.167);
}

/* ===== เงารูปปุ่มกลาง เมนู 1 + 2 ===== */
.ft-menu-mid img,
.ft-menu-2-mid-img img {
    filter: drop-shadow(1px 1px 0px var(--e-global-color-e0b8e5a));
}

/* ===== แผ่นเว้า — ชิดขอบล่าง คำนวณจากวงกลมและขอบข้าง ===== */
.footer-shape {
    /* รัศมีเว้า = ครึ่งช่องกลาง + ส่วนที่มุดใต้เมนู */
    --notch-r: calc(var(--ft-mid-size) / 2 + var(--ft-gap) + var(--ft-overlap));

    position: absolute;
    left:  calc(var(--ft-overlap) * -1);
    right: calc(var(--ft-overlap) * -1);
    bottom: 0;
    /* ขอบบน = จุดกลางวงกลม */
    height: calc(var(--ft-bottom) + var(--ft-mid-size) / 2);
    z-index: 0;
    pointer-events: none;

    background:
        radial-gradient(circle at 50% 0,
            transparent var(--notch-r),
            var(--e-global-color-5ed522c) var(--notch-r),
            var(--e-global-color-5ed522c) calc(var(--notch-r) + var(--ft-line)),
            transparent calc(var(--notch-r) + var(--ft-line) + 0.5px)),
        linear-gradient(180deg,
            var(--e-global-color-f0056bf) 0%,
            var(--e-global-color-6a7a53d) 50%,
            var(--e-global-color-6d374c9) 100%);

    -webkit-mask: radial-gradient(circle at 50% 0,
        transparent var(--notch-r),
        #000 calc(var(--notch-r) + 0.5px));
    mask: radial-gradient(circle at 50% 0,
        transparent var(--notch-r),
        #000 calc(var(--notch-r) + 0.5px));
}


/* ===================================================
   Footer menu 3 — ปุ่มกลางเหรียญทองลอย กดแล้วยุบ
   class: ft-menu-3 (แถบนอกสุด), ft3-coin (Icon Box ตัวกลาง)
   สีพื้นแถบอยู่ในก้อน "สีร่วม" ด้านบน
   =================================================== */

/* ===== ค่าหลักเมนู 3 (ตัวเลขเท่านั้น) ===== */
:root {
    /* ขนาดเหรียญ */
    --ft3-coin-size: 58px;
    /* ยกไอคอน+เหรียญขึ้นเท่านี้ */
    --ft3-lift: 22px;
    /* ความหนาขอบเหรียญปกติ */
    --ft3-depth: 6px;
    /* ขอบที่เหลือตอนกด */
    --ft3-press-depth: 4px;
    /* hover บนคอม ลอยขึ้นเท่านี้ */
    --ft3-hover-up: 4px;
}

/* ===== แถบ: ขอบบน ===== */
.ft-menu-3 {
    /* สีขอบบนแถบ เมนู 3 */
    border-top: 3px solid var(--e-global-color-e4b6b32);
}

/* สวิตช์: ขอบบนใช้สีชุดแยก (ใส่ class ft3-own-border เพิ่มที่แถบ) */
.ft-menu-3.ft3-own-border {
    border-top-color: var(--e-global-color-4b1d10b);
}

/* ===== ไอคอน SVG ทุกตัวในเมนู ใช้สีตาม color ===== */
.ft-menu-3 .elementor-icon svg,
.ft-menu-3 .elementor-icon svg * {
    fill: currentColor !important;
}

/* ===== ข้อความทุกปุ่มอยู่บรรทัดเดียว ===== */
.ft-menu-3 .elementor-icon-box-title {
    white-space: nowrap;
}

/* ----- สีปุ่มข้าง (ไอคอน + ข้อความ สีเดียวกัน) ----- */

/* ปกติ */
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin) .elementor-icon,
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin) .elementor-icon-box-title,
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin) .elementor-icon-box-title a {
    color: var(--e-global-color-945008f) !important;
    transition: color .15s ease;
}

/* ชี้ (เฉพาะคอม) */
@media (hover: hover) {
    .ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):hover .elementor-icon,
    .ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):hover .elementor-icon-box-title,
    .ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):hover .elementor-icon-box-title a {
        color: var(--e-global-color-06085dd) !important;
    }
}

/* กด (มือถือแตะ / คอมคลิก) */
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):active .elementor-icon,
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):active .elementor-icon-box-title,
.ft-menu-3 .elementor-widget-icon-box:not(.ft3-coin):active .elementor-icon-box-title a {
    color: var(--e-global-color-06085dd) !important;
}

/* ----- ปุ่มกลาง (เหรียญทอง) ----- */

.ft3-coin {
    position: relative;
    z-index: 3;
    -webkit-tap-highlight-color: transparent;
}

/* ไอคอนกลาง: ขนาดเท่าเดิม แค่ยกขึ้น (ไม่กระทบ layout) */
.ft3-coin .elementor-icon {
    /* ค่าเปลี่ยนตามสถานะ: ความหนาขอบ / ความฟุ้ง / ตำแหน่ง */
    --d: var(--ft3-depth);
    --glow: 0px;
    --y: 0px;

    position: relative !important;
    z-index: 0;
    transform: translateY(calc(var(--ft3-lift) * -1 + var(--y))) !important;
    transition: transform .15s ease, color .15s ease !important;
}

/* เหรียญทอง วาดด้านหลังไอคอน */
.ft3-coin .elementor-icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--ft3-coin-size);
    height: var(--ft3-coin-size);
    transform: translate(-50%, -50%);
    z-index: -1;
    border-radius: 50%;

    /* หน้าเหรียญ: ftm3 เหรียญบนซ้าย → เหรียญกลาง → เหรียญล่างขวา */
    background: linear-gradient(145deg,
        var(--e-global-color-b8b89b0) 0%,
        var(--e-global-color-5be5c5e) 40%,
        var(--e-global-color-215c24f) 100%);

    /* ลำดับเงา:
       1. ftm3 ขอบข้างเหรียญ
       2. ftm3 ฐานและไอคอนเหรียญ (เส้นล่างสุด)
       3. เงาตกพื้น
       4. ftm3 แสงฟุ้งเหรียญ
       5. แสงขอบบน (ด้านใน)
       6. เงาขอบล่าง (ด้านใน) */
    box-shadow:
        0 var(--d) 0 var(--e-global-color-1ad1db1),
        0 calc(var(--d) + 2px) 0 var(--e-global-color-764e5ea),
        0 calc(var(--d) + 4px) 25px rgba(0, 0, 0, .5),
        0 0 var(--glow) var(--e-global-color-cdc9961),
        inset 0 3px 6px rgba(255, 255, 255, .35),
        inset 0 -2px 4px rgba(0, 0, 0, .3);

    transition: box-shadow .15s ease, filter .15s ease;
}

/* ปุ่มกลาง: ปกติ */
.ft3-coin .elementor-icon {
    /* ไอคอนบนเหรียญ */
    color: var(--e-global-color-764e5ea) !important;
}
.ft3-coin .elementor-icon-box-title,
.ft3-coin .elementor-icon-box-title a {
    /* ข้อความใต้เหรียญ */
    color: var(--e-global-color-945008f) !important;
    transition: color .15s ease;
}

/* ปุ่มกลาง: hover (เฉพาะคอม) */
@media (hover: hover) {
    .ft3-coin:hover .elementor-icon {
        --y: calc(var(--ft3-hover-up) * -1);
        --d: calc(var(--ft3-depth) + var(--ft3-hover-up));
        --glow: 20px;
        /* ไอคอนบนเหรียญ ตอน hover */
        color: var(--e-global-color-764e5ea) !important;
    }
    .ft3-coin:hover .elementor-icon::before {
        filter: brightness(1.06);
    }
    .ft3-coin:hover .elementor-icon-box-title,
    .ft3-coin:hover .elementor-icon-box-title a {
        /* ข้อความ ตอน hover */
        color: var(--e-global-color-06085dd) !important;
    }
}

/* ปุ่มกลาง: active (มือถือแตะ / คอมคลิก) */
.ft3-coin:active .elementor-icon {
    --y: calc(var(--ft3-depth) - var(--ft3-press-depth));
    --d: var(--ft3-press-depth);
    --glow: 8px;
    /* ไอคอนบนเหรียญ ตอนกด */
    color: var(--e-global-color-764e5ea) !important;
}
.ft3-coin:active .elementor-icon::before {
    filter: brightness(.97);
}
.ft3-coin:active .elementor-icon-box-title,
.ft3-coin:active .elementor-icon-box-title a {
    /* ข้อความ ตอนกด */
    color: var(--e-global-color-06085dd) !important;
}

/* ===== ปุ่มของหน้าที่เปิดอยู่ (สคริปต์ใส่ class ft3-current ให้) ===== */

/* ปุ่มข้าง: ไอคอน + ข้อความ เป็นสีเปิด */
.ft-menu-3 .elementor-widget-icon-box.ft3-current:not(.ft3-coin) .elementor-icon,
.ft-menu-3 .elementor-widget-icon-box.ft3-current:not(.ft3-coin) .elementor-icon-box-title,
.ft-menu-3 .elementor-widget-icon-box.ft3-current:not(.ft3-coin) .elementor-icon-box-title a {
    color: var(--e-global-color-06085dd) !important;
}
.ft-menu-3 .elementor-widget-icon-box.ft3-current:not(.ft3-coin) .elementor-icon svg,
.ft-menu-3 .elementor-widget-icon-box.ft3-current:not(.ft3-coin) .elementor-icon svg * {
    fill: var(--e-global-color-06085dd) !important;
}

/* ปุ่มกลาง: เปลี่ยนแค่สีข้อความ */
.ft-menu-3 .elementor-widget-icon-box.ft3-coin.ft3-current .elementor-icon-box-title,
.ft-menu-3 .elementor-widget-icon-box.ft3-coin.ft3-current .elementor-icon-box-title a {
    color: var(--e-global-color-06085dd) !important;
}

/*ใส่สี radial container*/
.rdc {
    background:
        radial-gradient(circle at 50% 0%,
            color-mix(in srgb, var(--e-global-color-df1589c) 13%, transparent),
            transparent 26%),
        linear-gradient(180deg,
            color-mix(in srgb, var(--e-global-color-7536c20) 96%, transparent) 0%,
            color-mix(in srgb, var(--e-global-color-684e62f) 98%, transparent) 100%);
    border: 1px solid color-mix(in srgb, var(--e-global-color-df1589c) 24%, transparent);
    border-radius: 22px;
    padding: 16px;
    box-shadow:
        0 16px 36px rgba(0, 0, 0, .48),
        0 0 24px color-mix(in srgb, var(--e-global-color-df1589c) 12%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .06);
}

/* เงาเรืองหัวข้อในกล่อง rdc */
.rdc .elementor-heading-title {
    text-shadow:
        /* เรืองชั้นใน ตามสีหัวข้อ */
        0 0 12px color-mix(in srgb, currentColor 28%, transparent),
        /* เรืองชั้นนอก ตามสี rdc แสงและขอบ */
        0 0 22px color-mix(in srgb, var(--e-global-color-df1589c) 10%, transparent);
}

/* เงาดำใต้เนื้อหาในกล่อง rdc */
.rdc .elementor-widget-text-editor p {
    text-shadow: 5px 5px 16px rgba(0, 0, 0, .6);
}

/*hover container ใช้คู่กับ rdc*/
.rdc-hover {
    transition: border-color .3s ease, box-shadow .3s ease;
}

.rdc-hover:hover {
    border-color: color-mix(in srgb, var(--e-global-color-df1589c) 36%, transparent);
    box-shadow:
        0 20px 42px rgba(0, 0, 0, .54),
        0 0 30px color-mix(in srgb, var(--e-global-color-df1589c) 18%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .08);
}/* End custom CSS */