/* R108_AAA_TYPOGRAPHY_V61_ACTIVE
   ลำดับขนาดฟอนต์ส่วนกลางสำหรับหน้า ที่พัก / คาเฟ่ / ร้านอาหาร / บริการ / รายละเอียดห้อง / การจอง */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html body#r108-landing-body,
html body.experience-page,
html body.room-detail-page,
html body.success-bill-page,
html body .app-shell {
  font-size: 15px !important;
  line-height: 1.65;
}

/* เมนูด้านบนและชื่อรีสอร์ท */
html body .topbar .brand,
html body .room-detail-topbar .brand,
html body .experience-topbar .brand {
  font-size: 19px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
}

html body .topbar .brand small,
html body .room-detail-topbar .brand small,
html body .experience-topbar .brand small {
  font-size: 11px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
}

html body .topbar .menu,
html body .topbar .menu a,
html body .topbar .button,
html body .topbar .nav-actions .button,
html body .r108-page-nav .button,
html body .nav-menu-button,
html body .room-detail-nav a,
html body .experience-footer nav a {
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
}

/* หน้า index: หัวเรื่องหลัก */
html body#r108-landing-body .hero h1 {
  font-size: clamp(35px, 4.2vw, 48px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
}

html body#r108-landing-body .hero .lead,
html body#r108-landing-body .hero p {
  font-size: 15px !important;
  line-height: 1.75 !important;
}

/* หัวข้อแต่ละโมดูล */
html body#r108-landing-body .section-head h2,
html body#r108-landing-body #rooms > .container > .section-head h2,
html body#r108-landing-body #nearby .section-head h2,
html body#r108-landing-body .aaa-why-showcase-head h2,
html body#r108-landing-body .aaa-process-card > div:first-child > h2,
html body#r108-landing-body .aaa-faq-wrap > div:first-child > h2,
html body#r108-landing-body .aaa-bottom-card > div:first-child > h2,
html body#r108-landing-body .aaa-bottom-cta .section-head h2 {
  font-size: clamp(26px, 3vw, 34px) !important;
  line-height: 1.25 !important;
  letter-spacing: -.015em !important;
}

html body#r108-landing-body .section-head > p,
html body#r108-landing-body .aaa-why-showcase-head h2 + p,
html body#r108-landing-body .aaa-process-card > div:first-child > p,
html body#r108-landing-body .aaa-bottom-card > div:first-child > p {
  font-size: 14px !important;
  line-height: 1.75 !important;
}

/* หัวข้อในการ์ด */
html body#r108-landing-body .aaa-feature-card h3,
html body#r108-landing-body .aaa-package-card h3,
html body#r108-landing-body .aaa-nearby-grid h3,
html body#r108-landing-body #nearby .aaa-nearby-card h3,
html body#r108-landing-body .aaa-review-card h3,
html body#r108-landing-body .aaa-process-card h3,
html body#r108-landing-body .room-card h3,
html body#r108-landing-body .room-name-row h3,
html body#r108-landing-body .aaa-why-showcase-copy h3 {
  font-size: 19px !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

html body#r108-landing-body .room-card p,
html body#r108-landing-body .aaa-feature-card p,
html body#r108-landing-body .aaa-package-card p,
html body#r108-landing-body .aaa-nearby-card p,
html body#r108-landing-body .aaa-review-card p,
html body#r108-landing-body .aaa-process-card p,
html body#r108-landing-body .aaa-why-showcase-copy p,
html body#r108-landing-body .faq-answer {
  font-size: 13.5px !important;
  line-height: 1.7 !important;
}

/* ฟอร์มจองและปอปอัพ */
html body#r108-landing-body .booking-title-row h2,
html body#r108-landing-body .booking-card h2,
html body#r108-landing-body .booking-modal h2,
html body#r108-landing-body .modal h2 {
  font-size: 22px !important;
  line-height: 1.3 !important;
}

html body#r108-landing-body .booking-card label,
html body#r108-landing-body .booking-card input,
html body#r108-landing-body .booking-card select,
html body#r108-landing-body .booking-card textarea,
html body#r108-landing-body .booking-card button {
  font-size: 13px !important;
}

/* หน้า คาเฟ่ / ร้านอาหาร / บริการของเรา */
html body.experience-page .experience-hero h1 {
  font-size: clamp(38px, 5vw, 50px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
}

html body.experience-page .experience-story-copy h2,
html body.experience-page .experience-section-heading h2,
html body.experience-page .experience-feature-copy h2 {
  font-size: clamp(27px, 3.2vw, 36px) !important;
  line-height: 1.28 !important;
  letter-spacing: -.015em !important;
}

html body.experience-page .experience-card h3 {
  font-size: 19px !important;
  line-height: 1.4 !important;
}

html body.experience-page .experience-hero-copy > p:not(.experience-eyebrow) {
  font-size: 15px !important;
  line-height: 1.8 !important;
}

html body.experience-page .experience-story-copy > p:not(.experience-eyebrow),
html body.experience-page .experience-feature-copy > p:not(.experience-eyebrow),
html body.experience-page .experience-card p {
  font-size: 14px !important;
  line-height: 1.8 !important;
}

html body.experience-page .experience-eyebrow,
html body.experience-page .experience-breadcrumb,
html body.experience-page .experience-tags span,
html body.experience-page .experience-card-number,
html body.experience-page .experience-text-link {
  font-size: 12px !important;
}

/* หน้ารายละเอียดที่พัก */
html body.room-detail-page .room-detail-title-row h1 {
  font-size: clamp(32px, 4vw, 42px) !important;
  line-height: 1.18 !important;
}

html body.room-detail-page .room-detail-card h2,
html body.room-detail-page .room-detail-booking-card h2 {
  font-size: 22px !important;
  line-height: 1.3 !important;
}

html body.room-detail-page .room-detail-card h3,
html body.room-detail-page .room-detail-booking-card h3 {
  font-size: 18px !important;
  line-height: 1.35 !important;
}

html body.room-detail-page .room-detail-card p,
html body.room-detail-page .room-detail-booking-card p,
html body.room-detail-page .room-detail-card li,
html body.room-detail-page .room-detail-booking-card label,
html body.room-detail-page .room-detail-booking-card input,
html body.room-detail-page .room-detail-booking-card select,
html body.room-detail-page .room-detail-booking-card textarea,
html body.room-detail-page .room-detail-booking-card button {
  font-size: 13.5px !important;
  line-height: 1.7 !important;
}

/* หน้าสรุปการจอง */
html body.success-bill-page .success-bill-head h1,
html body.success-bill-page .success-header h1 {
  font-size: 29px !important;
  line-height: 1.25 !important;
}

html body.success-bill-page .success-bill-section-head h2,
html body.success-bill-page h2 {
  font-size: 20px !important;
  line-height: 1.35 !important;
}

html body.success-bill-page h3 {
  font-size: 17px !important;
  line-height: 1.4 !important;
}

html body.success-bill-page p,
html body.success-bill-page li,
html body.success-bill-page td,
html body.success-bill-page th,
html body.success-bill-page label,
html body.success-bill-page input,
html body.success-bill-page button {
  font-size: 13px !important;
  line-height: 1.65 !important;
}

/* หน้ารายการจองที่อยู่บนซับโดเมนเดียวกัน */
html body .app-topbar h1,
html body .app-main h1,
html body .page-title h1 {
  font-size: 27px !important;
  line-height: 1.25 !important;
}

html body .app-main h2,
html body .app-card h2,
html body .page-title h2 {
  font-size: 21px !important;
  line-height: 1.35 !important;
}

html body .app-main h3,
html body .app-card h3 {
  font-size: 17px !important;
  line-height: 1.4 !important;
}

@media (max-width: 680px) {
  html body#r108-landing-body,
  html body.experience-page,
  html body.room-detail-page,
  html body.success-bill-page,
  html body .app-shell {
    font-size: 14px !important;
  }

  html body .topbar .brand,
  html body .room-detail-topbar .brand,
  html body .experience-topbar .brand {
    font-size: 17px !important;
  }

  html body .topbar .brand small,
  html body .room-detail-topbar .brand small,
  html body .experience-topbar .brand small {
    font-size: 10px !important;
  }

  html body .topbar .menu,
  html body .topbar .menu a,
  html body .topbar .button,
  html body .topbar .nav-actions .button,
  html body .r108-page-nav .button,
  html body .nav-menu-button,
  html body .room-detail-nav a {
    font-size: 12px !important;
  }

  html body#r108-landing-body .hero h1 {
    font-size: 29px !important;
    line-height: 1.2 !important;
  }

  html body#r108-landing-body .hero .lead,
  html body#r108-landing-body .hero p {
    font-size: 13.5px !important;
  }

  html body#r108-landing-body .section-head h2,
  html body#r108-landing-body #rooms > .container > .section-head h2,
  html body#r108-landing-body #nearby .section-head h2,
  html body#r108-landing-body .aaa-why-showcase-head h2,
  html body#r108-landing-body .aaa-process-card > div:first-child > h2,
  html body#r108-landing-body .aaa-faq-wrap > div:first-child > h2,
  html body#r108-landing-body .aaa-bottom-card > div:first-child > h2,
  html body#r108-landing-body .aaa-bottom-cta .section-head h2 {
    font-size: 22px !important;
    line-height: 1.3 !important;
  }

  html body#r108-landing-body .aaa-feature-card h3,
  html body#r108-landing-body .aaa-package-card h3,
  html body#r108-landing-body .aaa-nearby-grid h3,
  html body#r108-landing-body #nearby .aaa-nearby-card h3,
  html body#r108-landing-body .aaa-review-card h3,
  html body#r108-landing-body .aaa-process-card h3,
  html body#r108-landing-body .room-card h3,
  html body#r108-landing-body .room-name-row h3,
  html body#r108-landing-body .aaa-why-showcase-copy h3 {
    font-size: 17px !important;
  }

  html body#r108-landing-body .section-head > p,
  html body#r108-landing-body .room-card p,
  html body#r108-landing-body .aaa-feature-card p,
  html body#r108-landing-body .aaa-package-card p,
  html body#r108-landing-body .aaa-nearby-card p,
  html body#r108-landing-body .aaa-review-card p,
  html body#r108-landing-body .aaa-process-card p,
  html body#r108-landing-body .aaa-why-showcase-copy p {
    font-size: 12.8px !important;
    line-height: 1.65 !important;
  }

  html body#r108-landing-body .booking-title-row h2,
  html body#r108-landing-body .booking-card h2,
  html body#r108-landing-body .booking-modal h2,
  html body#r108-landing-body .modal h2 {
    font-size: 20px !important;
  }

  html body.experience-page .experience-hero h1 {
    font-size: 31px !important;
    line-height: 1.2 !important;
  }

  html body.experience-page .experience-story-copy h2,
  html body.experience-page .experience-section-heading h2,
  html body.experience-page .experience-feature-copy h2 {
    font-size: 23px !important;
    line-height: 1.32 !important;
  }

  html body.experience-page .experience-card h3 {
    font-size: 17px !important;
  }

  html body.experience-page .experience-hero-copy > p:not(.experience-eyebrow),
  html body.experience-page .experience-story-copy > p:not(.experience-eyebrow),
  html body.experience-page .experience-feature-copy > p:not(.experience-eyebrow),
  html body.experience-page .experience-card p {
    font-size: 13px !important;
    line-height: 1.7 !important;
  }

  html body.room-detail-page .room-detail-title-row h1 {
    font-size: 29px !important;
  }

  html body.room-detail-page .room-detail-card h2,
  html body.room-detail-page .room-detail-booking-card h2 {
    font-size: 20px !important;
  }

  html body.room-detail-page .room-detail-card h3,
  html body.room-detail-page .room-detail-booking-card h3 {
    font-size: 17px !important;
  }

  html body.success-bill-page .success-bill-head h1,
  html body.success-bill-page .success-header h1 {
    font-size: 25px !important;
  }

  html body.success-bill-page .success-bill-section-head h2,
  html body.success-bill-page h2 {
    font-size: 18px !important;
  }
}