*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:#F8F9FA; color:#1A1A2E; font-family:'Inter',system-ui,sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a{ color:inherit; text-decoration:none; }
::selection{ background:rgba(0,214,143,.25); }
input,textarea,button{ font-family:inherit; }
textarea{ resize:vertical; }
@keyframes floatBlob{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(40px,-30px) scale(1.08); } }
@keyframes floatBlob2{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-50px,40px) scale(1.12); } }
@keyframes pulseDot{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
::-webkit-scrollbar{ width:10px; } ::-webkit-scrollbar-track{ background:#EEF0F3; } ::-webkit-scrollbar-thumb{ background:#cdd2da; border-radius:8px; }

/* Utility / component classes extracted from inline styles */
.page-wrapper{ position:relative; width:100%; overflow:hidden; }
.nav{ position:fixed; top:0; left:0; right:0; z-index:50; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px clamp(20px,5vw,64px); background:rgba(248,249,250,.82); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid rgba(26,26,46,.07); }
.brand-link{ display:flex; align-items:center; gap:11px; font-family:'Poppins'; font-weight:700; font-size:18px; letter-spacing:-.01em; }
.brand-badge{ display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:linear-gradient(135deg,#00D68F,#06b377); color:#fff; font-size:15px; font-weight:800; }
.brand-dot{ color:#00D68F; }
.nav-items{ display:flex; align-items:center; gap:clamp(14px,2.4vw,32px); flex-wrap:wrap; justify-content:flex-end; }
.nav-link{ font-size:14.5px; color:#5a5f70; font-weight:500; }
.cta-pill{ display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:999px; background:#00D68F; color:#06241a; font-weight:600; font-size:14.5px; box-shadow:0 8px 22px -8px rgba(0,214,143,.55); }

.hero{ position:relative; min-height:100vh; display:flex; align-items:center; padding:140px clamp(20px,5vw,64px) 90px; }
.blob1{ position:absolute; top:-120px; right:-80px; width:540px; height:540px; border-radius:50%; background:radial-gradient(circle,rgba(0,214,143,.16),transparent 65%); filter:blur(20px); animation:floatBlob 14s ease-in-out infinite; pointer-events:none; }
.blob2{ position:absolute; bottom:-160px; left:-120px; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(124,92,255,.1),transparent 65%); filter:blur(20px); animation:floatBlob2 18s ease-in-out infinite; pointer-events:none; }
.container{ position:relative; max-width:1140px; margin:0 auto; width:100%; z-index:2; }
.badge{ display:inline-flex; align-items:center; gap:9px; padding:7px 15px; border-radius:999px; background:rgba(0,214,143,.1); border:1px solid rgba(0,214,143,.28); font-size:13.5px; color:#0a8f63; font-weight:600; margin-bottom:28px; }
.pulse-dot{ width:7px; height:7px; border-radius:50%; background:#00D68F; animation:pulseDot 2s ease-in-out infinite; }
.hero-title{ font-family:'Poppins'; font-weight:800; font-size:clamp(2.4rem,6.2vw,4.6rem); line-height:1.04; letter-spacing:-.025em; margin:0 0 24px; max-width:16ch; }
.muted{ font-size:clamp(1.05rem,2vw,1.3rem); line-height:1.6; color:#4a4f60; max-width:62ch; margin:0 0 40px; }
.hero-cta-group{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.btn-primary{ display:inline-flex; align-items:center; gap:10px; padding:16px 30px; border-radius:14px; background:#00D68F; color:#06241a; font-weight:700; font-size:16px; box-shadow:0 16px 38px -12px rgba(0,214,143,.5); }
.btn-secondary{ display:inline-flex; align-items:center; gap:10px; padding:16px 30px; border-radius:14px; background:#fff; border:1px solid #DADCE3; color:#1A1A2E; font-weight:600; font-size:16px; box-shadow:0 1px 3px rgba(26,26,46,.05); }
.stats-row{ display:flex; gap:clamp(24px,5vw,60px); flex-wrap:wrap; margin-top:64px; }
.stat{ display:block; }
.stat .num{ font-family:'Poppins'; font-weight:700; font-size:2rem; color:#1A1A2E; }
.stat .label{ font-size:13.5px; color:#8a8f9c; }

.section{ position:relative; max-width:1140px; margin:0 auto; padding:clamp(50px,7vw,90px) clamp(20px,5vw,64px); }
.section--padded{ padding:clamp(70px,9vw,120px) clamp(20px,5vw,64px); }
.grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:clamp(40px,6vw,80px); align-items:center; }
.card{ padding:26px; border-radius:18px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05); }
.card-strong{ box-shadow:0 1px 3px rgba(26,26,46,.05),0 12px 28px -20px rgba(26,26,46,.18); }
.card-alt{ background:linear-gradient(135deg,rgba(0,214,143,.12),rgba(124,92,255,.08)); border:1px solid rgba(0,214,143,.28); }

.services-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px; }
.service{ padding:30px; border-radius:18px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05); transition:transform .35s,box-shadow .35s,border-color .35s; }
.service:hover{ transform:translateY(-6px); border-color:rgba(0,214,143,.45); box-shadow:0 20px 40px -22px rgba(0,214,143,.4); }
.service .icon-box{ display:grid; place-items:center; width:50px; height:50px; border-radius:13px; background:rgba(0,214,143,.12); color:#00b377; margin-bottom:20px; }

.portfolio-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; }
.portfolio-card{ border-radius:20px; overflow:hidden; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 18px 40px -28px rgba(26,26,46,.25); }
.portfolio-top{ height:180px; padding:18px; position:relative; overflow:hidden; }
.portfolio-top.ecom{ background:linear-gradient(135deg,#E6F9F1,#CFF2E2); }
.portfolio-top.info{ background:linear-gradient(135deg,#EFEBFB,#E0D8F8); }
.portfolio-top.saas{ background:linear-gradient(135deg,#E6F4F7,#D6ECF0); }
.portfolio-footer{ padding:24px; }

.portfolio-top.infoprod{ background:linear-gradient(135deg,#EFEBFB,#E0D8F8); }
.tag.alt{ font-size:12px; padding:5px 11px; border-radius:999px; background:#fff; color:#7C5CFF; border:1px solid rgba(124,92,255,.08); }
.tag{ font-size:12px; padding:5px 11px; border-radius:999px; background:#F1F3F6; color:#3a3f50; }

.tags-row{ display:flex; gap:8px; flex-wrap:wrap; }

.testimonial-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:22px; }
.testimonial{ padding:34px; border-radius:20px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 18px 40px -30px rgba(26,26,46,.25); }

.contact-section{ position:relative; padding:clamp(60px,8vw,110px) clamp(20px,5vw,64px); }
.contact-inner{ position:relative; max-width:1000px; margin:0 auto; }
.contact-header{ text-align:center; max-width:600px; margin:0 auto 48px; }
.contact-panel{ padding:34px; border-radius:22px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 24px 50px -34px rgba(26,26,46,.3); }
.contact-form{ display:flex; flex-direction:column; gap:18px; }
.input-label{ display:block; font-size:13.5px; font-weight:500; color:#3a3f50; margin-bottom:8px; }
.input, .textarea{ width:100%; padding:14px 16px; border-radius:12px; background:#F7F8FA; border:1px solid #E1E4EA; color:#1A1A2E; font-size:15px; outline:none; }
.textarea{ min-height:110px; resize:vertical; }
.submit-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:16px; border-radius:12px; border:none; background:#00D68F; color:#06241a; font-weight:700; font-size:16px; cursor:pointer; box-shadow:0 14px 34px -12px rgba(0,214,143,.5); }

/* submit button loader */
.submit-btn{ position:relative; overflow:hidden; }
.submit-btn .btn-label{ display:inline-block; transition:opacity .18s ease; }
.submit-btn .btn-loader{ display:none; width:18px; height:18px; border-radius:50%; border:3px solid rgba(6,36,26,0.15); border-top-color:#06241a; box-sizing:border-box; }
.submit-btn.loading .btn-label{ opacity:0; }
.submit-btn.loading .btn-loader{ display:inline-block; animation:spin .8s linear infinite; position:relative; }
@keyframes spin{ to{ transform:rotate(360deg); } }

.contact-links{ display:flex; flex-direction:column; gap:16px; }
.contact-card{ display:flex; align-items:center; gap:16px; padding:24px; border-radius:18px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05); transition:border-color .3s,box-shadow .3s; }
.contact-card:hover{ border-color:rgba(0,214,143,.5); box-shadow:0 16px 36px -24px rgba(0,214,143,.45); }
.contact-icon{ display:grid; place-items:center; width:48px; height:48px; border-radius:13px; background:rgba(0,214,143,.12); color:#00b377; flex:none; }
.contact-icon.linked{ background:rgba(124,92,255,.12); color:#7C5CFF; }

.location-card{ padding:24px; border-radius:18px; background:linear-gradient(135deg,rgba(0,214,143,.1),rgba(124,92,255,.08)); border:1px solid rgba(0,214,143,.25); }

.footer{ border-top:1px solid rgba(26,26,46,.08); padding:36px clamp(20px,5vw,64px); }
.footer-inner{ max-width:1140px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.footer-brand{ display:flex; align-items:center; gap:11px; font-family:'Poppins'; font-weight:700; font-size:16px; }
.footer-badge{ display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:linear-gradient(135deg,#00D68F,#06b377); color:#fff; font-size:13px; font-weight:800; }
.footer-links{ display:flex; gap:14px; }
.muted-link{ color:#5a5f70; }

/* small helpers */
.text-small{ font-size:13.5px; color:#8a8f9c; }
.text-muted{ color:#5a5f70; }

/* extras for sections and portfolio/testimonials */
.section--alt{ background:linear-gradient(180deg,transparent,rgba(0,214,143,.04),transparent); }
.grid--240{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; }
.portfolio-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; }
.portfolio-card{ border-radius:20px; overflow:hidden; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 18px 40px -28px rgba(26,26,46,.25); }
.portfolio-top{ height:180px; padding:18px; position:relative; overflow:hidden; }
.portfolio-top.ecom{ background:linear-gradient(135deg,#E6F9F1,#CFF2E2); }
.portfolio-top.info{ background:linear-gradient(135deg,#EFEBFB,#E0D8F8); }
.portfolio-top.saas{ background:linear-gradient(135deg,#E6F4F7,#D6ECF0); }
.portfolio-footer{ padding:24px; }

.testimonial-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:22px; }
.testimonial{ padding:34px; border-radius:20px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 18px 40px -30px rgba(26,26,46,.25); }
.avatar{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-weight:700; color:#fff; font-family:'Poppins'; }
.avatar.green{ background:linear-gradient(135deg,#00D68F,#06b377); }
.avatar.purple{ background:linear-gradient(135deg,#7C5CFF,#9d82ff); }

.contact-section{ position:relative; padding:clamp(60px,8vw,110px) clamp(20px,5vw,64px); }
.contact-bg{ position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0%,rgba(0,214,143,.08),transparent 55%); pointer-events:none; }
.contact-inner{ position:relative; max-width:1000px; margin:0 auto; }
.contact-header{ text-align:center; max-width:600px; margin:0 auto 48px; }
.contact-panel{ padding:34px; border-radius:22px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05),0 24px 50px -34px rgba(26,26,46,.3); }
.contact-form{ display:flex; flex-direction:column; gap:18px; }
.input-label{ display:block; font-size:13.5px; font-weight:500; color:#3a3f50; margin-bottom:8px; }
.input, .textarea{ width:100%; padding:14px 16px; border-radius:12px; background:#F7F8FA; border:1px solid #E1E4EA; color:#1A1A2E; font-size:15px; outline:none; }
.textarea{ min-height:110px; }
.submit-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:16px; border-radius:12px; border:none; background:#00D68F; color:#06241a; font-weight:700; font-size:16px; cursor:pointer; box-shadow:0 14px 34px -12px rgba(0,214,143,.5); }

.contact-links{ display:flex; flex-direction:column; gap:16px; }
.contact-card{ display:flex; align-items:center; gap:16px; padding:24px; border-radius:18px; background:#fff; border:1px solid #ECEDF1; box-shadow:0 1px 3px rgba(26,26,46,.05); transition:border-color .3s,box-shadow .3s; }
.contact-card:hover{ border-color:rgba(0,214,143,.5); box-shadow:0 16px 36px -24px rgba(0,214,143,.45); }
.contact-icon{ display:grid; place-items:center; width:48px; height:48px; border-radius:13px; background:rgba(0,214,143,.12); color:#00b377; flex:none; }
.contact-icon.linked{ background:rgba(124,92,255,.12); color:#7C5CFF; }
.location-card{ padding:24px; border-radius:18px; background:linear-gradient(135deg,rgba(0,214,143,.1),rgba(124,92,255,.08)); border:1px solid rgba(0,214,143,.25); }

.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:28px; align-items:start; }
.success-panel{ text-align:center; padding:30px 10px; }
.success-icon{ display:grid; place-items:center; width:64px; height:64px; border-radius:50%; background:rgba(0,214,143,.14); color:#00b377; margin:0 auto 20px; }
.success-title{ font-family:'Poppins'; font-weight:600; font-size:1.3rem; margin:0 0 10px; }
.success-sub{ font-size:.98rem; color:#5a5f70; margin:0; }

/* success animation */
@keyframes successPop {
	0% { transform: scale(.92); opacity: 0; }
	60% { transform: scale(1.03); opacity: 1; }
	100% { transform: scale(1); opacity: 1; }
}
.success-panel.animate-success{ animation: successPop .45s cubic-bezier(.2,.9,.25,1) both; }
.success-panel.fade-out{ animation: successPop .35s cubic-bezier(.2,.9,.25,1) reverse both; }

/* error state for panels */
.success-panel.error{ border-left:4px solid #FF5A5F; }
.success-panel.error .success-title{ color:#FF5A5F; }

.footer-copy{ font-size:13.5px; color:#8a8f9c; }
.footer-link{ color:#5a5f70; }

.footer{ border-top:1px solid rgba(26,26,46,.08); padding:36px clamp(20px,5vw,64px); }
.footer-inner{ max-width:1140px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.footer-brand{ display:flex; align-items:center; gap:11px; font-family:'Poppins'; font-weight:700; font-size:16px; }
.footer-badge{ display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:linear-gradient(135deg,#00D68F,#06b377); color:#fff; font-size:13px; font-weight:800; }
.footer-links{ display:flex; gap:14px; }
.muted-link{ color:#5a5f70; }

/* NEW: utility classes to replace inline styles */
.text-gradient{ background:linear-gradient(120deg,#00D68F,#06b377 55%,#7C5CFF); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.emph{ color:#1A1A2E; font-weight:600; }
.kicker{ font-size:14px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#00D68F; margin-bottom:16px; }
.section-title{ font-family:'Poppins'; font-weight:700; font-size:clamp(1.8rem,3.6vw,2.7rem); line-height:1.12; letter-spacing:-.02em; margin:0; }
.reveal-header{ max-width:640px; margin-bottom:54px; }
.lead{ font-size:1.07rem; line-height:1.7; color:#4a4f60; }
.mb18{ margin:0 0 18px; }
.mb32{ margin:0 0 32px; }
.chips{ display:flex; gap:12px; flex-wrap:wrap; }
.chip{ display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px; background:#fff; border:1px solid #E4E6EC; font-size:13.5px; color:#3a3f50; box-shadow:0 1px 2px rgba(26,26,46,.04); }
.col-vertical{ display:flex; flex-direction:column; gap:16px; }
.meta{ font-size:13px; color:#8a8f9c; margin-bottom:6px; }
.card-title{ font-family:'Poppins'; font-weight:600; font-size:1.25rem; }
.service-title{ font-family:'Poppins'; font-weight:600; font-size:1.18rem; margin:0 0 10px; }
.service-desc{ font-size:.98rem; line-height:1.6; color:#5a5f70; margin:0; }
.service-cta{ display:flex; flex-direction:column; justify-content:center; padding:30px; background:linear-gradient(135deg,rgba(0,214,143,.14),rgba(124,92,255,.1)); border:1px solid rgba(0,214,143,.3); }
.inline-cta{ display:inline-flex; align-items:center; gap:8px; color:#0a8f63; font-weight:600; font-size:.98rem; }
.window-controls{ display:flex; gap:6px; margin-bottom:14px; }
.dot{ width:9px; height:9px; border-radius:50%; display:inline-block; }
.dot.red{ background:#ff5f57; }
.dot.yellow{ background:#febc2e; }
.dot.green{ background:#28c840; }
.bar-small{ height:9px; width:55%; background:#00D68F; border-radius:4px; margin-bottom:9px; }
.bar-med{ height:7px; width:80%; background:rgba(26,26,46,.16); border-radius:4px; margin-bottom:6px; }
.bar-small-dim{ height:7px; width:65%; background:rgba(26,26,46,.1); border-radius:4px; margin-bottom:14px; }
.card-title--dark{ color:#1A1A2E; }
.person-name{ font-weight:600; font-size:15px; }
.person-role{ font-size:13px; color:#8a8f9c; }
.quote-mark{ font-family:'Poppins'; font-size:3rem; line-height:.5; margin-bottom:18px; }
.quote-mark.green{ color:#00D68F; }
.quote-mark.purple{ color:#7C5CFF; }

/* small pill indicators used in portfolio cards */
.pill-row{ display:flex; gap:8px; }
.pill{ height:22px; border-radius:6px; }
.pill.primary{ width:70px; background:#00D68F; }
.pill.muted{ width:50px; background:rgba(26,26,46,.1); }
.icon-meta{ color:#00b377; margin-bottom:16px; }
.card-heading{ font-family:'Poppins'; font-weight:600; font-size:1.1rem; margin:0 0 8px; }
.card-desc{ font-size:.95rem; line-height:1.55; color:#5a5f70; margin:0; }
.text-md{ font-size:.95rem; line-height:1.55; color:#5a5f70; margin:0 0 16px; }
.text-lg{ font-size:1.1rem; line-height:1.65; color:#2a2e3e; margin:0 0 26px; }
.row-center-gap{ display:flex; align-items:center; gap:14px; }
.location-title{ font-size:13.5px; color:#5a5f70; margin-bottom:6px; }
.location-entry{ font-weight:600; font-size:15px; }
.location-sub{ font-size:13.5px; color:#5a5f70; margin-top:10px; }

/* mobile nav */
.nav-toggle{ display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:38px; height:38px; border:none; background:transparent; padding:0; cursor:pointer; flex:none; }
.nav-toggle-bar{ display:block; width:22px; height:2px; background:#1A1A2E; border-radius:2px; transition:transform .25s ease, opacity .25s ease; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:760px){
  .nav-toggle{ display:flex; }
  .nav-items{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:4px;
    background:#F8F9FA; border-bottom:1px solid rgba(26,26,46,.07);
    padding:6px clamp(20px,5vw,64px) 18px;
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .3s ease, opacity .25s ease;
  }
  .nav-items.open{ max-height:420px; opacity:1; }
  .nav-items .nav-link{ width:100%; padding:12px 4px; }
  .nav-items .cta-pill{ justify-content:center; width:100%; padding:12px 20px; margin-top:6px; }
}