/*
      ── Logo font: 青柳隷書SIMO2 (Aoyagi Reisho) ─────────────────
      Subsetted to 9 characters only (宇寧國際法律事務所).
      Embedded as base64 WOFF — no separate font file needed.
      Cross-device: font is served from this HTML file itself.
      ──────────────────────────────────────────────────────────── */
    @font-face {
      font-family: 'LishuLogo';
      src: url('data:font/woff;base64,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') format('woff');
      font-weight: normal;
      font-style: normal;
      font-display: block;
    }
    :root {
      /* Logo uses the embedded 隸書 font */
      --font-lishu:  'LishuLogo', "Noto Serif TC", serif;
      --bg:          #f5f1ea;
      --bg2:         #efead f;
      --panel:       #ffffff;
      --text:        #1c1a17;
      --text2:       #3d3830;
      --muted:       #7a6f61;
      --accent:      #8b6f4e;
      --accent-dark: #4a3522;
      --accent-light:#c4a882;
      --gold:        #b8935a;
      --gold-light:  #e8d5b7;
      --border:      #dfd8cc;
      --border-light:#ece7de;
      --shadow-sm:   0 2px 12px rgba(74,53,34,0.07);
      --shadow-md:   0 8px 40px rgba(74,53,34,0.10);
      --shadow-lg:   0 24px 80px rgba(74,53,34,0.13);
      --radius-sm:   10px;
      --radius-md:   18px;
      --radius-lg:   28px;
      --font-serif:  "Cormorant Garamond", "Noto Serif TC", Georgia, serif;
      --font-sc:     "Cormorant SC", "Noto Serif TC", Georgia, serif;
      --font-sans:   "Noto Serif TC", Georgia, serif;
    }

    *, *::before, *::after { box-sizing: border-box; }

    html { scroll-behavior: smooth; }

    body {
      margin: 0;
      font-family: var(--font-serif);
      color: var(--text);
      background: var(--bg);
      min-height: 100vh;
      line-height: 1.75;
      -webkit-font-smoothing: antialiased;
    }

    /* ── Texture overlay ── */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
      pointer-events: none;
      z-index: 0;
    }

    a { color: inherit; text-decoration: none; }

    /* ════════════════════════════════════════
       SITE WRAPPER
    ════════════════════════════════════════ */
    #site-wrapper {
      position: relative;
      z-index: 1;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }

    /* ════════════════════════════════════════
       LANGUAGE CONTENT VISIBILITY
       Controlled by data-lang on <html> —
       works even before / without JavaScript
    ════════════════════════════════════════ */

    /* Default: show ZH, hide EN */
    [data-lang-content="en"]  { display: none; }
    [data-lang-content="zh"]  { display: block; }

    /* When html[data-lang="en"]: show EN, hide ZH */
    html[data-lang="en"] [data-lang-content="en"] { display: block; }
    html[data-lang="en"] [data-lang-content="zh"] { display: none; }

    /* ════════════════════════════════════════
       TOP NAV
    ════════════════════════════════════════ */
    #top-nav {
      position: sticky;
      top: 0;
      z-index: 100;
      background: transparent;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      border-bottom: none;
      transition: background 0.45s ease, border-bottom 0.45s ease, backdrop-filter 0.45s ease;
    }

    /* 捲離頂端後，nav 恢復亮色預設樣式 */
    #top-nav.nav--light {
      background: rgba(245,241,234,0.92);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      border-bottom: 1px solid var(--border);
    }

    /* 首頁固定背景圖：在整個 viewport，nav 透明時圖片透過 nav 可見 */
    /* nav 文字顏色：預設深色背景（融合）模式 */
    #top-nav .nav-brand-zh,
    #top-nav .nav-brand-en {
      color: rgba(240,235,226,0.9);
    }
    #top-nav .nav-link {
      color: rgba(240,235,226,0.78);
    }
    #top-nav .nav-link:hover {
      color: #f0ebe2;
      background: rgba(184,147,90,0.12);
    }
    #top-nav .nav-link.active {
      background: rgba(184,147,90,0.18);
      color: #f0ebe2;
    }
    #top-nav .lang-btn {
      color: rgba(184,147,90,0.85);
      border-color: rgba(184,147,90,0.35);
    }
    #top-nav .lang-btn.active {
      background: rgba(184,147,90,0.2);
      color: #e8d5b7;
      border-color: rgba(184,147,90,0.5);
    }
    #top-nav .lang-switcher {
      background: rgba(255,255,255,0.08);
      border-color: rgba(184,147,90,0.25);
    }
    #top-nav .hamburger span {
      background: rgba(240,235,226,0.85);
    }

    /* nav 文字顏色：亮色模式（nav--light） */
    #top-nav.nav--light .nav-brand-zh,
    #top-nav.nav--light .nav-brand-en {
      color: var(--accent-dark);
    }
    #top-nav.nav--light .nav-link {
      color: var(--text2);
    }
    #top-nav.nav--light .nav-link:hover {
      background: rgba(139,111,78,0.1);
      color: var(--accent-dark);
    }
    #top-nav.nav--light .nav-link.active {
      background: var(--accent-dark);
      color: #fff;
    }
    #top-nav.nav--light .lang-btn {
      color: var(--accent);
      border-color: var(--border);
    }
    #top-nav.nav--light .lang-btn.active {
      background: var(--accent-dark);
      color: #fff;
      border-color: var(--accent-dark);
    }
    #top-nav.nav--light .lang-switcher {
      background: rgba(255,255,255,0.7);
      border-color: var(--border);
    }
    #top-nav.nav--light .hamburger span {
      background: var(--accent-dark);
    }

    .nav-inner {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      height: 68px;
    }

    .nav-brand {
      display: inline-grid;
      grid-template-columns: 1fr;
      gap: 5px;
      cursor: pointer;
    }

    .nav-brand-zh {
      display: block;
      font-family: var(--font-lishu);
      font-size: 1.35rem;
      font-weight: 400;
      letter-spacing: 0.12em;
      line-height: 1;
      white-space: nowrap;
    }

    .nav-brand-en {
      font-family: var(--font-sc);
      font-size: 0.78rem;
      letter-spacing: 0.2em;
      font-variant: small-caps;
      line-height: 1;
      display: block;
      width: 100%;
      text-align: justify;
      text-align-last: justify;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 4px;
    }

    .nav-link {
      padding: 8px 14px;
      border-radius: 999px;
      font-family: var(--font-serif);
      font-size: 0.92rem;
      font-weight: 500;
      letter-spacing: 0.04em;
      cursor: pointer;
      transition: background 0.2s, color 0.2s;
      white-space: nowrap;
    }

    .nav-link:hover { background: rgba(139,111,78,0.1); }
    .nav-link.active { background: var(--accent-dark); color: #fff; }

    .nav-right {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .lang-switcher {
      display: flex;
      gap: 4px;
      padding: 4px;
      background: rgba(255,255,255,0.7);
      border: 1px solid var(--border);
      border-radius: 999px;
      transition: background 0.45s ease, border-color 0.45s ease;
    }

    .lang-btn {
      border: none;
      background: transparent;
      padding: 5px 11px;
      border-radius: 999px;
      cursor: pointer;
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 600;
      transition: background 0.2s, color 0.2s;
    }

    .lang-btn.active { background: var(--accent-dark); color: #fff; }

    /* Mobile hamburger */
    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 6px;
      border: none;
      background: transparent;
    }

    .hamburger span {
      display: block;
      width: 22px;
      height: 2px;
      border-radius: 2px;
      transition: transform 0.3s, opacity 0.3s;
    }

    .hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity: 0; }
    .hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

    .mobile-menu {
      display: none;
      position: fixed;
      top: 68px;
      left: 0; right: 0;
      background: rgba(245,241,234,0.97);
      backdrop-filter: blur(18px);
      border-bottom: 1px solid var(--border);
      padding: 16px 24px 24px;
      z-index: 99;
      flex-direction: column;
      gap: 4px;
    }

    .mobile-menu.open { display: flex; }

    .mobile-link {
      padding: 12px 16px;
      border-radius: var(--radius-sm);
      font-family: var(--font-serif);
      font-size: 1.05rem;
      color: var(--text2);
      cursor: pointer;
      transition: background 0.2s;
    }

    .mobile-link:hover { background: rgba(139,111,78,0.1); }
    .mobile-link.active { color: var(--accent-dark); font-weight: 600; }


    /* ════════════════════════════════════════
       PAGE SYSTEM
    ════════════════════════════════════════ */
    .page { display: none; flex: 1; }
    .page.active { display: block; }

    /* ════════════════════════════════════════
       PAGE: HOME
    ════════════════════════════════════════ */
    .home-hero {
      position: relative;
      overflow: hidden;
      background: var(--bg);
      min-height: 86vh;
      display: flex;
      align-items: center;
    }

    .home-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 60% 80% at 70% 50%, rgba(184,147,90,0.06) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 20% 80%, rgba(139,111,78,0.05) 0%, transparent 60%);
    }

    /* Decorative lines */
    .home-hero::after {
      content: '';
      position: absolute;
      top: -10%;
      right: 8%;
      width: 1px;
      height: 140%;
      background: linear-gradient(to bottom, transparent, rgba(184,147,90,0.15), rgba(184,147,90,0.25), rgba(184,147,90,0.15), transparent);
    }

    .hero-inner {
      position: relative;
      z-index: 2;
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
      gap: 48px;
      align-items: center;
      padding: 80px 0;
    }

    .hero-text { min-width: 0; }



    .hero-h1 {
      margin: 0 0 12px;
      font-family: var(--font-serif);
      font-size: clamp(1.4rem, 4.2vw, 5.2rem);
      font-weight: 300;
      line-height: 1.05;
      color: var(--accent-dark);
      letter-spacing: 0.04em;
      white-space: nowrap;
    }



    .hero-desc {
      margin: 0 0 40px;
      font-size: clamp(1rem, 1.3vw, 1.15rem);
      color: var(--text2);
      line-height: 1.85;
    }

    /* ZH hero desc: justify; EN: left-align (handled via lang-content override) */
    [data-lang-content="en"] .hero-desc {
      text-align: left;
    }

    [data-lang-content="zh"] .hero-desc {
      text-align: justify;
    }

    .hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    .btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 14px 28px;
      background: var(--gold);
      color: #fff;
      border-radius: 999px;
      font-family: var(--font-serif);
      font-size: 0.97rem;
      font-weight: 600;
      letter-spacing: 0.06em;
      cursor: pointer;
      border: none;
      transition: background 0.25s, transform 0.2s, box-shadow 0.25s;
      box-shadow: 0 4px 20px rgba(184,147,90,0.4);
    }

    .btn-primary:hover { background: #a07d46; transform: translateY(-1px); box-shadow: 0 8px 28px rgba(184,147,90,0.45); }

    .btn-outline {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 13px 28px;
      background: transparent;
      color: var(--accent-dark);
      border-radius: 999px;
      font-family: var(--font-serif);
      font-size: 0.97rem;
      font-weight: 500;
      letter-spacing: 0.06em;
      cursor: pointer;
      border: 1px solid rgba(74,53,34,0.35);
      transition: background 0.25s, border-color 0.25s;
    }

    .btn-outline:hover { background: rgba(74,53,34,0.06); border-color: rgba(74,53,34,0.6); }

    /* Hero photo card */
    .hero-photo-wrap {
      position: relative;
    }

    .hero-photo-card {
      position: relative;
      border-radius: var(--radius-lg);
      overflow: hidden;
      aspect-ratio: 3/4;
      border: 1px solid rgba(184,147,90,0.25);
      box-shadow: 0 40px 100px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.08);
    }

    .hero-photo-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }

    .hero-photo-badge {
      position: absolute;
      bottom: 24px;
      left: 24px;
      right: 24px;
      background: rgba(26,20,13,0.82);
      backdrop-filter: blur(12px);
      border: 1px solid rgba(184,147,90,0.25);
      border-radius: var(--radius-md);
      padding: 16px 20px;
    }

    .badge-name {
      font-family: var(--font-serif);
      font-size: 1.1rem;
      font-weight: 500;
      color: #f0ebe2;
      letter-spacing: 0.06em;
    }

    .badge-title {
      font-family: var(--font-sc);
      font-size: 0.72rem;
      letter-spacing: 0.2em;
      color: var(--gold);
      margin-top: 4px;
    }

    /* Decorative corner element */
    .hero-deco {
      position: absolute;
      top: -20px;
      right: -20px;
      width: 80px;
      height: 80px;
      border-top: 1px solid rgba(184,147,90,0.5);
      border-right: 1px solid rgba(184,147,90,0.5);
      border-radius: 0 var(--radius-sm) 0 0;
    }

    /* ── Home sections ── */
    .home-content {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      padding: 80px 0;
    }

    .section-label {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-family: var(--font-sc);
      font-size: 0.88rem;
      letter-spacing: 0.22em;
      font-variant: small-caps;
      color: var(--gold);
      margin-bottom: 16px;
    }

    .section-label::before,
    .section-label::after {
      content: '';
      display: block;
      width: 28px;
      height: 1px;
      background: var(--gold);
    }

    .section-h2 {
      margin: 0 0 14px;
      font-family: var(--font-serif);
      font-size: clamp(1.9rem, 3.5vw, 3rem);
      font-weight: 400;
      line-height: 1.2;
      color: var(--accent-dark);
      letter-spacing: 0.03em;
    }

    .section-lead {
      font-size: 1.08rem;
      color: var(--text2);
      max-width: 620px;
      margin: 0 0 48px;
      line-height: 1.85;
    }

    /* Home practice preview */
    .practice-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 72px;
    }

    /* ── Practice section (dark background) ── */
    .practice-section {
      background: linear-gradient(160deg, #2a1f14 0%, #3d2d1c 60%, #4a3522 100%);
    }
    .practice-section .section-h2 { color: #f0ebe2; }
    .practice-section .section-lead { color: rgba(240,235,226,0.72); }
    .practice-section .practice-card {
      background: rgba(240,230,215,0.10);
      border-color: rgba(184,147,90,0.28);
      box-shadow: 0 2px 16px rgba(0,0,0,0.25);
    }
    .practice-section .practice-card:hover {
      background: rgba(240,230,215,0.16);
      border-color: rgba(184,147,90,0.55);
      box-shadow: 0 8px 40px rgba(0,0,0,0.4);
      transform: translateY(-4px);
    }
    .practice-section .practice-num { color: var(--gold); }
    .practice-section .practice-title { color: #f0ebe2; }
    .practice-section .practice-desc { color: rgba(240,235,226,0.65); }

    /* Recognition strip：深色底色 + 亮金邊框，與 cards 區隔成為焦點 */
    .practice-section .recognition-strip {
      background: rgba(26,18,10,0.75);
      border: 1px solid rgba(232,213,183,0.55);
      box-shadow: 0 0 0 1px rgba(184,147,90,0.15);
    }
    .practice-section .recognition-quote {
      color: rgba(240,235,226,0.92);
    }
    .practice-section .recognition-quote cite {
      color: var(--gold-light);
    }
    .practice-section .recognition-badge {
      border-color: rgba(232,213,183,0.45);
    }
    .practice-section .rb-title {
      color: var(--gold-light);
    }
    .practice-section .rb-org {
      color: rgba(240,235,226,0.55);
    }

    .practice-card {
      background: white;
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 32px 28px;
      cursor: pointer;
      transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
      position: relative;
      overflow: hidden;
    }

    .practice-card::before {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--gold), var(--accent));
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s;
    }

    .practice-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--gold-light); }
    .practice-card:hover::before { transform: scaleX(1); }

    .practice-num {
      font-family: var(--font-sc);
      font-size: 2.2rem;
      color: var(--gold-light);
      line-height: 1;
      margin-bottom: 16px;
      font-weight: 300;
    }

    .practice-title {
      font-family: var(--font-serif);
      font-size: 1.15rem;
      font-weight: 600;
      color: var(--accent-dark);
      margin-bottom: 10px;
      line-height: 1.35;
    }

    .practice-desc {
      font-size: 0.93rem;
      color: var(--muted);
      line-height: 1.7;
    }

    /* Home recognition strip */
    .recognition-strip {
      background: linear-gradient(135deg, var(--accent-dark) 0%, #2a1f14 100%);
      border-radius: var(--radius-lg);
      padding: 48px 52px;
      display: flex;
      gap: 48px;
      align-items: center;
      margin-bottom: 72px;
    }

    .recognition-quote {
      flex: 1;
      font-family: var(--font-serif);
      font-size: clamp(1.2rem, 2vw, 1.6rem);
      font-style: italic;
      font-weight: 300;
      color: rgba(240,235,226,0.9);
      line-height: 1.6;
    }

    .recognition-quote cite {
      display: block;
      font-style: normal;
      font-size: 0.8rem;
      letter-spacing: 0.18em;
      color: var(--gold);
      margin-top: 14px;
      font-family: var(--font-sc);
    }

    .recognition-badge {
      flex-shrink: 0;
      width: 130px;
      height: 130px;
      border-radius: 50%;
      border: 1px solid rgba(184,147,90,0.4);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      gap: 4px;
      padding: 16px;
    }

    .recognition-badge .rb-title {
      font-family: var(--font-sc);
      font-size: 0.65rem;
      letter-spacing: 0.18em;
      color: var(--gold-light);
      line-height: 1.4;
    }

    .recognition-badge .rb-org {
      font-family: var(--font-serif);
      font-size: 0.75rem;
      font-style: italic;
      color: rgba(240,235,226,0.6);
    }

    /* ════════════════════════════════════════
       PAGE: ATTORNEY
    ════════════════════════════════════════ */
    .attorney-hero {
      background: linear-gradient(160deg, var(--accent-dark) 0%, #2e2016 100%);
      padding: 80px 0 0;
      position: relative;
      overflow: hidden;
    }

    .attorney-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse 50% 80% at 80% 40%, rgba(184,147,90,0.15) 0%, transparent 65%);
    }

    .attorney-inner {
      position: relative;
      z-index: 2;
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      display: grid;
      grid-template-columns: 320px 1fr;
      gap: 64px;
      align-items: end;
    }

    .attorney-text { padding-bottom: 60px; order: 2; }
    .attorney-photo-wrap { order: 1; align-self: end; }

    .attorney-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: var(--font-sc);
      font-size: 0.88rem;
      letter-spacing: 0.22em;
      color: var(--gold);
      margin-bottom: 20px;
    }

    .attorney-tag::before,
    .attorney-tag::after { content: ''; display: block; width: 28px; height: 1px; background: var(--gold); }

    .attorney-name {
      font-family: var(--font-serif);
      font-size: clamp(2.4rem, 5vw, 4rem);
      font-weight: 300;
      color: #f0ebe2;
      letter-spacing: 0.05em;
      line-height: 1.1;
      margin: 0 0 8px;
    }

    .attorney-title-bar {
      font-family: var(--font-sc);
      font-size: 1rem;
      letter-spacing: 0.16em;
      color: rgba(240,235,226,0.55);
      margin-bottom: 28px;
    }

    .attorney-summary {
      font-size: 1.08rem;
      color: rgba(240,235,226,0.78);
      line-height: 1.85;
    }

    [data-lang-content="zh"] .attorney-summary {
      text-align: justify;
    }

    [data-lang-content="en"] .attorney-summary {
      text-align: left;
    }

    .attorney-photo-wrap {
      align-self: end;
    }

    .attorney-photo {
      width: 100%;
      aspect-ratio: 3/4;
      object-fit: cover;
      object-position: center top;
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
      display: block;
      border: 1px solid rgba(184,147,90,0.2);
      border-bottom: none;
    }

    .attorney-body {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      padding: 72px 0 80px;
    }

    .attorney-grid {
      display: grid;
      grid-template-columns: 2fr 1fr;
      gap: 48px;
      align-items: start;
    }

    .attorney-section-title {
      font-family: var(--font-sc);
      font-size: 0.88rem;
      letter-spacing: 0.22em;
      color: var(--gold);
      font-variant: small-caps;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .attorney-section-title::before,
    .attorney-section-title::after { content: ''; display: block; width: 28px; height: 1px; background: var(--gold); }

    .attorney-section-h3 {
      font-family: var(--font-serif);
      font-size: 1.7rem;
      font-weight: 500;
      color: var(--accent-dark);
      margin: 0 0 20px;
    }

    .transactions-list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .transactions-list li {
      padding: 18px 0;
      border-bottom: 1px solid var(--border-light);
      display: flex;
      gap: 16px;
      font-size: 1rem;
      color: var(--text2);
      line-height: 1.7;
    }

    .transactions-list li::before {
      content: '—';
      color: var(--gold);
      flex-shrink: 0;
      margin-top: 1px;
    }

    .transactions-list li:last-child { border-bottom: none; }

    .sidebar-card {
      background: white;
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 28px;
      margin-bottom: 20px;
    }

    .sidebar-card-title {
      font-family: var(--font-sc);
      font-size: 0.82rem;
      letter-spacing: 0.22em;
      color: var(--gold);
      font-variant: small-caps;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .sidebar-card-title::before,
    .sidebar-card-title::after { content: ''; display: block; width: 18px; height: 1px; background: var(--gold); }

    .sidebar-item {
      display: flex;
      flex-direction: column;
      gap: 3px;
      padding: 10px 0;
      border-bottom: 1px solid var(--border-light);
    }

    .sidebar-item:last-child { border-bottom: none; padding-bottom: 0; }

    .sidebar-item strong {
      font-size: 1rem;
      color: var(--accent-dark);
      font-weight: 600;
      font-family: var(--font-serif);
      line-height: 1.3;
    }

    /* School names in education section: bolder and larger */
    .sidebar-item strong.sidebar-school {
      font-size: 1.05rem;
      font-weight: 700;
      letter-spacing: 0.01em;
    }

    .sidebar-item span {
      font-size: 0.88rem;
      color: var(--muted);
      line-height: 1.55;
    }

    /* Value props */
    .value-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
      margin-top: 40px;
    }

    .value-item {
      background: linear-gradient(135deg, #fdfcf9, white);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 24px;
    }

    .value-icon {
      width: 40px;
      height: 40px;
      background: linear-gradient(135deg, var(--gold-light), #f0e8d8);
      border-radius: var(--radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 12px;
      color: var(--accent-dark);
    }

    .value-title {
      font-family: var(--font-serif);
      font-size: 0.98rem;
      font-weight: 600;
      color: var(--accent-dark);
      margin-bottom: 6px;
    }

    .value-desc {
      font-size: 0.88rem;
      color: var(--muted);
      line-height: 1.65;
    }

    /* ════════════════════════════════════════
       PAGE: PRACTICE AREAS
    ════════════════════════════════════════ */
    .practice-hero {
      background: linear-gradient(160deg, var(--accent-dark) 0%, #2e2016 100%);
      padding: 80px 0;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .practice-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(184,147,90,0.12) 0%, transparent 70%);
    }

    .practice-hero-inner {
      position: relative;
      z-index: 2;
      width: min(720px, calc(100% - 48px));
      margin: 0 auto;
    }

    .practice-hero-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: var(--font-sc);
      font-size: 0.88rem;
      letter-spacing: 0.22em;
      font-variant: small-caps;
      color: var(--gold);
      margin-bottom: 20px;
    }

    .practice-hero-tag::before, .practice-hero-tag::after {
      content: '';
      display: block;
      width: 28px;
      height: 1px;
      background: var(--gold);
    }

    .practice-hero-h1 {
      font-family: var(--font-serif);
      font-size: clamp(2.2rem, 5vw, 3.8rem);
      font-weight: 300;
      color: #f0ebe2;
      letter-spacing: 0.04em;
      margin: 0 0 20px;
    }

    .practice-hero-p {
      font-size: 1.05rem;
      color: rgba(240,235,226,0.72);
      line-height: 1.85;
    }

    .practice-body {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      padding: 80px 0;
    }

    .practice-area {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 56px;
      align-items: start;
      padding: 60px 0;
      border-bottom: 1px solid var(--border);
    }

    .practice-area:first-child { padding-top: 0; }
    .practice-area:last-child { border-bottom: none; }
    .practice-area:nth-child(even) .practice-area-text { order: 2; }
    .practice-area:nth-child(even) .practice-area-visual { order: 1; }

    .practice-area-num {
      font-family: var(--font-sc);
      font-size: 4rem;
      color: var(--gold-light);
      font-weight: 300;
      line-height: 1;
      margin-bottom: 10px;
      opacity: 0.6;
    }

    .practice-area-title {
      font-family: var(--font-serif);
      font-size: clamp(1.4rem, 2.5vw, 2rem);
      font-weight: 500;
      color: var(--accent-dark);
      margin: 0 0 18px;
      line-height: 1.25;
    }

    .practice-area-desc {
      font-size: 1.01rem;
      color: var(--text2);
      line-height: 1.85;
      margin-bottom: 24px;
    }

    .practice-services {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .practice-services li {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 0.95rem;
      color: var(--text2);
      line-height: 1.6;
    }

    .practice-services li::before {
      content: '';
      display: block;
      width: 5px;
      height: 5px;
      background: var(--gold);
      border-radius: 50%;
      margin-top: 8px;
      flex-shrink: 0;
    }

    .practice-area-visual {
      background: linear-gradient(135deg, white, #faf7f2);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 40px 36px;
      position: relative;
      overflow: hidden;
    }

    .practice-area-visual::before {
      content: '';
      position: absolute;
      top: 0; right: 0;
      width: 120px;
      height: 120px;
      background: radial-gradient(circle, rgba(184,147,90,0.12), transparent 70%);
    }

    .pav-icon {
      margin-bottom: 20px;
      line-height: 1;
    }

    .pav-title {
      font-family: var(--font-serif);
      font-size: 1.1rem;
      font-weight: 600;
      color: var(--accent-dark);
      margin-bottom: 14px;
    }

    .pav-highlights {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .pav-highlight {
      background: var(--bg);
      border-radius: var(--radius-sm);
      padding: 12px 14px;
      font-size: 0.88rem;
      color: var(--muted);
      border-left: 3px solid var(--gold-light);
    }

    /* ════════════════════════════════════════
       PAGE: CONTACT
    ════════════════════════════════════════ */
    .contact-page {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      padding: 80px 0;
    }

    .contact-header {
      text-align: center;
      margin-bottom: 64px;
    }

    .contact-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px;
      align-items: start;
    }

    .contact-info-card {
      background: linear-gradient(160deg, var(--accent-dark), #2e2016);
      border-radius: var(--radius-lg);
      padding: 52px 44px;
      color: rgba(240,235,226,0.9);
      position: relative;
      overflow: hidden;
    }

    .contact-info-card::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 200px; height: 200px;
      border: 1px solid rgba(184,147,90,0.2);
      border-radius: 50%;
    }

    .contact-info-card::after {
      content: '';
      position: absolute;
      top: -100px; right: -100px;
      width: 300px; height: 300px;
      border: 1px solid rgba(184,147,90,0.1);
      border-radius: 50%;
    }

    .cic-label {
      font-family: var(--font-sc);
      font-size: 0.88rem;
      letter-spacing: 0.22em;
      color: var(--gold);
      margin-bottom: 24px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-variant: small-caps;
    }

    .cic-label::before,
    .cic-label::after { content: ''; display: block; width: 18px; height: 1px; background: var(--gold); }
    /* Ensure decorative line pseudo-elements don't get extra spacing */

    .value-section {
      background: var(--bg);
      border-top: 1px solid var(--border-light);
    }

    .value-section .home-content {
      padding-top: 80px;
      padding-bottom: 80px;
    }


    .cic-title {
      font-family: var(--font-serif);
      font-size: 1.6rem;
      font-weight: 400;
      margin-bottom: 36px;
      line-height: 1.3;
    }

    .cic-item {
      display: flex;
      gap: 16px;
      margin-bottom: 24px;
      align-items: flex-start;
    }

    .cic-item-icon {
      width: 38px;
      height: 38px;
      background: rgba(184,147,90,0.15);
      border: 1px solid rgba(184,147,90,0.25);
      border-radius: var(--radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gold-light);
      flex-shrink: 0;
    }

    .cic-item-content {}
    .cic-item-label {
      font-family: var(--font-sc);
      font-size: 0.65rem;
      letter-spacing: 0.2em;
      color: var(--gold-light);
      margin-bottom: 4px;
    }

    .cic-item-value {
      font-size: 0.95rem;
      line-height: 1.65;
      color: rgba(240,235,226,0.85);
    }

    .cic-item-value a {
      color: var(--gold-light);
      text-decoration: underline;
      text-decoration-color: rgba(184,147,90,0.4);
    }













    /* ════════════════════════════════════════
       FOOTER
    ════════════════════════════════════════ */
    #site-footer {
      background: var(--accent-dark);
      color: rgba(240,235,226,0.7);
      padding: 40px 0 30px;
      margin-top: auto;
    }

    .footer-inner {
      width: min(1180px, calc(100% - 48px));
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
      flex-wrap: wrap;
    }

    .footer-copy {
      font-family: var(--font-sans);
      font-size: 0.85rem;
    }

    .footer-copy .en-sc,
    .footer-powered .en-sc {
      font-family: var(--font-sc);
      font-variant: small-caps;
      letter-spacing: 0.06em;
    }

    .footer-powered {
      font-size: 0.85rem;
      font-family: var(--font-sans);
    }

    .footer-powered a {
      color: var(--gold-light);
      font-style: normal;
      font-family: var(--font-sc);
      font-variant: small-caps;
      letter-spacing: 0.08em;
    }

    /* ════════════════════════════════════════
       RESPONSIVE
    ════════════════════════════════════════ */

    /* ── Tablet / narrow desktop (≤ 900px) ── */
    @media (max-width: 900px) {

      /* Nav */
      .nav-inner { width: calc(100% - 40px); }
      .nav-links { display: none; }
      .hamburger { display: flex; }

      /* Home hero: stack vertically */
      .hero-inner {
        grid-template-columns: 1fr;
        padding: 56px 0 48px;
        gap: 40px;
      }
      .hero-photo-wrap {
        display: block;
        max-width: 300px;
        margin: 0 auto;
      }

      /* Home content */
      .home-content { padding: 56px 0 48px; }
      .practice-grid { grid-template-columns: 1fr; }
      .recognition-strip {
        flex-direction: column;
        text-align: center;
        padding: 36px 28px;
        gap: 28px;
      }
      .recognition-quote { font-size: 1.1rem; }

      /* Attorney hero: photo above text — reset desktop order */
      .attorney-hero { padding-top: 32px; }
      .attorney-inner {
        grid-template-columns: 1fr;
        display: flex;
        flex-direction: column-reverse;
        gap: 0;
      }
      .attorney-text { padding-bottom: 0; order: unset; }
      .attorney-photo-wrap {
        order: unset;
        align-self: auto;
        display: block;
        max-width: 220px;
        margin: 0 auto;
        padding-top: 0;
        padding-bottom: 20px;
      }
      .attorney-photo {
        border-radius: var(--radius-lg) !important;
        border: 1px solid rgba(184,147,90,0.25) !important;
      }
      .attorney-grid { grid-template-columns: 1fr; }

      /* Practice areas */
      .practice-area {
        grid-template-columns: 1fr;
        padding: 40px 0;
        gap: 32px;
      }
      .practice-area:nth-child(even) .practice-area-text { order: 1; }
      .practice-area:nth-child(even) .practice-area-visual { order: 2; }

      /* Value grid */
      .value-grid { grid-template-columns: 1fr; }

      /* Contact */
      .contact-grid { grid-template-columns: 1fr; }

      /* Footer */
      .footer-inner { flex-direction: column; gap: 12px; text-align: center; }
    }

    /* ── Mobile (≤ 600px) ── */
    @media (max-width: 600px) {

      /* Global spacing */
      .nav-inner { width: calc(100% - 32px); height: 60px; }

      /* Nav brand: slightly smaller on mobile */
      .nav-brand-zh { font-size: 1.15rem; letter-spacing: 0.08em; }
      .nav-brand-en { font-size: 0.68rem; }

      /* Mobile menu */
      .mobile-menu { padding: 12px 16px 20px; }
      .mobile-link { font-size: 1rem; padding: 10px 14px; }

      /* Home hero */
      .home-hero { min-height: auto; }
      .hero-inner { padding: 44px 0 40px; gap: 32px; }
      .hero-desc { font-size: 1rem; margin-bottom: 28px; }
      .hero-actions { gap: 10px; }
      .btn-primary, .btn-outline { padding: 12px 22px; font-size: 0.93rem; }
      .hero-photo-wrap { max-width: 260px; }
      .hero-photo-badge { padding: 12px 16px; bottom: 16px; left: 16px; right: 16px; }
      .badge-name { font-size: 0.95rem; }
      .badge-title { font-size: 0.65rem; }
      .hero-deco { display: none; }

      /* Home content */
      .home-content { padding: 44px 0 40px; }
      .section-h2 { font-size: clamp(1.6rem, 6vw, 2.2rem); }
      .practice-card { padding: 24px 20px; }
      .recognition-strip { padding: 28px 20px; border-radius: var(--radius-md); }
      .recognition-badge { width: 100px; height: 100px; padding: 10px; gap: 2px; }
      .recognition-badge .rb-title { font-size: 0.55rem; letter-spacing: 0.08em; }
      .recognition-badge .rb-org { font-size: 0.65rem; }

      /* Attorney hero */
      .attorney-hero { padding-top: 24px; }
      .attorney-name { font-size: clamp(2rem, 8vw, 2.8rem); }
      .attorney-summary { font-size: 1rem; }
      .attorney-photo-wrap { max-width: 180px; padding-bottom: 16px; }

      /* Attorney body */
      .attorney-body { padding: 44px 0 56px; }
      .attorney-body .attorney-grid > div,
      .attorney-body aside { padding: 0; }
      .sidebar-card { padding: 20px; }
      .value-item { padding: 18px; }

      /* Practice page */
      .practice-hero { padding: 52px 0; }
      .practice-hero-h1 { font-size: clamp(1.8rem, 7vw, 2.6rem); }
      .practice-body { padding: 44px 0 56px; }
      .practice-area { padding: 32px 0; gap: 24px; }
      .practice-area-title { font-size: clamp(1.2rem, 5vw, 1.6rem); }
      .practice-area-visual { padding: 24px 20px; }
      .pav-icon svg { width: 28px; height: 28px; }

      /* Contact page */
      .contact-page { padding: 44px 0 56px; }
      .contact-header { margin-bottom: 40px; }
      .contact-info-card { padding: 28px 24px; }
      .contact-form-card { padding: 28px 20px; }
      .cic-title { font-size: 1.3rem; }
      .form-row { grid-template-columns: 1fr; }
      .form-submit { padding: 13px; }

      /* Footer */
      .footer-inner { gap: 8px; padding: 0 16px; font-size: 0.8rem; }
    }

    /* ── Small mobile (≤ 390px) ── */
    @media (max-width: 390px) {
      .nav-inner { width: calc(100% - 24px); }
      .hero-inner { width: calc(100% - 32px); }
      .home-content,
      .attorney-body,
      .practice-body,
      .contact-page { width: calc(100% - 32px); }
      .hero-actions { flex-direction: column; }
      .btn-primary, .btn-outline { width: 100%; justify-content: center; }
    }

    /* ── Utility ── */
    .mt-0 { margin-top: 0 !important; }
    .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }

    /* ════════════════════════════════════════
       SLOGAN SECTION
    ════════════════════════════════════════ */
    .slogan-section {
      position: relative;
      width: 100%;
      height: 100svh;
      min-height: 560px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      background: linear-gradient(160deg, #2a1f14 0%, #3d2d1c 50%, #4a3522 100%);
      margin-top: -68px;
    }

    .slogan-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center 52%;
      opacity: 0.22;
    }

    .slogan-overlay {
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 70% 60% at 50% 40%, rgba(184,147,90,0.10) 0%, transparent 70%),
        linear-gradient(160deg, rgba(30,18,8,0.55) 0%, rgba(45,28,14,0.45) 50%, rgba(55,38,18,0.55) 100%);
    }

    .slogan-vert-line {
      width: 1px;
      height: 52px;
      margin: 0 auto;
    }
    .slogan-vert-line--top {
      background: linear-gradient(to bottom, transparent, rgba(184,147,90,0.45));
    }
    .slogan-vert-line--bottom {
      background: linear-gradient(to top, transparent, rgba(184,147,90,0.45));
    }

    .slogan-inner {
      position: relative;
      z-index: 2;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      /* padding-top 補回 nav 高度，讓內容視覺上在 nav 以下的空間置中 */
      padding: 28px 24px;
      padding-top: calc(68px + 28px);
      gap: 28px;
    }

    .slogan-ornament {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: 0;
    }

    .slogan-ornament:last-child {
      margin: 0;
    }

    .slogan-ornament-line {
      display: block;
      width: 48px;
      height: 1px;
      background: rgba(184,147,90,0.48);
    }

    .slogan-zh-text {
      font-family: var(--font-sans);
      font-size: clamp(1.5rem, 3.2vw, 2.3rem);
      font-weight: 300;
      letter-spacing: 0.38em;
      text-indent: 0.38em;
      color: #f0ebe2;
      line-height: 1.6;
      margin: 0;
    }

    .slogan-divider {
      width: 1px;
      height: 44px;
      background: linear-gradient(to bottom, rgba(184,147,90,0.6), rgba(184,147,90,0.12));
      margin: 0;
    }

    .slogan-en-text {
      font-family: var(--font-serif);
      font-size: clamp(1.5rem, 3.2vw, 2.3rem);
      font-weight: 300;
      font-style: italic;
      letter-spacing: 0.05em;
      color: rgba(240,235,226,0.75);
      line-height: 1.75;
      max-width: 500px;
      margin: 0;
    }

    @media (max-width: 600px) {
      .slogan-zh-text { letter-spacing: 0.25em; }
      .slogan-ornament-line { width: 32px; }
    }

    /* ── Nav brand link ── */
    .nav-brand-link {
      text-decoration: none;
      display: inline-grid;
      grid-template-columns: 1fr;
      gap: 5px;
    }

    /* ── Section label / lead centred (contact page) ── */
    .section-label--center { justify-content: center; }
    .section-h2--center    { text-align: center; }
    .section-lead--center  { margin: 0 auto; text-align: center; }

    /* ── Contact grid: single-column centred ── */
    .contact-grid--single {
      grid-template-columns: 1fr;
      max-width: 560px;
      margin: 0 auto;
    }

    /* ── Value section: reset top padding ── */
    .home-content--no-top { padding-top: 0; }

    /* ── Practice area SVG icon colour ── */
    .pav-icon svg { color: var(--gold); }

    /* ── Contact form feedback panels ── */