/* 常勝美學 Ando-style redesign (院長 2026-10-26).
   Loaded after warm.css on every page. Re-points the shared tokens to concrete greys and ink,
   squares off cards and buttons, and styles the new homepage (a-*). Light is static and soft:
   conic gradients with a mask and blur, never clip-path (iPad Safari draws hard edges). Photos stay in colour. */
body {
  --c0: #2B2A28;          /* charcoal: footer, film */
  --c1: #3E3D3A;          /* director's words */
  --concrete: #CFCDC8;
  --concrete2: #DCDAD5;
  --paper: #ECEBE7;
  --surface: #F6F5F2;
  --sand: #E3E1DC;        /* quiet panels */
  --sage: #DCDAD5;
  --navy: #1F1F1E;        /* ink: headings, primary actions */
  --pine-deep: #000;
  --ink: #3E3D3A;
  --muted: #55534F;
  --line: #CDCAC4;
  --gold: #8A8780;        /* small marks only */
  --line-green: #0F6E56;
  --sans: "Noto Sans TC", -apple-system, "PingFang TC", "Microsoft JhengHei", sans-serif;
  --serif: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --display: "Noto Sans TC", -apple-system, "PingFang TC", "Microsoft JhengHei", sans-serif;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
html { background: var(--c0); }
::selection { background: var(--concrete); color: var(--navy); }
:is(a,button,summary):focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; border-radius: 0; }

/* Concrete has edges, not curves; light, not shadow. */
body *, body *::before, body *::after { border-radius: 0 !important; }
body :not(.a-portrait):not(.a-portrait *) { box-shadow: none !important; }

/* ---------- Type ---------- */
body h1, body h2 { font-family: var(--display); font-weight: 300; color: var(--navy); }
body h1 { letter-spacing: .14em; line-height: 1.6; }
body h2 { letter-spacing: .12em; line-height: 1.6; }
body h3 { font-family: var(--display); font-weight: 500; letter-spacing: .06em; color: var(--navy); }
body p, body li { text-wrap: pretty; }
body strong, body b { font-weight: 500; }
/* Noto Sans TC is loaded at 300–500; heavier weights would be faked by the browser, so they settle at 500. */
body { font-synthesis-weight: none; }
body :is(h4, strong, b, summary, th, dt, label) { font-weight: 500; }
body h3 { font-weight: 400; }

/* ---------- Header ---------- */
.site-header { display: block !important; position: sticky; top: 0; z-index: 40; background: rgba(207,205,200,.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(31,31,30,.18); padding-top: env(safe-area-inset-top, 0px); }
.site-header .header-inner { display: flex !important; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
.site-header .brand-block { display: grid; grid-template-columns: auto auto; column-gap: 12px; align-items: center; justify-content: start; flex: none; min-width: 0; }
.site-header .brand { display: contents !important; }
.site-header .brand-mark { grid-column: 1 !important; grid-row: 1 / 3 !important; width: 30px; height: 35px; object-fit: contain; }
.site-header .brand > span:not(.brand-monogram) { grid-column: 2 !important; grid-row: 1 !important; min-width: 0; align-self: end; }
.site-header .brand strong { font-family: var(--sans); font-weight: 500; font-size: 1rem; letter-spacing: .2em; color: var(--navy); line-height: 1.5; }
.site-header .brand-address { grid-column: 2 !important; grid-row: 2 !important; display: flex; align-items: baseline; gap: 8px; white-space: nowrap; font-size: .75rem; line-height: 1.5; color: var(--ink); }
.site-header .brand-address .header-address { display: inline; color: var(--ink); font-size: .75rem; letter-spacing: .02em; }
.site-header .brand-address .header-google-link { display: inline-flex; min-height: 0; padding: 0; gap: 2px; font-size: .75rem; color: var(--navy); letter-spacing: .04em; }
.site-header .brand-address .header-google-link > span { border-bottom: 1px solid var(--muted); padding-bottom: 0; }
.site-header .brand-address .header-google-link svg { width: 11px; height: 11px; }
.site-header .clinic-contacts { display: flex; align-items: center; gap: 26px; margin-left: auto; }
.site-header .clinic-contacts > a { color: var(--navy); font-size: .8125rem; gap: 0; }
.site-header .clinic-contacts > a > svg { display: none; }
.site-header .clinic-contacts > a > span { display: flex; flex-direction: column; line-height: 1.5; font-weight: 500; letter-spacing: .04em; }
.site-header .clinic-contacts .header-phone { font-size: .875rem; font-weight: 500; }
.site-header .clinic-contacts small { margin: 0; color: var(--ink); font-size: .75rem; font-weight: 400; letter-spacing: .04em; }
.site-header .clinic-contacts .header-hours small { border-bottom: 1px solid var(--muted); width: fit-content; }
.site-header .clinic-contacts small svg { display: none; }
.site-header .header-actions { display: flex; align-items: center; gap: 12px; }
.site-header .header-call { display: none !important; }
.site-header .header-actions .button-line { min-height: 42px; padding: 10px 18px; background: var(--line-green); border: 1px solid var(--line-green); color: #fff; font-size: .875rem; font-weight: 500; letter-spacing: .12em; }
.site-header .menu-toggle { width: 44px; height: 44px; border: 1px solid rgba(31,31,30,.22); background: transparent; color: var(--navy); }
.site-header .menu-toggle[aria-expanded="true"] { background: rgba(255,255,255,.25); }
.site-header .menu-toggle svg { stroke-width: 1.2; }
.desktop-nav-row { border-top: 1px solid rgba(31,31,30,.14); background: transparent; }
.desktop-nav { justify-content: space-between; gap: 20px; font-size: .875rem; letter-spacing: .12em; }
.desktop-nav a { padding: 12px 0; color: var(--ink); font-weight: 400; }
.desktop-nav a::after { height: 1px; background: var(--navy); }
.desktop-nav a[aria-current] { color: var(--navy); font-weight: 500; }
.site-header .mobile-menu { position: absolute; top: 100%; left: 0; right: 0; padding: 0 0 12px; background: #CFCDC8; border-top: 1px solid rgba(31,31,30,.14); border-bottom: 1px solid rgba(31,31,30,.18); max-height: calc(100dvh - var(--clinic-header-height, 80px) - 70px - env(safe-area-inset-bottom, 0px)); }
.site-header .mobile-nav-links > a { min-height: 54px; padding: 0 22px; border-bottom: 1px solid rgba(31,31,30,.14); font-size: 1rem; letter-spacing: .12em; font-weight: 400; color: var(--navy); }
.site-header .mobile-nav-links > a svg { width: 16px; height: 16px; color: var(--muted); }
.site-header .mobile-nav-links > a[aria-current] { font-weight: 500; }
@media (max-width: 1179px) {
  .site-header .clinic-contacts, .desktop-nav-row { display: none !important; }
  .site-header .header-actions .button-line { display: none; }
  .site-header .menu-toggle { display: flex; }
  .site-header .header-inner { min-height: 68px; gap: 12px; }
}
@media (min-width: 1180px) { .site-header .menu-toggle { display: none !important; } }
@media (max-width: 400px) {
  .site-header .header-inner { gap: 10px; }
  .site-header .brand-block { column-gap: 10px; }
  .site-header .brand-mark { width: 26px; height: 31px; }
  .site-header .brand strong { font-size: .9375rem; letter-spacing: .1em; }
  .site-header .brand-address, .site-header .brand-address .header-address, .site-header .brand-address .header-google-link { font-size: .71875rem; }
  .site-header .brand-address { gap: 6px; }
  .site-header .menu-toggle { width: 44px; height: 44px; }
}

/* Announcement */
.clinic-announcement { background: var(--concrete2); border-bottom: 1px solid rgba(31,31,30,.1); color: var(--ink); }
.clinic-announcement summary { font-size: .8125rem; letter-spacing: .06em; color: var(--ink); }
.clinic-announcement .announcement-toggle { color: var(--navy); }
.clinic-announcement .announcement-sessions { font-size: .875rem; color: var(--ink); }

/* Bottom bar: phones and tablets (院長 2026-10-26: hours under 門診表). */
.mobile-contact { display: none; }
@media (max-width: 1179px) {
  body { padding-bottom: 0 !important; }
  .site-footer { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important; }
  .mobile-contact { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 0 !important; position: fixed; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 30; padding: 0 0 env(safe-area-inset-bottom, 0px) !important; border: 0 !important; background: rgba(43,42,40,.97) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  .mobile-contact a { min-height: 60px !important; padding: 6px 2px !important; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0 !important; background: transparent !important; color: #EDEBE6 !important; font-size: .875rem !important; letter-spacing: .14em; line-height: 1.35; font-weight: 400; }
  .mobile-contact a + a { border-left: 1px solid rgba(255,255,255,.14) !important; }
  .mobile-contact a:last-child { color: #9FE1CB !important; }
  .mobile-contact svg { display: none !important; }
  .mobile-contact a > span { display: flex; flex-direction: column; align-items: center; }
  .mobile-contact small { font-size: .6875rem; letter-spacing: .04em; color: #B9B7B1; margin-top: 2px; }
}

/* ---------- Buttons and links ---------- */
body .button, body .w-btn { border-radius: 0; background: var(--navy); border: 1px solid var(--navy); color: var(--surface); font-weight: 400; letter-spacing: .14em; }
body .button-outline, body .w-btn-quiet { background: transparent; color: var(--navy); border-color: var(--navy); }
body .button-line, body .w-btn-line { background: var(--line-green); border-color: var(--line-green); color: #fff; }
@media (hover: hover) and (pointer: fine) {
  body .button:not(.button-outline):not(.button-line):hover, body .w-btn-primary:hover { background: #000; transform: none; }
  body .button-outline:hover, body .w-btn-quiet:hover { background: var(--surface); }
}
body .text-link, body .w-link { color: var(--navy); border-bottom-color: var(--navy); text-decoration-color: var(--navy); letter-spacing: .06em; }
body .patient-shortcuts a, body .faq-categories a { border: 1px solid var(--navy); background: transparent; color: var(--navy); font-weight: 400; letter-spacing: .08em; }
body .ortho-hero .patient-shortcuts a:first-child { background: var(--navy); color: var(--surface); }

/* ---------- Shared page structure ---------- */
/* A soft shaft of light falls on the top of every inner page. */
main { position: relative; }
body:not([data-page="home"]) main::before { content: ""; position: absolute; top: 0; right: 0; width: min(100%, 980px); height: 640px; z-index: -1; pointer-events: none;
  background: conic-gradient(from 196deg at 92% -30%, rgba(255,250,240,0) 0deg, rgba(255,250,240,.10) 3deg, rgba(255,250,240,.30) 7deg, rgba(255,251,243,.36) 9deg, rgba(255,250,240,.24) 12deg, rgba(255,250,240,.06) 16deg, rgba(255,250,240,0) 19deg, rgba(255,250,240,0) 360deg);
  -webkit-mask-image: linear-gradient(180deg, #000 10%, rgba(0,0,0,.6) 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 10%, rgba(0,0,0,.6) 55%, transparent 100%); filter: blur(6px); }
body .breadcrumb { color: var(--muted); letter-spacing: .06em; }
body .breadcrumb a { color: var(--ink); }
body .page-intro h1, body .treatment-hero h1, body .education-reading h1, body .gd-page-hero h1, body .missing-teeth h1 { font-weight: 300; letter-spacing: .14em; color: var(--navy); }
body .page-intro p, body .page-intro .intro-copy { color: var(--ink); }
body .treatment-hero .price-tag { font-family: var(--sans); font-weight: 300; letter-spacing: .06em; color: var(--navy); background: transparent; border: 0; border-bottom: 1px solid var(--navy); padding: 0 0 4px; }
body .treatment-hero > figure { background: var(--surface); border-color: var(--line); }
body .article-body > .article-section > h2, body .ortho-section > h2, body .fee-section > h2, body .visit-layout .article-section > h2,
body .gd-services h2, body .gd-root h2, body .gd-periodontal h2, body .gd-fees h2, body .missing-teeth h2, body .education-body h2 { font-family: var(--display); font-weight: 300; letter-spacing: .12em; color: var(--navy); }
body .article-section p, body .article-section li { color: var(--ink); }
body .article-section a:not(.button) { color: var(--navy); text-decoration-color: var(--navy); }
body .article-body > .article-section { border-bottom-color: var(--line); }

/* Panels and cards: paper on concrete, hairline edges. */
body :is(.service-card, .case-card, .faq-item, .step-card, .ortho-plan, .gd-services article, .gd-crown, .mt-count-grid article, .mt-method-grid article,
  .treatment-questions, .ortho-questions, .physician-profile, .w-steps-optional details, .education-card, .education-teaser-card, .fee-section table, .fee-section tbody, .gd-walk-in-note) {
  background: var(--surface); border: 1px solid var(--line); }
body :is(.treatment-doctor, .first-appointment, .ortho-benefits, .ortho-payment, .fee-notes, .patient-note, .ortho-scope-group, .education-key-points, .gd-root) { background: var(--sand); border: 0; }
body .article-body > .article-section.w-steps-optional, body .article-body > .w-steps-optional { background: transparent; border: 0; }
body .faq-item[open] { border-color: var(--navy); }
body .faq-number, body .faq-item summary::after, body .faq-plus { color: var(--muted); font-family: var(--sans); font-style: normal; font-weight: 400; }
body .faq-item summary h2 { font-weight: 400; letter-spacing: .04em; }
body .case-image, body .treatment-card-media { background: #FBFAF8; border-color: var(--line); }
body .education-category, body .education-eyebrow { color: var(--muted); letter-spacing: .08em; }

/* Numbered steps: hairline squares instead of filled circles. */
body .w-timeline > .step-card::before, body .w-ortho-timeline li::before, body .gd-steps li::before, body .w-steps li::before {
  background: transparent !important; color: var(--navy) !important; border: 1px solid var(--navy); font-family: var(--sans) !important; font-weight: 400 !important; font-size: .8125rem !important; }
body .w-timeline > .step-card:not(:last-child)::after, body .w-ortho-timeline li:not(:last-child)::after, body .gd-steps li:not(:last-child)::after { background: rgba(31,31,30,.25); }
body .step-total { border-top: 1px solid var(--navy); }
body .step-total strong, body .ortho-plan-price p { font-family: var(--sans); font-weight: 300; letter-spacing: .04em; }
body .ortho-plan-price { border-bottom: 1px solid var(--navy); }
body .w-timeline .step-payment, body .fee-section td:nth-child(2) { font-weight: 500; }

/* Tables */
body .clinic-timetable thead th { background: var(--navy); color: var(--surface); font-weight: 400; letter-spacing: .08em; }
body .clinic-timetable .clinic-open { background: var(--surface); color: var(--navy); }
body .clinic-timetable .clinic-guest { background: #E6E1D6; color: #4A4238; }
body .clinic-timetable .clinic-closed { background: var(--concrete2); color: var(--muted); }
body .fee-section th { background: var(--sand); color: var(--navy); font-weight: 500; }
body .visit-address { font-family: var(--sans); font-weight: 300; letter-spacing: .08em; }

/* Media keeps its colour; frames are square. */
body video { background: var(--c0); }
body .treatment-film-media figcaption { color: var(--muted); letter-spacing: .04em; }
body .w-bio-photo img { background: var(--concrete2); }

/* Footer: charcoal, quiet. */
.site-footer { background: var(--c0) !important; color: #B9B7B1; border-top: 0 !important; padding-top: 64px !important; padding-bottom: 40px; }
.site-footer .footer-main nav { display: flex !important; flex-wrap: wrap; gap: 12px 26px !important; margin: 0; }
.site-footer .footer-main nav a { color: #E6E4DF !important; letter-spacing: .16em; font-size: .8125rem; }
.site-footer .trademark-notice { color: #A8A6A0 !important; }
.site-footer .copyright { border-top: 1px solid rgba(255,255,255,.12); color: #A8A6A0; font-size: .75rem; letter-spacing: .04em; }

/* ---------- Homepage (a-*) ---------- */
.a-blk { padding: 110px 0; }
.a-blk h2 { font-size: 1.625rem; letter-spacing: .2em; line-height: 1.7; margin: 0; }

.a-hero { position: relative; overflow: hidden; background: var(--concrete); }
.a-beam { position: absolute; inset: 0; pointer-events: none;
  background: conic-gradient(from 196deg at 92% -40%, rgba(255,250,240,0) 0deg, rgba(255,250,240,.10) 3deg, rgba(255,250,240,.34) 7deg, rgba(255,251,243,.42) 9deg, rgba(255,250,240,.30) 12deg, rgba(255,250,240,.08) 16deg, rgba(255,250,240,0) 19deg, rgba(255,250,240,0) 360deg);
  -webkit-mask-image: linear-gradient(180deg, #000 10%, rgba(0,0,0,.75) 55%, rgba(0,0,0,.25) 100%); mask-image: linear-gradient(180deg, #000 10%, rgba(0,0,0,.75) 55%, rgba(0,0,0,.25) 100%); }
.a-pool { position: absolute; right: -6%; bottom: -8%; width: 70%; height: 42%; pointer-events: none; background: radial-gradient(closest-side at 50% 60%, rgba(255,249,238,.30), rgba(255,249,238,0) 100%); }
.a-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(180deg, transparent, rgba(31,31,30,.06)); pointer-events: none; }
.a-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); min-height: 640px; }
.a-hero-copy { align-self: center; padding: 80px 0 90px; position: relative; z-index: 2; }
.a-hero h1 { font-size: 2.25rem; letter-spacing: .2em; line-height: 1.9; margin: 0 0 26px; }
.a-hero-lead { font-size: .9375rem; letter-spacing: .02em; line-height: 1.85; color: var(--ink); max-width: 27em; margin: 0 0 38px; }
.a-hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 26px; }
.a-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid var(--navy); padding: 12px 30px; font-size: .875rem; letter-spacing: .14em; color: var(--navy); }
.a-btn-solid { background: var(--navy); color: var(--surface); }
@media (hover: hover) and (pointer: fine) { .a-btn:hover { background: var(--surface); } .a-btn-solid:hover { background: #000; } }
.a-hero-note { font-size: .8125rem; letter-spacing: .02em; color: var(--ink); margin: 0; }
.a-portrait { position: relative; align-self: end; justify-self: center; width: 100%; max-width: 400px; margin: 0; z-index: 1; }
.a-portrait img { display: block; width: 100%; height: auto; filter: drop-shadow(18px 10px 22px rgba(31,31,30,.16)); }
.a-portrait figcaption { position: absolute; left: -54px; top: 30%; writing-mode: vertical-rl; font-size: .8125rem; letter-spacing: .6em; color: var(--ink); }
.a-portrait figcaption a { display: block; margin-top: 22px; padding: 10px 6px 10px 8px; font-size: .75rem; letter-spacing: .2em; color: var(--muted); border-left: 1px solid var(--line); }

.a-promises { background: var(--surface); }
.a-plist { list-style: none; margin: 56px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); counter-reset: ap; }
.a-plist li { counter-increment: ap; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: baseline; align-content: start; padding: 30px 40px 30px 0; margin-right: 40px; border-right: 1px solid var(--line); }
.a-plist li:nth-child(2n) { border-right: 0; margin-right: 0; }
.a-plist li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
.a-plist li::before { content: counter(ap, decimal-leading-zero); grid-column: 1; font-size: .8125rem; letter-spacing: .06em; color: var(--muted); }
.a-plist h3 { grid-column: 2; font-size: 1.0625rem; font-weight: 400; letter-spacing: .16em; margin: 0 0 10px; }
.a-plist p { grid-column: 2; margin: 0; font-size: .9375rem; line-height: 1.85; letter-spacing: .02em; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }

.a-needs { background: var(--paper); }
.a-needs-inner { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 40px; }
.a-nlist { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.a-nlist a { display: flex; justify-content: space-between; align-items: center; min-height: 60px; padding: 18px; background: var(--surface); border: 1px solid var(--line); font-size: 1rem; letter-spacing: .1em; color: var(--navy); }
.a-nlist a::after { content: "→"; font-size: .8125rem; color: var(--muted); letter-spacing: 0; margin-left: 8px; }
@media (hover: hover) and (pointer: fine) { .a-nlist a:hover { border-color: var(--navy); } }

/* First visit: a cone from the ceiling, then two beams below the assessment (approved 2026-10-26). */
.a-journey, #first-visit.a-journey { position: relative; overflow: hidden; background: #B3B0A9; --ink: #2E2D2B; --muted: #3E3D3A; --line: rgba(31,31,30,.3); }
.a-journey::before { content: ""; filter: blur(10px); position: absolute; left: 50%; top: 0; width: 1000px; margin-left: -500px; height: 900px; pointer-events: none; z-index: 0;
  background: conic-gradient(from 158deg at 50% -20px, rgba(255,253,247,0) 0deg, rgba(255,253,247,.16) 8deg, rgba(255,253,247,.38) 16deg, rgba(255,254,250,.46) 20deg, rgba(255,254,250,.46) 24deg, rgba(255,253,247,.38) 28deg, rgba(255,253,247,.16) 36deg, rgba(255,253,247,0) 44deg, rgba(255,253,247,0) 360deg);
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 50%, rgba(0,0,0,.35) 78%, transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 50%, rgba(0,0,0,.35) 78%, transparent 100%); }
.a-journey h2 { position: relative; z-index: 1; text-align: center; }
.a-flow { position: relative; z-index: 1; text-align: center; margin-top: 44px; }
.a-flow-lead { font-size: .8125rem; letter-spacing: .06em; color: var(--muted); margin: 0 0 6px; }
.a-first { list-style: none; margin: 0; padding: 0; }
.a-first li { position: relative; font-size: 1rem; letter-spacing: .12em; color: var(--navy); }
.a-first li + li { margin-top: 42px; }
.a-first li + li::before { content: ""; position: absolute; left: 50%; top: -34px; height: 26px; width: 1px; background: rgba(31,31,30,.32); }
.a-first li:last-child::after { content: ""; filter: blur(9px); position: absolute; left: 50%; top: 100%; width: 1400px; margin-left: -700px; height: 1100px; pointer-events: none; z-index: -1;
  background: conic-gradient(from 132deg at 50% 0, rgba(255,253,247,0) 0deg, rgba(255,253,247,.28) 8deg, rgba(255,254,250,.44) 14deg, rgba(255,254,250,.44) 22deg, rgba(255,253,247,.24) 30deg, rgba(255,253,247,0) 35deg, rgba(255,253,247,0) 58deg, rgba(255,253,247,.24) 63deg, rgba(255,254,250,.44) 71deg, rgba(255,254,250,.44) 79deg, rgba(255,253,247,.28) 85deg, rgba(255,253,247,0) 93deg, rgba(255,253,247,0) 360deg);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 40px, #000 55%, rgba(0,0,0,.5) 85%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 40px, #000 55%, rgba(0,0,0,.5) 85%, transparent 100%); }
.a-paths { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; margin-top: 6px; }
.a-path { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 6px 16px 8px; }
.a-path h3 { padding-top: 44px; margin: 0 0 18px; font-size: 1.125rem; font-weight: 400; letter-spacing: .2em; }
.a-path ol { display: inline-block; text-align: left; list-style: none; margin: 0 0 28px; padding: 0; counter-reset: k; }
.a-path li { counter-increment: k; display: flex; gap: 16px; padding: 6px 0; font-size: .9375rem; line-height: 1.85; letter-spacing: .02em; color: var(--ink); }
.a-path li::before { content: counter(k, decimal-leading-zero); font-size: .6875rem; letter-spacing: .2em; color: var(--muted); padding-top: 3px; }
.a-path a { margin-top: auto; align-self: center; font-size: .875rem; letter-spacing: .06em; color: var(--navy); border-bottom: 1px solid var(--navy); padding-bottom: 3px; }

.a-film { position: relative; overflow: hidden; background: var(--c0); color: #E6E4DF; }
.a-slit { position: absolute; inset: 0; pointer-events: none;
  background: conic-gradient(from 192deg at 90% -50%, rgba(255,249,238,0) 0deg, rgba(255,249,238,.04) 3deg, rgba(255,249,238,.09) 7deg, rgba(255,249,238,.10) 9deg, rgba(255,249,238,.06) 12deg, rgba(255,249,238,0) 17deg, rgba(255,249,238,0) 360deg);
  -webkit-mask-image: linear-gradient(180deg, #000, transparent); mask-image: linear-gradient(180deg, #000, transparent); }
.a-film-inner { position: relative; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 40px; align-items: center; }
.a-film h2 { color: #EDEBE6; }
.a-film p { font-size: .9375rem; line-height: 1.85; color: #B9B7B1; letter-spacing: .02em; max-width: 24em; margin: 24px 0 0; word-break: keep-all; overflow-wrap: anywhere; }
.a-film-media { justify-self: center; width: 260px; margin: 0; }
.a-film-media video { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; border: 1px solid rgba(255,255,255,.14); }

.a-words { position: relative; overflow: hidden; background: var(--c1); color: #EDEBE6; text-align: center; }
.a-words::after { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 220px; margin-left: -110px; pointer-events: none; z-index: 0; filter: blur(6px);
  background: linear-gradient(90deg, rgba(255,249,238,0), rgba(255,249,238,.07) 22%, rgba(255,250,240,.15) 42%, rgba(255,250,240,.17) 50%, rgba(255,250,240,.15) 58%, rgba(255,249,238,.07) 78%, rgba(255,249,238,0));
  -webkit-mask-image: linear-gradient(180deg, #000, rgba(0,0,0,.75) 60%, rgba(0,0,0,.6)); mask-image: linear-gradient(180deg, #000, rgba(0,0,0,.75) 60%, rgba(0,0,0,.6)); }
.a-words-inner { position: relative; z-index: 2; max-width: 640px; margin: 0 auto; padding: 20px 24px; }
.a-blk.a-words h2 { font-size: .8125rem; letter-spacing: .12em; color: #B2B0AA; margin: 0 0 22px; }
.a-words blockquote { margin: 0 0 30px; }
.a-words blockquote p { font-family: var(--serif); font-weight: 300; font-size: 1.375rem; line-height: 2.1; letter-spacing: .12em; color: #EDEBE6; }
.a-sign { position: relative; font-size: .8125rem; letter-spacing: .4em; color: #F2EFE8; margin: 0 0 30px; }
.a-sign::before { content: ""; position: absolute; left: 50%; top: 50%; width: 260px; height: 70px; margin: -35px 0 0 -130px; z-index: -1; pointer-events: none; background: radial-gradient(ellipse 110px 28px at 50% 50%, rgba(255,249,238,.26), rgba(255,249,238,0) 72%); }
.a-words a { font-size: .875rem; letter-spacing: .06em; color: #EDEBE6; border-bottom: 1px solid #EDEBE6; padding-bottom: 3px; }

/* Education teaser on the homepage */
body[data-page="home"] main .education-teaser { background: var(--surface); padding: 110px 0; }
body[data-page="home"] main .education-teaser-inner { width: min(1200px, calc(100% - 96px)); max-width: none; margin-inline: auto; padding: 0; }
@media (max-width: 1250px) { body[data-page="home"] main .education-teaser-inner { width: calc(100% - 64px); } }
body[data-page="home"] main .education-teaser-heading { display: flex; flex-direction: row !important; justify-content: space-between; align-items: flex-end !important; gap: 20px; margin-bottom: 0; }
body[data-page="home"] main .education-teaser-heading h2 { font-size: 1.625rem; letter-spacing: .2em; margin: 0; }
body[data-page="home"] main .education-eyebrow { font-size: .8125rem; letter-spacing: .12em; color: var(--muted); margin: 0 0 22px; }
body[data-page="home"] main .education-all { font-size: .875rem; letter-spacing: .06em; color: var(--ink); border: 0; }
body[data-page="home"] main .education-teaser-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-top: 52px; border-top: 1px solid var(--navy); }
body[data-page="home"] main .education-teaser-card { display: flex; flex-direction: column; padding: 28px 28px 30px 0; background: transparent; border: 0; }
body[data-page="home"] main .education-teaser-card + .education-teaser-card { border-left: 1px solid var(--line); padding-left: 28px; }
body[data-page="home"] main .education-teaser-card .education-category { flex: none; font-size: .75rem; letter-spacing: .1em; color: var(--muted); margin: 0 0 14px; white-space: nowrap; }
body[data-page="home"] main .education-teaser-card h3 { font-weight: 400; font-size: 1.0625rem; letter-spacing: .1em; line-height: 1.7; margin: 0 0 12px; word-break: keep-all; overflow-wrap: anywhere; }
body[data-page="home"] main .education-excerpt { flex: 1; font-size: .9375rem; line-height: 1.85; color: var(--ink); margin: 0 0 20px; word-break: keep-all; overflow-wrap: anywhere; }
body[data-page="home"] main .education-read { font-size: .875rem; letter-spacing: .06em; color: var(--navy); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { body[data-page="home"] main .education-teaser-card:hover { transform: none; } }

@media (max-width: 1100px) {
  .a-hero-lead { max-width: 22em; }
  .a-portrait figcaption { writing-mode: horizontal-tb; left: auto; right: 0; top: auto; bottom: 22px; background: rgba(246,245,242,.9); padding: 8px 14px; letter-spacing: .2em; font-size: .875rem; color: var(--navy); }
  .a-portrait figcaption a { display: inline; margin: 0 0 0 14px; border: 0; padding: 12px 0 12px 6px; letter-spacing: .06em; }
  body[data-page="home"] main .education-teaser-list { grid-template-columns: 1fr; }
  body[data-page="home"] main .education-teaser-card, body[data-page="home"] main .education-teaser-card + .education-teaser-card { padding: 24px 0; border-left: 0; }
  body[data-page="home"] main .education-teaser-card + .education-teaser-card { border-top: 1px solid var(--line); }
}
@media (max-width: 900px) { .a-needs-inner { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .a-blk, body[data-page="home"] main .education-teaser { padding: 76px 0; }
  .a-blk h2, body[data-page="home"] main .education-teaser-heading h2 { font-size: 1.3125rem; letter-spacing: .16em; }
  body[data-page="home"] main .education-teaser-inner { width: calc(100% - 40px); }
  .a-hero-grid { display: flex; flex-direction: column; min-height: 0; padding-top: 40px; padding-bottom: 44px; }
  .a-hero-copy { display: contents; }
  .a-hero h1 { order: 1; font-size: 1.625rem; letter-spacing: .16em; line-height: 1.75; margin: 0; position: relative; z-index: 2; }
  .a-portrait { display: contents; }
  .a-portrait img { order: 2; align-self: flex-end; width: 62%; max-width: 250px; height: 300px; object-fit: cover; object-position: 50% 0; margin: 0 -6px 0 0; filter: drop-shadow(12px 8px 16px rgba(31,31,30,.14)); -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent); mask-image: linear-gradient(180deg, #000 72%, transparent); position: relative; z-index: 1; }
  .a-portrait figcaption { order: 3; position: static; writing-mode: horizontal-tb; display: flex; justify-content: space-between; align-items: center; background: transparent; padding: 0; margin: -4px 0 22px; border-top: 1px solid var(--line); font-size: .8125rem; letter-spacing: .16em; color: var(--ink); position: relative; z-index: 2; }
  .a-portrait figcaption a { display: flex; align-items: center; min-height: 44px; margin: 0; padding: 0; border: 0; font-size: .8125rem; letter-spacing: .06em; color: var(--muted); }
  .a-portrait figcaption a::after { content: " →"; white-space: pre; }
  .a-hero-lead { order: 4; margin-bottom: 28px; }
  .a-hero-actions { order: 5; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px; }
  .a-hero-actions .a-btn { padding: 13px 0; letter-spacing: .12em; }
  .a-hero-note { order: 6; }
  .a-beam { background: conic-gradient(from 185deg at 100% -10%, rgba(255,250,240,0) 0deg, rgba(255,250,240,.12) 4deg, rgba(255,250,240,.40) 9deg, rgba(255,251,243,.50) 12deg, rgba(255,250,240,.36) 15deg, rgba(255,250,240,.10) 20deg, rgba(255,250,240,0) 24deg, rgba(255,250,240,0) 360deg); }
  .a-pool { right: -30%; top: 28%; bottom: auto; width: 110%; height: 30%; }
  .a-plist { grid-template-columns: 1fr; margin-top: 26px; }
  .a-plist li { padding: 13px 0; margin-right: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .a-plist h3 { margin: 0 0 4px; letter-spacing: .1em; }
  .a-plist p { line-height: 1.7; }
  .a-path { padding: 6px 10px 8px; }
  .a-path h3 { font-size: 1rem; letter-spacing: .12em; padding-top: 44px; margin-bottom: 14px; }
  .a-path ol { margin-bottom: 22px; }
  .a-path li { font-size: .875rem; gap: 8px; line-height: 1.6; padding: 5px 0; }
  .a-path li::before { letter-spacing: .04em; padding-top: 2px; }
  .a-path a { font-size: .8125rem; letter-spacing: .02em; }
  .a-film-inner { grid-template-columns: 1fr; }
  .a-film-media { width: 220px; }
  .a-words blockquote p { font-size: 1.125rem; }
}
@media (max-width: 400px) {
  .a-nlist a { padding: 16px 12px; letter-spacing: .04em; font-size: .9375rem; }
  .a-path { padding-left: 4px; padding-right: 4px; }
  .a-path a { letter-spacing: 0; }
}
@media (min-width: 701px) and (max-width: 900px) { .a-hero-grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); } .a-hero h1 { font-size: 1.875rem; } }
@media (prefers-reduced-motion: reduce) { .a-nlist a { transition: none; } }
main :is(h1, h2, h3, h4) { font-family: var(--display) !important; }
main h1 { font-weight: 300 !important; letter-spacing: .14em !important; color: var(--navy); }
main h2:not(.faq-item h2) { font-weight: 300; }
.site-footer .footer-main nav a { font-weight: 300; }

/* ---------- Review pass (2026-10-26) ---------- */
/* Light text everywhere; only true emphasis, table heads and prices sit at 500. */
main :is(p, li, td, dd, figcaption, caption) { font-weight: 400; }
main :is(p, li, td, dd, figcaption) > a { font-weight: inherit; }
main :is(strong, b, th, h4) { font-weight: 500; }
body .w-timeline .step-payment, body .fee-section td:nth-child(2), body .ortho-step-fee p { font-weight: 500; }
body .treatment-doctor-copy p:first-child { font-weight: 500; }
/* Chinese headings and short labels break after punctuation, never inside a word. */
/* Headings and short labels: balanced lines, so no character is left alone on the last line. */
main :is(h1, h2, h3, summary h2, .treatment-reading a, .education-card h3) { word-break: normal; text-wrap: wrap; }
@media (max-width: 620px) { main h1 { letter-spacing: .08em !important; } }
body .faq-item summary h2 { flex: 1; min-width: 0; max-width: none; }
body .clinic-timetable caption { font-family: var(--sans); font-weight: 300; letter-spacing: .1em; color: var(--navy); }
body .clinic-timetable td { font-weight: 400; }
body .clinic-timetable .clinic-guest { background: var(--concrete2); color: var(--navy); }
@media (max-width: 400px) { body .clinic-timetable thead small, body .clinic-timetable th small { display: block; white-space: nowrap; font-size: .6875rem; letter-spacing: 0; } }
body .fee-section td:first-child a { border-bottom: 0; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; text-decoration-color: var(--muted); font-weight: 500; }
/* Entry buttons match the homepage needs grid: left-aligned, an arrow, light text. */
body .gd-toc a { display: flex; align-items: center; justify-content: space-between; text-align: left; padding-inline: 18px; font-weight: 400; letter-spacing: .08em; background: var(--surface); border: 1px solid var(--line); color: var(--navy); }
body .gd-toc a::after { content: "→"; font-size: .8125rem; color: var(--muted); margin-left: 8px; }
body .gd-case-picker button { font-weight: 400; }
.site-footer .footer-main nav a { white-space: nowrap; }
body .article-body > .treatment-questions { border: 1px solid var(--line) !important; }
/* Treatment pages: the breadcrumb lines up with the centred text column. */
@media (min-width: 621px) {
  main:has(.treatment-hero-text) > .breadcrumb { width: min(860px, calc(100% - 96px)); }
  main:has(.ortho-hero) > .breadcrumb { width: min(960px, calc(100% - 96px)); }
}
@media (min-width: 621px) and (max-width: 1250px) {
  body .shell.treatment-hero-text, body .shell.treatment-hero-text.ortho-hero, main:has(.treatment-hero-text) > .breadcrumb { width: calc(100% - 64px); }
}
main .education-page-title { display: block; }
.keep-together { white-space: nowrap; font-weight: inherit !important; letter-spacing: inherit; color: inherit; }

/* ---------- Director review 2026-10-26 (round 2) ---------- */
/* Homepage lead breaks after punctuation; the portrait caption sits under the photo on phones. */
.a-hero-lead { word-break: keep-all; overflow-wrap: anywhere; }
@media (max-width: 700px) { .a-portrait figcaption { top: auto; bottom: auto; margin-top: 0; } }

/* Treatment page openings: one quiet price, a small note, a short rule, then the method. */
body .treatment-hero-text .price-tag { display: block; width: fit-content; position: relative; margin-top: 14px; padding: 0 0 16px; border: 0; }
body .treatment-hero-text .price-tag::after { content: ""; position: absolute; left: 0; bottom: 0; width: 48px; height: 1px; background: var(--navy); }
body .treatment-hero-text .price-tag + p { margin-top: 20px; max-width: 34em; font-size: .875rem; line-height: 1.95; letter-spacing: .04em; color: var(--muted); word-break: keep-all; overflow-wrap: anywhere; }
body .treatment-hero-text > div > p strong { font-weight: 400; color: var(--navy); }
body .treatment-hero-text > div > p:not(.price-tag):not(.price-tag + p) { font-size: .9375rem; line-height: 1.95; letter-spacing: .04em; color: var(--navy); word-break: keep-all; overflow-wrap: anywhere; }
body .treatment-hero-text .treatment-method { position: relative; margin-top: 26px; padding-top: 26px; }
body .treatment-hero-text .treatment-method::before { display: none; content: ""; position: absolute; left: 0; top: 0; width: 24px; height: 1px; background: var(--gold); }
body .treatment-hero-text .treatment-method p { font-size: .9375rem; line-height: 1.95; letter-spacing: .04em; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
body .treatment-doctor { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; padding: 22px 0 !important; }
body .treatment-doctor-copy p, body .treatment-doctor-copy p strong { font-weight: 400 !important; letter-spacing: .06em; line-height: 1.9; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
body .treatment-doctor-copy p:first-child, body .treatment-doctor-copy p:first-child strong { color: var(--navy); }

/* Orthodontics opening */
body .ortho-hero > div > p:first-of-type { font-family: var(--sans); font-weight: 300; font-size: 1.125rem; line-height: 2; letter-spacing: .12em; color: var(--navy); margin-top: 18px; word-break: keep-all; overflow-wrap: anywhere; }
body .ortho-hero .ortho-intro-copy p { margin-top: 12px; font-size: .8125rem; letter-spacing: .2em; color: var(--muted); }
body .ortho-hero .ortho-scope-group { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; padding: 22px 0 18px !important; margin-top: 32px; max-width: 420px; }
body .ortho-hero .ortho-scope-group .ortho-scope-title { font-size: .75rem; font-weight: 400; letter-spacing: .24em; color: var(--muted); margin: 0 0 12px; }
body .ortho-hero .ortho-scope { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
body .ortho-hero .ortho-scope li { min-width: 0; padding: 8px 0; font-size: .9375rem; font-weight: 400; letter-spacing: .12em; color: var(--navy); }
body .ortho-hero .ortho-scope li:nth-child(odd) { border-right: 1px solid var(--line); }
@media (min-width: 621px) {
  body .ortho-hero .ortho-scope { grid-template-columns: repeat(4, max-content); justify-content: start; }
  body .ortho-hero .ortho-scope li { padding: 4px 22px; border-right: 1px solid var(--line); }
  body .ortho-hero .ortho-scope li:first-child { padding-left: 0; }
  body .ortho-hero .ortho-scope li:last-child { border-right: 0; }
  body .ortho-hero .ortho-scope-group { max-width: none; }
}
@media (max-width: 620px) {
  body .treatment-hero-text .price-tag { margin-inline: auto; }
  body .treatment-hero-text .price-tag::after, body .treatment-hero-text .treatment-method::before { left: 50%; margin-left: -24px; }
  body .treatment-hero-text .treatment-method::before { margin-left: -12px; }
  body .treatment-hero-text .price-tag + p { margin-inline: auto; }
  body .ortho-hero .ortho-scope-group { margin-inline: auto; }
}
body .treatment-hero-text > div > p a { display: inline; min-height: 0; padding: 0 0 1px; margin: 0; border: 0; border-bottom: 1px solid var(--navy); text-decoration: none; }
/* Phones crop the portrait at the caption rule, so no drop shadow (it would outline the crop),
   and the floor light moves up behind the portrait instead of under the rule. */
@media (max-width: 700px) {
  .a-portrait img { filter: none; }
  .a-pool { top: 14%; height: 34%; right: -40%; }
}

/* ---------- Review round 3: Codex + second critic (2026-10-26) ---------- */
/* Bottom bar: the number sits under 電話預約, like the hours under 門診表. */
@media (max-width: 1179px) { .mobile-contact a small { font-variant-numeric: tabular-nums; } }

/* Tap targets: thin text links keep their look; an invisible hit area brings them to 44px. */
.site-header .brand-address .header-address, .site-header .brand-address .header-google-link,
.a-path a, .a-words a, .education-all, .a-portrait figcaption a { position: relative; }
.site-header .brand-address .header-address::after, .site-header .brand-address .header-google-link::after,
.a-path a::after, .a-words a::after, body[data-page="home"] main .education-all::after { content: ""; position: absolute; left: -2px; right: -2px; top: 50%; height: 44px; margin-top: -22px; }

/* Keyboard focus stays visible on the charcoal footer, bottom bar and dark homepage bands. */
.site-footer :is(a, button):focus-visible, .mobile-contact a:focus-visible, .a-film :is(a, button, video):focus-visible, .a-words a:focus-visible { outline: 2px solid #EDEBE6; outline-offset: 3px; }

/* Remaining heavy weights from the older stylesheets. */
body main :is(.ortho-plan h3, .ortho-timeline h3, .w-ortho-timeline h3, .treatment-option h3, .case-heading p, .treatment-reading-title, .ortho-scope-title) { font-weight: 400; }
body main :is(.treatment-option-price p, .w-ortho-timeline .ortho-step-fee p, .w-timeline .step-payment, .fee-section td:nth-child(2), .source-price p) { font-weight: 400; font-variant-numeric: tabular-nums; }
body main .visit-address { font-weight: 400; letter-spacing: .1em; }
body[data-page="關於院長"] main .article-section p strong { font-weight: 400; color: var(--navy); }

/* Image viewers: charcoal backdrop instead of the old navy. */
.image-lightbox::backdrop, .gd-lightbox::backdrop { background: rgba(31,31,30,.86); }
body .case-image { background: transparent; border: 0; padding: 0; }
.case-image-button::after, .gd-image-button::after { background: rgba(246,245,242,.92); border: 1px solid var(--line); color: var(--navy); font-size: .75rem; letter-spacing: .08em; padding: 2px 8px; right: 8px; bottom: 8px; }

/* Lists: one hairline square marker everywhere; wrapped lines align with the text. */
body main :is(.article-section, .education-body, .physician-profile, .treatment-option) ul:not(.treatment-reading):not(.ortho-scope):not(.w-timeline):not(.gd-steps),
body main ul.dot-list { list-style: none; padding-left: 0; margin-left: 0; }
body main :is(.article-section, .education-body, .physician-profile, .treatment-option) ul:not(.treatment-reading):not(.ortho-scope):not(.w-timeline):not(.gd-steps) > li,
body main ul.dot-list > li { position: relative; padding-left: 1.1em; }
body main :is(.article-section, .education-body, .physician-profile, .treatment-option) ul:not(.treatment-reading):not(.ortho-scope):not(.w-timeline):not(.gd-steps) > li::before,
body main ul.dot-list > li::before, .education-key-points li::before, .education-card-points li::before { content: ""; position: absolute; left: 0; top: .78em; width: 5px; height: 5px; margin: 0; background: var(--gold); border-radius: 0; }
body main ul.dot-list { margin: 10px 0 0; }
body main ul.dot-list > li + li, body main .treatment-option-details > li + li { margin-top: 4px; }

/* Timetable: the guest doctor's cell reads as open, not closed; tighter on small phones. */
body .clinic-timetable .clinic-guest { background: var(--paper) !important; color: var(--navy); }
body .clinic-timetable .clinic-closed { background: #D6D4CF; color: #6F6D68; }
@media (max-width: 400px) {
  body .clinic-timetable th, body .clinic-timetable td { padding: 10px 2px; font-size: .8125rem; letter-spacing: 0; }
  body .clinic-timetable thead th:first-child, body .clinic-timetable tbody th { width: 22%; }
}

/* Spacing between sections. */
body .article-body > .treatment-questions { margin-top: 40px; }
body .article-body > .w-steps-optional + .treatment-questions, body .article-body > .treatment-film + section { margin-top: 48px; }

/* Orthodontic plan prices: the same short rule as treatment prices. */
body .ortho-plan-price { display: block; border-bottom: 0 !important; position: relative; padding-bottom: 14px; }
body .ortho-plan-price::after { content: ""; position: absolute; left: 0; bottom: 0; width: 48px; height: 1px; background: var(--navy); }

/* Education pages share the site gutter and the plain breadcrumb. */
@media (max-width: 620px) { body .education-wrap { width: calc(100% - 40px); } }
body .education-breadcrumb a, body .education-wrap .breadcrumb a { text-decoration: none; border: 0; color: var(--ink); }
@media (max-width: 620px) { body .education-reading { padding-inline: 0; border: 0; background: transparent; } }

/* Desktop: the title column lines up with the content under it. */
@media (min-width: 621px) {
  body[data-page="門診資訊"] main > .breadcrumb, body[data-page="門診資訊"] main > .page-intro { width: min(1060px, calc(100% - 96px)); }
  body[data-page^="常見問題"] main > .breadcrumb, body[data-page^="常見問題"] main > .page-intro { width: min(900px, calc(100% - 96px)); }
}
body .visit-booking > p { word-break: keep-all; overflow-wrap: anywhere; }