/*
Theme Name: Lanna Compare
Description: Local bilingual WordPress foundation. Directory workflows are staged separately.
Version: 1.9.7
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: lanna-compare
*/
:root {
    --canvas: #faf9f6;
    --surface: #fff;
    --ink: #17352c;
    --secondary: #46594f;
    --brand: #185b45;
    --hover: #104332;
    --divider: #d1dad3;
    --notice: #fff1d6;
    --notice-ink: #784900;
    --focus: #174fc4;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: 1rem/1.65 system-ui, -apple-system, "Segoe UI", sans-serif; }
:lang(th) { font-family: "Leelawadee UI", Tahoma, system-ui, sans-serif; }
html:lang(th) body { font-size:1.0625rem; line-height: 1.8; }
a { color: var(--brand); text-underline-offset: .2em; }
a:hover { color: var(--hover); }
a:focus-visible, main:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; box-shadow: 0 0 0 3px #fff; }
p { max-width: 68ch; margin-block: 0 16px; }
h1, h2 { margin-block: 0 16px; }
h1 { max-width: 24ch; font-size:1.875rem; line-height: 1.25; }
html:lang(th) h1 { line-height: 1.5; }
h2 { font-size:1.5rem; line-height: 1.5; }
.container { width: min(100%, 1200px); margin-inline: auto; padding-inline: 16px; }
.skip-link { position: absolute; inset-block-start: 8px; inset-inline-start: 8px; z-index: 10; padding: 12px 16px; background: #fff; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.demo-banner { padding-block: 12px; background: var(--notice); color: var(--notice-ink); border-block-end: 1px solid var(--notice-ink); }
.site-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; padding-block: 24px; border-block-end: 1px solid var(--divider); }
.brand { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; max-width: 100%; text-decoration: none; font-size:1.1875rem; font-weight: 600; }
.brand svg { flex: 0 0 40px; }
.brand span { min-width: 0; }
.language-switch { display: flex; flex-wrap: wrap; gap: 8px; }
.language-switch a, .return-link { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 16px; }
.language-switch a[aria-current="page"] { background: var(--brand); color: #fff; border-radius: 4px; font-weight: 600; }
.intro { padding-block: 48px 24px; }
.eyebrow { font-weight: 600; color: var(--secondary); }
.lead { font-size:1.125rem; }
.availability { padding-block: 24px; border-block: 1px solid var(--divider); }
.availability p:last-child, .principles p:last-child { margin-block-end: 0; }
.principles { display: grid; gap: 32px; padding-block: 32px 48px; }
.principles > * { min-width: 0; }
.site-footer { border-block-start: 1px solid var(--divider); padding-block: 24px; color: var(--secondary); font-size:0.875rem; }
html:lang(th) .site-footer { font-size:0.9375rem; line-height: 1.75; }
.translation-notice { color: var(--notice-ink); }
@media (min-width: 600px) { .container { padding-inline: 24px; } }
@media (min-width: 1024px) {
    .container { padding-inline: 32px; }
    h1 { font-size:2.5rem; }
    .principles { grid-template-columns: 1fr 1fr; gap: 48px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }
@media print { .skip-link, .language-switch { display: none; } body { background: #fff; } .demo-banner { border: 2px solid currentColor; } }