:root {
  --sky-700: #075985;
  --sky-600: #1687e0;
  --sky-400: #45b5f5;
  --sky-100: #ddf3ff;
  --sky-50: #f7fbfe;
  --sun-500: #ffca45;
  --ocean-700: #00677d;
  --ocean-600: #007f98;
  --ocean-400: #24c7b5;
  --ocean-50: #e6f8f7;
  --forest-700: #2c613a;
  --forest-600: #397a4a;
  --forest-400: #8cbf5a;
  --forest-50: #edf7ec;
  --mountain-700: #36524f;
  --mountain-600: #496a67;
  --mountain-400: #789c84;
  --mountain-50: #eef4f1;
  --sunset-700: #9f3f31;
  --sunset-600: #c6533e;
  --sunset-400: #f29b59;
  --sunset-50: #fff0e8;
  --wildlife-700: #485a29;
  --wildlife-600: #5c7135;
  --wildlife-400: #d68a3a;
  --wildlife-50: #f4f3e7;
  --neutral-950: #10212b;
  --neutral-800: #243843;
  --neutral-600: #536873;
  --neutral-400: #8a9aa3;
  --neutral-200: #dce5e9;
  --neutral-100: #edf3f5;
  --white: #fff;
  --color-primary: var(--sky-600);
  --color-primary-strong: var(--sky-700);
  --color-accent: var(--sun-500);
  --color-atmosphere-soft: var(--sky-100);
  --color-canvas: var(--sky-50);
  --color-surface: var(--white);
  --color-text: var(--neutral-950);
  --color-text-muted: var(--neutral-600);
  --color-border: var(--neutral-200);
  --color-link: var(--sky-700);
  --color-focus: var(--sky-600);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --content-reading: 720px;
  --content-main: 1200px;
  --gutter: 16px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --font-display: "Be Vietnam Pro", Inter, system-ui, sans-serif;
  --font-body: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-theme="ocean"] { --color-primary: var(--ocean-600); --color-primary-strong: var(--ocean-700); --color-accent: var(--ocean-400); --color-atmosphere-soft: var(--ocean-50); }
[data-theme="forest"] { --color-primary: var(--forest-600); --color-primary-strong: var(--forest-700); --color-accent: var(--forest-400); --color-atmosphere-soft: var(--forest-50); }
[data-theme="mountain"] { --color-primary: var(--mountain-600); --color-primary-strong: var(--mountain-700); --color-accent: var(--mountain-400); --color-atmosphere-soft: var(--mountain-50); }
[data-theme="sunset"] { --color-primary: var(--sunset-600); --color-primary-strong: var(--sunset-700); --color-accent: var(--sunset-400); --color-atmosphere-soft: var(--sunset-50); }
[data-theme="wildlife"] { --color-primary: var(--wildlife-600); --color-primary-strong: var(--wildlife-700); --color-accent: var(--wildlife-400); --color-atmosphere-soft: var(--wildlife-50); }

* { box-sizing: border-box; }
html { background: var(--color-canvas); }
body { margin: 0; min-width: 320px; color: var(--color-text); background: var(--color-canvas); font: 400 16px/1.6 var(--font-body); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--color-link); text-underline-offset: 0.15em; }
a:hover { color: var(--color-primary); }
a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
h1, h2, h3 { margin: 0; color: var(--color-text); font-family: var(--font-display); text-wrap: balance; }
h1 { font-size: clamp(2.25rem, 7vw, 4rem); line-height: 1.05; letter-spacing: -0.03em; }
h2 { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; }
h3 { font-size: 1.25rem; line-height: 1.3; }
p { margin: 0 0 var(--space-4); text-wrap: pretty; }

.sd-skip-link { position: absolute; z-index: 4; top: -60px; left: var(--gutter); padding: var(--space-2) var(--space-3); color: var(--neutral-950); background: var(--white); }
.sd-skip-link:focus { top: var(--space-2); }
.sd-shell { min-height: 100vh; }
.sd-nav { background: var(--white); border-bottom: 1px solid var(--color-border); }
.sd-nav__inner, .sd-hero__inner, .sd-main, .sd-footer__inner { width: min(100% - (var(--gutter) * 2), var(--content-main)); margin: 0 auto; }
.sd-nav__inner { display: flex; flex-wrap: wrap; align-items: center; min-height: 64px; gap: var(--space-2) var(--space-4); padding: var(--space-1) 0; }
.sd-logo { display: block; flex: 0 0 152px; width: 152px; height: 48px; overflow: hidden; }
.sd-logo img { width: 152px; max-width: none; transform: translateY(-15px); }
.sd-nav__links { display: flex; flex: 1; gap: var(--space-1); overflow-x: auto; }
.sd-nav__links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-2); color: var(--neutral-800); font-size: .875rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.sd-nav__links a:hover { color: var(--color-primary-strong); background: var(--color-atmosphere-soft); }
.sd-nav__actions { display: flex; align-items: center; gap: var(--space-2); margin-left: auto; }
.sd-theme-control { display: flex; align-items: center; gap: var(--space-2); color: var(--neutral-600); font-size: .8125rem; font-weight: 600; }
.sd-theme-control select { min-height: 44px; padding: 0 var(--space-5) 0 var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text); background: var(--white); font: 600 .875rem/1 var(--font-body); }
.sd-theme-control select:hover { border-color: var(--color-primary); }
.sd-theme-control select:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.sd-language-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-3); border-radius: var(--radius-sm); color: var(--color-primary-strong); font-size: .875rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.sd-language-link:hover { color: var(--color-primary-strong); background: var(--color-atmosphere-soft); }

.sd-hero { position: relative; overflow: hidden; min-height: 230px; color: var(--white); background: linear-gradient(135deg, var(--color-primary-strong) 0%, var(--color-primary) 58%, var(--color-accent) 140%); background-position: center; background-size: cover; }
.sd-hero::before { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgb(16 33 43 / .9), rgb(16 33 43 / .58) 55%, rgb(16 33 43 / .22)); }
.sd-hero::after { position: absolute; right: -8%; bottom: -1px; left: -8%; height: 26px; content: ""; border-top: 1px solid rgb(255 255 255 / .65); border-radius: 50% 50% 0 0 / 100% 100% 0 0; }
.sd-hero__inner { position: relative; z-index: 1; display: flex; min-height: 230px; flex-direction: column; justify-content: flex-end; padding: var(--space-6) 0 var(--space-7); }
.sd-hero h1 { max-width: 16ch; color: var(--white); }
.sd-breadcrumbs { margin-bottom: var(--space-3); color: rgb(255 255 255 / .92); font-size: .875rem; }
.sd-breadcrumbs a { color: inherit; }
.sd-breadcrumbs span { padding: 0 var(--space-1); }

.sd-main { padding: var(--space-6) 0 var(--space-8); }
.sd-content { max-width: var(--content-main); }
.sd-section { margin-top: var(--space-8); }
.sd-section:first-child { margin-top: 0; }
.sd-section__heading { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }
.sd-section__heading a { font-size: .875rem; font-weight: 600; white-space: nowrap; }
.sd-place-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); gap: var(--space-3); margin-top: var(--space-5); }
.sd-place-grid a { display: flex; align-items: center; min-height: 52px; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text); font-weight: 600; text-decoration: none; }
.sd-place-grid a:hover { border-color: var(--color-primary); color: var(--color-primary-strong); background: var(--color-atmosphere-soft); }
.sd-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-top: var(--space-5); }
.sd-photo-grid a { display: block; overflow: hidden; border-radius: var(--radius-sm); background: var(--neutral-100); }
.sd-photo-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 180ms ease-out; }
.sd-photo-grid a:hover img { transform: scale(1.03); }
.sd-entry-list, .sd-news-list, .sd-tour-list { display: grid; gap: var(--space-3); margin-top: var(--space-5); }
.sd-entry-item, .sd-news-item, .sd-tour-item { display: flex; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }
.sd-entry-item img { flex: 0 0 72px; width: 72px; height: 54px; border-radius: var(--radius-sm); object-fit: cover; }
.sd-entry-item a, .sd-news-item a, .sd-tour-item a { font-weight: 600; }
.sd-news-item img { flex: 0 0 100px; width: 100px; height: 75px; border-radius: var(--radius-sm); object-fit: cover; }
.sd-meta { display: block; margin-top: var(--space-1); color: var(--color-text-muted); font-size: .8125rem; }
.sd-article, .sd-question { max-width: var(--content-reading); }
.sd-article h2, .sd-question h2 { margin-bottom: var(--space-5); }
.sd-article__lead { display: grid; gap: var(--space-5); margin-bottom: var(--space-5); }
.sd-article__image { width: min(100%, 360px); border-radius: var(--radius-md); object-fit: cover; }
.sd-photo-detail { display: grid; gap: var(--space-5); max-width: var(--content-reading); }
.sd-photo-detail__image { width: 100%; border-radius: var(--radius-md); }
.sd-rich-content { max-width: var(--content-reading); }
.sd-rich-content :is(p, div, figure) { max-width: 100% !important; }
.sd-rich-content font { color: inherit; font: inherit; }
.sd-rich-content :is(ul, ol) { margin: 0 0 var(--space-4); padding-left: 1.5rem; }
.sd-rich-content ul { list-style: disc; }
.sd-rich-content ol { list-style: decimal; }
.sd-rich-content li + li { margin-top: var(--space-1); }
.sd-rich-content table { width: 100% !important; max-width: 100%; margin: 0 0 var(--space-4); border-collapse: collapse; }
.sd-rich-content :is(td, th) { padding: var(--space-2); border: 1px solid var(--color-border) !important; }
.sd-rich-content img { height: auto !important; max-width: 100% !important; }
.sd-facts { width: min(100%, var(--content-reading)); margin: var(--space-5) 0 0; border-collapse: collapse; }
.sd-facts th, .sd-facts td { padding: var(--space-3); border-bottom: 1px solid var(--color-border); text-align: left; }
.sd-facts th { width: 35%; color: var(--color-text-muted); font-size: .875rem; }
.sd-answer { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.sd-answer + .sd-answer { margin-top: var(--space-3); }
.sd-answer__byline { margin-bottom: var(--space-2); color: var(--color-text-muted); font-size: .875rem; }
.sd-footer { border-top: 1px solid var(--color-border); background: var(--white); }
.sd-footer__inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); padding: var(--space-5) 0; color: var(--color-text-muted); font-size: .875rem; }
.sd-footer p { margin: 0; }
.sd-footer a + a::before { padding: 0 var(--space-2); color: var(--neutral-400); content: "·"; }

@media (min-width: 768px) {
  :root { --gutter: 24px; }
  .sd-nav__inner { min-height: 72px; }
  .sd-logo { flex-basis: 176px; width: 176px; height: 52px; }
  .sd-logo img { width: 176px; transform: translateY(-18px); }
  .sd-photo-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); }
  .sd-article__lead { grid-template-columns: 200px 1fr; align-items: start; }
}
@media (max-width: 640px) {
  .sd-nav__links { order: 3; flex-basis: 100%; }
  .sd-theme-control span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; clip-path: inset(50%); }
  .sd-section__heading { align-items: flex-start; flex-direction: column; gap: var(--space-2); }
  .sd-section__heading a { white-space: normal; }
}
@media (min-width: 1024px) { :root { --gutter: 32px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; } }