/* Header */
.site-header{
  height:80px;
  background:#fff;
  border-bottom:1px solid rgba(11,27,46,.07);
  position:relative;
  z-index:50;
}
.header-inner{height:100%;display:flex;align-items:center}
.brand{display:inline-flex;align-items:center;flex:0 0 auto}
.brand img{width:190px;height:auto;display:block}
.main-nav{margin-left:auto;display:flex;align-items:center;gap:42px}
.main-nav a{position:relative;font-size:13px;line-height:1;font-weight:700;color:#17263a;letter-spacing:-.012em;padding:32px 0 30px;opacity:.93}
.main-nav a.active{color:var(--blue)}
.main-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:20px;height:3px;border-radius:3px;background:var(--blue)}
.header-cta{margin-left:42px;height:42px;min-width:118px;padding:0 22px;border-radius:6px;background:var(--blue);color:#fff;font-size:13px;font-weight:800;letter-spacing:-.01em;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 14px rgba(0,87,216,.18)}

/* Buttons */
.btn{height:44px;padding:0 24px;border-radius:6px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:800;line-height:1;letter-spacing:-.012em;white-space:nowrap;transition:transform .15s ease, box-shadow .15s ease, background .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 9px 18px rgba(0,87,216,.17)}
.btn-outline{background:#fff;color:var(--blue);border-color:#a7c6f3;box-shadow:0 4px 10px rgba(11,27,46,.035)}
.btn-sm{height:40px;padding:0 20px;font-size:12.5px}
.btn-arrow::after{content:"→";font-size:15px;line-height:0;margin-top:-1px}

/* Cards */
.card{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-soft)}
.icon-badge{width:54px;height:54px;border-radius:999px;background:#eef5ff;color:var(--blue);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.icon-badge svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.card-title{margin:0;color:var(--text);font-size:15.5px;line-height:1.24;font-weight:800;letter-spacing:-.018em}
.card-text{margin:6px 0 0;color:#5c6d82;font-size:12.8px;line-height:1.48;font-weight:500}

/* Image card */
.image-card{position:relative;overflow:hidden;border-radius:12px;background:#dfe8f2;box-shadow:0 6px 18px rgba(11,27,46,.05)}
.image-card img{width:100%;height:100%;object-fit:cover}
.image-card.overlay::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,16,32,.78) 0%,rgba(4,16,32,.44) 38%,rgba(4,16,32,.04) 100%)}
.image-card-content{position:absolute;left:24px;right:62px;bottom:22px;color:#fff;z-index:1}
.image-card-content h3{margin:0;font-size:16px;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.image-card-content p{margin:5px 0 0;font-size:12.8px;line-height:1.35;color:rgba(255,255,255,.88);font-weight:500}
.round-arrow{position:absolute;right:20px;bottom:20px;z-index:2;width:30px;height:30px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--blue);display:grid;place-items:center;font-size:15px;font-weight:900}

/* Footer */
.site-footer{background:var(--footer);color:#fff;margin-top:0;padding:48px 0 24px;position:relative;overflow:hidden}
.site-footer::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% -10%,rgba(0,112,255,.16),transparent 38%);pointer-events:none}
.footer-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.15fr;gap:84px;align-items:start}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:410px}
.footer-logo{width:206px;height:auto}
.footer-tagline{margin:2px 0 0;color:rgba(255,255,255,.68);font-size:13px;line-height:1.58;font-weight:500;max-width:330px}
.footer-email{margin-top:8px;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);height:38px;padding:0 18px;border-radius:6px;display:inline-flex;align-items:center;font-size:12.5px;font-weight:800}
.footer-grid{display:grid;grid-template-columns:repeat(3,minmax(130px,1fr));gap:14px 38px;align-items:center;justify-items:center;padding-top:5px}
.footer-link{width:100%;height:38px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.78);font-size:13px;font-weight:650;letter-spacing:-.01em;border-radius:8px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025)}
.footer-link:hover{color:#fff;background:rgba(255,255,255,.07)}
.footer-bottom{position:relative;z-index:1;margin-top:36px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);text-align:center;color:rgba(255,255,255,.48);font-size:12px;font-weight:500}

/* Modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(5,13,24,.56);z-index:100;padding:24px}
.modal.is-open{display:flex}
.modal-panel{width:min(560px,100%);background:#fff;border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.28);padding:30px;position:relative}
.modal-close{position:absolute;right:16px;top:14px;border:0;background:#eef3f9;color:#203045;width:32px;height:32px;border-radius:999px;font-weight:800;cursor:pointer}
.modal-title{margin:0 0 10px;font-size:22px;font-weight:800;letter-spacing:-.035em;color:var(--text)}
.modal-body{color:var(--muted);font-size:14px;line-height:1.55}
.modal-code{margin:18px 0 0;padding:16px;border-radius:10px;background:#f3f7fc;border:1px solid #dfe8f4;color:var(--text);font-size:22px;font-weight:800;letter-spacing:-.02em;text-align:center}
.modal-image{margin-top:16px;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#f7faff}


/* Final fix: remove blue focus/active frame on mouse-clicked navigation and buttons */
.main-nav a:focus,
.main-nav a:active,
.site-header a:focus,
.site-header a:active,
.btn:focus,
.btn:active,
.header-cta:focus,
.header-cta:active,
button:focus,
button:active,
a:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

.main-nav a:focus-visible,
.site-header a:focus-visible,
.btn:focus-visible,
.header-cta:focus-visible,
button:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}