/* JIMSULTECH developer badge + developer profile */
:root{
  --jt-navy:#062d43;
  --jt-blue:#0c5d8d;
  --jt-teal:#0c8793;
  --jt-gold:#d5a43a;
  --jt-cream:#fff7e7;
  --jt-ink:#15313f;
  --jt-muted:#647983;
  --jt-line:#d9e5ea;
}

.jimsultech-float{
  position:fixed;
  left:18px;
  bottom:18px;
  z-index:980;
  display:flex;
  align-items:center;
  gap:9px;
  padding:7px 13px 7px 7px;
  background:linear-gradient(135deg,var(--jt-navy),var(--jt-blue));
  border:1px solid var(--jt-gold);
  border-radius:50px;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
  color:#fff!important;
  text-decoration:none!important;
  transition:transform .22s ease, box-shadow .22s ease;
}
.jimsultech-float:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}
.jimsultech-float img{
  width:52px;
  height:52px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid #e6bd58;
  background:#061f30;
}
.jimsultech-float strong{
  display:block;
  font-size:12px;
  line-height:1.15;
  letter-spacing:.7px;
}
.jimsultech-float small{
  display:block;
  margin-top:2px;
  color:#f0cf79;
  font-size:10px;
}

.jt-page{
  max-width:1500px;
  margin:0 auto;
  padding:30px 24px 70px;
  color:var(--jt-ink);
}
.jt-hero{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr);
  gap:32px;
  align-items:center;
  padding:42px;
  border-radius:22px;
  background:
    radial-gradient(circle at 85% 20%,rgba(52,174,196,.28),transparent 28%),
    linear-gradient(130deg,#052c42 0%,#075980 54%,#0b8790 100%);
  color:#fff;
  box-shadow:0 16px 40px rgba(4,44,66,.20);
}
.jt-hero h1{
  margin:8px 0 10px;
  font-size:clamp(34px,5vw,62px);
  line-height:1;
  letter-spacing:.01em;
}
.jt-hero .jt-kicker{
  margin:0;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#f0cb70;
  font-size:13px;
}
.jt-hero .jt-lead{
  max-width:820px;
  margin:0;
  color:#e8f6f8;
  font-size:18px;
  line-height:1.7;
}
.jt-hero-badge{
  display:flex;
  justify-content:center;
}
.jt-hero-badge img{
  width:min(100%,360px);
  border-radius:24px;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.28));
}
.jt-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}
.jt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:0 18px;
  border-radius:10px;
  text-decoration:none!important;
  font-weight:800;
  transition:.2s ease;
}
.jt-btn-primary{
  background:linear-gradient(90deg,#e8bd58,#d79b28);
  color:#092b3e!important;
}
.jt-btn-secondary{
  border:1px solid rgba(255,255,255,.45);
  background:rgba(255,255,255,.10);
  color:#fff!important;
}
.jt-btn:hover{transform:translateY(-2px)}

.jt-intro-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:24px 0;
}
.jt-stat{
  padding:20px;
  border:1px solid var(--jt-line);
  border-radius:15px;
  background:#fff;
  box-shadow:0 6px 20px rgba(20,55,70,.06);
}
.jt-stat:nth-child(1){border-top:4px solid #0c8793}
.jt-stat:nth-child(2){border-top:4px solid #1769aa}
.jt-stat:nth-child(3){border-top:4px solid #d5a43a}
.jt-stat:nth-child(4){border-top:4px solid #2b8b61}
.jt-stat strong{
  display:block;
  color:var(--jt-navy);
  font-size:18px;
}
.jt-stat span{
  display:block;
  margin-top:7px;
  color:var(--jt-muted);
  line-height:1.45;
}

.jt-section{
  margin-top:24px;
  padding:28px;
  border:1px solid var(--jt-line);
  border-radius:18px;
  background:linear-gradient(145deg,#fff,#f4fafb);
}
.jt-section-alt{
  background:linear-gradient(135deg,#edf8f8 0%,#fff7e8 100%);
}
.jt-section h2{
  margin:0 0 8px;
  color:var(--jt-navy);
  font-size:28px;
}
.jt-section .jt-sub{
  margin:0 0 20px;
  color:var(--jt-muted);
  line-height:1.6;
}
.jt-services{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.jt-card{
  padding:20px;
  border:1px solid #dfe9ed;
  border-radius:14px;
  background:#fff;
}
.jt-card h3{
  margin:0 0 10px;
  color:#073e5a;
  font-size:18px;
}
.jt-card ul{
  margin:0;
  padding-left:19px;
  color:#49636f;
  line-height:1.65;
}
.jt-tech{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.jt-chip{
  padding:9px 13px;
  border-radius:999px;
  background:#e8f4f6;
  border:1px solid #cfe5e8;
  color:#073e5a;
  font-weight:750;
  font-size:13px;
}
.jt-contact{
  display:grid;
  grid-template-columns:1fr auto;
  gap:22px;
  align-items:center;
  margin-top:24px;
  padding:30px;
  border-radius:18px;
  background:linear-gradient(120deg,#062d43,#0b6f88);
  color:#fff;
}
.jt-contact h2{margin:0 0 8px;color:#fff}
.jt-contact p{margin:4px 0;color:#e7f3f5}
.jt-contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.jt-note{
  margin-top:14px;
  color:#78909a;
  font-size:13px;
  text-align:center;
}

@media(max-width:1000px){
  .jt-hero{grid-template-columns:1fr}
  .jt-hero-badge{justify-content:flex-start}
  .jt-hero-badge img{max-width:280px}
  .jt-intro-grid{grid-template-columns:repeat(2,1fr)}
  .jt-services{grid-template-columns:repeat(2,1fr)}
  .jt-contact{grid-template-columns:1fr}
  .jt-contact-actions{justify-content:flex-start}
}
@media(max-width:650px){
  .jimsultech-float{left:12px;bottom:12px;padding:5px}
  .jimsultech-float span{display:none}
  .jimsultech-float img{width:44px;height:44px}
  .jt-page{padding:18px 14px 60px}
  .jt-hero{padding:26px 20px;border-radius:16px}
  .jt-intro-grid,.jt-services{grid-template-columns:1fr}
  .jt-section,.jt-contact{padding:22px 18px}
}

/* Compact developer badge — bottom right */
.jimsultech-float{
    left:auto !important;
    right:18px !important;
    bottom:72px !important;

    width:54px;
    height:54px;
    padding:4px !important;
    gap:10px;

    overflow:hidden;
    white-space:nowrap;
    border-radius:40px;
    transition:width .28s ease, transform .2s ease, box-shadow .2s ease;
}

.jimsultech-float img{
    width:44px !important;
    height:44px !important;
    min-width:44px;
}

.jimsultech-float span{
    display:block !important;
    opacity:0;
    visibility:hidden;
    transition:opacity .2s ease;
}

.jimsultech-float:hover,
.jimsultech-float:focus{
    width:285px;
    padding-right:16px !important;
    transform:translateY(-2px);
}

.jimsultech-float:hover span,
.jimsultech-float:focus span{
    opacity:1;
    visibility:visible;
}

@media(max-width:650px){
    .jimsultech-float{
        right:12px !important;
        bottom:68px !important;
        width:48px;
        height:48px;
    }

    .jimsultech-float img{
        width:40px !important;
        height:40px !important;
        min-width:40px;
    }

    .jimsultech-float:hover,
    .jimsultech-float:focus{
        width:245px;
    }
}