/* Two-page review only. Remove the layout allowlist only after approval.
   Google Fonts Prompt is self-hosted by the existing application (500/600/700). */
.readability-preview {
  --content-max: 1600px;
  --content-width: calc(100% - 32px);
  --copy-size: 16px;
  --card-gap: 24px;
  font-family: 'Prompt', system-ui, sans-serif;
  font-size: var(--copy-size);
  font-weight: 500;
  line-height: 1.8;
}
.readability-preview .container {
  width: var(--content-width);
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: 0;
}
.readability-preview .container .container { width: 100%; max-width: none; }
.readability-preview :is(p,li,a,button,h1,h2,h3,h4,span) { letter-spacing: normal; }
.readability-preview :is(.grid,.flex) > * { min-width: 0; }
.readability-preview :is(h1,h2,h3,h4) { line-height: 1.5; }
.readability-preview :is(.hrk-hero-title,.page-hero h1) { font-size: clamp(32px,3.9vw,56px); font-weight: 700; line-height: 1.45; }
.readability-preview :is(.section-title,main section h2:not(.sr-only,.news-card-title,.card h2)) { font-size: clamp(28px,2.5vw,36px); }
.readability-preview main h3:not(.news-card-title,.card h3) { font-size: clamp(20px,1.7vw,24px); }
.readability-preview :is(.news-card-title,.card :is(h2,h3).news-card-title) {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #111f4b !important;
  margin-top: 10px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.readability-preview :is(.news-card-excerpt,.card p.news-card-excerpt) {
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color: #546078 !important;
  margin-top: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.readability-preview :is(.btn,.btn-gold,.btn-navy,.btn-outline,.btn-outline-gold,.btn-outline-light,.link-arrow,.hrk-btn-gold,.hrk-btn-outline) { font-size: 16px; line-height: 1.7; white-space: normal; }
.readability-preview :is(.text-\[15px\],.text-base,main .text-sm,main .hrk-hero-desc) { font-size: var(--copy-size); line-height: 1.8; }
.readability-preview :is(.text-xs,.text-\[13px\],.text-\[13\.5px\],.news-card-meta,.news-card-meta .badge,.eyebrow,.hrk-hero-eyebrow) { font-size: 14px; line-height: 1.7; }
.readability-preview .text-ink-muted { color: var(--th-text-muted); }
.readability-preview main :is(.grid.gap-4,.grid.gap-5,.grid.gap-6) { gap: var(--card-gap); }
.readability-preview main :is(.card.p-5,.card.p-6,.card > .p-5,.card > .p-6) { padding: 24px; }
.readability-preview main .line-clamp-2 { display: block; -webkit-line-clamp: unset; overflow: visible; }
.readability-preview main :is(.card > .flex,.card > div,.card > a) { height: auto; }
.readability-preview main .card > .flex.items-center.justify-between { flex-wrap: wrap; }
.readability-preview main .card > div > .flex.items-center.justify-between { flex-wrap: wrap; }
.readability-preview section[aria-labelledby='programs-title'] ul { grid-template-columns: minmax(0,1fr); }
.readability-preview main p { overflow-wrap: anywhere; }
.readability-preview main .container > div > p:not(.eyebrow) { max-width: 70ch; }
.readability-preview main img:not(.hrk-hero-bg-img) { object-fit: contain; }
.readability-preview main article.container > :is(p,.prose-hrk,.news-card-meta,.link-arrow) { max-width: 900px; margin-inline: auto; }
.readability-preview main article.container > img { max-height: 720px; height: auto; }
.readability-preview .prose-hrk { overflow-wrap: anywhere; }
.readability-preview .prose-hrk img { max-width: 100%; height: auto; }
.readability-preview .prose-hrk :is(p,li) { font-size: var(--copy-size); line-height: 1.8; }
.readability-preview main article :is(p,li) { line-height: 1.8; }
.readability-preview footer :is(ul,address) { font-size: 16px; line-height: 1.8; }
.readability-preview footer .text-white\/50 { color: #cbd5e1; }
.readability-preview footer img { flex-shrink: 0; object-fit: contain; }
.readability-preview [data-drawer]:not([hidden]) { display: block; }
.readability-preview [data-drawer] :is(a,button) { font-family: 'Prompt', system-ui, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; }
.readability-preview > div.bg-navy-deep > .container { padding-block: 6px; }

@media (min-width: 640px) {
  .readability-preview { --content-width: calc(100% - 48px); }
}
@media (min-width: 768px) {
  .readability-preview section[aria-labelledby='programs-title'] ul { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width: 1024px) {
  .readability-preview { --content-width: 92%; --copy-size: 18px; --card-gap: 28px; }
  .readability-preview main :is(.card.p-5,.card.p-6,.card > .p-5,.card > .p-6) { padding: 28px; }
}
@media (min-width: 1360px) {
  .readability-preview section[aria-labelledby='programs-title'] ul { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 639px) {
  .readability-preview main .card > .flex.items-center { flex-wrap: wrap; }
  .readability-preview footer .container > div > .flex { flex-wrap: wrap; }
}
/* The original about section was full-bleed; align its inner grid with every section. */
.readability-preview section[aria-labelledby='about-title'] > .grid {
  width: var(--content-width); max-width: var(--content-max); margin-inline: auto;
  gap: var(--card-gap); padding-block: 48px;
}
.readability-preview section[aria-labelledby='about-title'] > .grid > div { padding-inline: 0; }
.readability-preview section[aria-labelledby='about-title'] > .grid > img { height: auto; align-self: center; min-height: 0; }
html:not([data-theme]) .readability-preview { --th-text-muted: #46536b; }
.readability-preview footer h3 { font-size: 20px; line-height: 1.5; }
.readability-preview [aria-labelledby='gal-title'] .font-heading { font-size: 20px; }
.readability-preview [aria-labelledby='svc-title'] .card { align-items: center; text-align: center; }
@media (max-width: 767px) {
  .readability-preview main .card > div.flex.items-center.justify-between { flex-wrap: wrap; }
}
/* Preserve the intended partner-logo dimensions even when inline styles are blocked by CSP. */
.readability-preview .marquee-container { min-width: 0; }
.readability-preview .marquee-container img { height: 90px; width: auto; max-width: 280px; flex-shrink: 0; }
.readability-preview > div.bg-navy-deep nav a { font-size: 15px; }
.readability-preview nav[aria-label='เปลี่ยนภาษา'] > :is(a, span[aria-current]) { min-width: 28px; text-align: center; font-size: 14px; }