/* 温曌民个人网站 · 2026网站重组：蓝白专业风格 / 原有研究入口保留 */
:root{
 --ink:#173d57;--navy:#183b5f;--blue:#2e688a;--teal:#347b8e;
 --body:#3f5d72;--muted:#6e8798;--line:#dbe7f0;
 --paper:#f0f5fa;--white:#fff;--sky:#e8f3f8;--gold:#b58d59;
 --shadow:0 14px 32px rgba(24,63,92,.075);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:radial-gradient(ellipse at 8% 0%,#d5e6f1 0%,transparent 32%),linear-gradient(135deg,#f0f5fa,#f8fafc 55%,#f0f5fa);color:var(--body);
 font:15px/1.8 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif}
a{color:#236786;text-underline-offset:3px}
a:hover{color:#9a6b48}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #c5a274;outline-offset:3px}
img{display:block;max-width:100%}
h1,h2,h3,h4,p,figure{margin:0}
h1,h2{font-weight:750;letter-spacing:.008em}
section[id]{scroll-margin-top:92px}
.container{width:min(1220px,calc(100% - 42px));margin-inline:auto}
.skip-link{position:absolute;z-index:100;top:-90px;left:12px;background:#fff;color:var(--ink);padding:9px 12px;border-radius:8px}
.skip-link:focus{top:12px}
.masthead{margin:20px auto 0;background:linear-gradient(115deg,#17375b,#1f5b78 70%,#397d91);border-radius:27px;color:white;
 padding:32px 35px;position:relative;overflow:hidden;box-shadow:0 20px 35px -20px rgba(19,51,78,.55)}
.masthead:after{content:"";position:absolute;right:-55px;top:-85px;width:275px;height:275px;border-radius:50%;
 background:rgba(255,255,255,.07);pointer-events:none}
.brandline{font-size:11px;letter-spacing:.14em;color:#c5e0ed;font-weight:750;margin-bottom:8px}
.masthead h1{font-size:clamp(25px,3.3vw,41px);line-height:1.3;position:relative;z-index:1}
.masthead p{font-size:13.5px;color:#e0edf4;line-height:1.85;max-width:820px;margin-top:9px;position:relative;z-index:1}
.primary-nav{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.98);backdrop-filter:blur(12px);
 border:1px solid #dae8f1;border-radius:15px;box-shadow:0 8px 18px rgba(30,70,110,.055);
 margin:14px auto 0;display:flex;align-items:center;gap:5px;overflow-x:auto;scrollbar-width:thin;padding:7px 11px;white-space:nowrap}
.primary-nav a{padding:9px 15px;text-decoration:none;border-radius:9px;color:#3c6882;font-weight:750;font-size:13px;flex:none}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{background:#e7f3f9;color:#173f5d}
.section{padding:38px 0 0}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:17px}
.section-heading h2{font-size:clamp(22px,2.5vw,29px);color:var(--ink);line-height:1.4}
.section-heading p{font-size:12.5px;color:#698498;max-width:530px;line-height:1.85}
.section-mark{width:7px;height:25px;background:var(--teal);border-radius:40px;display:inline-block;vertical-align:middle;margin-right:11px}
.eyebrow{font-size:10.5px;letter-spacing:.13em;color:#5c86a0;font-weight:850}
.muted{color:var(--muted);font-size:12.8px}
.panel{border:1px solid var(--line);background:rgba(255,255,255,.97);border-radius:24px;padding:28px;box-shadow:var(--shadow)}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{min-width:0;display:flex;flex-direction:column;gap:11px;background:var(--white);border:1px solid #dce9f2;border-radius:21px;
 padding:22px 21px;box-shadow:0 10px 20px rgba(20,65,90,.045);transition:transform .16s,border-color .16s,box-shadow .16s}
.card:hover{transform:translateY(-2px);border-color:#b5d4e3;box-shadow:0 14px 25px rgba(20,65,90,.09)}
.card .icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#ebf4f8;font-size:22px}
.card h3{font-size:16px;line-height:1.48;color:#1d4760}
.card p{font-size:13px;line-height:1.82;color:#637e90;flex:1}
.card .open-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:6px;min-height:38px;
 background:#1e506f;color:#fff;text-decoration:none;border-radius:100px;padding:8px 15px;font-size:12.5px;font-weight:800}
.card .open-btn:hover{background:#2b728a;color:white}
.feature-panel{background:linear-gradient(120deg,#fff 15%,#ebf5fa 100%);border:1px solid #d7e7ef;border-radius:25px;
 padding:27px 30px;display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:22px;align-items:center;box-shadow:var(--shadow);margin-bottom:17px}
.feature-panel h2{color:#154764;font-size:clamp(21px,2.35vw,27px);line-height:1.45;margin:12px 0}
.feature-panel p{color:#55768c;font-size:13.4px;line-height:1.85;max-width:780px}
.feature-panel .chips{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0}
.chips span,.pill{font-size:11px;color:#50778e;background:#fff;border:1px solid #d5e6ef;border-radius:9px;padding:5px 10px}
.feature-numeral{padding:23px;background:#e4f1f7;border-radius:20px;color:#1b516e}
.feature-numeral b{font-size:52px;display:block;line-height:1.08;letter-spacing:-.06em}
.feature-numeral span{font-size:12px;font-weight:800}
.feature-numeral small{display:block;line-height:1.75;color:#668799;margin-top:14px;font-size:11px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:10px 16px;font-size:13px;line-height:1.4;
 text-decoration:none;font-weight:800;border-radius:10px;border:1px solid transparent}
.button.primary{background:#1e546f;color:white}
.button.primary:hover{background:#2d718e;color:white}
.button.soft{background:#eef7fb;border-color:#c5deea;color:#245975}
.button.soft:hover{background:#dff0f8}
.subtle-band{display:flex;align-items:center;justify-content:space-between;gap:22px;background:#f9fbfd;border:1px solid #dce7ef;
 border-radius:21px;padding:22px 25px}
.subtle-band strong{font-size:16px;color:var(--ink)}
.subtle-band p{font-size:12.5px;color:var(--muted);margin-top:5px}
.subtle-band a{flex:none}
.footer{margin:37px auto 26px;background:#f8fbff;border:1px solid var(--line);border-radius:20px;text-align:center;padding:21px 25px;
 font-size:11.5px;color:#658094;line-height:1.95}
.footer a{text-decoration:none}
.footer .footer-links{display:flex;flex-wrap:wrap;gap:13px;justify-content:center;margin:6px 0}
.crumb{font-size:12px;color:#7d94a3;margin:24px 0 2px}
.crumb a{text-decoration:none}
.page-title{margin:22px 0 24px;max-width:940px}
.page-title .eyebrow{margin-bottom:8px}
.page-title h2{font-size:clamp(26px,3.35vw,38px);color:var(--ink);line-height:1.37}
.page-title p{font-size:14px;color:#638093;line-height:1.9;margin-top:11px}
.tabs-anchor{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.tabs-anchor a{font-size:12px;font-weight:800;text-decoration:none;border:1px solid #d2e5f0;background:#fff;
 color:#326782;padding:8px 13px;border-radius:10px}
.tabs-anchor a:hover{background:#e7f3f9}
.person-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:30px;align-items:start}
.person-grid h3{color:#1e4b66;font-size:23px;margin:8px 0 10px}
.person-grid p{font-size:13.5px;line-height:1.98;color:#466778;margin:9px 0}
.lang-chip{background:#f0f8fc;border:1px solid #d8eaf2;border-radius:10px;padding:6px 11px;display:inline-block;font-size:12px;color:#537d91;margin:5px 0}
.portrait{margin:0;border:1px solid #d9e6ed;background:#f6f9fb;padding:8px;border-radius:17px}
.portrait img{display:block;width:100%;height:auto;max-height:290px;object-fit:contain;border-radius:10px}
.portrait figcaption{font-size:11px;text-align:center;color:#7892a0;margin:7px 0 3px}
.name-story{display:grid;grid-template-columns:50px minmax(0,1fr);gap:16px;padding:19px;margin:17px 0;border:1px solid #e9ddcd;
 background:linear-gradient(125deg,#f8fbff 0%,#fff9ef 100%);border-radius:17px}
.name-story .name-symbol{font:750 26px "Songti SC","SimSun",serif;color:#9d7447;background:#f8ecd9;border:1px solid #e6d4b7;
 display:grid;place-items:center;width:44px;height:44px;border-radius:12px}
.name-verse{font-family:"Songti SC","STSong","SimSun",serif;font-size:clamp(17px,2vw,21px)!important;
 line-height:1.7!important;color:#295571!important;font-weight:750;margin:5px 0 8px!important}
.name-story p{font-size:13.2px!important;color:#5e7481;line-height:1.95!important}
.name-story .name-ending{color:#4c6a78!important}
.name-story strong{color:#315970}
.career-details{border:1px solid #d6e6ef;border-radius:14px;background:#f9fcfd;margin:17px 0;overflow:hidden}
.career-details summary{list-style-position:inside;cursor:pointer;padding:14px 16px;font-size:13px;color:#266583;font-weight:800;line-height:1.8}
.career-details summary:hover{background:#edf7fa}
.career-details[open] summary{border-bottom:1px solid #d9e9f1}
.career-story{padding:8px 19px 20px}
.career-story h3{font-size:15px;line-height:1.65;border-left:3px solid #c39b67;padding-left:10px;margin:20px 0 8px;color:#245673}
.career-story p{font-size:13.2px;line-height:2;color:#526d7e;margin:9px 0 12px}
.mentor-info{border-top:1px solid #e2edf3;padding-top:19px;margin-top:19px}
.mentor-info strong{color:#285672}
.mentor-info p{color:#617e8f;font-size:12.5px;line-height:1.9}
.practice-note{font-size:11.7px;color:#577a8a;background:#edf6fa;padding:13px 16px;border-radius:11px;margin-top:15px;line-height:1.85}
.firm-photo-block{display:grid;grid-template-columns:minmax(0,1.1fr) 290px;gap:24px;align-items:center}
.firm-photo-block h3{font-size:24px;color:#20506b;line-height:1.52;margin:9px 0 12px}
.firm-photo-block p{font-size:14px;line-height:1.92;color:#547287;margin:9px 0}
.firm-photo{margin:0;padding:10px;border:1px solid #d9e6ee;border-radius:18px;background:#f7f9fb}
.firm-photo img{width:100%;height:auto;max-height:390px;object-fit:contain;border-radius:10px}
.firm-photo figcaption{font-size:11px;color:#778c9a;text-align:center;margin:8px 3px 1px;line-height:1.7}
.law-firm-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px}
.law-firm{border:1px solid #d6e6ef;background:#fdfefe;border-radius:17px;padding:23px;min-width:0}
.law-firm .district{font-size:11px;font-weight:850;color:#47788d;letter-spacing:.1em;margin-bottom:7px}
.law-firm h4{font-size:18px;color:#1f4d6a;line-height:1.5}
.law-firm p{font-size:12.8px;color:#678293;line-height:1.9;margin:9px 0}
.law-firm a{font-size:12px;font-weight:800}
.firm-notice{font-size:12px;line-height:1.85;background:#eff7fb;border-left:3px solid #85b0c5;
 color:#577487;padding:13px 16px;border-radius:0 11px 11px 0;margin-top:14px}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.service-item{border:1px solid #dbe9f1;border-radius:16px;background:#fff;padding:21px;min-width:0}
.service-item small{font-size:10px;color:#ac8058;font-weight:850;letter-spacing:.09em}
.service-item h4{font-size:16px;color:#2d5974;line-height:1.5;margin:8px 0}
.service-item p{font-size:12.5px;line-height:1.86;color:#687f8e}
.process{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:24px 0}
.process-item{background:#f1f7fa;border:1px solid #d9e9f1;border-radius:13px;padding:18px}
.process-item span{font:italic 24px Georgia,serif;color:#a78b69}
.process-item strong{display:block;color:#275571;margin:8px 0;font-size:14px}
.process-item p{font-size:12px;color:#688496;line-height:1.85}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:24px;align-items:center}
.contact-grid p{font-size:13px;line-height:1.9;color:#597787;margin:11px 0}
.phone{font-size:clamp(21px,2.7vw,27px);font-weight:850;letter-spacing:.02em;white-space:nowrap;text-decoration:none}
.contact-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:17px 0}
.qr-panel{background:#f8fbfc;border:1px solid #dbe9ef;border-radius:16px;padding:14px;text-align:center}
.qr-panel img{width:100%;height:auto;max-width:214px;margin:auto}
.qr-panel strong{display:block;color:#2e6078;font-size:13px;margin-bottom:6px}
.qr-panel figcaption{font-size:11px;color:#8196a1;line-height:1.7;margin-top:8px}
.guide-inline{font-size:12px;border-top:1px solid #e1edf4;padding-top:15px;margin-top:18px;color:#6d8493}
.guide-inline a{font-weight:800}
.topic-section{margin-top:34px}
.topic-title{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:15px}
.topic-title h2{font-size:22px;color:#1a4862}
.topic-title p{font-size:12px;color:#718a99}
.guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.guide-steps article{border:1px solid #d9e8f0;background:#fff;border-radius:17px;padding:21px}
.guide-steps span{font-size:11px;font-weight:850;color:#b48a57}
.guide-steps h3{font-size:17px;color:#245472;margin:9px 0}
.guide-steps p{font-size:13px;line-height:1.9;color:#678293}
@media(max-width:1000px){
 .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .firm-photo-block{grid-template-columns:minmax(0,1fr) 245px}
 .person-grid{grid-template-columns:minmax(0,1fr) 175px}
 .feature-panel{grid-template-columns:minmax(0,1fr) 190px}
}
@media(max-width:690px){
 body{font-size:14px}
 .container{width:calc(100% - 26px)}
 .masthead{margin-top:13px;padding:25px 21px;border-radius:22px}
 .masthead h1{font-size:clamp(25px,6vw,32px)}
 .masthead p{font-size:12.5px}
 .primary-nav{margin-top:10px;border-radius:13px;padding:6px;gap:3px}
 .primary-nav a{padding:8px 11px;font-size:12px}
 .section{padding-top:27px}
 .section-heading,.topic-title{align-items:flex-start;flex-direction:column;gap:7px}
 .panel{padding:21px 17px;border-radius:18px}
 .card-grid,.law-firm-pair,.service-grid,.guide-steps,.process{grid-template-columns:1fr}
 .feature-panel{grid-template-columns:1fr;padding:21px 18px;gap:14px}
 .feature-numeral{padding:14px 18px;display:grid;grid-template-columns:75px minmax(0,1fr);gap:4px 12px}
 .feature-numeral b{font-size:32px;grid-row:1/4}
 .feature-numeral span{font-size:11px}
 .feature-numeral small{margin:0;font-size:10px}
 .subtle-band{flex-direction:column;align-items:start;padding:18px}
 .person-grid,.firm-photo-block,.contact-grid{grid-template-columns:1fr}
 .portrait{grid-row:1;max-width:165px}
 .firm-photo{width:min(100%,370px)}
 .firm-photo img{max-height:420px}
 .name-story{grid-template-columns:1fr;gap:7px;padding:15px}
 .name-story .name-symbol{width:40px;height:40px}
 .page-title{margin:18px 0}
 .contact-grid .qr-panel{max-width:285px}
 .contact-actions .button{min-width:0}
}
@media(max-width:390px){
 .card{padding:18px}
 .phone{font-size:22px}
 .feature-panel h2{font-size:20px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
@media print{.primary-nav,.contact-actions,.button{display:none!important}body{background:white}
 .masthead{background:white;color:#163f5f;box-shadow:none;border:1px solid #d8e2e7}
 .masthead p,.brandline{color:#39556b}
 .card,.panel,.service-item{box-shadow:none;break-inside:avoid}
 .footer{border:0}}
