/* KHOKSI TRAVEL — restored one-pager (2026-10-03). The original main.css is not in the web archive; this is a new
   stylesheet in the spirit of the page: VIP van service, night-blue + gold. Prompt (headings) + Sarabun (text),
   both with Thai glyphs. Contrast: ink #1d2733 on #fff 15.4 · #f6efe0 on #0f2a44 13.0 · #0f2a44 on gold #f2b84b 7.6 */
:root {
  --kt-navy: #0f2a44;
  --kt-navy-2: #16395c;
  --kt-gold: #f2b84b;
  --kt-gold-d: #d99a2b;
  --kt-ink: #1d2733;
  --kt-mute: #4f5d6c;
  --kt-paper: #ffffff;
  --kt-sand: #f7f3ea;
  --kt-line: #e6dfcf;
  --kt-head: "Prompt", "Leelawadee UI", Tahoma, sans-serif;
  --kt-text: "Sarabun", "Leelawadee UI", Tahoma, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--kt-paper); color: var(--kt-ink); font: 18px/1.8 var(--kt-text); }
h1, h2, h3 { font-family: var(--kt-head); line-height: 1.3; margin: 0 0 .55em; color: var(--kt-navy); }
h2 { font-size: clamp(1.5rem, 3.2vw, 2rem); font-weight: 700; }
h3 { font-size: 1.2rem; font-weight: 600; }
p { margin: 0 0 1em; }
a { color: var(--kt-navy-2); }
.kt-wrap { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.kt-narrow { max-width: 780px; }
.kt-center { text-align: center; }

/* hero — the banner photo is lost; a night road with headlight streaks drawn in CSS */
.kt-hero { position: relative; overflow: hidden; text-align: center; color: #f6efe0; padding: 96px 0 104px;
  background:
    radial-gradient(600px 220px at 50% 115%, rgba(242, 184, 75, .35), transparent 70%),
    repeating-linear-gradient(100deg, transparent 0 46px, rgba(255, 255, 255, .035) 46px 48px),
    linear-gradient(160deg, #0a1f33 0%, var(--kt-navy) 55%, #1b4268 100%); }
.kt-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px;
  background: linear-gradient(90deg, transparent, var(--kt-gold), transparent); }
.kt-hero h1 { color: #fff; font-size: clamp(2.4rem, 7vw, 4.2rem); letter-spacing: .06em; margin-bottom: .25em; }
.kt-mark { display: inline-block; font: 600 .82rem/1 var(--kt-head); letter-spacing: .32em; color: var(--kt-gold);
  border: 1px solid rgba(242, 184, 75, .55); border-radius: 999px; padding: 8px 16px 8px 20px; margin-bottom: 22px; }
.kt-tag { font-size: clamp(1.1rem, 2.6vw, 1.35rem); max-width: 640px; margin: 0 auto 1.6em; color: #e9e1cf; }

.kt-btn { display: inline-block; background: var(--kt-gold); color: var(--kt-navy); font: 600 1.05rem/1 var(--kt-head);
  text-decoration: none; padding: 16px 34px; border-radius: 999px; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5);
  transition: background .15s, transform .15s; }
.kt-btn:hover { background: #ffd27a; color: var(--kt-navy); transform: translateY(-1px); }

.kt-sec { padding: 64px 0; }
.kt-band { background: var(--kt-sand); border-top: 1px solid var(--kt-line); border-bottom: 1px solid var(--kt-line); }
.kt-lead { font-style: italic; font-size: 1.1rem; color: var(--kt-ink); }
.kt-phone { display: inline-block; font: 600 1.15rem/1.4 var(--kt-head); color: var(--kt-navy);
  background: #fff7e6; border-left: 4px solid var(--kt-gold-d); padding: 12px 18px; border-radius: 0 10px 10px 0; }

.kt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 32px; }
.kt-card { background: #fff; border: 1px solid var(--kt-line); border-radius: 16px; padding: 26px 28px;
  box-shadow: 0 14px 34px -26px rgba(15, 42, 68, .55); }
.kt-check { list-style: none; margin: 0; padding: 0; }
.kt-check li { position: relative; padding: 0 0 12px 34px; }
.kt-check li::before { content: ""; position: absolute; left: 0; top: .45em; width: 20px; height: 20px; border-radius: 50%;
  background: var(--kt-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 10.5 3 3 6-6.5' fill='none' stroke='%230f2a44' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat; }

.kt-contact { background: var(--kt-navy); color: #f6efe0; }
.kt-contact h2 { color: #fff; }
.kt-foot { background: #0a1f33; color: #b9c4d0; font-size: .95rem; padding: 22px 0; text-align: center; }

@media (max-width: 760px) {
  body { font-size: 17px; }
  .kt-hero { padding: 72px 0 80px; }
  .kt-grid { grid-template-columns: minmax(0, 1fr); }
  .kt-sec { padding: 48px 0; }
  .kt-card { padding: 22px; }
}