:root { --ink:#13262f; --paper:#f4f2eb; --blue:#183f50; --gold:#b89958; --line:rgba(19,38,47,.2); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.65 Manrope,"Noto Sans SC",sans-serif; } .site-header { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 5.5vw; border-bottom:1px solid var(--line); position:relative; z-index:5; } .wordmark { text-decoration:none; color:var(--ink); letter-spacing:.14em; font:600 15px/1 "DM Mono",monospace; } .wordmark em { font:italic 500 16px "Playfair Display",serif; letter-spacing:.04em; } .mark { color:var(--gold); font-size:20px; margin-right:6px; } nav { display:flex; gap:28px; } nav a,.language-switch { color:var(--ink); text-decoration:none; border:0; background:transparent; font:500 11px "DM Mono",monospace; letter-spacing:.07em; text-transform:uppercase; cursor:pointer; } nav a:hover,.language-switch:hover { color:var(--gold); } .language-switch { border-left:1px solid var(--line); padding-left:22px; }
.hero { min-height:calc(100vh - 82px); display:grid; grid-template-columns:minmax(0,1fr) 110px; align-items:center; padding:8vw 5.5vw; overflow:hidden; position:relative; background:radial-gradient(circle at 80% 35%,#2e6574 0, #183f50 32%,#102e3a 73%); color:#fff; } .hero-copy { width:min(765px,100%); position:relative; z-index:2; } .eyebrow,.section-number { letter-spacing:.14em; font:500 10px "DM Mono",monospace; } .eyebrow { color:#d6bc7a; margin:0 0 25px; } h1,h2,h3,p { margin-top:0; } h1 { max-width:690px; margin-bottom:25px; font:500 clamp(48px,7.1vw,102px)/.98 "Playfair Display","Noto Sans SC",serif; letter-spacing:-.045em; } h1 em { color:#d6bc7a; font-weight:500; } .lede { max-width:525px; font-size:17px; color:#d8e0df; } .button { display:inline-flex; gap:34px; align-items:center; margin-top:19px; padding:15px 19px; border:1px solid #c8aa6b; color:#fff; text-decoration:none; font:500 11px "DM Mono",monospace; letter-spacing:.06em; text-transform:uppercase; transition:.2s; } .button:hover { background:#c8aa6b; color:var(--ink); } .button span { font-size:17px; } .hero-side { writing-mode:vertical-rl; align-self:end; color:#a6bbc0; font:500 9px "DM Mono",monospace; letter-spacing:.2em; } .orbit { position:absolute; border:1px solid rgba(205,181,125,.25); border-radius:50%; } .orbit-a { width:850px;height:510px;right:-250px;top:8%;transform:rotate(-26deg); }.orbit-b {width:550px;height:850px;right:9%;top:-290px;transform:rotate(40deg);}.star { position:absolute;color:#dec782;font-size:25px;}.star-one{right:17%;top:30%;}.star-two{right:35%;bottom:20%;font-size:16px;}
.section { padding:110px 11vw; }.section-number { color:#986f27; margin-bottom:58px; }.intro-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:9vw; }.intro h2,.leadership h2,.contact h2 { font:500 clamp(35px,4vw,58px)/1.1 "Playfair Display","Noto Sans SC",serif; letter-spacing:-.035em; }.intro-grid div p { font-size:16px; margin-bottom:19px; }.dark { background:var(--ink); color:#f5f1e7; }.dark .section-number { color:#d3b878; }.philosophy { padding-top:130px; padding-bottom:130px; } blockquote { max-width:1000px; margin:0; font:500 clamp(38px,5.5vw,78px)/1.12 "Playfair Display","Noto Sans SC",serif; letter-spacing:-.035em; }.philosophy-copy { margin:43px 0 0 auto; max-width:510px; color:#b4c6c7; font-size:16px; }.services { padding-bottom:80px; }.service-list { border-top:1px solid var(--line); }.service-list article { display:grid; grid-template-columns:70px 1fr 30px; gap:20px; padding:29px 0; border-bottom:1px solid var(--line); }.service-list span,.leader-index { color:#9c772f; font:500 10px "DM Mono",monospace; }.service-list h3 { margin-bottom:7px; font:500 clamp(22px,2.5vw,32px)/1.15 "Playfair Display","Noto Sans SC",serif; }.service-list p { max-width:570px; margin:0; color:#597078; }.service-list i { color:#b08c49; font-style:normal; font-size:20px; }.leaders { display:grid; grid-template-columns:1fr 1fr; gap:6vw; margin-top:65px; }.leaders article { padding-top:20px; border-top:1px solid var(--line); }.leaders h3 { margin:23px 0 9px; font:500 34px/1.05 "Playfair Display","Noto Sans SC",serif; }.leaders h3 span { font-size:18px; }.role { color:#9c772f; font:500 10px "DM Mono",monospace; letter-spacing:.05em; text-transform:uppercase; }.leaders article > p:last-child { color:#597078; }.contact { padding-bottom:55px; }.contact-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:9vw; }.contact h2 { max-width:660px; }.button.light { color:#f5f1e7; }.contact address { font-style:normal; color:#c1d0ce; }.contact address strong { color:#d9bd7c; font:500 10px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.1em; }.contact address a { color:#f5f1e7; text-decoration:none; }.corridors { border-top:1px solid rgba(255,255,255,.18); margin:90px 0 0; padding-top:21px; color:#b5c7c5; font:500 10px "DM Mono",monospace; letter-spacing:.1em; } footer { display:flex; justify-content:space-between; gap:20px; padding:22px 5.5vw; background:#0c1d24; color:#91a2a3; font:500 9px "DM Mono",monospace; letter-spacing:.08em; }
@media (max-width:720px) { .site-header { height:68px; padding:0 24px; } nav { display:none; }.hero { min-height:670px; grid-template-columns:1fr 35px; padding:80px 24px; }.section { padding:75px 24px; }.section-number { margin-bottom:35px; }.intro-grid,.leaders,.contact-grid { grid-template-columns:1fr; gap:30px; }.leaders { margin-top:35px; }.service-list article { grid-template-columns:35px 1fr 20px; gap:10px; }.service-list p { font-size:14px; }.philosophy { padding-top:85px; padding-bottom:85px; }.philosophy-copy { margin-top:30px; }.contact .button { margin-bottom:25px; }.corridors { margin-top:50px; line-height:2; } footer { flex-direction:column; padding:20px 24px; } }