:root{--navy:#061b36;--navy2:#082954;--blue:#1668f5;--cyan:#08a7df;--orange:#f26a3d;--ink:#102033;--muted:#64748b;--line:#e5edf7;--bg:#f5f8fc;--card:#fff;--shadow:0 18px 45px rgba(15,35,75,.10);--radius:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.skipLink{position:absolute;left:-999px}.skipLink:focus{left:16px;top:16px;z-index:9999;background:#fff;padding:10px;border-radius:8px}.siteHeader{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);box-shadow:0 6px 25px rgba(15,23,42,.06)}.navShell{height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brandLogo{display:flex;align-items:center;background:rgba(255,255,255,.78);border:1px solid var(--line);border-radius:18px;padding:10px 16px;box-shadow:0 10px 28px rgba(15,23,42,.06)}.brandLogo img{height:48px;width:auto}.navCol{display:flex;align-items:center;gap:30px;font-weight:800}.navCol a{color:#142033}.navCol a:hover{color:var(--blue)}.adminPill{background:#071225!important;color:#fff!important;border-radius:999px;padding:14px 22px;box-shadow:0 8px 22px rgba(7,18,37,.18)}.navToggle{width:46px;height:46px;border:0;border-radius:14px;background:#fff;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.navToggle span{width:22px;height:2px;background:#071225;border-radius:3px}.heroSection{position:relative;overflow:hidden;background:radial-gradient(circle at 78% 35%,rgba(22,104,245,.35),transparent 28%),linear-gradient(135deg,#05172f 0%,#072f60 60%,#0ba9e2 100%);color:#fff;padding:120px 0 96px}.heroSection:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px;opacity:.22}.heroSection .container{position:relative;z-index:1}.heroBadge{display:inline-flex;align-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);color:#ff9c5c;border-radius:999px;padding:8px 14px;font-weight:800;margin-bottom:20px}.heroSection h1{font-size:clamp(38px,6vw,72px);font-weight:900;letter-spacing:-.045em;margin:0 0 14px}.heroSection h2{font-size:clamp(18px,2.3vw,28px);font-weight:800;margin-bottom:18px;max-width:850px}.heroSection p{font-size:18px;max-width:720px;color:#dbeafe}.heroActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn{border:0;border-radius:14px;font-weight:800;padding:13px 20px}.btnPrimary{background:linear-gradient(135deg,#1267ff,#0aa7e7);color:#fff!important;box-shadow:0 13px 28px rgba(18,103,255,.24)}.btnOutlineLight{border:1px solid rgba(255,255,255,.42);color:#fff!important;background:rgba(255,255,255,.07)}.btnSoft{background:#eef5ff;color:#0c55db!important;border:1px solid #d7e7ff}.profileCardPro{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(16px);border-radius:var(--radius);padding:28px;box-shadow:0 25px 65px rgba(0,0,0,.28)}.profileCardPro img{height:56px;width:auto;margin-bottom:18px;background:#fff;border-radius:12px;padding:8px}.profileCardPro h3{font-weight:900}.profileCardPro ul{margin:0;padding-left:18px;color:#dbeafe}.metricsWrap{margin-top:-48px;position:relative;z-index:2}.metricGrid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}.metricCard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;text-align:center;box-shadow:var(--shadow);min-height:108px;display:flex;flex-direction:column;align-items:center;justify-content:center}.metricCard span{font-size:24px}.metricCard strong{font-size:27px;font-weight:900;color:#092454}.metricCard small{color:var(--muted);font-weight:700}.sectionSpace{padding:72px 0}.sectionHead{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:26px}.sectionKicker{text-transform:uppercase;font-weight:900;color:#0b67f3;font-size:12px;letter-spacing:.08em}.sectionHead h2,.proPanel h2{font-weight:900;letter-spacing:-.035em;margin:4px 0 0}.lightBg{background:#f2f7fd}.proPanel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px;box-shadow:var(--shadow)}.darkPanel{background:linear-gradient(135deg,#061b36,#082954);color:#fff}.darkPanel .sectionKicker{color:#ff8b4a}.cleanList{padding:0;margin:0;list-style:none}.cleanList li{padding:9px 0;border-bottom:1px solid rgba(255,255,255,.12)}.projectCard,.blogCard,.testimonialCard,.skillGroup,.contactInfoCard,.contactFormPro,.articleShell{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}.projectMedia,.blogMedia{display:block;background:#e2e8f0;aspect-ratio:16/10;overflow:hidden}.projectMedia img,.blogMedia img{width:100%;height:100%;object-fit:cover;transition:.35s transform}.projectCard:hover img,.blogCard:hover img{transform:scale(1.045)}.projectBody,.blogBody{padding:20px}.projectBody h3,.blogBody h3{font-size:20px;font-weight:900;line-height:1.25}.projectBody p,.blogBody p{color:var(--muted);margin-bottom:14px}.techBadges{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.techBadges span,.skillPills span{font-size:12px;font-weight:800;background:#eef5ff;color:#0a5be7;border-radius:999px;padding:7px 10px}.simpleLink{font-weight:900;color:#0b67f3}.skillsGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.skillGroup{padding:22px}.skillGroup h3{font-size:16px;font-weight:900}.skillGroup p{color:var(--muted);margin:0}.skillPills{display:flex;flex-wrap:wrap;gap:9px}.testimonialCard{padding:24px}.testimonialCard p{font-size:16px;color:#334155}.testimonialCard strong{display:block;font-weight:900}.testimonialCard small{color:var(--muted)}.blogBody span{font-size:11px;font-weight:900;color:#0b67f3;text-transform:uppercase}.pageHero{background:linear-gradient(135deg,#061b36,#0b71b8);color:#fff;padding:105px 0 70px}.pageHero h1{font-size:clamp(36px,5vw,60px);font-weight:900;letter-spacing:-.04em}.pageHero p{max-width:850px;color:#dbeafe;font-size:18px}.contactStack{display:grid;gap:16px}.contactInfoCard{padding:20px;display:flex;gap:16px;align-items:flex-start}.contactInfoCard span{width:46px;height:46px;border-radius:14px;background:#eef5ff;display:flex;align-items:center;justify-content:center;font-size:22px}.contactInfoCard h3{font-size:18px;font-weight:900}.contactInfoCard p{margin:0;color:var(--muted);font-weight:600}.contactFormPro{padding:34px}.contactFormPro h2{font-weight:900}.contactFormPro label{font-weight:900;margin-top:14px;margin-bottom:8px}.form-control{border:1px solid #d7e2f0!important;border-radius:16px!important;padding:15px 16px!important;box-shadow:none!important}.form-control:focus{border-color:#1267ff!important;box-shadow:0 0 0 4px rgba(18,103,255,.08)!important}.articleShell{padding:28px;max-width:920px;margin:auto}.articleImage,.detailImage{border-radius:20px;box-shadow:var(--shadow);width:100%;object-fit:cover}.articleMeta{color:var(--muted);font-weight:700;margin:18px 0}.richText{font-size:17px;color:#334155}.dashboardGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.dashboardAction{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;font-weight:900;color:#0b2e59;box-shadow:var(--shadow)}.dashboardAction:hover{transform:translateY(-2px);color:#0b67f3}.emptyState{background:#fff;border:1px dashed #b8c7d8;border-radius:18px;padding:28px;text-align:center;color:var(--muted);font-weight:800}.siteFooter{background:#061b36;color:#dbeafe;padding:56px 0 22px}.footerLogo{height:54px;width:auto;background:#fff;border-radius:14px;padding:8px}.siteFooter h5{color:#fff;font-weight:900}.siteFooter a,.siteFooter span{display:block;color:#dbeafe;margin:8px 0}.footerBottom{border-top:1px solid rgba(255,255,255,.12);margin-top:28px;padding-top:18px;color:#9fb2c8}.messages{position:fixed;top:100px;right:20px;z-index:2000}.alert{border-radius:16px;box-shadow:var(--shadow)}@media(max-width:1199px){.metricGrid{grid-template-columns:repeat(4,1fr)}.skillsGrid{grid-template-columns:repeat(2,1fr)}}@media(max-width:991px){.navShell{height:74px}.brandLogo img{height:40px}.navCol{position:fixed;left:16px;right:16px;top:82px;display:none;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 30px 80px rgba(2,8,23,.22)}.navOpen .navCol{display:flex}.navCol a{padding:13px 14px;border-radius:14px}.navCol a:hover{background:#eef5ff}.heroSection{padding:88px 0 78px}.metricGrid{grid-template-columns:repeat(2,1fr)}.sectionHead{align-items:flex-start;flex-direction:column}.dashboardGrid{grid-template-columns:1fr 1fr}}@media(max-width:575px){body{font-size:15px}.siteHeader .container-fluid{padding-left:12px!important;padding-right:12px!important}.brandLogo{padding:8px 10px}.brandLogo img{height:34px}.heroSection{padding:64px 0 64px}.heroSection h1{font-size:38px}.heroSection h2{font-size:19px}.heroSection p{font-size:15px}.heroActions .btn{width:100%;text-align:center}.metricsWrap{margin-top:-32px}.metricGrid{gap:10px}.metricCard{min-height:96px;padding:13px}.metricCard strong{font-size:22px}.metricCard small{font-size:12px}.sectionSpace{padding:48px 0}.proPanel,.contactFormPro,.articleShell{padding:22px;border-radius:18px}.skillsGrid,.dashboardGrid{grid-template-columns:1fr}.projectBody,.blogBody{padding:16px}.pageHero{padding:80px 0 48px}.pageHero h1{font-size:36px}.contactInfoCard{padding:16px}.siteFooter{text-align:left;padding-bottom:70px}}

/* Phase Blog Restore + World-Class Mobile/PWA Polish */
.blogCard,.projectCard,.testimonialCard,.contactInfoCard,.contactFormPro,.skillGroup,.metricCard{background:#fff!important;border:1px solid #e5edf7!important;border-radius:22px!important;box-shadow:0 14px 38px rgba(15,35,75,.09)!important;overflow:hidden!important}.blogMedia,.projectMedia{background:linear-gradient(135deg,#eef5ff,#f8fbff)!important;min-height:168px!important}.blogMedia img,.projectMedia img{width:100%!important;height:100%!important;object-fit:cover!important}.blogBody,.projectBody{padding:20px!important}.blogBody h3,.projectBody h3{font-size:18px!important;font-weight:900!important;line-height:1.28!important}.blogBody p,.projectBody p{font-size:14px!important;color:#526276!important}.pageHero{min-height:unset!important;padding:78px 0 54px!important}.pageHero h1{margin-bottom:12px!important}.emptyState strong{color:#0b2e59}.navBadge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;border-radius:999px;background:#f26a3d;color:#fff;font-size:11px;margin-left:6px;padding:0 6px}.dashNavLink{background:#071225!important;color:#fff!important;border-radius:999px;padding:12px 18px!important}.floatingContact{position:fixed;right:18px;bottom:92px;z-index:1400;width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#1267ff,#0aa7e7);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 18px 45px rgba(18,103,255,.28)}.mobileBottomNav{display:none;position:fixed;left:0;right:0;bottom:0;z-index:1500;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-top:1px solid #dbe7f5;box-shadow:0 -12px 35px rgba(15,35,75,.10);grid-template-columns:repeat(4,1fr);padding:7px 10px calc(7px + env(safe-area-inset-bottom));}.mobileBottomNav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#55657a;font-weight:800;font-size:12px;border-radius:14px;padding:7px 4px}.mobileBottomNav a span{font-size:20px;line-height:1}.mobileBottomNav a.active{color:#1267ff;background:#eef5ff}.mobileInstallPrompt{display:none;position:fixed;left:14px;right:14px;bottom:82px;z-index:1600;background:linear-gradient(135deg,#061b36,#082954);color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:14px;box-shadow:0 24px 70px rgba(2,8,23,.35);align-items:center;gap:12px}.mobileInstallPrompt.show{display:flex}.mobileInstallPrompt div{flex:1}.mobileInstallPrompt strong{display:block;font-weight:950}.mobileInstallPrompt span{display:block;color:#cfe2ff;font-size:13px}.mobileInstallPrompt button{border:0;border-radius:12px;font-weight:900;padding:10px 14px}.mobileInstallPrompt .installNow{background:#1267ff;color:#fff}.mobileInstallPrompt .installClose{background:rgba(255,255,255,.12);color:#fff;font-size:18px;line-height:1}.siteHeader{backdrop-filter:blur(18px)!important}.navCol a{white-space:nowrap}.sectionHead .btn{white-space:nowrap}@media(max-width:575px){body{padding-bottom:78px!important}.mobileBottomNav{display:grid!important}.floatingContact{bottom:84px;right:14px;width:50px;height:50px;border-radius:16px}.mobileInstallPrompt{bottom:82px}.navShell{height:70px!important}.sectionSpace{padding:44px 0!important}.pageHero{padding:58px 0 36px!important}.pageHero h1{font-size:32px!important}.pageHero p{font-size:15px!important}.blogCard,.projectCard,.testimonialCard,.contactInfoCard,.contactFormPro,.skillGroup,.metricCard{border-radius:18px!important}.blogMedia,.projectMedia{min-height:150px!important}.blogBody,.projectBody{padding:16px!important}.blogBody h3,.projectBody h3{font-size:17px!important}.row.g-4{--bs-gutter-y:1rem}.contactFormPro .btn,.heroActions .btn{width:100%;}.sectionHead{gap:10px!important;margin-bottom:18px!important}.siteFooter{padding-bottom:96px!important}}


/* Phase 4: Database image polish and safe media rendering */
.projectMedia,.blogMedia{position:relative;background:#eef5ff!important;display:block;overflow:hidden;}
.projectMedia:before,.blogMedia:before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(11,46,89,.08),rgba(18,103,255,.08));z-index:0;}
.projectMedia img,.blogMedia img{position:relative;z-index:1;display:block;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;}
@media(min-width:576px){.mobileInstallPrompt{display:none!important}}


/* Phase 5: Mobile menu collapse fix + accordion/read-more enterprise polish */
@media (max-width: 991.98px){
  .siteHeader{position:sticky!important;top:0!important;z-index:3000!important;}
  .navShell{position:relative!important;}
  .navToggle{display:flex!important;position:relative!important;z-index:3102!important;cursor:pointer!important;}
  .navToggle span{transition:transform .22s ease, opacity .22s ease;}
  body.navOpen .navToggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  body.navOpen .navToggle span:nth-child(2){opacity:0;}
  body.navOpen .navToggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .navCol{
    position:fixed!important;
    top:78px!important;
    left:14px!important;
    right:14px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
    padding:16px!important;
    background:rgba(255,255,255,.98)!important;
    border:1px solid #dbe7f5!important;
    border-radius:22px!important;
    box-shadow:0 30px 90px rgba(2,8,23,.28)!important;
    opacity:0!important;
    transform:translateY(-10px) scale(.98)!important;
    pointer-events:none!important;
    visibility:hidden!important;
    max-height:calc(100vh - 105px)!important;
    overflow:auto!important;
    z-index:3100!important;
    transition:opacity .22s ease, transform .22s ease, visibility .22s ease!important;
  }
  body.navOpen .navCol{
    opacity:1!important;
    transform:translateY(0) scale(1)!important;
    pointer-events:auto!important;
    visibility:visible!important;
  }
  .navCol a{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:14px 16px!important;border-radius:16px!important;background:#f6f9fd!important;color:#102033!important;font-weight:900!important;}
  .navCol a:hover,.navCol a:focus{background:#eef5ff!important;color:#1267ff!important;}
  body.navOpen:before{content:'';position:fixed;inset:0;background:rgba(2,8,23,.32);backdrop-filter:blur(2px);z-index:2999;}
}

/* Expand/collapse long text inside cards */
.cardClampTarget{position:relative;overflow:hidden;max-height:4.8em;transition:max-height .28s ease;}
.cardClampTarget:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1.7em;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff);pointer-events:none;}
.cardClampTarget.expanded{max-height:500px!important;}
.cardClampTarget.expanded:after{display:none;}
.cardExpandBtn{margin-top:8px;border:0;background:#eef5ff;color:#0b67f3;border-radius:999px;padding:8px 12px;font-weight:900;font-size:12px;display:inline-flex;align-items:center;gap:6px;}
.cardExpandBtn:hover{background:#dbeafe;color:#0849b8;}

/* Project/blog mobile card polish */
@media(max-width:575.98px){
  .projectCard,.blogCard{border-radius:20px!important;margin-bottom:16px!important;}
  .projectMedia,.blogMedia{min-height:132px!important;aspect-ratio:16/9!important;}
  .projectBody,.blogBody{padding:15px!important;}
  .projectBody h3,.blogBody h3{font-size:18px!important;line-height:1.25!important;margin-bottom:8px!important;}
  .projectBody p,.blogBody p{font-size:14px!important;line-height:1.55!important;margin-bottom:8px!important;}
  .techBadges{gap:6px!important;margin-top:10px!important;}
  .techBadges span{font-size:11px!important;padding:6px 9px!important;}
  .simpleLink{display:inline-flex!important;margin-top:6px!important;padding:8px 0!important;}
  .mobileInstallPrompt{left:10px!important;right:10px!important;bottom:84px!important;padding:10px 12px!important;border-radius:16px!important;}
  .mobileInstallPrompt strong{font-size:14px!important;}
  .mobileInstallPrompt span{font-size:12px!important;}
  .mobileInstallPrompt button{padding:8px 10px!important;}
}

/* Phase 500-safe dashboard + notification restore */
.notifyNavLink{position:relative;display:inline-flex!important;align-items:center;justify-content:center;width:46px;height:46px;border-radius:999px;background:#fff!important;border:1px solid #dbe7f5!important;box-shadow:0 10px 26px rgba(15,35,75,.08);padding:0!important;color:#071225!important}.notifyNavLink .navBadge{position:absolute;top:-5px;right:-5px;margin-left:0}.dashNavLink{display:inline-flex!important;align-items:center;justify-content:center;min-height:46px}.alertMetric strong{color:#f26a3d!important}.notificationList{display:grid;gap:12px}.notificationItem{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #e5edf7;border-radius:18px;padding:16px;box-shadow:0 12px 30px rgba(15,35,75,.06);transition:.2s ease}.notificationItem:hover{transform:translateY(-2px);border-color:#bdd7ff}.notificationItem.unread{border-left:5px solid #f26a3d;background:linear-gradient(90deg,#fff7ed,#fff)}.notificationIcon{width:40px;height:40px;border-radius:14px;background:#eef5ff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.notificationBody{display:flex;flex-direction:column;gap:2px}.notificationBody strong{font-weight:950;color:#0b2e59}.notificationBody small{font-weight:800;color:#64748b}.notificationBody em{font-style:normal;color:#475569;font-size:14px}.dashboardAction:nth-last-child(1){background:linear-gradient(135deg,#061b36,#082954)!important;color:#fff!important}.dashboardAction:nth-last-child(1):hover{color:#fff!important}
@media(max-width:991px){.notifyNavLink{width:auto;justify-content:flex-start;padding:13px 14px!important}.notifyNavLink:after{content:'Notifications';font-weight:900;margin-left:8px}.dashNavLink{justify-content:flex-start!important;border-radius:14px!important}}
