.elementor-90 .elementor-element.elementor-element-6e748024{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-7719d5b2{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-90 .elementor-element.elementor-element-22695682 > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-90 .elementor-element.elementor-element-22695682 .elementor-heading-title{color:var( --e-global-color-secondary );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-90 .elementor-element.elementor-element-c9d73f8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-90 .elementor-element.elementor-element-524a2fd3{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;}.elementor-90 .elementor-element.elementor-element-5179bde9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-17db5f0d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-7dbb9ae5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-33651902{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-382b70de{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-558ea3a3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-65407a41{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-7062eb9c{--display:flex;}.elementor-90 .elementor-element.elementor-element-a3a6d16{--display:flex;}.elementor-90 .elementor-element.elementor-element-12660a63{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-abda1aa{--display:flex;}.elementor-90 .elementor-element.elementor-element-667a86d8 .elementor-heading-title{color:var( --e-global-color-secondary );}.elementor-90 .elementor-element.elementor-element-173a5da9{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;}.elementor-90 .elementor-element.elementor-element-77fd82d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-466503b6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-75b43016{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-30c39605{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-4bacf0f0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-90 .elementor-element.elementor-element-2191770{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-74c19c84{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-90 .elementor-element.elementor-element-5c2cc391{--display:flex;}.elementor-90 .elementor-element.elementor-element-73adc72{--spacer-size:50px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-90 .elementor-element.elementor-element-5179bde9{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-17db5f0d{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-7dbb9ae5{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-33651902{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-382b70de{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-558ea3a3{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-a3a6d16{--content-width:800px;}.elementor-90 .elementor-element.elementor-element-77fd82d{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-466503b6{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-75b43016{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-30c39605{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-4bacf0f0{--width:33.3333%;}.elementor-90 .elementor-element.elementor-element-2191770{--width:33.3333%;}}@media(max-width:1024px){.elementor-90 .elementor-element.elementor-element-c9d73f8{--padding-top:10px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-90 .elementor-element.elementor-element-c9d73f8{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-90 .elementor-element.elementor-element-a3a6d16{--content-width:80%;}}/* Start custom CSS *//* ================================
   Guide / Hotspot Global CSS
   ================================ */

.guide-box {
  position: relative;
  max-width: 1200px;
  margin: auto;
}

.guide-box img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== Hotspot ===== */
.guide-box .hotspot {
  position: absolute;
  border: 2px solid red;
  border-radius: 6px;
  cursor: pointer;
  z-index: 5;
  background: rgba(255, 0, 0, 0);
}

/* hover highlight */
.guide-box .hotspot:hover {
  box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.2);
}

/* ===== Step number (Responsive) ===== */
.guide-box .hotspot::after {
  content: attr(data-step);
  position: absolute;
  top: -0.6em;
  right: -0.6em;

  width: clamp(18px, 2.2vw, 24px);
  height: clamp(18px, 2.2vw, 24px);

  background: red;
  color: #fff;
  font-size: clamp(11px, 1.2vw, 13px);
  font-weight: bold;

  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== Tooltip (Responsive Core) ===== */
.guide-box .tooltip {
  position: absolute;
  bottom: 100%;
  left: 0;

  background: rgba(0, 0, 0, 0.85);
  color: #fff;

  padding: clamp(8px, 1.5vw, 14px);
  border-radius: 8px;

  font-size: clamp(12px, 1.4vw, 14px);
  line-height: 1.5;

  width: max-content;
  max-width: min(90vw, 360px); /* สำคัญมาก */
  white-space: normal;
  word-break: break-word;

  /* hide */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
  z-index: 10;
}

/* Tooltip ยาวพิเศษ */
.guide-box .tooltip.long {
  max-width: min(90vw, 420px);
}

/* ===== Desktop Hover ===== */
@media (hover: hover) {
  .guide-box .hotspot:hover .tooltip {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
}

/* ===== Touch / Mobile ===== */
@media (hover: none) {
  .guide-box .hotspot {
    outline: none;
  }

  .guide-box .hotspot:focus .tooltip,
  .guide-box .hotspot:focus-within .tooltip {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
}

/* ===== Tablet ===== */
@media (max-width: 1024px) {
  .guide-box .tooltip {
    font-size: 13px;
    max-width: 80vw;
  }
}

/* ===== Mobile ===== */
@media (max-width: 767px) {
  .guide-box .hotspot {
    border-width: 1.5px;
  }.guide-box .hotspot::after {
    width: 10px;
    height: 10px;
    font-size: 8px;
  }

  .guide-box .tooltip {
    font-size: 10px;
    max-width: 55vw;
    left: 50px;
    transform: translate(-50%, 8px);
    text-align: left;
  }

  .guide-box .hotspot:focus .tooltip,
  .guide-box .hotspot:focus-within .tooltip {
    transform: translate(-50%, 0);
  }
}/* End custom CSS */