/* Editorial introductions for the dedicated navigation pages. */
.content-page .page-intro { display:grid; grid-template-columns:1.12fr 1fr; align-items:center; gap:64px; padding-top:48px; padding-bottom:80px; }
.page-breadcrumb { display:flex; gap:12px; align-items:center; color:#68726c; font-size:12px; margin-bottom:42px; }
.page-breadcrumb a { text-decoration:none; }
.page-breadcrumb a:hover { color:#b74827; }
.page-kicker { display:block; font-size:11px; letter-spacing:.09em; font-weight:700; text-transform:uppercase; color:#68726c; margin:0 0 22px; }
.content-page .page-intro h1 { color:#242d29; font-size:clamp(38px,4.5vw,65px); font-weight:650; letter-spacing:-.055em; line-height:1.23; margin:0 0 26px; white-space:normal; }
html[lang="th"] .content-page .page-intro h1 { font-size:clamp(36px,3.7vw,54px); line-height:1.45; letter-spacing:-.045em; }
.page-title-accent { color:#bc4c2d; }
.page-intro-description { max-width:540px; color:#606c65; font-size:16px; line-height:1.85; margin:0; }
.page-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:30px; }
.page-button { display:inline-flex; align-items:center; justify-content:space-between; gap:22px; min-height:48px; padding:13px 20px; border:1px solid #b74827; border-radius:8px; background:#b74827; color:#fff; font-size:13px; font-weight:600; text-decoration:none; transition:background .2s; }
.page-button:hover { background:#96391d; }
.page-button-secondary { color:#29342d; border-color:#d9dfd7; background:#fff; }
.page-button-secondary:hover { background:#f0f3ec; }
.page-button:focus-visible { outline:3px solid #d4863f; outline-offset:4px; }
.page-art { min-width:0; }
.capability-mosaic { display:grid; grid-template-columns:1fr 1fr; gap:13px; transform:rotate(-2deg); padding:24px 8px 6px; }
.capability-tile { position:relative; overflow:hidden; border:1px solid #e0e4dc; background:white; border-radius:17px; box-shadow:0 12px 24px #253b2810; }
.capability-tile:nth-child(even) { transform:translateY(25px); }
.capability-tile img { display:block; width:100%; height:auto; aspect-ratio:1.18; object-fit:cover; object-position:top; }
.capability-tile > span { display:flex; gap:12px; align-items:center; padding:14px; font-size:12px; font-weight:600; color:#29342d; }
.capability-tile small { font-size:10px; color:#7b857d; }
.page-photo { position:relative; overflow:hidden; border-radius:24px; background:#e9eddf; }
.page-photo > img { display:block; width:100%; height:470px; object-fit:cover; }
.page-photo-caption { position:absolute; left:20px; right:20px; bottom:20px; padding:22px; background:#fffef6f2; border-radius:12px; color:#26362b; }
.page-photo-caption > span { color:#b74827; font-size:13px; font-weight:700; }
.page-photo-caption p { margin:10px 0 0; font-size:20px; font-weight:600; }
.page-brand-art { display:flex; flex-direction:column; align-items:center; border-radius:50% 50% 22px 22px; background:radial-gradient(ellipse at 50% 30%,#fff3d7,#f2eee4 75%); padding:12px 24px 30px; }
.page-brand-art > img { display:block; width:min(100%,400px); height:auto; }
.page-brand-art > div { text-align:center; }
.page-brand-name { color:#29342d; font-size:38px; font-weight:700; letter-spacing:-2px; }
.page-brand-name > span { color:#b74827; }
.page-brand-art p { font-size:9px; letter-spacing:.15em; color:#68726c; margin:8px 0 0; }
.contact-brief-card { background:#edf0e7; color:#29342d; padding:36px; border-radius:22px; border:1px solid #dde3d4; }
.contact-brief-card h2 { font-size:30px; line-height:1.5; letter-spacing:-.025em; font-weight:600; margin:0 0 20px; }
.contact-brief-card ol { margin:0; padding:0; list-style:none; }
.contact-brief-card li { display:flex; gap:20px; border-top:1px solid #d4dccb; padding:19px 0; }
.contact-brief-card li:last-child { padding-bottom:0; }
.contact-brief-card li > span { color:#b74827; font-size:12px; padding-top:5px; }
.contact-brief-card h3 { font-size:15px; margin:0 0 7px; }
.contact-brief-card li p { font-size:13px; line-height:1.7; color:#606c65; margin:0; }
.content-page .page-details { padding-block:85px; }
.page-detail-heading { max-width:650px; margin-bottom:32px; }
.page-detail-heading h2,.page-next h2 { font-size:clamp(26px,3vw,40px); line-height:1.5; font-weight:600; letter-spacing:-.025em; margin:0; color:#29342d; }
.page-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.page-detail-card { border-top:2px solid #dbe2d4; padding-top:23px; }
.page-detail-number { display:block; color:#b74827; font-size:12px; margin-bottom:25px; }
.page-detail-card h3 { color:#29342d; font-size:19px; font-weight:600; margin:0 0 12px; }
.page-detail-card p { font-size:14px; line-height:1.9; color:#606c65; margin:0; }
.page-next { display:flex; align-items:center; justify-content:space-between; gap:30px; background:#edf0e7; padding:35px 40px; border-radius:18px; margin-bottom:85px; }
.page-next h2 { font-size:26px; }
.page-next p { font-size:14px; line-height:1.8; color:#606c65; margin:10px 0 0; }
.page-next .page-button { flex-shrink:0; }
.content-page #services,.content-page #about { border-top:1px solid #dfe3dd; }
.content-page .enquiry-section { margin-top:20px; }
.page-contact .enquiry-section { margin-top:0; }
@media(max-width:1000px) {
  .content-page .page-intro { gap:32px; }
  .capability-tile > span { padding:11px 9px; gap:6px; font-size:10px; }
  .page-photo > img { height:420px; }
  .contact-brief-card { padding:26px; }
  .page-detail-grid { gap:26px; }
  .page-next { flex-direction:column; align-items:flex-start; }
}
@media(max-width:760px) {
  .content-page .page-intro { grid-template-columns:1fr; padding-top:24px; padding-bottom:48px; gap:34px; }
  .page-breadcrumb { margin-bottom:30px; }
  .content-page .page-intro h1 { font-size:42px; }
  html[lang="th"] .content-page .page-intro h1 { font-size:36px; }
  .page-intro-description { font-size:15px; }
  .page-kicker { font-size:10px; margin-bottom:15px; }
  .page-actions { gap:10px; margin-top:24px; }
  .page-button { padding:12px 15px; gap:16px; font-size:12px; }
  .capability-mosaic { padding:0 7px 28px; max-width:480px; margin:auto; }
  .capability-tile img { aspect-ratio:1.3; }
  .capability-tile > span { padding:12px; font-size:11px; }
  .page-photo > img { height:330px; }
  .page-photo-caption { padding:16px; left:14px; right:14px; bottom:14px; }
  .page-photo-caption p { font-size:18px; }
  .page-brand-art { max-width:440px; margin:auto; }
  .page-brand-art > img { max-width:290px; }
  .contact-brief-card h2 { font-size:27px; }
  .content-page .page-details { padding-block:52px; }
  .page-detail-grid { grid-template-columns:1fr; gap:30px; }
  .page-detail-number { margin-bottom:14px; }
  .page-next { padding:26px; margin-bottom:45px; }
}
@media(prefers-reduced-motion:reduce) { .page-button { transition:none; } }
