:root{
  --navy:#14275c; --navy-deep:#0c1a40; --ink:#1b2440; --ink-soft:#56607c;
  --gold:#b5852f; --gold-deep:#96691c; --gold-soft:#f4ead6;
  --paper:#ffffff; --paper-alt:#f6f4ef; --line:rgba(20,39,92,.14); --line-gold:rgba(181,133,47,.45);
  --shadow:0 18px 44px -24px rgba(12,26,64,.4);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:90px}
body{margin:0; background:var(--paper); color:var(--ink); font-family:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif; font-weight:400; line-height:1.75; -webkit-font-smoothing:antialiased}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:'Noto Serif SC','Songti SC',serif; color:var(--navy); margin:0; font-weight:700; letter-spacing:.02em; text-wrap:balance}
p{margin:0}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px}
section{padding:76px 0}
.alt{background:var(--paper-alt)}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px}
@media (max-width:720px){ section{padding:52px 0} .wrap{padding:0 18px} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{transition-duration:.001ms!important} }

/* header */
header.site{position:sticky; top:0; z-index:100; background:rgba(255,255,255,.96); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.nav-inner{max-width:1180px; margin:0 auto; padding:0 28px; height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px}
.brand img{height:40px; width:auto}
nav.main{display:flex; align-items:center; gap:30px; font-size:14.5px}
nav.main > a, .dd > a{text-decoration:none; color:var(--ink); padding:8px 0; position:relative; white-space:nowrap; font-weight:500}
nav.main > a::after, .dd > a::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--gold); transform:scaleX(0); transition:transform .25s}
nav.main > a:hover::after, nav.main > a.on::after, .dd:hover > a::after, .dd > a.on::after{transform:scaleX(1)}
.dd{position:relative}
.dd > a .car{font-size:10px; margin-left:4px; color:var(--gold)}
.dd-menu{position:absolute; top:100%; left:-18px; min-width:150px; background:#fff; border:1px solid var(--line); border-top:2px solid var(--gold); box-shadow:var(--shadow); padding:6px 0; display:none}
.dd:hover .dd-menu, .dd:focus-within .dd-menu{display:block}
.dd-menu a{display:block; padding:10px 18px; text-decoration:none; font-size:14px; color:var(--ink)}
.dd-menu a:hover{background:var(--gold-soft); color:var(--navy)}
.btn{display:inline-flex; align-items:center; gap:10px; padding:13px 26px; border-radius:3px; text-decoration:none; font-size:14.5px; font-weight:500; letter-spacing:.03em; transition:all .2s; border:1px solid transparent; cursor:pointer}
.btn-gold{background:var(--gold); color:#fff}
.btn-gold:hover{background:var(--gold-deep)}
.btn-line{border-color:var(--gold); color:var(--navy); background:#fff}
.btn-line:hover{background:var(--gold-soft)}
.btn-sm{padding:10px 20px; font-size:13.5px}
.menu-btn{display:none; background:none; border:1px solid var(--line); border-radius:3px; width:42px; height:42px; font-size:20px; color:var(--navy); cursor:pointer}
@media (max-width:980px){
  .menu-btn{display:block}
  nav.main{display:none; position:absolute; top:76px; left:0; right:0; background:#fff; flex-direction:column; align-items:stretch; gap:0; padding:8px 22px 18px; border-bottom:1px solid var(--line); box-shadow:var(--shadow)}
  nav.main.open{display:flex}
  nav.main > a, .dd > a{padding:13px 0; border-bottom:1px solid var(--line); display:block}
  nav.main > a::after, .dd > a::after{display:none}
  .dd-menu{display:block; position:static; border:none; box-shadow:none; padding:0 0 0 16px}
  .dd-menu a{border-bottom:1px solid var(--line); padding:11px 0}
  .nav-cta{display:none}
}

/* section titles */
.title{text-align:center; margin-bottom:44px}
.title h2{font-size:clamp(25px,3.2vw,34px); display:inline-flex; align-items:center; gap:22px}
.title h2::before,.title h2::after{content:""; width:clamp(30px,12vw,190px); height:1px; background:var(--line-gold)}
.title p{color:var(--ink-soft); font-size:14.5px; margin-top:10px}
.kicker{color:var(--gold); font-size:14px; font-weight:600; letter-spacing:.14em; margin-bottom:12px}
.num{font-family:'Cormorant Garamond','Noto Serif SC',serif; color:var(--gold); font-weight:600}

/* hero */
.hero{position:relative; overflow:hidden; background:#fff}
.hero-media{position:absolute; top:0; right:0; bottom:0; width:66%}
.hero-media img{width:100%; height:100%; object-fit:cover}
.hero-media::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.9) 14%,rgba(255,255,255,0) 52%)}
.hero .wrap{position:relative; padding-top:86px; padding-bottom:86px}
.hero-text{max-width:500px}
.hero h1{font-size:clamp(34px,4.6vw,52px); line-height:1.25}
.hero h1 small{display:block; font-size:.56em; margin-top:8px}
.hero .en{letter-spacing:.14em; font-size:14px; color:var(--ink); margin-top:16px}
.hero .lead{color:var(--ink-soft); font-size:15px; margin-top:20px; line-height:1.95}
.actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:30px}
@media (max-width:860px){
  .hero-media{position:relative; width:100%; height:260px}
  .hero-media::after{background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,0) 40%)}
  .hero .wrap{padding-top:28px; padding-bottom:52px}
}

/* stats */
.stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.stats .wrap{display:grid; grid-template-columns:repeat(4,1fr)}
.stat{padding:28px 22px; border-left:1px solid var(--line); display:flex; gap:14px; align-items:flex-start}
.stat:first-child{border-left:none}
.stat svg{width:34px; height:34px; color:var(--gold); flex-shrink:0; margin-top:4px}
.stat b{display:block; font-family:'Cormorant Garamond','Noto Serif SC',serif; font-size:30px; line-height:1.1; color:var(--navy)}
.stat span{display:block; font-size:14px; font-weight:600; color:var(--navy); margin-top:4px}
.stat em{display:block; font-style:normal; font-size:12.5px; color:var(--ink-soft); line-height:1.6; margin-top:2px}
@media (max-width:900px){ .stats .wrap{grid-template-columns:1fr 1fr} .stat:nth-child(3){border-left:none} .stat:nth-child(n+3){border-top:1px solid var(--line)} }
@media (max-width:480px){ .stats .wrap{grid-template-columns:1fr} .stat{border-left:none; border-top:1px solid var(--line)} .stat:first-child{border-top:none} }

/* philosophy */
.philo{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center}
.tiles{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.tiles figure{margin:0; position:relative; overflow:hidden; border-radius:4px}
.tiles img{width:100%; height:180px; object-fit:cover; transition:transform .5s}
.tiles figure:hover img{transform:scale(1.05)}
.tiles figcaption{position:absolute; left:0; right:0; bottom:0; padding:26px 14px 10px; background:linear-gradient(0deg,rgba(12,26,64,.82),transparent); color:#fff; font-family:'Noto Serif SC',serif; font-size:16px; font-weight:600}
.tiles figcaption small{display:block; font-family:'Noto Sans SC',sans-serif; font-weight:400; font-size:11.5px; opacity:.85; letter-spacing:.05em}
.philo h2{font-size:clamp(24px,3vw,31px); line-height:1.4}
.philo .body{color:var(--ink-soft); font-size:14.5px; margin-top:16px; line-height:1.95}
.feats{display:grid; grid-template-columns:repeat(4,1fr); margin-top:30px}
.feat{text-align:center; padding:0 8px; border-left:1px solid var(--line)}
.feat:first-child{border-left:none}
.feat svg{width:34px; height:34px; color:var(--gold); margin:0 auto 8px}
.feat h4{font-size:14.5px}
.feat p{font-size:12px; color:var(--ink-soft)}
@media (max-width:900px){ .philo{grid-template-columns:1fr; gap:34px} }
@media (max-width:520px){ .feats{grid-template-columns:1fr 1fr; row-gap:22px} .feat:nth-child(3){border-left:none} }

/* process */
.steps{display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
.step{display:flex; gap:10px; align-items:flex-start; position:relative}
.step .num{width:40px; height:40px; border-radius:50%; background:var(--gold-soft); display:flex; align-items:center; justify-content:center; font-size:19px; flex-shrink:0}
.step h4{font-size:15px}
.step p{font-size:12.5px; color:var(--ink-soft); line-height:1.65; margin-top:3px}
@media (max-width:980px){ .steps{grid-template-columns:repeat(3,1fr); row-gap:26px} }
@media (max-width:560px){ .steps{grid-template-columns:1fr 1fr} }

/* services */
.svc{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; margin-bottom:36px}
.svc:last-child{margin-bottom:0}
.svc.rev .svc-img{order:2}
.svc-img{border-radius:4px; overflow:hidden; box-shadow:var(--shadow)}
.svc-img img{width:100%; height:300px; object-fit:cover}
.svc h3{font-size:25px; display:flex; align-items:baseline; gap:14px}
.svc h3 .num{font-size:30px}
.svc p{color:var(--ink-soft); font-size:14.5px; margin-top:10px}
.checks{display:grid; grid-template-columns:1fr 1fr; gap:8px 20px; margin:16px 0 0; padding:0; list-style:none}
.checks li{font-size:13.5px; color:var(--ink); padding-left:18px; position:relative}
.checks li::before{content:""; position:absolute; left:2px; top:.72em; width:6px; height:6px; border-radius:50%; background:var(--gold)}
@media (max-width:860px){ .svc{grid-template-columns:1fr; gap:20px} .svc.rev .svc-img{order:0} .svc-img img{height:230px} }
@media (max-width:480px){ .checks{grid-template-columns:1fr} }

/* cards */
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.card{text-decoration:none; display:block; text-align:center}
.card .ph{border-radius:4px; overflow:hidden}
.card img{width:100%; height:190px; object-fit:cover; transition:transform .5s}
.card:hover img{transform:scale(1.05)}
.card h4{font-size:16px; margin-top:12px}
.card p{font-size:12.5px; color:var(--ink-soft)}
.more{text-align:center; margin-top:34px}
@media (max-width:860px){ .cards{grid-template-columns:1fr 1fr} }

/* why + faq */
.split{display:grid; grid-template-columns:1.25fr 1fr; gap:56px}
.split h2{font-size:26px; margin-bottom:24px}
.why{display:grid; grid-template-columns:200px 1fr; gap:26px}
.why > img{width:100%; height:100%; min-height:240px; object-fit:cover; border-radius:4px}
.why-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px 22px; align-content:start}
.why-item{display:flex; gap:12px}
.why-item svg{width:28px; height:28px; color:var(--gold); flex-shrink:0; margin-top:3px}
.why-item h4{font-size:14.5px}
.why-item p{font-size:12.5px; color:var(--ink-soft); line-height:1.65}
.faq-item{border:1px solid var(--line); border-radius:3px; margin-bottom:8px; background:#fff}
.faq-q{width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:13px 16px; font:500 14.5px 'Noto Sans SC',sans-serif; color:var(--navy); display:flex; justify-content:space-between; gap:14px; align-items:center}
.faq-q i{font-style:normal; color:var(--gold); font-size:18px; transition:transform .3s; flex-shrink:0}
.faq-item.open .faq-q i{transform:rotate(45deg)}
.faq-a{max-height:0; overflow:hidden; transition:max-height .35s}
.faq-a p{padding:0 16px 14px; font-size:13.5px; color:var(--ink-soft)}
@media (max-width:980px){ .split{grid-template-columns:1fr; gap:44px} }
@media (max-width:620px){ .why{grid-template-columns:1fr} .why > img{display:none} .why-grid{grid-template-columns:1fr} }

/* contact */
.contact{background:var(--navy-deep); color:#fff}
.contact .wrap{display:grid; grid-template-columns:1.3fr 1fr; gap:50px; align-items:center}
.contact h2{color:#fff; font-size:clamp(25px,3.2vw,34px); line-height:1.4}
.contact .lead{color:#b9c3df; font-size:14.5px; margin-top:14px; max-width:500px}
.info{border-left:1px solid rgba(255,255,255,.2); padding-left:38px}
.info div{margin-bottom:18px}
.info small{display:block; font-size:11.5px; letter-spacing:.14em; color:#93a0c8}
.info a,.info span{font-family:'Noto Serif SC',serif; font-size:17px; color:#fff; text-decoration:none; overflow-wrap:anywhere}
.info a:hover{color:#e9c98a}
@media (max-width:820px){ .contact .wrap{grid-template-columns:1fr} .info{border-left:none; padding-left:0; border-top:1px solid rgba(255,255,255,.2); padding-top:26px} }
footer{background:#081330; color:#8e9abf; font-size:12.5px; padding:22px 0}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 24px}
footer a{color:#c5cde6; text-decoration:none; margin-left:18px}
footer a:first-child{margin-left:0}
footer a:hover{color:#fff}

/* inner pages */
.page-head{background:linear-gradient(120deg,var(--navy-deep),var(--navy)); color:#fff; padding:54px 0 50px}
.page-head h1{color:#fff; font-size:clamp(28px,4vw,40px)}
.page-head p{color:#c4cde8; margin-top:12px; max-width:760px; font-size:15px}
.crumbs{font-size:13px; color:#9fabd0; margin-bottom:14px}
.crumbs a{color:#d9c08c; text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.subnav{border-bottom:1px solid var(--line); background:#fff}
.subnav .wrap{display:flex; gap:32px}
.subnav a{padding:16px 0; text-decoration:none; font-weight:500; font-size:15px; color:var(--ink-soft); border-bottom:2px solid transparent; margin-bottom:-1px}
.subnav a.on{color:var(--navy); border-color:var(--gold)}
.subnav a:hover{color:var(--navy)}
.intro{max-width:820px; margin:0 auto 46px; text-align:center; color:var(--ink-soft); font-size:15.5px; line-height:2}
.intro strong{color:var(--navy)}
.plist{display:grid; gap:22px}
.pblock{display:grid; grid-template-columns:400px 1fr; background:#fff; border:1px solid var(--line); border-radius:5px; overflow:hidden; text-decoration:none; transition:box-shadow .25s, transform .25s}
.pblock:hover{box-shadow:var(--shadow); transform:translateY(-2px)}
.pblock .pimg{overflow:hidden; background:var(--paper-alt)}
.pblock img{width:100%; height:100%; min-height:230px; max-height:260px; object-fit:cover; transition:transform .5s}
.pblock:hover img{transform:scale(1.04)}
.pblock .ptext{padding:30px 36px; display:flex; flex-direction:column; justify-content:center}
.ptag{font-size:12px; letter-spacing:.14em; color:var(--gold); font-weight:600}
.pblock h3{font-size:24px; margin:6px 0 10px}
.pblock p{color:var(--ink-soft); font-size:15px}
.pmore{margin-top:18px; color:var(--gold-deep); font-size:14px; font-weight:600}
@media (max-width:820px){ .pblock{grid-template-columns:1fr} .pblock img{max-height:220px} .pblock .ptext{padding:22px} }

.detail{display:grid; grid-template-columns:1.15fr 1fr; gap:52px; align-items:start}
.gallery .main{border-radius:5px; overflow:hidden; background:var(--paper-alt); border:1px solid var(--line); aspect-ratio:3/2; cursor:zoom-in; padding:0; width:100%; display:block}
.gallery .main img{width:100%; height:100%; object-fit:cover}
.gallery .main.contain img{object-fit:contain; background:#fff}
.thumbs{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:10px}
.thumbs button{padding:0; border:2px solid transparent; border-radius:4px; overflow:hidden; cursor:pointer; background:none; aspect-ratio:3/2}
.thumbs button.on{border-color:var(--gold)}
.thumbs img{width:100%; height:100%; object-fit:cover}
.gnote{font-size:12.5px; color:var(--ink-soft); margin-top:10px}
.dtext h2{font-size:22px; padding-left:14px; border-left:3px solid var(--gold); margin-bottom:12px}
.dtext p{color:var(--ink-soft); font-size:15px; line-height:2; margin-bottom:30px}
.ask{background:var(--gold-soft); border-radius:5px; padding:22px 24px}
.ask p{margin:0 0 14px; color:var(--ink); font-size:14.5px; line-height:1.8}
.pnav{display:flex; justify-content:space-between; gap:16px; margin-top:54px; padding-top:24px; border-top:1px solid var(--line); font-size:14.5px; flex-wrap:wrap}
.pnav a{text-decoration:none; color:var(--navy); font-weight:500}
.pnav a:hover{color:var(--gold-deep)}
@media (max-width:900px){ .detail{grid-template-columns:1fr; gap:32px} }

.grid4{display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:960px; margin:0 auto}
.grid4 button{padding:0; border:none; background:none; border-radius:5px; overflow:hidden; cursor:zoom-in; aspect-ratio:3/2}
.grid4 img{width:100%; height:100%; object-fit:cover; transition:transform .5s}
.grid4 button:hover img{transform:scale(1.04)}
.prose{max-width:780px; margin:0 auto 44px; color:var(--ink-soft); font-size:15.5px; line-height:2.05}
.prose p{margin-bottom:16px}
@media (max-width:560px){ .grid4{grid-template-columns:1fr} }

.lightbox{position:fixed; inset:0; z-index:1000; background:rgba(8,14,36,.93); display:none; align-items:center; justify-content:center; padding:32px}
.lightbox.open{display:flex}
.lightbox img{max-width:100%; max-height:86vh; border-radius:3px; background:#fff}
.lightbox button{position:absolute; top:18px; right:22px; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.35); font-size:18px; cursor:pointer}

/* confidentiality gate */
.nda{display:none}
body.gated{overflow:hidden}
body.gated > header, body.gated > section, body.gated > .page-head, body.gated > footer{filter:blur(14px); pointer-events:none; user-select:none}
body.gated .nda{display:flex; position:fixed; inset:0; z-index:2000; background:rgba(8,14,36,.72); align-items:center; justify-content:center; padding:18px}
.nda-box{background:#fff; border-radius:6px; border-top:4px solid var(--gold); max-width:640px; width:100%; max-height:92vh; display:flex; flex-direction:column; padding:30px 32px 26px; box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.nda-box h2{font-size:25px; text-align:center}
.nda-sub{text-align:center; color:var(--ink-soft); font-size:14px; margin:6px 0 18px}
.nda-text{overflow:auto; border:1px solid var(--line); border-radius:4px; padding:16px 18px; font-size:14px; line-height:1.85; color:var(--ink); background:var(--paper-alt)}
.nda-text ol{margin:10px 0 0; padding-left:20px}
.nda-text li{margin-bottom:8px}
.nda-check{display:flex; gap:10px; align-items:center; margin:18px 0 0; font-size:14.5px; font-weight:500; color:var(--navy); cursor:pointer}
.nda-check input{width:18px; height:18px; accent-color:var(--gold)}
.nda-actions{display:flex; justify-content:flex-end; gap:12px; margin-top:18px; flex-wrap:wrap}
.nda-actions .btn[disabled]{opacity:.45; cursor:not-allowed}
@media (max-width:520px){ .nda-box{padding:22px 18px} .nda-actions .btn{flex:1; justify-content:center} }