/* StudioWeb static site - generated by the CMS publisher; edit the "css" template in the admin. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;padding-top:54px;font:16px/1.7 "Open Sans",Helvetica,Arial,sans-serif;color:#565656;background:#fff}
a{color:#0e85c9;text-decoration:none;border-bottom:1px solid #cee4f1;transition:all .3s linear}
a:hover{color:#349f3b;border-color:#349f3b}
img{max-width:100%;height:auto}
.wrap{max-width:1100px;margin:0 auto;padding:0 30px}
h1,h2,h3,h4{color:#000;font-weight:600;line-height:1.3;margin:0 0 .5em}
h1{font-size:38px}
h2{font-size:26px;line-height:36px;margin-top:45px}
h3{color:#0e85c9;font-size:20px;margin-top:35px}
p{margin:25px 0}
ul,ol{margin:25px 0;padding-left:25px}
ul{list-style:square}
blockquote{margin:25px 0;padding-left:20px;border-left:3px solid #cee4f1}
blockquote p{font-size:18px;line-height:30px;color:#0e85c9}
code{background:#f0f8fc;padding:2px 6px;border-radius:4px;font-size:.9em;color:#202020}
pre{background:#202020;color:#f7f7f7;padding:20px;border-radius:6px;overflow:auto;line-height:1.5}
pre code{background:none;color:inherit;padding:0}
hr{border:0;border-top:1px solid #cee4f1;margin:40px 0}

/* top bar */
.topbar{position:fixed;top:0;left:0;right:0;height:54px;background:#fff;z-index:1030;font-size:12px;line-height:24px;border-bottom:1px solid #cee4f1}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:54px}
.topbar .brand{border:0;color:#000;font-family:'Open Sans',sans-serif;font-size:26px;line-height:1;letter-spacing:-.5px;white-space:nowrap}
.topbar .brand-light{font-weight:300}
.topbar .brand-bold{font-weight:600}
.topbar .brand img{display:block}
.topbar .nav{display:flex;gap:24px;margin:0;padding:0;list-style:none}
.topbar .nav a{color:#000;border:0;text-transform:uppercase;letter-spacing:1px;font-weight:600}
.topbar .nav a:hover{color:#349f3b}

/* masthead / hero */
.masthead,.hero{background:linear-gradient(90deg,rgba(45,152,213,.86) 0%,rgba(14,133,210,.86) 100%),#0e85d2 url('hero-bg.jpg') center 40%/cover no-repeat;color:#fff;text-align:center}
.masthead{padding:50px 0}
.masthead h1{color:#fff;margin:0;letter-spacing:1px}
.hero{padding:90px 0 100px}
.hero h1{color:#fff;font-size:46px;letter-spacing:2px}
.hero .lead{max-width:640px;margin:20px auto 35px;font-size:18px;line-height:30px;color:#f0f8fc}

/* buttons */
.btn{display:inline-block;padding:12px 40px;border:0;border-radius:6px;color:#fff;font-weight:600;letter-spacing:.5px;
     background:linear-gradient(180deg,#74e37b 0%,#53bd5a 100%);text-shadow:1px 1px 1px #349f3b;transition:all .3s linear}
.btn:hover{background:#349f3b;color:#fff}
.btn-blue{background:#0e85c9;text-shadow:1px 1px 1px #006fae}
.btn-blue:hover{background:#006fae}

/* content */
.content{max-width:796px;padding-top:40px;padding-bottom:70px}
.content p.meta{color:#53bd5a;font-size:14px;margin:0 0 17px}
.card{border:1px solid #cee4f1;border-radius:12px;padding:25px 30px;background:#f7f7f7;margin:25px 0}

/* footer */
.footer{background:linear-gradient(90deg,#2d98d5 0%,#0e85d2 100%);color:#fff;text-align:center;padding:50px 0 40px}
.footer .nav{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 30px;margin:0 0 30px;padding:0;list-style:none}
.footer .nav a{color:#fff;border:0;font-weight:600;letter-spacing:.5px}
.footer .nav a:hover{border-bottom:1px solid #fff}
.footer .copyright{margin:0 auto;color:#cee4f1;font-size:12px;line-height:22px;letter-spacing:.5px}

@media (max-width:700px){
  .wrap{padding-left:20px;padding-right:20px}
  h1{font-size:30px}.hero h1{font-size:34px}
}
/* home: stats band + tables */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 40px}
.stat{background:#f4f9fd;border:1px solid #dbeaf5;border-radius:8px;padding:20px 12px;text-align:center}
.stat strong{display:block;font-size:30px;line-height:1.1;font-weight:700;color:#0e85d2}
.stat span{display:block;margin-top:6px;font-size:14px;line-height:20px;color:#565656}
.content table{width:100%;border-collapse:collapse;margin:10px 0 20px;font-size:15px;line-height:22px}
.content th,.content td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid #e3e3e3}
.content th{background:#f4f9fd;color:#333;font-weight:600}
.brands{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 35px}
.brands .logo{display:flex;align-items:center;justify-content:center;height:88px;padding:0 20px;background:#fff;border:1px solid #dbeaf5;border-radius:12px}
.brands .logo img{display:block;width:auto;height:auto;max-width:100%;max-height:30px}
.brands .logo-wix img{max-height:24px}.brands .logo-docker img,.brands .logo-jetbrains img,.brands .logo-lovable img{max-height:26px}
@media (max-width:700px){.brands{grid-template-columns:repeat(2,1fr);gap:10px}.brands .logo{height:72px;padding:0 16px}.brands .logo img{max-height:26px}.brands .logo-wix img{max-height:20px}.brands .logo-docker img,.brands .logo-jetbrains img,.brands .logo-lovable img{max-height:22px}}
.content .lead-in{font-size:18px;line-height:30px}
.card h3{margin-top:0}
.hero .avatar{display:block;width:140px;height:140px;border-radius:50%;object-fit:cover;margin:0 auto 22px;border:4px solid rgba(255,255,255,.9);box-shadow:0 6px 20px rgba(0,0,0,.25)}
.content .headshot{float:right;width:260px;height:auto;border-radius:12px;margin:5px 0 20px 30px;box-shadow:0 4px 14px rgba(0,0,0,.15)}
@media (max-width:700px){.content .headshot{float:none;display:block;margin:0 auto 25px}.stats{grid-template-columns:repeat(2,1fr)}.content table{font-size:14px}}

/* mobile hamburger menu */
.nav-toggle{display:none;background:none;border:0;padding:10px 6px;margin-right:-6px;cursor:pointer}
.nav-toggle span{display:block;width:24px;height:2px;margin:5px 0;background:#000;border-radius:2px;transition:transform .25s,opacity .25s}
@media (max-width:820px){
  .nav-toggle{display:block}
  .topbar .topnav{display:none;position:absolute;top:54px;left:0;right:0;background:#fff;border-bottom:1px solid #cee4f1;box-shadow:0 8px 16px rgba(0,0,0,.08)}
  .topbar.nav-open .topnav{display:block}
  .topbar .nav{flex-direction:column;gap:0;padding:6px 0;font-size:14px}
  .topbar .nav li{border-top:1px solid #eef5fa}
  .topbar .nav li:first-child{border-top:0}
  .topbar .nav a{display:block;padding:12px 20px}
  .topbar.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .topbar.nav-open .nav-toggle span:nth-child(2){opacity:0}
  .topbar.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .topbar .brand{font-size:24px}
}

/* button groups */
.btns{display:flex;flex-wrap:wrap;gap:14px}
@media (max-width:700px){.btns .btn{flex:1 1 100%;text-align:center;padding-left:20px;padding-right:20px}}