/* A red civic portal: ceremonial crimson, warm white, and restrained gold. */
:root {
  --heading:#8b1520; --brand-deep:#a3121e; --red:#b51821; --red-dark:#780e18; --accent-light:#efd19a; --gold:#d6b677;
  --text:#352b2b; --muted:#786b67; --line:#e7dcd5; --pale:#faf7f2;
  --serif:'Source Han Serif SC','Noto Serif CJK SC','STSong','SimSun',serif;
  --sans:'HarmonyOS Sans SC','Microsoft YaHei UI','Microsoft YaHei','PingFang SC',sans-serif;
  font-family:var(--sans);
  font-size:15px; color:var(--text); background:var(--pale); font-synthesis:none;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; min-width:0; line-height:1.7; text-align:start; overflow-wrap:anywhere; background:linear-gradient(180deg,#fcf8f2 0,#fffdf9 1100px,#f7f3ed); }
button,input,select,textarea { font:inherit; }
button { padding:0; border:0; background:none; color:inherit; cursor:pointer; }
a { color:inherit; text-decoration:none; }
a:hover,button:hover { color:var(--red); }
button:disabled { cursor:default; opacity:.55; }
:is(button,a,input,select,textarea):focus-visible { outline:3px solid #a31520; outline-offset:4px; }
header :focus-visible,.site-footer :focus-visible { outline-color:#efd19a; }
[hidden] { display:none !important; }
h1,h2,h3,h4,p { margin:0; }
ul { margin:0; padding:0; list-style:none; }
img { display:block; max-width:100%; }
::selection { color:white; background:#7e2931; }
.container { width:min(1280px,calc(100% - 80px)); margin-inline:auto; }
.icon,.entry-icon,.interpretation-art,.promotion-icon { display:block; flex:none; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.icon-definitions { position:absolute; width:0; height:0; overflow:hidden; }
.rotate { transform:rotate(180deg); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:-80px; inset-inline-start:20px; padding:10px 20px; color:var(--heading); background:white; z-index:60; }
.skip-link:focus { top:12px; }
.content-lines { white-space:pre-wrap; }
[data-content] { overflow-wrap:anywhere; }
/* The masthead is the portal's architectural gesture. */
header { position:relative; isolation:isolate; color:#fff9ec; background:linear-gradient(108deg,#8c0e19,#b51821 58%,#9b111c); overflow:hidden; border-top:3px solid #d6b677; }
header::before { content:''; position:absolute; z-index:-1; pointer-events:none; inset:0; background:linear-gradient(113deg,transparent 40%,#f7d39a0b 40.1%,transparent 68%),linear-gradient(158deg,transparent 45%,#49050c26 45.1%,transparent 78%),radial-gradient(ellipse at 65% 0,#e75c3c38,transparent 65%); }
header::after { content:''; pointer-events:none; position:absolute; z-index:-1; width:650px; height:280px; border-block:1px solid #edca8b20; top:-160px; right:-65px; transform:rotate(-24deg); background:linear-gradient(180deg,#f8d4a008,transparent); }
.utility-bar { border-bottom:1px solid #f3d5ab26; font-size:12px; color:#f5dfce; background:#5c081120; }
.utility-inner { min-height:40px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 20px; padding-block:4px; }
.welcome { display:flex; flex:1 1 240px; min-width:0; flex-wrap:wrap; gap:4px 20px; }
.utility-date { color:#f0cbb9; }
.utility-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:2px 14px; max-width:100%; }
.utility-actions button,.utility-actions a { display:inline-flex; align-items:center; gap:5px; min-width:0; max-width:100%; padding-block:6px; text-align:start; line-height:1.5; }
.utility-actions .icon { width:15px; height:15px; }
.utility-actions :is(button,a):hover { color:white; }
.utility-divider { height:11px; width:1px; background:#d4c4bb35; }
.language-control { display:inline-flex; align-items:center; min-width:0; max-width:100%; padding-block:3px; }
.language-control > .language-toggle { display:inline-flex; align-items:center; gap:8px; min-width:0; max-width:100%; min-height:34px; padding:6px 11px; border:1px solid #efd19a66; border-radius:8px; background:#ffffff0b; color:#fff3d8; font-size:12px; line-height:1.5; transition:background-color .16s,border-color .16s; }
.language-control > .language-toggle:hover,.language-control > .language-toggle[aria-expanded="true"] { color:#fff9ec; border-color:#efd19ab3; background:#ffffff17; }
.language-toggle > span { min-width:0; }
.language-toggle .language-chevron { width:12px; height:12px; opacity:.75; transform:rotate(90deg); transition:transform .16s; }
.language-toggle[aria-expanded="true"] .language-chevron { transform:rotate(-90deg); }
/* The language picker is in the top layer; JavaScript places it below its trigger. */
.language-panel { position:fixed; inset:auto; z-index:70; width:420px; max-width:calc(100vw - 24px); max-height:calc(100dvh - var(--language-panel-top,64px) - 12px); margin:0; padding:20px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#d8c3b4 transparent; border:1px solid #e9ded3; border-radius:14px; background:#fffefa; color:var(--text); box-shadow:0 20px 70px #3e0b1429,0 3px 12px #3e0b1412; text-align:start; font-size:14px; line-height:1.6; letter-spacing:normal; }
.language-panel:popover-open { animation:language-panel-enter .16s ease-out; }
.language-panel::backdrop { background:transparent; }
.language-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:17px; }
.language-panel-heading > div { min-width:0; }
.language-panel-eyebrow { display:block; margin-bottom:3px; color:#9c7542; font:11px/1.5 'Segoe UI',sans-serif; letter-spacing:.08em; }
.language-panel-heading h2 { color:var(--heading); font-size:20px; line-height:1.5; font-weight:600; letter-spacing:normal; }
.language-panel .language-close { display:grid; flex:none; place-items:center; width:32px; height:32px; padding:6px; border:1px solid #ebdfd5; border-radius:8px; background:#faf5ef; color:#8b6a60; }
.language-panel .language-close:hover { background:#f4e9df; color:var(--heading); }
.language-panel .language-close .icon { width:16px; height:16px; }
.language-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.language-panel .language-option { display:grid; grid-template-columns:minmax(0,1fr) 15px; align-content:center; gap:3px 5px; min-width:0; min-height:67px; padding:11px 10px; border:1px solid #eadfd6; border-radius:9px; background:#fff; color:#4b3733; line-height:1.4; text-align:start; transition:background-color .14s,border-color .14s,box-shadow .14s; }
.language-panel .language-option:hover { border-color:#cda789; background:#fcf4e9; color:var(--heading); }
.language-native { grid-column:1; grid-row:1; min-width:0; font-size:13px; line-height:1.5; font-weight:500; letter-spacing:normal; hyphens:none; }
.language-code { grid-column:1; grid-row:2; justify-self:start; color:#947a6c; font:10px/1.4 'Segoe UI',sans-serif; letter-spacing:.04em; direction:ltr; unicode-bidi:isolate; }
.language-panel .language-check { grid-column:2; grid-row:1 / span 2; align-self:center; width:15px; height:15px; visibility:hidden; stroke-width:2; }
.language-panel .language-option[aria-pressed="true"] { border-color:#93131e; background:linear-gradient(135deg,#a81a26,#8b1520); color:#fff7e9; box-shadow:0 3px 10px #89101c24; }
.language-option[aria-pressed="true"] .language-native { font-weight:600; }
.language-option[aria-pressed="true"] .language-code { color:#efd5b5; }
.language-option[aria-pressed="true"] .language-check { visibility:visible; color:#efd19a; }
.language-panel button:focus-visible { outline:2px solid var(--red); outline-offset:3px; }
@keyframes language-panel-enter { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:translateY(0); } }
.brand-row { display:flex; align-items:center; justify-content:space-between; gap:40px; padding-block:34px 32px; }
.brand { display:block; flex:1; min-width:0; color:#f8f5f3; }
.brand:hover { color:white; }
.brand-name { display:block; font:600 clamp(27px,2.7vw,40px)/1.4 var(--serif); letter-spacing:.15em; color:#fff3d8; text-shadow:0 2px 10px #58050e28; }
.brand-en { display:block; margin-top:7px; color:#edd2b2; font:13px/1.5 'Segoe UI',sans-serif; letter-spacing:.12em; }
.header-search { width:400px; max-width:42%; }
.search-form { display:flex; height:49px; border:1px solid #eed0a975; background:#60091325; border-radius:3px; overflow:hidden; }
.search-form:focus-within { border-color:#d2c1b8; box-shadow:0 0 0 3px #b499951a; }
.search-form input { flex:1; min-width:0; padding:0 17px; border:0; background:transparent; color:white; outline:none; font-size:14px; }
.search-form input::placeholder { color:#f3ddd1; }
.search-form button { display:flex; align-items:center; gap:8px; min-width:0; max-width:50%; padding:0 18px; background:#cebcb31c; color:#faf7f5; border-inline-start:1px solid #c1aa9d35; font-size:14px; }
.search-form button:hover { background:#cebcb330; }
.search-form .icon { width:17px; height:17px; }
.hot-search { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; font-size:12px; color:#f1d8c5; }
.hot-search button:hover { color:white; }
.main-nav { border-top:1px solid #efd19a38; border-bottom:3px solid #d6b677; background:#780e18b3; }
.nav-inner { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.nav-link { position:relative; display:flex; align-items:center; justify-content:center; gap:10px; min-width:0; padding:17px 8px; font-size:17px; line-height:1.5; letter-spacing:.08em; color:#fff0df; text-align:center; }
.nav-link > span { min-width:0; }
.nav-link .icon { width:18px; height:18px; }
.nav-link.active { color:#fff0c4; background:#f5d38c12; }
.nav-link.active::after { content:''; position:absolute; height:3px; bottom:0; left:24%; right:24%; background:#e7c981; }
.nav-link:hover { color:white; background:#cebcb310; }
main.container { padding-bottom:64px; }
.headline { position:relative; padding:39px 24px 38px; text-align:center; }
.headline-tag { display:flex; justify-content:center; align-items:center; gap:15px; margin-bottom:10px; color:#a15a42; font-size:12px; letter-spacing:.2em; }
.headline-tag > span:empty { width:35px; height:1px; background:#c3ada1; }
.headline h1 { line-height:1.5; }
.headline-title { max-width:100%; font:600 clamp(25px,2.7vw,39px)/1.5 var(--sans); color:var(--red); letter-spacing:.035em; text-wrap:balance; }
.headline-title:hover { color:#822a33; }
.headline-related { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; margin-top:13px; color:var(--muted); font-size:13px; }
.headline-related > span { color:#d0bfb6; font-size:10px; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:32px; align-items:stretch; }
.feature { min-width:0; padding:7px; background:#fff; border:1px solid #ddd1cb; border-radius:4px; box-shadow:0 12px 36px #4f1a1f10; }
.feature-story { display:block; position:relative; width:100%; height:336px; overflow:hidden; text-align:start; border-radius:2px; color:white; }
.feature-story img { width:100%; height:100%; object-fit:cover; filter:saturate(.78); transition:transform .7s ease; }
.feature-story:hover img { transform:scale(1.025); }
.feature-story:hover { color:white; }
.feature-tag { position:absolute; z-index:1; inset-inline-start:22px; top:20px; max-width:calc(100% - 44px); padding:5px 12px; color:#f8f5f3; background:#351115c4; border-inline-start:2px solid #d7c9c1; font-size:12px; backdrop-filter:blur(8px); }
.feature-shade { position:absolute; inset:0; background:linear-gradient(180deg,#19151100 33%,#19151170 69%,#191511df); }
.feature-caption { position:absolute; left:26px; right:26px; bottom:26px; overflow-wrap:anywhere; }
.feature-tag,.feature-caption > span,.feature-caption strong { overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; -webkit-line-clamp:3; }
.feature-tag,.feature-caption > span { -webkit-line-clamp:2; }
.feature-caption > span { display:block; margin-bottom:7px; font-size:12px; color:#e5dcd7; letter-spacing:.08em; }
.feature-caption strong { display:block; font-size:22px; line-height:1.6; font-weight:500; }
.feature-controls { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:48px; padding-inline:14px; }
.slide-dots { display:flex; gap:8px; align-items:center; }
.slide-dot { position:relative; width:22px; min-height:36px; }
.slide-dot::after { content:''; display:block; height:3px; width:100%; background:#ddd0c9; transition:background .2s,width .2s; }
.slide-dot.active { width:38px; }
.slide-dot.active::after { background:#75262e; }
.slide-dot > span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.slide-arrows { display:flex; align-items:center; gap:7px; }
.slide-arrows > span { color:#a78883; font:12px 'Segoe UI',sans-serif; letter-spacing:.08em; margin-inline-end:9px; direction:ltr; unicode-bidi:isolate; }
.slide-arrows b { color:var(--heading); font-size:15px; font-weight:600; }
.slide-arrows button { display:grid; place-items:center; width:30px; height:30px; border:1px solid #eae1d9; border-radius:3px; }
.slide-arrows button:hover { background:#f5f0ec; }
.slide-arrows .icon { width:15px; height:15px; }
.news-panel { min-width:0; padding:6px 0 0; display:flex; flex-direction:column; }
.section-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px 16px; border-bottom:1px solid var(--line); margin-bottom:20px; padding-bottom:14px; }
.section-heading h2 { font-size:23px; line-height:1.5; font-weight:600; color:var(--heading); letter-spacing:.04em; }
.more-link { display:inline-flex; align-items:center; gap:6px; flex:0 1 auto; min-width:0; max-width:100%; color:#8e6a64; font-size:12px; text-align:start; }
.more-link > span { min-width:0; }
.more-link .icon { width:14px; height:14px; }
.news-heading { padding:0; margin:0; }
.news-tabs { display:flex; flex:1; min-width:0; gap:clamp(12px,2.4vw,30px); }
.news-tab { position:relative; flex:1 1 0; min-width:0; padding:0 0 14px; color:#906c66; font-size:22px; line-height:1.5; font-weight:500; text-align:start; }
.news-tab.active { color:var(--heading); font-weight:600; }
.news-tab.active::after { content:''; position:absolute; height:3px; bottom:-1px; inset-inline-start:0; width:35px; background:var(--red); }
.news-list { flex:1; padding-top:22px; }
.news-lead { padding-bottom:17px; border-bottom:1px solid #eee7e1; margin-bottom:13px; }
.news-lead a { color:#531b21; font-size:20px; line-height:1.65; font-weight:600; }
.news-lead p { color:var(--muted); font-size:13px; line-height:1.9; margin-top:8px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.news-item { display:flex; align-items:baseline; gap:10px; margin:12px 0; font-size:14px; }
.news-item::before { content:''; align-self:flex-start; flex:none; height:4px; width:4px; background:#a68782; margin-top:11px; }
.news-item a { flex:1; min-width:0; }
.news-item time { font:12px 'Segoe UI',sans-serif; color:#a2827d; white-space:nowrap; }
.news-lead a,.news-item a { overflow-wrap:anywhere; }
.news-bottom { display:flex; gap:16px; justify-content:space-between; align-items:center; color:#96716c; padding:11px 0 4px; font-size:11px; }
.news-update { display:flex; align-items:center; gap:7px; min-width:0; }
.news-update > span { min-width:0; }
.news-update .icon { width:14px; height:14px; }
.quick-entries { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:30px 0 54px; border:1px solid #e1d6d1; border-radius:4px; background:linear-gradient(105deg,#fff,#f7f3f0); }
.quick-entries > * { display:flex; align-items:center; text-align:start; gap:16px; padding:26px 23px; position:relative; min-width:0; }
.quick-entries > * > span { flex:1; min-width:0; }
.quick-entries > * + *::before { content:''; position:absolute; inset-inline-start:0; top:25%; height:50%; width:1px; background:#e2d7d1; }
.quick-entries > *:hover { background:#f3eeea; }
.entry-icon { width:31px; height:31px; color:#8e2e38; stroke-width:1.25; }
.quick-entries strong { display:block; font-size:17px; font-weight:500; color:var(--heading); }
.quick-entries small { display:block; font-size:11px; color:#95706a; margin-top:4px; }
.entry-arrow { width:15px; height:15px; margin-inline-start:auto; color:#a98b86; }
.policy-grid { display:grid; grid-template-columns:1.1fr 1fr .87fr; gap:36px; margin-bottom:40px; }
.policy-column,.disclosure-column { min-width:0; }
.compact-list li { position:relative; margin:14px 0; }
.compact-list a,.compact-list .list-button { display:flex; align-items:baseline; gap:10px; width:100%; min-width:0; text-align:start; line-height:1.85; font-size:14px; }
.compact-list a::before { content:''; flex:none; align-self:flex-start; margin-top:11px; width:4px; height:4px; background:#b19591; }
.list-title { flex:1; min-width:0; overflow-wrap:anywhere; }
.compact-list time { flex:none; color:#a1807b; font:11px 'Segoe UI',sans-serif; white-space:nowrap; }
.policy-library { display:flex; align-items:center; gap:10px; text-align:start; width:100%; padding:12px 15px; margin-top:21px; background:#f2ede8; color:#912f39; border:1px solid #e6ddd9; border-radius:3px; font-size:12px; }
.policy-library > span { min-width:0; }
.policy-library .icon:last-child { margin-inline-start:auto; }
.policy-library .icon { width:16px; height:16px; }
.interpretation-banner { position:relative; display:flex; width:100%; justify-content:space-between; overflow:hidden; text-align:start; padding:21px 23px; background:#f3efeb; border:1px solid #e9e0d9; border-radius:3px; }
.interpretation-banner small { display:block; color:#8c6963; font-size:11px; }
.interpretation-banner strong { display:block; font-size:25px; font-weight:500; line-height:1.5; color:var(--heading); margin:6px 0 10px; }
.interpretation-banner em { display:flex; align-items:center; gap:8px; font-size:11px; color:#7d5d58; font-style:normal; }
.interpretation-banner em .icon { width:14px; height:14px; }
.interpretation-art { width:94px; height:94px; color:#c5b0a4; stroke-width:.6; position:absolute; right:12px; top:32px; transform:rotate(-12deg); opacity:.4; }
.interpretation-banner > span { position:relative; z-index:1; min-width:0; }
.interpretation-list { margin-top:17px; }
.disclosure-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#ede5de; border:1px solid #ede5de; border-radius:3px; overflow:hidden; }
.disclosure-grid button { display:flex; align-items:center; gap:9px; min-width:0; justify-content:center; text-align:center; padding:17px 8px; font-size:13px; background:#fbf9f7; }
.disclosure-grid button > span { min-width:0; }
.disclosure-grid button:hover { background:#f2ede9; }
.disclosure-grid .icon { width:20px; height:20px; color:#8a6762; }
.government-report { display:flex; align-items:center; gap:12px; width:100%; text-align:start; padding:16px; margin-top:15px; background:var(--heading); color:#f7f4f2; border-radius:3px; }
.government-report > span { font:300 28px 'Segoe UI',sans-serif; color:#ecd09b; }
.government-report strong { min-width:0; font-size:15px; font-weight:500; }
.government-report .icon { width:17px; height:17px; margin-inline-start:auto; }
.government-report:hover { background:#5b1e24; color:white; }
.livelihood-banner { position:relative; display:flex; align-items:center; justify-content:space-between; gap:30px; text-align:start; width:100%; overflow:hidden; padding:32px 44px; margin-bottom:50px; background:linear-gradient(105deg,#9b101b,#b51821); color:white; border:1px solid #a61821; border-bottom:3px solid #d6b677; border-radius:3px; }
.livelihood-banner::after { content:''; position:absolute; pointer-events:none; width:48%; height:320px; right:5%; top:-180px; border:1px solid #f1d39e30; transform:rotate(-27deg); background:linear-gradient(160deg,#f5c8870b,transparent); }
.banner-text,.banner-detail { position:relative; z-index:1; min-width:0; }
.banner-text { flex:1; }
.banner-text small { display:block; font-size:12px; color:#f5e4c9; letter-spacing:.08em; margin-bottom:7px; }
.banner-text strong { display:block; font-size:30px; font-weight:500; line-height:1.6; letter-spacing:.04em; text-wrap:balance; }
.banner-detail { display:flex; flex:0 1 260px; gap:14px; align-items:center; padding-block:11px; padding-inline:20px 0; border-inline-start:1px solid #c3ada14d; font-size:12px; color:#ebe2db; }
.banner-detail .icon { width:18px; height:18px; }
.livelihood-banner:hover { color:white; background:#4f1a1f; }
.section-title { display:flex; flex:1 1 16rem; min-width:0; align-items:baseline; flex-wrap:wrap; gap:4px 20px; }
.section-title > span { font-size:12px; color:var(--muted); }
/* Local architectural photography keeps the city, rather than decoration, in focus. */
.city-gallery-section { margin:0 0 48px; }
.city-photo-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px; }
.city-photo-card { grid-column:span 2; display:flex; flex-direction:column; min-width:0; height:100%; text-align:start; border:1px solid #dfd2c9; border-radius:4px; overflow:hidden; background:#fffdf9; transition:border-color .2s,background-color .2s; }
.city-photo-card:first-child { grid-column:span 4; }
.city-photo-image { display:block; position:relative; width:100%; height:220px; flex:none; overflow:hidden; background:#e8e0d5; }
.city-photo-card:nth-child(-n+2) .city-photo-image { height:270px; }
.city-photo-image img { width:100%; height:100%; object-fit:cover; object-position:center; transition:filter .2s; }
.city-photo-card:first-child .city-photo-image img { object-position:center 56%; }
.city-photo-view { position:absolute; bottom:12px; inset-inline-end:12px; max-width:calc(100% - 24px); padding:4px 10px; color:#fff8ed; background:#4f181dd9; border:1px solid #e7c98169; border-radius:2px; font-size:11px; line-height:1.7; overflow-wrap:anywhere; }
.city-photo-copy { display:block; flex:1; min-width:0; padding:17px 20px 20px; border-top:2px solid #d6b677; }
.city-photo-copy strong { display:block; margin-bottom:7px; color:var(--heading); font-size:18px; line-height:1.6; font-weight:600; overflow-wrap:anywhere; }
.city-photo-copy > span { display:block; max-width:76ch; font-size:13px; line-height:1.95; color:#78645f; overflow-wrap:anywhere; white-space:pre-line; }
.city-photo-card:hover { color:inherit; border-color:#ba9382; background:#fcf7ef; }
.city-photo-card:hover .city-photo-image img { filter:brightness(1.035); }
.city-photo-card:focus-visible { outline-offset:4px; }
.city-gallery-note { margin-top:13px; color:#8b756d; font-size:11px; line-height:1.8; overflow-wrap:anywhere; }
.services-section { margin-bottom:49px; }
.services-layout { display:grid; grid-template-columns:1fr 290px; gap:28px; }
.service-main { min-width:0; }
.service-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:0 0 22px; border-bottom:1px solid var(--line); }
.service-tabs button { min-width:0; font-size:14px; line-height:1.6; padding:4px 0 12px; position:relative; color:#926d67; text-align:start; }
.service-tabs button.active { font-weight:600; color:#70252c; }
.service-tabs button.active::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:#872c35; }
.service-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.service-button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:11px; text-align:center; min-width:0; padding:20px 8px; font-size:13px; background:#fff; border:1px solid #eae1d9; border-radius:4px; }
.service-button .icon { width:27px; height:27px; stroke-width:1.35; color:#95303a; }
.service-button > span { min-width:0; overflow-wrap:anywhere; }
.service-button:hover { background:#f7f3f0; border-color:#c3ada1; color:#672229; }
.service-promotion { position:relative; min-width:0; overflow:hidden; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:27px; border:1px solid #dfd3cc; border-radius:4px; background:linear-gradient(135deg,#f3efeb,#fcfbfb); }
.promotion-icon { position:absolute; width:122px; height:122px; right:-19px; bottom:-7px; color:#d9cbc4; stroke-width:.65; opacity:.45; }
.service-promotion > :not(.promotion-icon) { position:relative; }
.service-promotion h3 { color:#692229; font-size:24px; font-weight:500; line-height:1.5; margin-bottom:13px; }
.service-promotion p { color:#906c66; font-size:12px; line-height:2; }
.service-promotion button { display:flex; align-items:center; gap:16px; min-width:0; max-width:100%; font-size:12px; color:#7e2931; border-bottom:1px solid #c5b0a5; padding-bottom:7px; margin-top:25px; text-align:start; }
.service-promotion button > span { min-width:0; }
.service-promotion button .icon { width:16px; height:16px; }
.interaction-grid { display:grid; grid-template-columns:1.8fr 1fr; gap:40px; margin-bottom:46px; }
.interaction-main,.notice-column { min-width:0; }
.interaction-entries { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:26px; }
.interaction-entries button { display:flex; align-items:center; gap:15px; min-width:0; text-align:start; padding:23px 20px; border:1px solid #e3d8d2; border-radius:4px; background:#fff; }
.interaction-entries button > span { min-width:0; }
.interaction-entries button > .icon:first-child { width:29px; height:29px; color:#85635e; stroke-width:1.3; }
.interaction-entries button > .icon:last-child { width:15px; height:15px; margin-inline-start:auto; color:#b09490; }
.interaction-entries strong { display:block; font-size:17px; color:var(--heading); font-weight:500; }
.interaction-entries small { display:block; color:#9a7670; font-size:11px; margin-top:3px; }
.interaction-entries button:hover { background:#f7f4f2; }
.response-heading { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 18px; margin-bottom:8px; }
.response-heading h3 { color:#74252d; font-size:16px; font-weight:600; }
.response-heading span { color:#a1807b; font-size:11px; }
.response-tag { flex:none; color:#80605b; background:#f0eae5; padding:1px 6px; border:1px solid #e1d5cf; font-size:10px; border-radius:2px; }
.hotline { display:flex; align-items:center; gap:13px; padding:18px; margin-top:21px; background:#f2ece7; border:1px solid #e6ddd8; border-radius:3px; }
.hotline > .icon { width:29px; height:29px; color:#876560; }
.hotline > span { flex:1; min-width:0; color:#8b6862; font-size:11px; }
.hotline strong { display:block; color:#6d242b; font:300 33px/1.2 'Segoe UI',sans-serif; letter-spacing:.08em; margin-top:3px; }
.hotline small { min-width:0; max-width:40%; border-inline-start:1px solid #d6c8c0; padding-inline-start:14px; font-size:11px; color:#926d67; line-height:1.9; }
.topic-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.topic-card { position:relative; min-width:0; overflow:hidden; display:block; text-align:start; padding:25px 28px 23px; background:#f3eee9; border:1px solid #e2d8d2; border-radius:4px; }
.topic-card::after { content:''; pointer-events:none; position:absolute; width:120px; height:180px; right:-34px; bottom:-81px; border:1px solid #95706a2b; transform:rotate(30deg); box-shadow:-25px -25px 0 -1px #f3eee9,-25px -25px 0 0 #95706a1a; }
.topic-card small { color:#97726c; font-size:11px; }
.topic-card strong { display:block; font-size:22px; font-weight:500; line-height:1.6; color:#74252d; margin:10px 0 17px; }
.topic-card > span { display:flex; align-items:center; gap:12px; font-size:11px; color:#896762; }
.topic-card > span > span { min-width:0; }
.topic-card .icon { width:16px; height:16px; margin-inline-start:auto; }
.topic-green { background:#f1ebe6; border-color:#ded2cc; }
.topic-green strong { color:#6e242b; }
.topic-green::after { box-shadow:none; border-color:#9b77712e; }
.topic-digital { background:#f2ede9; border-color:#e4dad5; }
.topic-digital::after { box-shadow:none; }
.topic-card:hover { border-color:#b69b97; background:#f6f3f0; }
.site-footer { background:#5a0d16; color:#ecd4c1; border-top:3px solid #d6b677; font-size:12px; }
.footer-links { display:flex; flex-wrap:wrap; gap:13px 29px; padding:24px 0; border-bottom:1px solid #d1c1b821; }
.footer-links strong { font-weight:500; color:#efe8e2; margin-inline-end:24px; }
.footer-links button:hover { color:white; }
.footer-main { display:flex; align-items:center; justify-content:space-between; gap:35px; padding:32px 0 38px; }
.footer-brand { display:block; color:#f7f4f1; font:500 24px/1.6 var(--serif); letter-spacing:.1em; margin-bottom:6px; }
.footer-main > div:first-child p { font-size:11px; color:#b19590; }
.footer-main > div { min-width:0; }
.footer-description { flex:1; line-height:2; color:#c4aea2; }
.image-attribution { font-size:10px; color:#c3a69a; }
.footer-back { display:flex; align-items:center; gap:12px; min-width:0; max-width:100%; color:#ded2cc; font-size:12px; }
.footer-back .icon { width:17px; height:17px; }
.footer-back:hover { color:white; }
.back-to-top { display:grid; place-items:center; position:fixed; inset-inline-end:20px; bottom:26px; width:44px; height:44px; color:#6d242b; background:#fcfbfbed; border:1px solid #d1c1b8; border-radius:4px; box-shadow:0 5px 18px #501a1f15; z-index:10; }
/* Details, forms, and services use the same warm white surface. */
.content-dialog { width:860px; max-width:calc(100vw - 40px); max-height:90dvh; padding:0; border:1px solid #d0bfb5; border-radius:8px; background:#fff; color:var(--text); box-shadow:0 24px 100px #230c0e4d; }
.content-dialog::backdrop { background:#2c0e11b3; backdrop-filter:blur(7px); }
.dialog-header { position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:16px 28px; border-bottom:1px solid var(--line); background:#f8f5f3f5; color:#922f39; font-size:13px; }
.dialog-header > span { min-width:0; }
.dialog-header button { display:grid; flex:none; place-items:center; min-width:34px; min-height:34px; border:1px solid #e7ded9; border-radius:4px; background:white; }
.dialog-header button:hover { background:#f1ece7; }
.dialog-header button .icon { width:18px; height:18px; }
.dialog-content { padding:28px 42px 38px; overflow-wrap:anywhere; }
.content-dialog:has(.city-photo-detail) { width:1120px; }
.city-photo-detail { min-width:0; }
.city-photo-detail figure { margin:0; }
.city-photo-detail figure img { display:block; width:100%; height:auto; max-height:none; object-fit:contain; background:#eee8df; border:1px solid #e3d9d1; }
.city-photo-detail figcaption { margin-top:12px; color:#7c615a; font-size:12px; line-height:1.9; overflow-wrap:anywhere; }
.city-photo-detail .city-photo-description { margin:18px 0; color:#68524e; font-size:15px; line-height:2.05; white-space:pre-line; overflow-wrap:anywhere; }
.city-photo-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding-top:20px; margin-top:24px; border-top:1px solid var(--line); }
.city-photo-pagination button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:90px; min-height:42px; padding:9px 15px; color:var(--heading); background:#faf6f0; border:1px solid #ddcec3; border-radius:3px; font-size:13px; }
.city-photo-pagination button > span { min-width:0; overflow-wrap:anywhere; }
.city-photo-pagination button:hover { color:#fff8ef; background:var(--red-dark); border-color:var(--red-dark); }
.city-photo-pagination > span { color:#8b756d; font-size:12px; }
.city-photo-source { color:#8b756d; font-size:12px; line-height:1.9; overflow-wrap:anywhere; }
.dialog-content h1 { color:var(--heading); font-size:27px; font-weight:600; line-height:1.6; margin:0 0 22px; }
.dialog-content h2 { color:#6e242b; font-size:20px; margin:26px 0 13px; }
.article-meta { font-size:12px; color:#96716b; border-bottom:1px solid var(--line); padding-bottom:17px; margin-bottom:23px; }
.article-summary { background:#f6f3f0; border-inline-start:3px solid #9f7d78; padding:16px 20px; margin:20px 0; font-size:14px; line-height:1.9; color:#745753; }
.article-body,[dir="auto"] { text-align:start; }
.article-body p { font-size:16px; line-height:2.1; margin:1.3em 0; white-space:pre-wrap; }
.article-body p,.article-summary,.dialog-content h1 { overflow-wrap:anywhere; }
.article-note { border-top:1px solid var(--line); padding-top:17px; margin-top:28px; color:#a2817c; font-size:12px; }
.dialog-search-form { display:flex; flex-wrap:wrap; gap:10px; margin:20px 0; }
.dialog-search-form input { flex:1 1 12rem; min-width:0; }
.dialog-search-form button,.primary-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:0; max-width:100%; padding:10px 22px; border:1px solid #a4121d; border-radius:4px; background:var(--red); color:white; font-size:14px; white-space:normal; overflow-wrap:anywhere; }
.dialog-search-form button:hover,.primary-button:hover { background:var(--red-dark); color:white; }
.field-input { display:block; width:100%; min-height:44px; padding:10px 13px; border:1px solid #dfd4ce; border-radius:4px; background:#fffdf8; color:var(--text); font-size:14px; }
.field-input::placeholder { color:#a78884; }
.result-filters { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.result-filters button,.map-link { font-size:12px; padding:5px 11px; border:1px solid #eae1da; border-radius:3px; color:#87655f; }
.result-filters button.active { color:white; background:#73252d; border-color:#73252d; }
.result-count { font-size:12px; color:#9a7671; margin:17px 0 5px; }
.search-result { display:block; width:100%; text-align:start; padding:20px 0; border-bottom:1px solid #efe9e3; }
.search-result strong { display:block; font-size:17px; font-weight:500; color:#73252d; }
.search-result p { color:#956f69; font-size:13px; margin:7px 0; }
.search-result small { font-size:11px; color:#a78884; }
.search-result strong,.search-result p { overflow-wrap:anywhere; }
.search-result:hover strong { color:#842b34; }
.empty-state { padding:30px 12px; text-align:center; color:#85645f; font-size:15px; }
.empty-state p { font-size:13px; margin-top:9px; color:#a4837e; }
.service-intro { margin:18px 0; line-height:1.9; }
.dialog-services { margin-top:20px; }
.service-time { color:#8b6863; font-size:13px; margin:15px 0; }
.guide-list { padding-inline:25px 0; font-size:15px; line-height:2; list-style:disc; }
ol.guide-list { list-style:decimal; }
.guide-list li { padding-inline-start:5px; margin:8px 0; }
.guide-list li::marker { color:#8f6b66; }
.guide-footer { border:1px solid #e9e0d9; background:#faf7f5; border-radius:4px; padding:15px 18px; margin-top:25px; font-size:13px; color:#96716c; }
.message-notice { background:#f6f3f0; border:1px solid #eae1d9; border-inline-start:3px solid #b0948f; padding:13px 17px; font-size:13px; color:#7e5e59; margin-bottom:25px; }
.message-form label { display:block; font-size:14px; color:#7a2830; margin-bottom:18px; }
.message-form label .field-input { margin-top:7px; }
.message-identity-note { font-size:12px; color:#a07f7a; margin:-5px 0 23px; }
.message-form textarea { min-height:130px; resize:vertical; }
.form-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:7px; }
.form-footer small { font-size:12px; color:#a4837e; }
.message-error { color:#a03745; font-size:13px; margin-bottom:16px; }
.success-panel { padding:15px 0 20px; text-align:center; }
.success-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 22px; background:#f1ebe6; border:1px solid #dcd0c9; color:#842b34; border-radius:50%; }
.success-icon .icon { width:26px; height:26px; }
.success-panel p { margin:15px 0; color:#926d67; }
.success-panel .primary-button { margin-top:22px; }
.local-message { border-top:1px solid var(--line); padding-top:17px; margin-top:22px; font-size:13px; line-height:2; color:#95706a; }
.local-message button { margin-inline-start:10px; color:#7c2831; text-decoration:underline; }
.toast { position:fixed; z-index:40; left:50%; top:24px; transform:translateX(-50%) translateY(-12px); max-width:calc(100% - 32px); background:#501a1ff5; border:1px solid #97726d; border-radius:5px; padding:12px 22px; color:white; font-size:14px; box-shadow:0 8px 30px #41151926; opacity:0; pointer-events:none; transition:opacity .2s,transform .2s; }
.toast.visible { opacity:1; transform:translateX(-50%) translateY(0); }
body.senior-mode { font-size:18px; }
.senior-mode .container { width:min(1380px,calc(100% - 64px)); }
.senior-mode :is(.news-item,.compact-list a,.service-button,.field-input) { font-size:18px; }
.senior-mode :is(.utility-bar,.hot-search,.more-link) { font-size:14px; }
body.accessible-mode :is(a,button) { text-decoration:underline; text-underline-offset:4px; }
body.accessible-mode { --muted:#842b34; }
/* Translated labels keep their own rhythm rather than Chinese display tracking. */
html:not(:lang(zh)) { --sans:'Segoe UI','Arial',sans-serif; --serif:Georgia,'Times New Roman',serif; }
html:lang(ja) { --sans:'Yu Gothic','Meiryo','Noto Sans JP',sans-serif; --serif:'Yu Mincho','Noto Serif JP','MS PMincho',serif; }
html:lang(ko) { --sans:'Malgun Gothic','Noto Sans KR',sans-serif; --serif:'Batang','Noto Serif KR',serif; }
html:lang(ar) { --sans:'Noto Sans Arabic','Tahoma','Segoe UI',sans-serif; --serif:'Noto Naskh Arabic','Traditional Arabic','Tahoma',serif; }
html:not(:lang(zh)) body { hyphens:auto; }
html:not(:lang(zh)) :is(.brand-name,.brand-en,.nav-link,.headline-tag,.headline-title,.feature-caption > span,.section-heading h2,.banner-text small,.banner-text strong,.footer-brand) { letter-spacing:normal; }
html:not(:lang(zh)) .brand-name { font-size:clamp(24px,2.4vw,34px); line-height:1.35; }
html:not(:lang(zh)) .brand-en { font-family:var(--sans); line-height:1.7; }
html:lang(ar) body { line-height:1.9; }
html:lang(ar) :is(.brand-name,.headline-title,.feature-caption strong) { line-height:1.7; }
html[dir="rtl"] :is(.slide-arrows button .icon,.entry-arrow,.more-link .icon,.policy-library > .icon:last-child,.government-report .icon,.banner-detail .icon,.service-promotion button .icon,.interaction-entries button > .icon:last-child,.topic-card > span > .icon,.city-photo-pagination button .icon) { scale:-1 1; }
time { direction:ltr; unicode-bidi:isolate; }
.form-footer small { flex:1; min-width:0; }
@media (min-width:1700px) { .container { width:1360px; } .feature-story { height:360px; } }
@media (max-width:1150px) {
  .container { width:calc(100% - 48px); } .brand-row { gap:25px; } .brand-name { letter-spacing:.08em; } .utility-date { display:none; }
  .hero-grid { gap:24px; } .feature-story { height:340px; } .feature-caption { left:20px; right:20px; bottom:22px; } .feature-caption strong { font-size:20px; }
  .quick-entries > * { padding:22px 16px; gap:11px; } .quick-entries strong { font-size:15px; } .entry-icon { width:26px; height:26px; } .entry-arrow { display:none; }
  .policy-grid { gap:25px; grid-template-columns:1fr 1fr; } .disclosure-column { grid-column:1/-1; } .disclosure-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .government-report { justify-content:center; } .government-report .icon { margin-inline-start:10px; }
  .services-layout { grid-template-columns:1fr 260px; gap:22px; } .interaction-grid { gap:26px; grid-template-columns:1.6fr 1fr; }
  .interaction-entries { gap:12px; } .interaction-entries button { padding:19px 13px; gap:10px; } .interaction-entries small { font-size:10px; }
  .topic-card { padding:23px 21px; } .topic-card strong { font-size:19px; } .footer-links { gap:12px 22px; }
  .city-photo-grid { gap:17px; } .city-photo-image { height:190px; } .city-photo-card:nth-child(-n+2) .city-photo-image { height:245px; }
  .city-photo-copy { padding:15px 17px 18px; } .city-photo-copy strong { font-size:17px; }
}
@media (max-width:1000px) {
  html:not(:lang(zh)) .nav-inner { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:850px) {
  .utility-inner { font-size:11px; gap:10px; } .utility-actions { gap:10px; } .utility-actions .utility-divider { display:none; }
  .brand-row { align-items:flex-start; gap:20px; padding-block:28px; } .brand-name { font-size:29px; } .brand-en { font-size:11px; }
  .header-search { max-width:46%; } .search-form { height:44px; } .search-form button { padding:0 13px; } .search-form button span { display:none; }
  .search-form input { font-size:12px; padding-inline:12px; } .hot-search { font-size:10px; gap:10px; }
  .nav-link { font-size:15px; letter-spacing:0; padding-block:15px; } .nav-link .icon { display:none; }
  .headline { padding:32px 0; } .headline-title { font-size:29px; } .headline-related { font-size:11px; gap:7px; }
  .hero-grid { grid-template-columns:1fr; gap:28px; } .feature-story { height:360px; } .feature-caption strong { font-size:25px; }
  .news-list { padding-top:20px; } .news-item { margin:14px 0; }
  .quick-entries { grid-template-columns:1fr 1fr; margin:28px 0 40px; } .quick-entries > * { padding:22px 24px; }
  .quick-entries > *:nth-child(3),.quick-entries > *:nth-child(4) { border-top:1px solid #ebe2db; } .quick-entries > *:nth-child(3)::before { display:none; }
  .quick-entries strong { font-size:17px; } .entry-arrow { display:block; }
  .policy-grid { gap:30px; margin-bottom:30px; } .disclosure-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .livelihood-banner { padding:28px; flex-direction:column; align-items:flex-start; gap:13px; margin-bottom:38px; } .banner-text strong { font-size:27px; } .banner-detail { flex-basis:auto; padding:0; border:0; }
  .services-layout { grid-template-columns:1fr; gap:22px; } .service-promotion { padding:23px 27px; } .service-promotion p { white-space:normal; }
  .service-promotion button { margin-top:17px; } .promotion-icon { right:40px; bottom:0; width:145px; height:145px; }
  .interaction-grid { grid-template-columns:1fr; gap:32px; margin-bottom:35px; } .topic-grid { grid-template-columns:1fr; gap:15px; }
  .topic-card { padding:24px 28px; } .topic-card strong { font-size:24px; margin:6px 0 11px; }
  .footer-main { flex-wrap:wrap; gap:22px; } .footer-description { flex-basis:60%; } .footer-back { margin-inline-start:auto; }
  .city-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } .city-photo-card { grid-column:auto; }
  .city-photo-card:first-child { grid-column:1/-1; } .city-photo-card:nth-child(-n+2) .city-photo-image { height:220px; }
  .city-photo-card:first-child .city-photo-image { height:auto; aspect-ratio:2 / 1; } .city-photo-image { height:220px; }
}
@media (max-width:560px) {
  .container,.senior-mode .container { width:calc(100% - 32px); } .utility-inner { align-items:flex-start; justify-content:center; padding:5px 0; } .welcome { display:none; }
  .utility-actions { width:100%; justify-content:flex-start; gap:3px 14px; } .utility-actions button,.utility-actions a { padding-block:6px; }
  .language-control { margin-inline-start:auto; }
  .language-panel { padding:17px; border-radius:14px; }
  .language-options { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .language-panel .language-option { min-height:62px; padding:10px 12px; }
  .brand-row { display:block; padding:25px 0 21px; } .brand-name { font-size:30px; letter-spacing:.09em; } .brand-en { font-size:11px; margin-top:5px; }
  .header-search { width:100%; max-width:none; margin-top:22px; } .search-form { height:44px; } .search-form input { font-size:13px; }
  .search-form button { padding:0 15px; } .search-form button span { display:block; font-size:12px; } .hot-search { margin-top:9px; gap:14px; font-size:11px; }
  .nav-inner { grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; padding-inline:8px; } .nav-link { font-size:13px; padding:12px 4px; } .nav-link.active::after { left:27%; right:27%; }
  html:not(:lang(zh)) .nav-inner { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html:not(:lang(zh)) .nav-link { padding:12px 10px; font-size:14px; }
  .headline { padding:28px 0; } .headline-tag { font-size:10px; margin-bottom:10px; } .headline-title { font-size:26px; }
  .headline-related { font-size:10px; gap:5px 7px; margin-top:13px; } .headline-related > span { display:none; }
  .hero-grid { gap:25px; } .feature { padding:5px; } .feature-story { height:285px; }
  .feature-tag { inset-inline-start:16px; top:15px; font-size:10px; padding:4px 9px; } .feature-caption { left:17px; right:17px; bottom:21px; }
  .feature-caption > span { font-size:10px; } .feature-caption strong { font-size:20px; } .feature-controls { padding-inline:9px; min-height:44px; } .slide-arrows > span { margin-inline-end:5px; }
  .news-tab { font-size:20px; } .news-lead a { font-size:18px; } .news-item { font-size:13px; } .news-bottom { font-size:10px; } .news-update { gap:5px; }
  .quick-entries { margin:25px 0 35px; } .quick-entries > * { gap:10px; padding:20px 13px; } .quick-entries strong { font-size:14px; } .quick-entries small { font-size:9px; }
  .quick-entries .entry-icon { width:23px; height:23px; } .quick-entries .entry-arrow { display:none; }
  html:not(:lang(zh)) .quick-entries { grid-template-columns:minmax(0,1fr); }
  html:not(:lang(zh)) .quick-entries > * + * { border-top:1px solid #ebe2db; }
  html:not(:lang(zh)) .quick-entries > * + *::before { display:none; }
  .policy-grid { grid-template-columns:1fr; gap:28px; } .disclosure-column { grid-column:auto; }
  .section-heading { padding-bottom:12px; margin-bottom:18px; gap:10px; } .section-heading h2 { font-size:22px; } .section-title { gap:6px 13px; } .section-title > span { font-size:10px; }
  .more-link { font-size:11px; gap:3px; } .compact-list a,.compact-list .list-button { font-size:13px; } .interpretation-art { right:20px; }
  .livelihood-banner { padding:25px 22px; } .banner-text strong { font-size:25px; } .banner-text small { font-size:10px; } .banner-detail { font-size:11px; }
  .services-section { margin-bottom:35px; } .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
  .service-button { flex-direction:row; gap:12px; padding:19px 9px; font-size:12px; } .service-button .icon { width:23px; height:23px; }
  .service-tabs { gap:12px; margin-bottom:19px; } .service-tabs button { font-size:13px; } .service-promotion h3 { font-size:24px; } .promotion-icon { right:0; }
  .interaction-entries { grid-template-columns:1fr; gap:12px; } .interaction-entries button { padding:20px; } .interaction-entries small { font-size:11px; }
  .response-heading { gap:12px; } .response-heading span { font-size:10px; } .response-tag { font-size:9px; }
  .topic-card strong { font-size:22px; } main.container { padding-bottom:40px; }
  .footer-links { gap:12px 18px; padding:22px 0; font-size:11px; } .footer-links strong { width:100%; margin:0; } .footer-main { display:block; padding:25px 0; }
  .footer-brand { font-size:24px; } .footer-description { margin-top:20px; font-size:11px; } .image-attribution { font-size:9px; } .footer-back { display:inline-flex; margin-top:20px; }
  .back-to-top { inset-inline-end:12px; bottom:16px; width:40px; height:40px; }
  .content-dialog { max-width:calc(100vw - 20px); max-height:94dvh; border-radius:6px; } .dialog-header { padding:10px 16px; font-size:12px; }
  .dialog-content { padding:22px 20px 28px; } .dialog-content h1 { font-size:22px; } .article-body p { font-size:15px; line-height:2; } .article-meta { font-size:10px; }
  .article-summary { font-size:13px; padding:12px 14px; } .dialog-search-form { gap:7px; } .dialog-search-form button { padding-inline:15px; }
  .result-filters { gap:6px; } .result-filters button { padding:4px 8px; font-size:11px; } .search-result strong { font-size:16px; }
  .form-footer { flex-direction:column; align-items:stretch; gap:15px; } .form-footer .primary-button { width:100%; } .toast { top:14px; width:max-content; text-align:center; font-size:13px; }
  .city-gallery-section { margin-bottom:35px; } .city-photo-grid { grid-template-columns:minmax(0,1fr); gap:17px; }
  .city-photo-card:first-child { grid-column:auto; } .city-photo-image,.city-photo-card:nth-child(-n+2) .city-photo-image,.city-photo-card:first-child .city-photo-image { height:auto; aspect-ratio:16 / 10; }
  .city-photo-card:first-child .city-photo-image { aspect-ratio:1.875 / 1; } .city-photo-copy { padding:15px 17px 18px; }
  .city-photo-copy strong { font-size:18px; } .city-photo-copy > span { font-size:13px; }
  .city-photo-detail .city-photo-description { font-size:14px; } .city-photo-pagination { gap:8px; }
  .city-photo-pagination button { min-width:76px; padding-inline:10px; } .city-photo-pagination > span { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }