/* Reading surface using the shared paper, ink, Sarabun and LINE controls. */
.answers-wrap { max-width:70ch; margin-inline:auto; padding:32px var(--page-x) 80px; box-sizing:content-box; }
.answers-page h1 { font-family:"Sarabun",sans-serif; font-size:clamp(32px,4.3vw,56px); font-weight:300; line-height:1.3; color:var(--red); margin:36px 0 32px; overflow-wrap:anywhere; text-wrap:balance; }
.answers-page h2 { font-family:"Sarabun",sans-serif; font-size:clamp(23px,2.5vw,30px); font-weight:700; line-height:1.45; margin:0 0 16px; text-wrap:balance; }
.answers-page p, .answers-page li { font-size:18px; line-height:1.9; overflow-wrap:anywhere; }
.answers-page p { margin:0 0 20px; }
.answers-page ul { padding-left:1.4em; }
.answers-page li + li { margin-top:12px; }
.answers-page main a:not(.button):not(.video-facade) { text-decoration:underline; text-underline-offset:.2em; }
.answers-page main a:focus-visible { outline:3px solid var(--ink); outline-offset:5px; }
.answers-breadcrumb ol { display:flex; flex-wrap:wrap; gap:8px 12px; list-style:none; padding:0; margin:0; }
.answers-breadcrumb li, .answers-breadcrumb li + li { font-size:14px; line-height:1.7; margin:0; }
.answers-breadcrumb li + li::before { content:"›"; margin-right:12px; }
.answers-lead { padding:clamp(20px,3vw,32px); background:var(--v4-lime); border-radius:16px; }
.answers-lead h2 { font-size:18px; }
.answers-lead p { font-size:20px; margin:0; }
.answers-section, .answers-group { margin-top:56px; }
.answers-section p:last-child { margin-bottom:0; }
.answers-page figure { margin:0; }
.answers-page figcaption { margin-top:16px; line-height:1.75; font-size:16px; }
.answers-page .video-embed { width:100%; }
.answers-group > ul { list-style:none; padding:0; margin:0; }
.answers-group > ul > li { padding:24px 0 28px; border-top:1px solid var(--line); margin:0; }
.answers-group h3 { font-size:22px; font-weight:700; line-height:1.55; margin:0 0 10px; }
.answers-group p { margin-bottom:12px; }
.answers-read-more { font-size:16px; font-weight:700; }
.answers-cta { margin-top:64px; background:var(--v4-ink); color:var(--paper); padding:clamp(22px,3vw,36px); border-radius:16px; }
.answers-cta h2 { color:var(--v4-lime); }
.answers-cta .cta-row { flex-wrap:wrap; }
.answers-cta .button--secondary { border:1px solid currentColor; }
.answers-cta .cta-call { color:var(--paper); }
.answers-page .answers-updated { font-size:14px; margin:40px 0 0; color:var(--muted); }
html[lang^="zh"] .answers-page h1, html[lang="ja"] .answers-page h1 { letter-spacing:0; }
@media (max-width:600px) {
  .answers-wrap { padding-top:24px; padding-bottom:64px; }
  .answers-page h1 { margin-top:28px; }
  .answers-page p, .answers-page li { font-size:17px; }
  .answers-breadcrumb li, .answers-breadcrumb li + li { font-size:13px; }
  .answers-lead p { font-size:18px; }
  .answers-cta .cta-row { align-items:stretch; }
  .answers-cta .button { width:100%; justify-content:center; padding-inline:12px; white-space:normal; text-align:center; }
}
@media (prefers-reduced-motion:reduce) { .answers-page .video-facade img, .answers-page .video-facade__play { transition:none; transform:none; } }

/* fixed header: pages.css drops main padding on mobile because other subpages pad their hero instead */
@media (max-width:760px) { .answers-page main { padding-top:var(--header-height); } }