/* ===== CCM v2 — JCCO-inspired minimalist style ===== */
/* Colour palette:
   --white:      #ffffff
   --off-white:  #f7f7f7
   --charcoal:   #1a1a1a
   --mid-grey:   #4a4a4a
   --light-grey: #6b7280   (was #888888; darkened for WCAG AA 4.5:1)
   --border:     #e0e0e0
   --accent:     #2c2c2c   (dark charcoal accent, replaces navy/gold)
   --accent2:    #6f5a40   (warm bronze; was #8b7355, darkened for WCAG AA)
*/

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --white:#ffffff;
  --off-white:#f7f7f7;
  --charcoal:#1a1a1a;
  --mid-grey:#4a4a4a;
  --light-grey:#6b7280;
  --border:#e0e0e0;
  --accent:#2c2c2c;
  --bronze:#6f5a40;
  --text:#2c2c2c;
  --text-light:#666666;
}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;color:var(--text);line-height:1.7;background:var(--white)}

/* Language Toggle */
.lang-toggle{position:fixed;top:90px;right:20px;z-index:999;display:flex;gap:4px;background:var(--charcoal);border-radius:25px;padding:4px;box-shadow:0 2px 12px rgba(0,0,0,.15)}
.lang-btn{padding:7px 15px;border:none;border-radius:20px;cursor:pointer;font-size:.72rem;font-weight:600;letter-spacing:1px;transition:all .3s;background:transparent;color:rgba(255,255,255,.55)}
.lang-btn.active{background:var(--white);color:var(--charcoal)}
.cn{display:none}
body.zh .en{display:none}
body.zh .cn{display:block}
body.zh .cn-inline{display:inline}
body.zh .en-inline{display:none}
.cn-inline{display:none}

/* Nav */
nav{position:fixed;top:0;width:100%;z-index:1000;background:var(--white);padding:0 5%;display:flex;align-items:center;justify-content:space-between;height:80px;border-bottom:1px solid var(--border)}
.nav-brand{display:flex;align-items:center;gap:14px}
.nav-logo{height:46px;width:auto}
.nav-text h1{font-family:'Playfair Display',serif;color:var(--charcoal);font-size:1.1rem;font-weight:600;letter-spacing:.5px}
.nav-text span{color:var(--light-grey);font-size:.62rem;letter-spacing:1.5px;text-transform:uppercase;display:block}
.nav-links{display:flex;gap:1.8rem;list-style:none}
.nav-links a{white-space:nowrap;color:var(--mid-grey);text-decoration:none;font-size:.75rem;font-weight:400;letter-spacing:.5px;transition:color .25s;text-transform:uppercase}
.nav-links a:hover,.nav-links a.active{color:var(--charcoal)}
.nav-toggle{display:none;color:var(--charcoal);font-size:1.4rem;cursor:pointer;background:none;border:none;padding:0;line-height:1}

/* Hero — clean dark overlay, no bright gold */
.hero{height:100vh;display:flex;align-items:flex-end;justify-content:center;position:relative;text-align:center;padding:0 5% 10vh;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(160deg,rgba(247,247,247,.82),rgba(232,232,232,.78))}
.hero-content{position:relative;z-index:1;max-width:780px}
.hero h2{font-family:'Playfair Display',serif;color:var(--charcoal);font-size:2.9rem;font-weight:600;margin-bottom:1.1rem;line-height:1.25;letter-spacing:-.5px}
body.zh .hero h2{font-family:'Noto Serif TC',serif}
.hero p{color:var(--mid-grey);font-size:1rem;max-width:580px;margin:0 auto 2.2rem;font-weight:400;line-height:1.8}
.gold-line{width:48px;height:2px;background:var(--bronze);opacity:1;margin:0 auto 2rem}
.btn{display:inline-block;padding:13px 34px;border:1px solid var(--charcoal);color:var(--charcoal);text-decoration:none;font-size:.78rem;letter-spacing:2px;text-transform:uppercase;transition:all .3s}
.btn:hover{background:var(--charcoal);color:var(--white)}

/* Sections */
section{padding:100px 5%}
.section-title{text-align:center;margin-bottom:60px}
.section-title h2{font-family:'Playfair Display',serif;font-size:2rem;color:var(--charcoal);margin-bottom:.5rem;font-weight:600;letter-spacing:-.3px}
body.zh .section-title h2{font-family:'Noto Serif TC',serif}
.section-title .gold-line{width:40px;height:2px;background:var(--bronze);opacity:1;margin:14px auto 0}

/* About */
.about{background:var(--off-white)}
.about-content{max-width:760px;margin:0 auto;text-align:center;font-size:.97rem;color:var(--text-light);line-height:1.95}

/* Practice Areas */
.practice-intro{max-width:760px;margin:0 auto 40px;text-align:center;font-size:.93rem;color:var(--text-light);line-height:1.85}
.practice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;max-width:1200px;margin:0 auto;background:var(--border)}
.practice-card{background:var(--white);padding:35px 28px;text-align:center;transition:background .25s;cursor:pointer}
.practice-card:hover{background:var(--off-white)}
.practice-card::before{display:none}
.practice-card .card-img{width:100%;height:110px;object-fit:cover;margin-bottom:20px;filter:grayscale(30%)}
.practice-card h3{font-family:'Playfair Display',serif;font-size:.97rem;margin-bottom:10px;color:var(--charcoal);line-height:1.4}
body.zh .practice-card h3{font-family:'Noto Serif TC',serif}
.practice-card p{font-size:.80rem;color:var(--text-light)}
.practice-detail{display:none;text-align:left;margin-top:16px;padding-top:16px;border-top:1px solid var(--border);font-size:.80rem;color:var(--text-light);line-height:1.85}
.practice-detail.active{display:block}
.practice-detail ul{margin:10px 0 0 18px}
.practice-detail li{margin-bottom:5px}

/* Team */
.team{background:var(--off-white)}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px;max-width:1200px;margin:0 auto;background:var(--border)}
.team-card{background:var(--white);overflow:hidden;transition:background .25s;cursor:pointer}
.team-card:hover{background:#fafafa}
.team-photo{width:100%;height:310px;object-fit:cover;object-position:center top;display:block;background:#e8e8e8;filter:grayscale(10%)}
.team-info{padding:24px 28px 28px}
.team-info h3{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--charcoal);margin-bottom:4px}
body.zh .team-info h3{font-family:'Noto Serif TC',serif}
.team-info .role{color:var(--bronze);font-size:.72rem;letter-spacing:1px;text-transform:uppercase;font-weight:500;margin-bottom:12px}
.team-info p{font-size:.82rem;color:var(--text-light);line-height:1.75;display:none}
/* expanded / featured: show bio in the current language only */
.team-card.active .team-info p.en,.team-card.featured .team-info p.en{display:block}
body.zh .team-card.active .team-info p.en,body.zh .team-card.featured .team-info p.en{display:none}
body.zh .team-card.active .team-info p.cn,body.zh .team-card.featured .team-info p.cn{display:block}
body.zh .team-card:not(.active):not(.featured) .team-info p.cn{display:none}
.team-info .languages{margin-top:10px;font-size:.74rem;color:var(--light-grey);font-weight:400;display:none}
.team-card.active .languages,.team-card.featured .languages{display:block}
/* expand hint on clickable cards */
.team-card[data-card-toggle] .team-info{position:relative}
.team-card[data-card-toggle] .team-info::after{content:'+';position:absolute;top:22px;right:26px;font-size:1.25rem;font-weight:300;color:var(--light-grey);line-height:1}
.team-card[data-card-toggle].active .team-info::after{content:'\2212'}
/* credentials strip (admissions / qualifications) */
.credentials{display:none;flex-wrap:wrap;gap:14px 36px;margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.team-card.active .credentials,.team-card.featured .credentials{display:flex}
.credential .c-label{font-size:.62rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:2px}
.credential .c-value{font-family:'Playfair Display',serif;font-size:1.02rem;color:var(--charcoal)}
.credential-no-value{align-self:center}
.credential-no-value .c-label{margin-bottom:0;font-size:.68rem;letter-spacing:1.1px}
/* founder: full-width feature card, photo left + profile right */
.team-card.featured{grid-column:1/-1;display:grid;grid-template-columns:minmax(280px,400px) 1fr;cursor:default}
.team-card.featured:hover{background:var(--white)}
.team-card.featured .team-photo{height:100%;min-height:460px}
.team-card.featured .team-info{padding:44px 52px;align-self:center}
.team-card.featured .team-info h3{font-size:1.45rem;margin-bottom:6px}
.team-card.featured .team-info .role{margin-bottom:18px}
.team-card.featured .team-info p{font-size:.86rem;line-height:1.85}
@media(max-width:768px){
  .team-card.featured{grid-template-columns:1fr}
  .team-card.featured .team-photo{height:auto;aspect-ratio:4/5;min-height:0;max-height:none;object-position:center}
  .team-card.featured .team-info{padding:24px 20px}
}

/* Contact */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px;max-width:860px;margin:0 auto;text-align:center}
.contact-item .ico{display:block;margin-left:auto;margin-right:auto;font-size:1.3rem;color:var(--bronze);margin-bottom:14px}
.contact-item h4{font-family:'Playfair Display',serif;margin-bottom:8px;color:var(--charcoal);font-size:.95rem}
.contact-item p{font-size:.87rem;color:var(--text-light)}
.contact-item a{color:var(--text-light);text-decoration:none;transition:color .25s}
.contact-item a:hover{color:var(--charcoal)}

/* Contact extras */
.contact-extra{display:grid;grid-template-columns:2fr 1fr;gap:30px;max-width:1000px;margin:50px auto 0;align-items:stretch}
.contact-map{overflow:hidden;min-height:300px;border:1px solid var(--border)}
.contact-map iframe{display:block;width:100%;height:100%;min-height:300px}
.contact-wechat{text-align:center;background:var(--off-white);padding:28px;border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center}
.wechat-qr{width:150px;height:150px;border:5px solid var(--white);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.contact-wechat h4{margin:14px 0 5px;color:var(--charcoal);font-family:'Playfair Display',serif}
.contact-wechat p{font-size:.80rem;color:var(--text-light)}

/* Careers */
.careers{background:var(--off-white)}


/* Testimonials */
.testimonials{background:var(--off-white)}
.testimonial-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1px;max-width:1100px;margin:0 auto;background:var(--border)}
.testimonial-card{background:var(--white);padding:36px 30px;display:flex;flex-direction:column}
.testimonial-stars{color:var(--charcoal);margin-bottom:16px;font-size:.85rem;letter-spacing:3px}
.testimonial-card p{font-style:italic;color:var(--text-light);line-height:1.95;font-size:.92rem;margin-bottom:20px}
.testimonial-author{font-weight:600;color:var(--charcoal);font-size:.82rem;margin-top:auto;letter-spacing:.5px}

/* News */
.news-list{max-width:900px;margin:0 auto;display:grid;gap:18px}
.news-card{background:var(--white);border:1px solid var(--border);border-left:2px solid var(--bronze);padding:30px 34px;cursor:pointer;transition:background .25s}
.news-card:hover{background:#fafafa}
.news-meta{font-size:.72rem;letter-spacing:1.4px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:10px}
.news-card h3{font-family:'Playfair Display',serif;font-size:1.16rem;line-height:1.5;font-weight:600;color:var(--charcoal);margin-bottom:12px}
body.zh .news-card h3{font-family:'Noto Serif TC',serif}
.news-lead{font-size:.92rem;line-height:1.85;color:var(--text-light)}
.news-more{margin-top:16px;font-size:.75rem;letter-spacing:1px;text-transform:uppercase;color:var(--bronze);font-weight:600}
.news-more::after{content:' +'}
.news-card.active .news-more::after{content:' \2212'}
.news-full{display:none;margin-top:20px;padding-top:20px;border-top:1px solid var(--border);cursor:auto}
.news-card.active .news-full{display:block}
.news-full p{font-size:.92rem;line-height:1.95;color:var(--text);margin-bottom:14px}
.news-full p:last-child{margin-bottom:0}
.news-photo{margin:0 0 22px}
.news-photo img{display:block;width:100%;max-width:100%;height:auto;border:1px solid var(--border);background:#f6f6f6}
.news-photo figcaption{margin-top:10px;font-size:.76rem;line-height:1.7;letter-spacing:.3px;color:var(--text-light);text-align:center}
@media(max-width:768px){.news-photo{margin-bottom:18px}}

/* Legal Knowledge / Blog */
.legal-knowledge{background:var(--off-white)}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1px;max-width:1100px;margin:0 auto;background:var(--border)}
.blog-card{background:var(--white);padding:28px;border-left:2px solid var(--bronze);transition:background .25s;cursor:pointer}
.blog-card:hover{background:#fafafa}
.blog-card .blog-date{font-size:.70rem;color:var(--bronze);font-weight:600;letter-spacing:1px;margin-bottom:8px;text-transform:uppercase}
.blog-card h3{font-family:'Playfair Display',serif;font-size:.95rem;color:var(--charcoal);margin-bottom:10px;line-height:1.45}
.blog-card p{font-size:.80rem;color:var(--text-light);line-height:1.75}
.blog-img{display:none;margin-top:14px}
.blog-card.active .blog-img{display:block}
.blog-img img{width:100%}

/* Legal Content */
.privacy{background:var(--off-white)}
.legal-content{max-width:800px;margin:0 auto;font-size:.87rem;color:var(--text-light);line-height:1.95}
.legal-content h4{font-family:'Playfair Display',serif;color:var(--charcoal);margin:1.6rem 0 .5rem;font-size:.97rem}
.legal-content p{margin-bottom:1rem}
.legal-content a{color:var(--bronze);text-decoration:none}
.legal-content a:hover{text-decoration:underline}

/* Footer */
footer{background:var(--charcoal);color:rgba(255,255,255,.55);padding:44px 5%;text-align:center}
.social-links{margin-bottom:22px}
.social-links a{color:rgba(255,255,255,.45);margin:0 12px;font-size:1.1rem;transition:color .3s}
.social-links a:hover{color:var(--white)}
footer p{font-size:.76rem}

/* Legal Modal */
.legal-modal{position:fixed;inset:0;z-index:2000;display:none;background:rgba(0,0,0,.45);backdrop-filter:blur(4px)}
.legal-modal.open{display:flex;align-items:center;justify-content:center}
body.modal-open{overflow:hidden}
.legal-modal-box{background:var(--white);width:100%;max-width:900px;height:90vh;margin:0 auto;display:flex;flex-direction:column;overflow:hidden}
.legal-modal-header{display:flex;align-items:center;border-bottom:1px solid var(--border);background:var(--charcoal);flex-shrink:0}
.legal-tabs{display:flex;flex:1}
.legal-tab{flex:1;padding:20px 15px;background:transparent;border:none;cursor:pointer;font-family:'Playfair Display',serif;font-size:.97rem;font-weight:600;color:rgba(255,255,255,.45);letter-spacing:.5px;transition:all .3s;border-bottom:2px solid transparent}
body.zh .legal-tab{font-family:'Noto Serif TC',serif}
.legal-tab:hover{color:rgba(255,255,255,.8)}
.legal-tab.active{color:var(--white);border-bottom-color:var(--white)}
.legal-close{background:transparent;border:none;color:rgba(255,255,255,.6);font-size:1.4rem;cursor:pointer;padding:0 22px;align-self:stretch;transition:color .3s}
.legal-close:hover{color:var(--white)}
.legal-modal-body{overflow-y:auto;padding:40px 45px;-webkit-overflow-scrolling:touch}
.legal-panel{display:none}
.legal-panel.active{display:block}
.legal-panel h3{font-family:'Playfair Display',serif;font-size:1.45rem;color:var(--charcoal);margin-bottom:.3rem}
body.zh .legal-panel h3{font-family:'Noto Serif TC',serif}
.legal-panel .legal-updated{font-size:.74rem;color:var(--bronze);margin-bottom:1.5rem;display:block}
.legal-panel .legal-content{max-width:none;margin:0}
.legal-panel h4{margin:1.6rem 0 .5rem}
.legal-panel h5{font-family:'Inter',sans-serif;font-size:.90rem;color:var(--charcoal);font-weight:600;margin:1.1rem 0 .4rem}
.legal-panel ul,.legal-panel ol{margin:.5rem 0 1rem 1.4rem}
.legal-panel li{margin-bottom:.5rem;font-size:.86rem;color:var(--text-light);line-height:1.8}
@media(max-width:768px){
  .legal-modal-box{height:100vh;max-width:100%}
  .legal-modal-body{padding:24px 20px}
  .legal-tab{padding:15px 8px;font-size:.82rem}
  .legal-panel h3{font-size:1.15rem}
}

/* Nav extras */
.nav-links{gap:1.4rem}

/* Scroll fade-in */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}

/* Floating buttons */
.whatsapp-float{position:fixed;right:20px;bottom:20px;width:54px;height:54px;background:#25D366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.7rem;box-shadow:0 4px 14px rgba(0,0,0,.2);z-index:998;transition:transform .3s;text-decoration:none}
.whatsapp-float:hover{transform:scale(1.08);color:#fff}
.scroll-top{position:fixed;right:20px;bottom:86px;width:46px;height:46px;border:1px solid var(--border);border-radius:50%;background:var(--white);color:var(--charcoal);font-size:1rem;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.1);z-index:998;transition:all .3s}
.scroll-top.show{display:flex}
.scroll-top:hover{background:var(--charcoal);color:var(--white);border-color:var(--charcoal)}

/* Responsive */
@media(max-width:768px){
  .nav-links{display:none;position:absolute;top:80px;left:0;width:100%;background:var(--white);flex-direction:column;padding:2rem;gap:1.5rem;border-bottom:1px solid var(--border);box-shadow:0 8px 24px rgba(0,0,0,.08)}
  .nav-links.active{display:flex}
  .nav-toggle{display:block}
  .hero{height:85vh;padding-bottom:8vh}
  .hero h2{font-size:1.65rem}
  .hero p{font-size:.9rem}
  section{padding:55px 5%}
  .section-title h2{font-size:1.55rem}
  .section-title{margin-bottom:36px}
  .practice-grid{grid-template-columns:1fr;gap:0}
  .practice-card{padding:24px 20px}
  .team-grid{grid-template-columns:1fr;gap:0}
  .team-photo{height:260px}
  .team-info{padding:20px}
  .contact-grid{grid-template-columns:1fr;gap:28px}
  .contact-extra{grid-template-columns:1fr;margin-top:32px}
  .contact-map,.contact-map iframe{min-height:240px}
  .testimonial-grid{grid-template-columns:1fr;gap:0}
  .blog-grid{grid-template-columns:1fr;gap:0}
  .news-list{gap:14px}
  .lang-toggle{top:84px;right:10px}
  .lang-btn{padding:6px 12px;font-size:.68rem}
  .nav-text h1{font-size:.88rem}
  .nav-text span{font-size:.58rem}
  .nav-logo{height:38px}
  nav{height:70px;padding:0 4%}
  .about-content{font-size:.9rem}
  .btn{padding:12px 26px;font-size:.74rem}
  .whatsapp-float{width:50px;height:50px;font-size:1.55rem}
  .scroll-top{width:42px;height:42px;bottom:80px}
}
@media(max-width:380px){
  .hero h2{font-size:1.38rem}
  .nav-text h1{font-size:.78rem}
  .nav-text span{display:none}
  .team-photo{height:220px}
  .team-card.featured .team-photo{height:auto;aspect-ratio:4/5}
}


/* ===== v4 additions — v3 sections restyled to the v2 minimalist palette ===== */
/* v3 content introduced sections v2 never had: About stats, Practice pillars,
   Selected Experience (case cards) and Recognition (award cards). These reuse
   the v2 tokens (--charcoal / --bronze / --off-white / --text-light) and the
   same flat, hairline-bordered, low-chrome treatment as the rest of v2. */

/* About stats */
.about-stats{display:flex;justify-content:center;flex-wrap:wrap;gap:56px;max-width:800px;margin:44px auto 0}
.about-stat{text-align:center}
.about-stat .label{font-size:.66rem;letter-spacing:2px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:6px}
.about-stat .value{font-family:'Playfair Display',serif;font-size:1.5rem;color:var(--charcoal)}
body.zh .about-stat .value{font-family:'Noto Serif TC',serif}

/* Practice pillars */
.practice-pillars{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:1000px;margin:0 auto 40px}
.pillar{border:1px solid var(--border);border-radius:30px;padding:8px 20px;font-size:.68rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--mid-grey);font-weight:500}
.pillar span{color:var(--bronze);margin-right:6px}

/* Selected Experience — case cards */
.experience{background:var(--off-white)}
.case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1px;max-width:1200px;margin:0 auto;background:var(--border)}
.case-card{background:var(--white);border-top:2px solid var(--bronze);padding:28px 26px;transition:background .25s}
.case-card:hover{background:#fafafa}
.case-tag{font-size:.66rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:10px}
.case-name{font-family:'Playfair Display',serif;font-size:.97rem;font-style:italic;font-weight:600;color:var(--charcoal);margin-bottom:6px;line-height:1.4}
body.zh .case-name{font-family:'Noto Serif TC',serif}
.case-ref{font-size:.72rem;color:var(--light-grey);letter-spacing:.5px;margin-bottom:12px}
.case-card p{font-size:.82rem;color:var(--text-light);line-height:1.75}
.case-note{max-width:900px;margin:35px auto 0;text-align:center;font-size:.74rem;color:var(--text-light);font-style:italic}

/* Recognition — award cards */
.awards{background:var(--off-white)}
.award-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;max-width:900px;margin:0 auto;background:var(--border)}
.award-card{background:var(--white);padding:35px 30px;text-align:center;transition:background .25s}
.award-card:hover{background:#fafafa}
.award-badge{margin-bottom:20px}
.award-badge img{max-width:100%;height:160px;width:auto;object-fit:contain}
.award-status{font-size:.68rem;letter-spacing:2px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:8px}
.award-card h3{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--charcoal);margin-bottom:12px}
body.zh .award-card h3{font-family:'Noto Serif TC',serif}
.award-card p{font-size:.82rem;color:var(--text-light);line-height:1.75}

/* An expanded practice card spans the full row so long detail stays readable */
.practice-grid:has(.practice-detail.active) .practice-card:has(.practice-detail.active){grid-column:1/-1}

/* Keep the light/white rhythm now that two extra sections sit between team/contact */
.team{background:var(--white)}

@media(max-width:768px){
  .about-stats{gap:28px;margin-top:30px}
  .about-stat .value{font-size:1.25rem}
  .practice-pillars{gap:8px;margin-bottom:28px}
  .pillar{padding:7px 14px;font-size:.62rem;letter-spacing:1px}
  .case-grid{grid-template-columns:1fr;gap:0}
  .case-card{padding:22px 20px}
  .award-grid{grid-template-columns:1fr;gap:0}
}
/* ===== Audit fixes (2026-10-06) ===== */
/* Inline SVG icons (replace Font Awesome webfont) */
.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}
.ico{display:inline-block;width:1em;height:1em;fill:currentColor;vertical-align:-.125em;flex-shrink:0}
.testimonial-stars .ico{margin-right:3px}
/* Skip link (keyboard users) */
.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--white);color:var(--charcoal);padding:10px 16px;border:1px solid var(--charcoal);text-decoration:none;font-size:.85rem}
.skip-link:focus{left:12px;top:12px}
/* Spacing utilities (replace inline style="margin-top:…") */
.mt-1{margin-top:1rem}
.mt-12{margin-top:1.2rem}
.mt-15{margin-top:1.5rem}
footer .footer-legal{margin-top:10px;font-size:.72rem}
footer .footer-legal a{color:rgba(255,255,255,.6);text-decoration:none}
footer .footer-legal a:hover{color:var(--white)}
/* Practice cards: heading is a real <button> */
.practice-toggle{all:unset;display:block;width:100%;cursor:pointer;font:inherit;color:inherit;line-height:inherit;text-align:inherit}
.practice-toggle:focus-visible{outline:2px solid var(--charcoal);outline-offset:4px}
/* Click-to-load map */
.map-load{width:100%;height:100%;min-height:300px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--off-white);border:0;cursor:pointer;font:inherit;font-size:.82rem;letter-spacing:.5px;color:var(--mid-grey);transition:background .25s,color .25s}
.map-load:hover,.map-load:focus-visible{background:#ececec;color:var(--charcoal)}
.map-load .ico{font-size:1.2rem;color:var(--bronze)}
.contact-map iframe{border:0}
/* Nav subtitle: show only the active language (.nav-text span outranked .cn) */
.nav-text span.cn{display:none}
body.zh .nav-text span.en{display:none}
body.zh .nav-text span.cn{display:block}
/* Nav: compact at <=1280px; hamburger at <=1180px */
.nav-text h1{white-space:nowrap}
@media(max-width:1280px){
  .nav-links{gap:1.1rem}
  .nav-links a{font-size:.7rem}
  .nav-text span{display:none!important}
}
@media(max-width:1180px){
  .nav-links{display:none;position:absolute;top:80px;left:0;width:100%;background:var(--white);flex-direction:column;padding:2rem;gap:1.5rem;border-bottom:1px solid var(--border);box-shadow:0 8px 24px rgba(0,0,0,.08)}
  .nav-links.active{display:flex}
  .nav-links a{font-size:.75rem}
  .nav-toggle{display:block}
  .nav-text span.en{display:block!important}
  body.zh .nav-text span.en{display:none!important}
  body.zh .nav-text span.cn{display:block!important}
}
@media(max-width:768px){
  .nav-links{top:70px}
}
@media(max-width:380px){
  .nav-text span.en,.nav-text span.cn,body.zh .nav-text span.cn{display:none!important}
}

/* ===== Round 2 review (2026-10-06): design / usability / conversion ===== */
/* Nav: brand is a home link; language toggle lives inside the nav bar */
.nav-brand{text-decoration:none;color:inherit}
.nav-actions{display:flex;align-items:center;gap:10px}
.lang-toggle{position:static;top:auto;right:auto;z-index:auto;box-shadow:none;margin-left:24px}
.lang-btn{min-width:44px;min-height:40px;padding:0 12px}
.nav-toggle{min-width:44px;min-height:44px;align-items:center;justify-content:center}
@media(max-width:1180px){
  .nav-toggle{display:inline-flex}
  .nav-links a{display:flex;align-items:center;min-height:44px;width:100%}
  .nav-links{gap:.25rem}
  .lang-toggle{margin-left:0}
}
/* Hero calls to action */
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}
.btn-primary{background:var(--charcoal);color:var(--white)}
.btn-primary:hover{background:#000;color:var(--white)}
.hero-cta .btn:not(.btn-primary){background:rgba(255,255,255,.6)}
.hero-cta .btn:not(.btn-primary):hover{background:var(--charcoal);color:var(--white)}
/* Practice filters (real buttons) */
.pillar{background:transparent;font-family:inherit;cursor:pointer;min-height:44px;transition:background .2s,color .2s,border-color .2s}
.pillar span{color:inherit;margin-right:0}
.pillar .pillar-no{color:var(--bronze);margin-right:6px}
.pillar:hover{border-color:var(--charcoal);color:var(--charcoal)}
.pillar.active{background:var(--charcoal);border-color:var(--charcoal);color:var(--white)}
.pillar.active .pillar-no{color:#d9c7a8}
.pillar:focus-visible{outline:2px solid var(--charcoal);outline-offset:3px}
.practice-card[hidden]{display:none}
/* Testimonials: tighter vertical rhythm */
.testimonials{padding-top:80px;padding-bottom:80px}
/* Contact: tap targets + enquiry form */
.contact-item a{display:inline-block;padding:12px 4px;min-height:44px}
.enquiry-form{max-width:860px;margin:50px auto 0;background:var(--off-white);border:1px solid var(--border);padding:36px 40px;display:grid;grid-template-columns:1fr 1fr;gap:18px 24px}
.enquiry-form h3,.enquiry-form .form-note,.enquiry-form .form-row-full,.enquiry-form .form-error,.enquiry-form .form-actions{grid-column:1/-1}
.enquiry-form h3{font-family:'Playfair Display',serif;font-size:1.25rem;color:var(--charcoal);font-weight:600}
body.zh .enquiry-form h3{font-family:'Noto Serif TC',serif}
.form-note{font-size:.85rem;color:var(--text-light);line-height:1.7}
.form-note-small{font-size:.8rem}
.form-row label{display:block;font-size:.8rem;letter-spacing:.3px;color:var(--mid-grey);margin-bottom:6px;font-weight:500}
.form-row input,.form-row select,.form-row textarea{width:100%;font:inherit;font-size:1rem;padding:11px 14px;border:1px solid #bdbdbd;background:var(--white);color:var(--text);border-radius:0;min-height:44px}
.form-row textarea{resize:vertical}
.form-row input:focus-visible,.form-row select:focus-visible,.form-row textarea:focus-visible{outline:2px solid var(--charcoal);outline-offset:1px}
.form-error{color:#9b1c1c;font-size:.88rem}
.form-actions{display:flex;flex-wrap:wrap;gap:12px}
/* Legal Knowledge: explicit expand affordance, full articles */
.blog-more{margin-top:14px;font-size:.75rem;letter-spacing:1px;text-transform:uppercase;color:var(--bronze);font-weight:600}
.blog-more::after{content:' +'}
.blog-card.active .blog-more::after{content:' \2212'}
.blog-grid .blog-card.active{grid-column:1/-1}
.blog-full{display:none;margin-top:18px;padding-top:18px;border-top:1px solid var(--border);max-width:760px;cursor:auto}
.blog-card.active .blog-full{display:block}
.blog-full p,.blog-full li{font-size:.95rem;color:var(--text);line-height:1.9}
.blog-full p{margin-bottom:12px}
.blog-full h4{font-family:'Noto Serif TC',serif;font-size:1rem;color:var(--charcoal);margin:20px 0 8px}
.blog-full ul{margin:0 0 12px 22px}
.blog-full img{display:block;width:100%;max-width:640px;height:auto}
/* Footer: N.A.P. + secondary links */
footer{text-align:left}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;max-width:1100px;margin:0 auto 28px}
.footer-col h4{font-family:'Playfair Display',serif;color:var(--white);font-size:.95rem;font-weight:600;line-height:1.5;margin-bottom:12px}
.footer-col p{font-size:.86rem;line-height:1.6}
.footer-col a{color:rgba(255,255,255,.78);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.footer-col a:hover{color:var(--white)}
.footer-links{list-style:none}
.social-links{margin:0 0 0 -10px}
.social-links a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin:0}
footer>p{text-align:center}
footer .footer-legal a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
@media(max-width:768px){
  .hero-cta{flex-direction:column;align-items:center}
  .hero-cta .btn{width:100%;max-width:320px}
  .enquiry-form{grid-template-columns:1fr;padding:26px 20px;margin-top:36px}
  .news-card{padding:24px 20px}
  .news-card h3{font-size:1.02rem}
  .news-full p{font-size:.9rem}
  .footer-grid{grid-template-columns:1fr;gap:24px}
  .testimonials{padding-top:56px;padding-bottom:56px}
  /* 12px floor for small text on phones */
  .case-tag,.case-ref,.award-status,.about-stat .label,.credential .c-label,.team-info .role,.team-info .languages,
  .pillar,.news-more,.blog-more,.nav-text span,.lang-btn,.practice-card p,.blog-card p,.contact-wechat p,
  footer p,footer .footer-legal,.form-row label{font-size:.78rem}
  .about-content,.legal-content{font-size:.95rem}
}

/* Empty grid cells (filtered practice cards / expanded blog card) must not show the grey gap colour */
.practice-grid,.blog-grid{background:transparent}
.practice-card,.blog-card{box-shadow:0 0 0 1px var(--border)}

/* Phones: keep brand + language toggle + menu button on one row */
@media(max-width:600px){
  nav{padding:0 12px;height:68px}
  .nav-brand{gap:8px;min-width:0;flex:1 1 auto}
  .nav-logo{width:44px;height:auto}
  .nav-text{min-width:0}
  .nav-text h1{font-size:.8rem;letter-spacing:.5px;white-space:nowrap}
  .nav-text span,.nav-text span.en,.nav-text span.cn,body.zh .nav-text span.en,body.zh .nav-text span.cn{display:none!important}
  .nav-actions{gap:4px;flex:0 0 auto}
  .lang-btn{min-width:40px;padding:0 8px}
  .nav-links{top:68px}
}
@media(max-width:360px){.nav-text h1{white-space:normal;line-height:1.2}}

/* Team Profile Pages */
.profile-page{max-width:900px;margin:0 auto;padding:60px 24px 80px}
.profile-header{display:grid;grid-template-columns:minmax(250px,350px) 1fr;gap:40px;align-items:start;margin-bottom:40px}
.profile-photo{width:100%;max-width:350px;height:auto;object-fit:cover;object-position:center top;border-radius:2px}
.profile-name{font-family:'Playfair Display',serif;font-size:1.8rem;color:var(--charcoal);margin-bottom:4px}
body.zh .profile-name{font-family:'Noto Serif TC',serif}
.profile-title{color:var(--bronze);font-size:.8rem;letter-spacing:1px;text-transform:uppercase;font-weight:500;margin-bottom:16px}
.profile-bio h3{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--charcoal);margin:32px 0 16px;border-bottom:1px solid var(--border);padding-bottom:8px}
body.zh .profile-bio h3{font-family:'Noto Serif TC',serif}
.profile-bio p{font-size:.9rem;color:var(--text-light);line-height:1.85;margin-bottom:12px}
.profile-bio .en{display:block}
.profile-bio .cn{display:none}
body.zh .profile-bio .en{display:none}
body.zh .profile-bio .cn{display:block}
.testimonials-section{margin-top:48px}
.testimonials-section h3{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--charcoal);margin-bottom:20px;border-bottom:1px solid var(--border);padding-bottom:8px}
body.zh .testimonials-section h3{font-family:'Noto Serif TC',serif}
.testimonial-item{background:var(--white);border-left:3px solid var(--bronze);padding:16px 20px;margin-bottom:16px;font-size:.85rem;color:var(--text-light);line-height:1.75;font-style:italic}
.testimonial-item .en{display:block}
.testimonial-item .cn{display:none}
body.zh .testimonial-item .en{display:none}
body.zh .testimonial-item .cn{display:block}
.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--bronze);font-size:.85rem;text-decoration:none;margin-bottom:32px;font-weight:500}
.back-link:hover{text-decoration:underline}
.ico-back{transform:rotate(-90deg)}
.profile-link{display:inline-block;margin-top:12px;color:var(--bronze);font-size:.8rem;font-weight:500;text-decoration:none;letter-spacing:.5px}
.profile-link:hover{text-decoration:underline}
@media(max-width:768px){
  .profile-header{grid-template-columns:1fr;gap:24px}
  .profile-photo{max-width:280px;margin:0 auto}
  .profile-page{padding:40px 16px 60px}
}
/* ===== Site-wide justified body copy (2026-11-10) =====
   All prose (paragraphs + list items) is justified / 左右對齊 on every page:
   About, Practice Areas, Selected Experience, Recognition, News, Legal
   Knowledge, Careers, enquiry form, legal modals, team profiles and
   testimonials. Short centred UI text stays centred (hero tagline, section
   titles, nav/buttons, contact details, WeChat block, footer copyright and
   the Apply Now button line). Headings are intentionally NOT justified. */
p,li{text-align:justify;-webkit-hyphens:auto;hyphens:auto}
.about-content,.practice-intro,.practice-detail,.case-note{text-align:justify}
.hero-content p,.contact-item p,.contact-wechat p,footer>p,.careers .about-content>p:last-child{text-align:center;-webkit-hyphens:none;hyphens:none}