*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:#102f59;background:#fff;font-family:Arial,Helvetica,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.portfolio{width:min(1120px,100% - 48px);margin:0 auto}.heroSection{grid-template-columns:1.1fr .9fr;align-items:center;gap:70px;min-height:650px;padding:80px 0;display:grid}.heroContent{max-width:650px}.eyebrow{letter-spacing:3px;color:#176fe0;margin-bottom:18px;font-size:12px;font-weight:700}.heroContent h1{letter-spacing:-3px;color:#102f59;margin-bottom:25px;font-size:clamp(48px,6vw,76px);font-weight:700;line-height:.98}.heroContent h2{color:#38516f;max-width:540px;margin-bottom:20px;font-size:22px;font-weight:500}.heroDescription{color:#718096;max-width:570px;margin-bottom:30px;font-size:16px}.heroButtons{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.primaryButton,.secondaryButton{border-radius:7px;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:0 20px;font-size:14px;font-weight:600;transition:all .2s;display:inline-flex}.primaryButton{color:#fff;background:#176fe0}.primaryButton:hover{background:#102f59}.secondaryButton{color:#102f59;background:#fff;border:1px solid #d9e1ea}.secondaryButton:hover{color:#fff;background:#102f59;border-color:#102f59}.socialLinks{align-items:center;gap:22px;margin-top:25px;display:flex}.socialLinks a{color:#61738a;align-items:center;gap:7px;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.socialLinks a:hover{color:#176fe0}.heroImageWrapper{justify-content:flex-end;display:flex}.imageFrame{background:#f4f7fa;border:1px solid #e4e9ef;border-radius:10px;width:340px;height:420px;padding:10px}.profileImage{object-fit:cover;border-radius:6px;width:100%;height:100%;display:block}.informationSection{grid-template-columns:1fr 1fr;gap:22px;padding:40px 0 100px;display:grid}.infoCard{background:#fff;border:1px solid #e2e8ef;border-radius:10px;min-height:300px;padding:30px;transition:background-color .25s,border-color .25s,transform .25s}.infoCard:hover{background:#102f59;border-color:#102f59;transform:translateY(-3px)}.cardHeader{border-bottom:1px solid #e7ecf1;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:20px;display:flex}.cardNumber,.cardLabel{letter-spacing:2px;color:#8291a3;font-size:11px;font-weight:700}.cardContent h3{color:#102f59;margin-bottom:17px;font-size:26px;font-weight:650}.cardContent p{color:#718096;margin-bottom:14px;font-size:14px;line-height:1.8}.infoCard:hover .cardHeader{border-color:#ffffff2e}.infoCard:hover .cardNumber,.infoCard:hover .cardLabel,.infoCard:hover .cardContent h3,.infoCard:hover .cardContent p,.infoCard:hover .aboutMeta span,.infoCard:hover .aboutMeta strong{color:#fff}.aboutMeta{grid-template-columns:1fr 1fr;gap:18px;margin-top:25px;display:grid}.aboutMeta div{flex-direction:column;gap:4px;display:flex}.aboutMeta span{text-transform:uppercase;letter-spacing:1.5px;color:#95a2b2;font-size:10px}.aboutMeta strong{color:#38516f;font-size:13px;font-weight:600}.skillsGrid{grid-template-columns:1fr 1fr;gap:9px 25px;display:grid}.skillItem{color:#52677f;align-items:center;gap:10px;padding:9px 0;font-size:13px;font-weight:500;transition:all .2s;display:flex}.skillIcon{color:#176fe0;background:#f2f6fa;border-radius:6px;justify-content:center;align-items:center;width:30px;height:30px;transition:all .2s;display:flex}.infoCard:hover .skillItem{color:#fff}.infoCard:hover .skillIcon{color:#fff;background:#ffffff1f}.sectionHeading,.sectionMiniHeader{align-items:center;gap:16px;display:flex}.sectionNumber{letter-spacing:2px;color:#176fe0;font-size:11px;font-weight:700}.sectionLabel{letter-spacing:2px;color:#8492a3;font-size:11px;font-weight:700}.projectSection{padding:20px 0 100px}.projectSection .sectionHeading{margin-bottom:25px}.projectCard{background:#f6f8fa;border:1px solid #e4e9ee;border-radius:10px;grid-template-columns:.9fr 1.1fr;align-items:center;gap:50px;padding:42px;display:grid}.projectInfo{max-width:480px}.projectTag{letter-spacing:1.5px;color:#176fe0;margin-bottom:15px;font-size:10px;font-weight:700;display:inline-block}.projectInfo h3{color:#102f59;margin-bottom:17px;font-size:31px;line-height:1.2}.projectInfo p{color:#6d7d90;margin-bottom:22px;font-size:14px;line-height:1.8}.techList{flex-wrap:wrap;gap:8px;margin-bottom:25px;display:flex}.techList span{color:#52677f;background:#fff;border:1px solid #dfe6ed;border-radius:5px;padding:6px 10px;font-size:11px;font-weight:600}.projectButtons{flex-wrap:wrap;gap:10px;display:flex}.projectPreview{background:#fff;border:1px solid #dfe5eb;border-radius:8px;width:100%;overflow:hidden;box-shadow:0 12px 30px #102f5914}.browserBar{background:#edf1f5;align-items:center;gap:5px;height:32px;padding:0 12px;display:flex}.browserBar span{background:#aeb8c3;border-radius:50%;width:7px;height:7px}.dashboardMockup{grid-template-columns:100px 1fr;min-height:280px;display:grid}.mockSidebar{background:#102f59;padding:15px 10px}.mockLogo{opacity:.85;background:#fff;border-radius:3px;width:38px;height:10px;margin:4px auto 28px}.mockNav{background:#ffffff40;border-radius:3px;width:60px;height:8px;margin:17px auto}.mockNav.active{background:#fff}.mockMain{background:#f8fafc;padding:20px}.mockTop{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.mockTitle{background:#b5c0cc;border-radius:3px;width:90px;height:12px}.mockUser{background:#d4dce5;border-radius:50%;width:25px;height:25px}.mockCards{grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:18px;display:grid}.mockCard{background:#fff;border:1px solid #e3e8ed;border-radius:5px;padding:12px}.mockCard small{color:#8996a4;margin-bottom:7px;font-size:7px;display:block}.mockCard strong{color:#102f59;font-size:17px}.mockTable{background:#fff;border:1px solid #e3e8ed;border-radius:5px;overflow:hidden}.mockTableHeader{background:#eef2f5;height:25px}.mockRow{border-top:1px solid #edf0f3;grid-template-columns:1.5fr 1fr .5fr;align-items:center;gap:10px;height:30px;padding:0 12px;display:grid}.mockRow span{background:#d8dee5;border-radius:2px;height:6px}.educationServices{grid-template-columns:.9fr 1.1fr;gap:22px;padding-bottom:100px;display:grid}.educationCard,.servicesCard{background:#fff;border:1px solid #e2e8ef;border-radius:10px;padding:30px}.educationContent{align-items:center;gap:20px;margin-top:30px;display:flex}.educationLogo{border:1px solid #e1e7ed;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;padding:8px;display:flex}.educationLogo img{object-fit:contain;width:100%;height:100%}.educationContent h3{color:#102f59;margin-bottom:5px;font-size:17px}.institution{color:#65778b;font-size:13px}.educationYear{color:#176fe0;margin-top:5px;font-size:12px}.servicesGrid{grid-template-columns:1fr 1fr;gap:20px;margin-top:28px;display:grid}.serviceItem{align-items:flex-start;gap:12px;display:flex}.serviceIcon{color:#176fe0;background:#f3f6f9;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.serviceItem h4{color:#102f59;margin-bottom:3px;font-size:13px}.serviceItem p{color:#7a8999;font-size:11px;line-height:1.6}.contactSection{padding:25px 0 90px}.contactIntro{max-width:650px}.contactIntro h3{color:#102f59;margin:25px 0 15px;font-size:35px;line-height:1.2}.contactIntro>p{color:#718096;max-width:500px;margin-bottom:25px;font-size:14px;line-height:1.8}.contactDetails{align-items:center;width:100%;margin-bottom:22px;display:flex}.contactDetail{color:#176fe0;align-items:center;gap:10px;font-size:13px;font-weight:600;display:inline-flex}.contactDetailIcon{color:#176fe0;background:#f2f6fa;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.contactDetail strong{color:#176fe0;white-space:nowrap;font-size:13px;font-weight:600}.sendButton{color:#fff;cursor:pointer;background:#102f59;border:none;border-radius:6px;justify-content:center;align-self:flex-start;align-items:center;gap:8px;min-height:44px;padding:0 18px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex}.sendButton:hover{background:#176fe0}.footer{border-top:1px solid #e5eaf0;justify-content:space-between;align-items:center;gap:20px;min-height:80px;display:flex}.footer p{color:#8996a4;font-size:11px}.footerLinks{align-items:center;gap:18px;display:flex}.footerLinks a{color:#68798c;font-size:12px;transition:all .2s}.footerLinks a:hover{color:#176fe0}@media (max-width:900px){.heroSection{grid-template-columns:1fr;gap:45px;padding:65px 0}.heroImageWrapper{justify-content:flex-start}.imageFrame{width:290px;height:360px}.informationSection,.educationServices,.projectCard{grid-template-columns:1fr}.projectInfo{max-width:none}.contactSection{padding-top:20px}}@media (max-width:700px){.portfolio{width:min(100% - 30px,1120px)}.heroSection{min-height:auto;padding:50px 0 65px}.heroContent h1{letter-spacing:-2px;font-size:50px}.heroContent h2{font-size:19px}.informationSection,.projectSection,.educationServices,.contactSection{padding-bottom:65px}.infoCard,.educationCard,.servicesCard{padding:24px}.projectCard{gap:30px;padding:25px}.projectInfo h3{font-size:27px}.aboutMeta,.servicesGrid{grid-template-columns:1fr}.footer{text-align:center;flex-direction:column;justify-content:center;padding:20px 0}}@media (max-width:480px){.portfolio{width:calc(100% - 24px)}.heroContent h1{font-size:40px;line-height:1}.heroContent h2{font-size:18px;line-height:1.5}.heroDescription{font-size:14px;line-height:1.75}.heroButtons{flex-direction:column;align-items:stretch}.primaryButton,.secondaryButton{width:100%}.socialLinks{gap:16px}.imageFrame{width:100%;max-width:340px;height:400px}.heroImageWrapper{width:100%}.infoCard{min-height:auto;padding:22px}.cardContent h3{font-size:23px}.projectCard{padding:20px}.projectInfo h3{font-size:25px}.projectInfo p{font-size:13px}.techList{gap:6px}.techList span{padding:5px 8px;font-size:10px}.projectPreview{width:100%}.dashboardMockup{grid-template-columns:58px 1fr;min-height:230px}.mockSidebar{padding:10px 5px}.mockLogo{width:30px;margin-bottom:22px}.mockNav{width:35px;margin:13px auto}.mockMain{min-width:0;padding:10px}.mockCards{gap:5px}.mockCard{padding:8px}.mockCard small{font-size:6px}.mockCard strong{font-size:13px}.mockRow{gap:5px;padding:0 7px}.educationContent{align-items:flex-start;gap:14px}.educationLogo{width:60px;height:60px}.servicesGrid{grid-template-columns:1fr}.contactIntro h3{font-size:30px}.contactDetails{justify-content:flex-start;width:100%;padding-bottom:3px;overflow-x:auto}.contactDetail{flex-shrink:0}.contactDetail strong{font-size:12px}.sendButton{width:100%}.footerLinks{flex-wrap:wrap;justify-content:center}}