/* Hồ sơ cá nhân theo màu và phông Bài 3. */
body{background:#f8fbfc}
.wrap{width:min(1160px,calc(100% - 64px))}
.top{padding:26px 0;border-bottom:0}
.brand{font-size:24px;position:relative;padding-left:18px}
.brand::before{content:"";position:absolute;left:0;top:4px;width:5px;height:45px;background:var(--orange);border-radius:3px}
.top nav{gap:26px;font-weight:600}
.hero{position:relative;background:var(--navy);color:white;border-radius:24px;padding:60px;gap:56px;min-height:570px;overflow:hidden;box-shadow:0 20px 60px #05305512}
.hero::after{content:"";position:absolute;width:430px;height:430px;right:-240px;top:-270px;border:70px solid #0D9FA933;border-radius:50%;pointer-events:none}
.hero .eyebrow{color:#d2f3f4;font-size:10px;letter-spacing:1.3px;margin-bottom:28px}
.hero h1{font-size:52px;line-height:1.19;letter-spacing:-1.6px;font-weight:700;max-width:570px}
.hero .intro{color:#e2eef6;font-size:16px;line-height:1.9;margin:24px 0 30px}
.hero .button{background:var(--orange);color:var(--navy);box-shadow:0 5px 20px #00000016;font-size:14px;padding:15px 20px;gap:10px}
.hero .button:hover{background:#ffb259}
.hero .download{color:white;font-size:13px;text-underline-offset:5px}
.workboard{position:relative;background:#fff;color:var(--navy);border:0;padding:30px;border-radius:16px;box-shadow:0 16px 40px #001e3933;z-index:1}
.workboard::before{content:"LMH";display:grid;place-items:center;width:80px;height:80px;border-radius:50%;background:var(--light);color:var(--navy);font-size:24px;font-weight:700;letter-spacing:2px;margin:0 0 24px;border:1px solid #b8dee3}
.workboard::after{content:"";position:absolute;left:91px;top:90px;width:17px;height:17px;border-radius:50%;background:var(--orange);border:3px solid white}
.workboard .eyebrow{color:var(--teal);font-size:10px;margin-bottom:12px;letter-spacing:1px}
.qual{padding:16px 0;border-bottom:1px solid #e3ecef;font-size:12px;line-height:1.8}
.qual:last-child{border-bottom:0;padding-bottom:0}
.qual b{font-size:14px;margin-bottom:6px}
.section{padding:72px 0}
.section>.eyebrow,.section-title>.eyebrow{padding-left:34px;position:relative}
.section>.eyebrow::before,.section-title>.eyebrow::before{content:"";position:absolute;width:22px;height:2px;left:0;top:9px;background:var(--orange)}
h2{font-size:36px;line-height:1.35;letter-spacing:-1px;max-width:820px}
.bio-grid{gap:56px;align-items:start}
.bio-grid>p{font-size:17px;line-height:1.9;margin:0}
.bio-grid>div{background:#fff;padding:24px 28px;border-radius:14px;border:1px solid #dbe9ef;border-top:4px solid var(--orange)}
.bio-grid h3{font-size:17px;margin:0 0 12px}
.bio-grid>div p{font-size:13px;line-height:1.9}
#kinh-nghiem{padding-top:24px}
.timeline{position:relative;margin-left:12px;grid-template-columns:165px 1fr;padding:22px 0 22px 34px;gap:24px;border-top:0;border-left:2px solid #cce2e8}
.timeline::before{content:"";position:absolute;left:-7px;top:27px;width:12px;height:12px;border:3px solid var(--navy);background:#fff;border-radius:50%}
.timeline:first-of-type::before{border-color:var(--orange);background:var(--orange)}
.timeline time{font-size:12px;font-weight:600;white-space:nowrap}
.timeline>div{background:#fff;padding:18px 22px;border:1px solid #e1eaef;border-radius:12px;box-shadow:0 4px 14px #05305504;margin-top:-9px}
.timeline h3{font-size:17px;margin-bottom:7px}
.timeline p{font-size:13px;color:var(--teal)}
#dich-vu{padding-top:24px}
.services article{position:relative;border-top:0;border-left:5px solid var(--orange);background:white;padding:32px 38px;border-radius:14px;box-shadow:0 10px 28px #05305509}
.services article h3{font-size:25px;margin-top:0;max-width:850px}
.services article p{max-width:850px;font-size:15px}
.price{display:inline-block;background:var(--light);padding:12px 18px!important;border:0;margin-top:18px;border-radius:8px;font-size:14px!important}
.projects{position:relative;border-radius:24px;margin:0 24px;background:var(--navy);padding:56px 0}
.projects .wrap{width:min(1040px,calc(100% - 72px))}
.projects .eyebrow{color:#caedf0;font-size:11px}
.projects h2{font-size:36px}
.section-desc{font-size:14px;line-height:1.9}
.project{grid-template-columns:52px 1fr 130px;gap:24px;padding:28px 0;border-color:#ffffff26}
.project-index{font-size:24px;font-weight:700;color:var(--orange)}
.project h3{font-size:22px;margin:10px 0 12px}
.project p{font-size:14px;line-height:1.9;color:#dceaf4}
.project-label{font-size:11px;padding:8px 10px;border:1px solid #ffffff35;border-radius:6px;text-align:center}
.contact{padding:64px 0 72px}
.contact p{font-size:16px;color:var(--teal)}
.contact-pending{background:white;border-radius:8px;border:1px solid #dce8ef;border-left:4px solid var(--orange);font-size:13px}
.footer{font-size:11px;padding:24px 0 30px}
@media(min-width:761px) and (max-width:1050px){.hero{padding:40px;gap:32px}.hero h1{font-size:42px}.hero .button{font-size:12px}.top nav{gap:16px;font-size:12px}.workboard{padding:24px}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.top{padding:22px 0;gap:12px}.brand{font-size:19px;padding-left:12px;max-width:165px}.brand::before{width:4px;height:46px}.brand span{font-size:7px;letter-spacing:1.1px}.top nav{gap:8px 12px;font-size:10px;max-width:125px}.hero{padding:34px 24px;gap:32px;border-radius:18px;min-height:0}.hero .eyebrow{font-size:8px;letter-spacing:1px;line-height:1.8;margin-bottom:20px}.hero h1{font-size:35px;letter-spacing:-1px;line-height:1.24}.hero .intro{font-size:14px;line-height:1.85}.hero .button{font-size:11px;padding:13px 14px}.hero .download{font-size:12px}.workboard{padding:24px;border-radius:12px}.workboard::before{width:64px;height:64px;font-size:20px;margin-bottom:18px}.workboard::after{left:72px;top:72px}.qual b{font-size:13px}.qual{font-size:11px}.section{padding:44px 0}h2{font-size:27px;letter-spacing:-.6px}.bio-grid{gap:24px}.bio-grid>p{font-size:15px}.bio-grid>div{padding:22px}.timeline{grid-template-columns:1fr;gap:14px;padding:18px 0 18px 23px;margin-left:6px}.timeline::before{top:22px}.timeline>div{padding:17px;margin:0}.timeline h3{font-size:16px}.timeline p{font-size:12px}.services article{padding:24px}.services article h3{font-size:22px}.services article p{font-size:14px}.price{font-size:12px!important}.projects{margin:0 10px;padding:40px 0;border-radius:18px}.projects .wrap{width:calc(100% - 40px)}.projects h2{font-size:27px}.project{grid-template-columns:28px 1fr;gap:14px;padding:24px 0}.project-index{font-size:19px}.project h3{font-size:20px}.tag{font-size:9px;line-height:1.8}.project p{font-size:12px}.project-label{grid-column:2;width:max-content;max-width:100%;font-size:10px}.section-desc{font-size:12px}.contact{padding:44px 0}.contact p{font-size:14px}.footer{font-size:10px}}