/* ============================================================
   sx-design-skin — re-skin the about / travel / inquiry page CONTENT
   to the home (Claude Design) look while keeping the content/markup.
   The "jogyeongdo" content used dark card headers, heavy shadows and a
   22px radius; the home is light & clean (white cards, #e6ebf2 borders,
   navy text, light section bands). Loaded AFTER style.css so it wins;
   scoped to content classes so the sx-header/sx-footer are untouched.
   ============================================================ */

:root { --sx-card-radius: 16px; }

/* ---- Section rhythm + headings (match the home) ---- */
.about-section, .travel-section, .inquiry-section { padding: 72px 0; }
.about-section, .travel-section, .inquiry-section { background: #ffffff; }
.about-section:nth-of-type(even),
.travel-section:nth-of-type(even),
.inquiry-section:nth-of-type(even) { background: #f8fafc; }
.section-heading { color: #071536 !important; font-weight: 700; letter-spacing: -0.02em; }
.section-divider { background: #314066 !important; }

/* ---- Unify every content card to the home card ---- */
.stat-card, .fleet-card, .cabin-card, .checkin-card, .airport-guide-card,
.contact-card, .faq-item, .inquiry-form-wrap, .baggage-table-wrap,
.prohibited-item, .form-success {
  background: #ffffff !important;
  border: 1px solid #e6ebf2 !important;
  border-radius: var(--sx-card-radius) !important;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.04) !important;
}
.stat-card, .cabin-card, .checkin-card, .airport-guide-card, .contact-card,
.fleet-card, .prohibited-item { transition: transform .18s, box-shadow .18s, border-color .18s; }
.stat-card:hover, .fleet-card:hover, .cabin-card:hover, .checkin-card:hover,
.airport-guide-card:hover, .contact-card:hover, .prohibited-item:hover {
  border-color: #cdd7e5 !important;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.10) !important;
  transform: translateY(-3px);
}

/* ---- Lighten the dark card headers / banners to the home light look ---- */
.fleet-card-top {
  background: #f8fafc !important;
  border-bottom: 1px solid #e6ebf2 !important;
}
.fleet-card-top, .fleet-card-top *:not(svg):not(path):not(use) { color: #071536 !important; }
.fleet-route { color: #64748b !important; }
.fleet-card-top svg { color: #94a3b8 !important; opacity: .8; }

.skyteam-banner {
  background: #f8fafc !important;
  border: 1px solid #e6ebf2 !important;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.04) !important;
}
.skyteam-banner *:not(svg):not(path):not(use):not(img) { color: #1a2338 !important; }

/* ---- Tables: light header (home palette), clean rows ---- */
.baggage-table, .hours-table { background: #fff; border-collapse: separate; border-spacing: 0; }
.baggage-table thead th, .hours-table thead th,
.baggage-table thead, .hours-table thead {
  background: #f8fafc !important;
  color: #1a2338 !important;
  border-bottom: 1px solid #e6ebf2 !important;
}
.baggage-table td, .baggage-table th, .hours-table td, .hours-table th {
  border-bottom: 1px solid #eef2f7 !important;
}

/* ---- FAQ ---- */
.faq-item { background: #fff !important; }
.faq-question { color: #1a2338 !important; font-weight: 600; }

/* ---- Forms (Contact) ---- */
.form-control {
  border: 1px solid #e6ebf2 !important; border-radius: 12px !important;
  background: #fff !important; color: #1a2338 !important;
}
.form-control:focus { outline: 2px solid #314066 !important; border-color: transparent !important; }
.btn-submit, .discord-btn {
  background: #314066 !important; color: #fff !important;
  border-radius: 999px !important; border: none !important;
}
.btn-submit:hover, .discord-btn:hover { background: #1a2338 !important; }

/* ============================================================
   Polish pass — finer details to read like the home
   ============================================================ */

/* Hero: subtler brand watermark, tighter premium headings */
.about-hero-logo { opacity: .07 !important; }
.about-hero h1, .travel-hero h1, .inquiry-hero h1 { letter-spacing: -0.025em; line-height: 1.2; }
.about-hero, .travel-hero, .inquiry-hero { border-bottom: 1px solid #eef2f7; }

/* Stat numbers: one consistent deep navy (was navy/cyan alternating) */
.stat-number { color: #071536 !important; font-weight: 700; }
.stat-label { color: #64748b !important; letter-spacing: .01em; }

/* Section headings: refined scale + rhythm */
.section-heading { font-size: 26px !important; line-height: 1.25; }
.section-divider { width: 44px !important; height: 3px !important; border-radius: 2px; margin-top: 14px; }

/* Cards: comfy, even padding + flex so grid items align */
.stat-card { padding: 26px 22px !important; }
.cabin-card, .checkin-card, .fleet-card { display: flex; flex-direction: column; }
.cabin-card { padding: 24px !important; }
.contact-card { padding: 24px !important; }

/* Class code chips (EC/PC/BC/FC/EXC): keep their accent but pill-clean */
.cabin-code { font-weight: 700; letter-spacing: .03em; }

/* FAQ rows: a touch more breathing room + smooth toggle */
.faq-item { transition: border-color .18s, box-shadow .18s; }
.faq-question { padding: 18px 22px !important; }

/* Buttons everywhere: consistent weight */
.btn-submit, .discord-btn { font-weight: 600; padding: 12px 24px !important; }

/* ============================================================
   Home-reference pass — mirror index.html's exact design tokens
   (hero, type scale, section rhythm, buttons, radii)
   ============================================================ */

/* Hero: light bg + large navy-3 title + grey lead, like the home hero */
.about-hero, .travel-hero, .inquiry-hero {
  background: #fafbfc !important;
  text-align: left !important;
  padding: 84px 0 72px !important;
}
.about-hero .container, .travel-hero .container, .inquiry-hero .container { max-width: 1200px; }
.about-hero h1, .travel-hero h1, .inquiry-hero h1 {
  font-size: clamp(32px, 4.6vw, 48px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.025em !important;
  font-weight: 700 !important;
  color: #071536 !important;
  max-width: 760px;
  margin: 0 0 18px !important;
}
.about-hero h1 span, .travel-hero h1 span, .inquiry-hero h1 span { color: #314066 !important; }
.about-hero p, .travel-hero p, .inquiry-hero p {
  font-size: 17px !important;
  color: #475569 !important;
  line-height: 1.55 !important;
  max-width: 560px;
  margin-left: 0 !important; margin-right: 0 !important;
}
.about-hero-logo, .travel-hero-logo, .inquiry-hero-logo { display: none !important; }

/* Section rhythm + headings like the home (.section 80px, .story h2 32px) */
.about-section, .travel-section, .inquiry-section { padding: 80px 0 !important; }
.section-heading {
  font-size: 30px !important; font-weight: 700 !important; color: #071536 !important;
  letter-spacing: -0.02em !important; line-height: 1.22 !important;
}

/* Buttons like the home .cta (navy pill) */
.btn-submit, .discord-btn {
  height: 52px !important; padding: 0 28px !important; font-size: 15px !important;
  border-radius: 999px !important; background: #314066 !important;
}

/* Card radii like the home (--radius lg/md) */
.stat-card, .fleet-card, .cabin-card, .checkin-card, .airport-guide-card,
.contact-card, .faq-item, .inquiry-form-wrap, .baggage-table-wrap, .prohibited-item {
  border-radius: 16px !important;
}