{"id":112,"date":"2026-06-27T04:09:42","date_gmt":"2026-06-27T04:09:42","guid":{"rendered":"https:\/\/techcoree.com\/?page_id=112"},"modified":"2026-06-27T08:23:05","modified_gmt":"2026-06-27T08:23:05","slug":"modren-contact-us","status":"publish","type":"page","link":"https:\/\/techcoree.com\/?page_id=112","title":{"rendered":"Contact Us"},"content":{"rendered":"\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Contact \u2014 TechCore Engineering<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Raleway:wght@400;600;700;800;900&amp;family=Open+Sans:wght@300;400;600&amp;display=swap\" rel=\"stylesheet\">\n\n<!-- EmailJS SDK -->\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/@emailjs\/browser@4\/dist\/email.min.js\"><\/script>\n\n<style>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ROOT & RESET \u2014 Paper \/ Navy \/ Amber theme\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n\n:root {\n  --tc-navy:        #1C3A5C;   \/* mid navy \u2014 icon gradients, structural accents *\/\n  --tc-navy-light:  #4A6E94;   \/* slate navy \u2014 gradient text & link accents *\/\n  --tc-navy-dark:   #0B1F33;   \/* brand Navy \u2014 headings, deep accents *\/\n  --tc-amber:       #D98E2B;   \/* brand Amber \u2014 primary accent, CTAs *\/\n  --tc-amber-light: #E8AA52;   \/* light amber \u2014 secondary highlights *\/\n  --tc-success:     #3F7D5C;   \/* muted forest green \u2014 success state *\/\n  --tc-error:       #B33F3F;   \/* muted rust red \u2014 error state *\/\n  --tc-bg:          #F7F5F0;   \/* Paper \u2014 page background *\/\n  --tc-bg2:         #FDFBF6;   \/* warm cream-white \u2014 secondary surface *\/\n  --tc-card:        rgba(255,253,248,0.88);\n  --tc-card-b:      rgba(255,253,248,0.95);\n  --tc-text:        #0B1F33;   \/* Navy text *\/\n  --tc-muted:       rgba(11,31,51,0.6);\n  --tc-border:       rgba(11,31,51,0.14);\n  --tc-shadow:      0 24px 70px rgba(11,31,51,0.16);\n}\n\nhtml { scroll-behavior: smooth; }\nbody {\n  font-family: 'Open Sans', sans-serif;\n  background: var(--tc-bg);\n  color: var(--tc-text);\n  min-height: 100vh;\n  overflow-x: hidden;\n}\n\n\/* \u2500\u2500 Custom Cursor \u2500\u2500 *\/\n#tc-cursor {\n  position: fixed; width: 14px; height: 14px; border-radius: 50%;\n  background: var(--tc-amber); pointer-events: none; z-index: 9999;\n  transform: translate(-50%,-50%); transition: transform .08s, width .2s, height .2s;\n  box-shadow: 0 0 12px rgba(217,142,43,.45);\n}\n#tc-cursor-ring {\n  position: fixed; width: 42px; height: 42px; border-radius: 50%;\n  border: 1px solid rgba(11,31,51,.35); pointer-events: none; z-index: 9998;\n  transform: translate(-50%,-50%); transition: all .18s ease;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   BACKGROUND CAROUSEL\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n#tc-bg-wrap {\n  position: fixed; inset: 0; z-index: 0; overflow: hidden;\n}\n.tc-bg-track {\n  display: flex; height: 100%;\n  animation: tcBgScroll 52s linear infinite;\n}\n@keyframes tcBgScroll {\n  0%   { transform: translateX(0); }\n  100% { transform: translateX(-50%); }\n}\n.tc-bg-frame {\n  flex: 0 0 100vw; height: 100%;\n  background-size: cover; background-position: center;\n  filter: grayscale(.3) sepia(.14) brightness(1.08) contrast(.92);\n}\n\n\/* Layered overlay \u2014 washes the photo strip back into the paper tone *\/\n#tc-bg-overlay {\n  position: fixed; inset: 0; z-index: 1; pointer-events: none;\n  background:\n    radial-gradient(ellipse 70% 55% at 10% 40%, rgba(217,142,43,.12) 0%, transparent 55%),\n    radial-gradient(ellipse 60% 50% at 90% 55%, rgba(11,31,51,.08) 0%, transparent 55%),\n    linear-gradient(180deg, rgba(247,245,240,.90) 0%, rgba(247,245,240,.78) 50%, rgba(247,245,240,.94) 100%);\n}\n\/* Engineering grid *\/\n#tc-grid {\n  position: fixed; inset: 0; z-index: 1; pointer-events: none;\n  background-image:\n    linear-gradient(rgba(11,31,51,.05) 1px, transparent 1px),\n    linear-gradient(90deg, rgba(11,31,51,.05) 1px, transparent 1px);\n  background-size: 52px 52px;\n}\n\/* Colour blobs *\/\n.tc-blob {\n  position: fixed; border-radius: 50%; pointer-events: none;\n  filter: blur(90px); opacity: .15; z-index: 1;\n  animation: tcBlobFloat 14s ease-in-out infinite;\n}\n.tcb1 { width:520px;height:420px;background:radial-gradient(circle,#D98E2B,transparent);top:-100px;left:-100px;animation-duration:16s;}\n.tcb2 { width:480px;height:480px;background:radial-gradient(circle,#0B1F33,transparent);top:30%;right:-120px;animation-duration:20s;animation-delay:-5s;}\n.tcb3 { width:380px;height:380px;background:radial-gradient(circle,#E8AA52,transparent);bottom:-80px;left:35%;animation-duration:12s;animation-delay:-8s;}\n.tcb4 { width:320px;height:320px;background:radial-gradient(circle,#C9A66B,transparent);bottom:5%;left:5%;animation-duration:18s;animation-delay:-3s;}\n@keyframes tcBlobFloat{0%,100%{transform:translate(0,0);}40%{transform:translate(25px,-18px);}70%{transform:translate(-18px,28px);}}\n\n\/* Particles canvas *\/\n#tc-particles { position: fixed; inset: 0; z-index: 2; pointer-events: none; }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PAGE WRAPPER\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n#tc-contact-page {\n  position: relative; z-index: 10;\n  padding: 120px 0 80px;\n  min-height: 100vh;\n}\n\n.tc-container {\n  max-width: 1160px;\n  margin: 0 auto;\n  padding: 0 32px;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   HERO HEADER\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-hero {\n  text-align: center;\n  margin-bottom: 72px;\n  position: relative;\n}\n\n.tc-eyebrow {\n  display: inline-flex; align-items: center; gap: 10px;\n  font-family: 'Raleway', sans-serif; font-size: 11px; font-weight: 700;\n  letter-spacing: 5px; text-transform: uppercase; color: var(--tc-amber);\n  margin-bottom: 20px;\n  opacity: 0; transform: translateY(20px);\n  animation: tcFadeUp .6s ease .2s forwards;\n}\n.tc-eyebrow::before, .tc-eyebrow::after {\n  content: ''; display: block; width: 32px; height: 1px; background: var(--tc-amber);\n}\n\n.tc-hero h1 {\n  font-family: 'Raleway', sans-serif;\n  font-size: clamp(34px, 5.5vw, 72px);\n  font-weight: 900; text-transform: uppercase;\n  letter-spacing: 2px; line-height: 1.05;\n  color: var(--tc-text); margin-bottom: 20px;\n  opacity: 0; transform: translateY(24px);\n  animation: tcFadeUp .65s ease .35s forwards;\n}\n.tc-hero h1 .tc-hl {\n  background: linear-gradient(90deg, var(--tc-amber), var(--tc-navy-light));\n  -webkit-background-clip: text; -webkit-text-fill-color: transparent;\n}\n\n.tc-hero p {\n  font-size: 15px; color: var(--tc-muted); max-width: 560px;\n  margin: 0 auto; line-height: 1.85;\n  opacity: 0; transform: translateY(20px);\n  animation: tcFadeUp .6s ease .5s forwards;\n}\n\n\/* Decorative separator *\/\n.tc-sep {\n  width: 64px; height: 3px; margin: 24px auto;\n  background: linear-gradient(90deg, var(--tc-amber), var(--tc-navy-light));\n  border-radius: 2px;\n  opacity: 0; transform: scaleX(0);\n  animation: tcSep .6s ease .45s forwards;\n}\n@keyframes tcSep { to { opacity: 1; transform: scaleX(1); } }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   STAT BAR\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-stat-bar {\n  display: flex; justify-content: center; gap: 0;\n  background: var(--tc-card);\n  border: 1px solid var(--tc-border); border-radius: 12px;\n  overflow: hidden; margin-bottom: 64px;\n  opacity: 0; transform: translateY(20px);\n  animation: tcFadeUp .65s ease .65s forwards;\n}\n.tc-stat-item {\n  flex: 1; padding: 24px 20px; text-align: center;\n  position: relative; transition: background .3s;\n}\n.tc-stat-item + .tc-stat-item::before {\n  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%;\n  width: 1px; background: var(--tc-border);\n}\n.tc-stat-item:hover { background: rgba(217,142,43,.08); }\n.tc-stat-num {\n  font-family: 'Raleway', sans-serif; font-size: 28px; font-weight: 900;\n  background: linear-gradient(135deg, var(--tc-amber), var(--tc-navy-light));\n  -webkit-background-clip: text; -webkit-text-fill-color: transparent;\n  display: block; margin-bottom: 4px;\n}\n.tc-stat-lbl { font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--tc-muted); }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   CONTACT CARDS (3 columns)\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-cards-grid {\n  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;\n  margin-bottom: 56px;\n}\n\n.tc-c-card {\n  background: var(--tc-card);\n  border: 1px solid var(--tc-border); border-radius: 14px;\n  padding: 40px 24px 32px; text-align: center;\n  transition: border-color .3s, transform .4s, background .3s, box-shadow .4s;\n  cursor: pointer; position: relative; overflow: hidden;\n  opacity: 0; transform: translateY(30px);\n}\n.tc-c-card::before {\n  content: ''; position: absolute; inset: 0; border-radius: 14px;\n  background: linear-gradient(135deg, rgba(217,142,43,.08), rgba(11,31,51,.05));\n  opacity: 0; transition: opacity .35s;\n}\n.tc-c-card::after {\n  content: ''; position: absolute; bottom: 0; left: 0; right: 0;\n  height: 2px;\n  background: linear-gradient(90deg, var(--tc-amber), var(--tc-navy-light));\n  transform: scaleX(0); transition: transform .4s cubic-bezier(.4,0,.2,1);\n}\n.tc-c-card:hover { border-color: rgba(217,142,43,.45); transform: translateY(-6px); box-shadow: 0 20px 50px rgba(11,31,51,.14); }\n.tc-c-card:hover::before { opacity: 1; }\n.tc-c-card:hover::after { transform: scaleX(1); }\n.tc-c-card:hover .tc-c-icon { transform: scale(1.12) rotateY(15deg); }\n.tc-c-card:hover .tc-c-icon-wrap { box-shadow: 0 0 0 8px rgba(217,142,43,.16); }\n\n.tc-c-icon-wrap {\n  width: 80px; height: 80px; border-radius: 50%;\n  background: linear-gradient(135deg, var(--tc-navy), var(--tc-navy-dark));\n  display: flex; align-items: center; justify-content: center;\n  margin: 0 auto 22px;\n  transition: box-shadow .3s;\n  border: 1px solid rgba(11,31,51,.3);\n}\n.tc-c-icon { width: 34px; height: 34px; stroke: #fff; fill: none; stroke-width: 1.7; transition: transform .4s; }\n\n.tc-c-card h3 {\n  font-family: 'Raleway', sans-serif; font-size: 15px; font-weight: 800;\n  color: var(--tc-text); margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px;\n}\n.tc-c-card p { font-size: 13px; color: var(--tc-muted); line-height: 1.8; }\n.tc-c-card a { color: var(--tc-muted); text-decoration: none; transition: color .2s; }\n.tc-c-card a:hover { color: var(--tc-amber); }\n\n\/* Card entrance animation (staggered) *\/\n.tc-c-card.tc-visible { animation: tcCardIn .55s cubic-bezier(.4,0,.2,1) forwards; }\n.tc-c-card:nth-child(1) { animation-delay: .0s; }\n.tc-c-card:nth-child(2) { animation-delay: .12s; }\n.tc-c-card:nth-child(3) { animation-delay: .24s; }\n@keyframes tcCardIn { to { opacity: 1; transform: translateY(0); } }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FORM CONTAINER (glass card)\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-form-wrap {\n  background: rgba(255,253,248,.74);\n  border: 1px solid rgba(11,31,51,.10);\n  border-radius: 20px;\n  overflow: hidden;\n  backdrop-filter: blur(18px);\n  box-shadow: var(--tc-shadow);\n  display: grid; grid-template-columns: 1fr 1.65fr;\n  opacity: 0; transform: translateY(32px);\n  animation: tcFadeUp .7s ease .8s forwards;\n  position: relative;\n}\n.tc-form-wrap::before {\n  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;\n  background: linear-gradient(90deg, var(--tc-amber), var(--tc-navy-light), var(--tc-amber));\n  background-size: 200% 100%; animation: tcShimmer 4s linear infinite;\n}\n@keyframes tcShimmer { 0%{background-position:0 0} 100%{background-position:200% 0} }\n\n\/* LEFT \u2014 Info Panel (kept as the deep Navy accent block) *\/\n.tc-form-left {\n  background: linear-gradient(160deg, #14304D 0%, #0B1F33 100%);\n  padding: 52px 40px;\n  display: flex; flex-direction: column; justify-content: space-between;\n  border-right: 1px solid rgba(255,255,255,.08);\n  position: relative; overflow: hidden;\n}\n.tc-form-left::before {\n  content: ''; position: absolute; bottom: -80px; right: -80px;\n  width: 280px; height: 280px; border-radius: 50%;\n  background: radial-gradient(circle, rgba(217,142,43,.16), transparent 70%);\n}\n\n.tc-form-left h2 {\n  font-family: 'Raleway', sans-serif; font-size: 26px; font-weight: 900;\n  text-transform: uppercase; letter-spacing: 1.5px; color: #fff;\n  margin-bottom: 14px; line-height: 1.15;\n}\n.tc-form-left h2 span { color: var(--tc-amber); }\n.tc-form-left > p { font-size: 13px; color: #F6F1E7; line-height: 1.85; margin-bottom: 36px;}\n\n.tc-info-list { display: flex; flex-direction: column; gap: 22px; margin-bottom: 40px; }\n.tc-info-row {\n  display: flex; align-items: flex-start; gap: 14px;\n  padding: 16px; border-radius: 10px;\n  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07);\n  transition: border-color .3s, background .3s, transform .3s;\n  cursor: default;\n}\n.tc-info-row:hover { border-color: rgba(217,142,43,.35); background: rgba(217,142,43,.08); transform: translateX(5px); }\n.tc-info-row:hover .tc-info-icon { background: linear-gradient(135deg,var(--tc-amber),var(--tc-amber-light)); }\n\n.tc-info-icon {\n  width: 42px; height: 42px; border-radius: 8px; flex-shrink: 0;\n  background: linear-gradient(135deg,var(--tc-navy),var(--tc-navy-dark));\n  display: flex; align-items: center; justify-content: center;\n  transition: background .3s, transform .3s;\n}\n.tc-info-row:hover .tc-info-icon { transform: rotate(6deg) scale(1.08); }\n.tc-info-icon svg { width: 18px; height: 18px; stroke: #fff; fill: none; stroke-width: 2; }\n\n.tc-info-text { flex: 1; }\n.tc-info-label { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--tc-amber); margin-bottom: 4px; font-weight: 600; }\n.tc-info-val { font-size: 13px; color: rgba(255,255,255,.85); line-height: 1.65; }\n.tc-info-val a { color: rgba(255,255,255,.88); text-decoration: none; transition: color .2s; }\n.tc-info-val a:hover { color: var(--tc-amber); }\n\n\/* WhatsApp pill *\/\n.tc-wa-pill {\n  display: inline-flex; align-items: center; gap: 8px;\n  background: rgba(37,211,102,.12); border: 1px solid rgba(37,211,102,.3);\n  border-radius: 20px; padding: 8px 16px; font-size: 12px;\n  color: #25d366; font-weight: 600; letter-spacing: .5px;\n  text-decoration: none; transition: background .25s, transform .2s, box-shadow .25s;\n  width: fit-content;\n}\n.tc-wa-pill:hover { background: rgba(37,211,102,.22); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(37,211,102,.2); }\n.tc-wa-pill svg { width: 18px; height: 18px; fill: #25d366; }\n\n\/* Social icons *\/\n.tc-socials { display: flex; gap: 10px; margin-top: 24px; }\n.tc-soc-btn {\n  width: 38px; height: 38px; border-radius: 8px;\n  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);\n  display: flex; align-items: center; justify-content: center;\n  text-decoration: none; transition: border-color .25s, background .25s, transform .25s;\n}\n.tc-soc-btn svg { width: 17px; height: 17px; fill: rgba(255,255,255,.55); transition: fill .25s; }\n.tc-soc-btn:hover { border-color: var(--tc-amber); background: rgba(217,142,43,.12); transform: translateY(-3px); }\n.tc-soc-btn:hover svg { fill: var(--tc-amber); }\n\n\/* RIGHT \u2014 Form *\/\n.tc-form-right { padding: 52px 48px; }\n.tc-form-right h3 {\n  font-family: 'Raleway', sans-serif; font-size: 20px; font-weight: 800;\n  color: var(--tc-text); text-transform: uppercase; letter-spacing: 1.5px;\n  margin-bottom: 8px;\n}\n.tc-form-right > p { font-size: 13px; color: var(--tc-muted); margin-bottom: 32px; }\n\n\/* Form grid *\/\n.tc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }\n.tc-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }\n.tc-row .tc-field { margin-bottom: 0; }\n\n.tc-field label {\n  font-size: 10px; letter-spacing: 2px; text-transform: uppercase;\n  color: var(--tc-muted); font-weight: 600;\n  transition: color .25s;\n}\n.tc-field:focus-within label { color: var(--tc-amber); }\n\n.tc-field input, .tc-field select, .tc-field textarea {\n  width: 100%; padding: 13px 16px;\n  background: rgba(11,31,51,.035);\n  border: 1px solid rgba(11,31,51,.16); border-radius: 8px;\n  color: var(--tc-text); font-family: 'Open Sans', sans-serif; font-size: 13px;\n  outline: none; transition: border-color .25s, background .25s, box-shadow .25s, transform .2s;\n  -webkit-appearance: none; appearance: none;\n}\n.tc-field input::placeholder, .tc-field textarea::placeholder { color: rgba(11,31,51,.35); }\n.tc-field input:focus, .tc-field select:focus, .tc-field textarea:focus {\n  border-color: var(--tc-amber); background: rgba(217,142,43,.07);\n  box-shadow: 0 0 0 3px rgba(217,142,43,.16);\n  transform: translateY(-1px);\n}\n.tc-field input:hover:not(:focus), .tc-field select:hover:not(:focus), .tc-field textarea:hover:not(:focus) {\n  border-color: rgba(11,31,51,.26);\n}\n.tc-field select option { background: #FDFBF6; color: #0B1F33; }\n.tc-field textarea { min-height: 118px; resize: vertical; }\n\n\/* Service checkboxes *\/\n.tc-service-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 20px; }\n.tc-service-check { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 9px 12px;\n  border: 1px solid rgba(11,31,51,.14); border-radius: 6px;\n  transition: border-color .25s, background .25s;\n}\n.tc-service-check:hover { border-color: rgba(217,142,43,.4); background: rgba(217,142,43,.06); }\n.tc-service-check input[type=\"checkbox\"] { display: none; }\n.tc-check-box {\n  width: 16px; height: 16px; border: 1.5px solid rgba(11,31,51,.3); border-radius: 3px;\n  flex-shrink: 0; display: flex; align-items: center; justify-content: center;\n  transition: background .2s, border-color .2s;\n}\n.tc-service-check input:checked + .tc-check-box {\n  background: var(--tc-amber); border-color: var(--tc-amber);\n}\n.tc-service-check input:checked + .tc-check-box::after {\n  content: '\u2713'; font-size: 10px; color: #fff; font-weight: 700;\n}\n.tc-service-check span.tc-svc-lbl { font-size: 12px; color: rgba(11,31,51,.75); }\n\n\/* Budget select *\/\n.tc-budget-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }\n.tc-budget-btn {\n  flex: 1 1 auto; min-width: 80px;\n  padding: 8px 10px; border: 1px solid rgba(11,31,51,.16); border-radius: 6px;\n  background: rgba(11,31,51,.03); color: rgba(11,31,51,.6); font-size: 11px;\n  text-align: center; cursor: pointer; transition: all .25s; font-family: 'Open Sans', sans-serif;\n  letter-spacing: .5px;\n}\n.tc-budget-btn.active, .tc-budget-btn:hover { background: rgba(217,142,43,.14); border-color: var(--tc-amber); color: var(--tc-amber); }\n\n\/* Submit row *\/\n.tc-submit-row {\n  display: flex; align-items: center; justify-content: space-between;\n  flex-wrap: wrap; gap: 16px; margin-top: 6px;\n}\n.tc-submit-btn {\n  position: relative; overflow: hidden;\n  padding: 15px 44px; border: none; border-radius: 8px; cursor: pointer;\n  font-family: 'Raleway', sans-serif; font-size: 13px; font-weight: 800;\n  letter-spacing: 1.5px; text-transform: uppercase; color: #fff;\n  background: linear-gradient(135deg, var(--tc-amber), var(--tc-navy));\n  transition: transform .25s, box-shadow .25s;\n}\n.tc-submit-btn::before {\n  content: ''; position: absolute; inset: 0;\n  background: linear-gradient(135deg, var(--tc-navy), var(--tc-amber));\n  opacity: 0; transition: opacity .4s;\n}\n.tc-submit-btn:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(217,142,43,.4); }\n.tc-submit-btn:hover::before { opacity: 1; }\n.tc-submit-btn span { position: relative; z-index: 1; }\n.tc-submit-btn:active { transform: translateY(-1px); }\n\n.tc-submit-note {\n  font-size: 11px; color: var(--tc-muted); line-height: 1.7;\n  max-width: 240px;\n}\n\n\/* \u2500\u2500 Progress \/ status \u2500\u2500 *\/\n.tc-progress-bar-wrap {\n  height: 3px; background: rgba(11,31,51,.08); border-radius: 2px;\n  margin-top: 20px; overflow: hidden; display: none;\n}\n.tc-progress-bar {\n  height: 100%; border-radius: 2px;\n  background: linear-gradient(90deg, var(--tc-amber), var(--tc-navy-light));\n  width: 0; transition: width 1.2s ease;\n}\n.tc-form-msg {\n  margin-top: 18px; padding: 14px 18px; border-radius: 8px;\n  font-size: 13px; font-weight: 600; display: none; line-height: 1.6;\n}\n.tc-form-msg.success { background: rgba(63,125,92,.12); border: 1px solid rgba(63,125,92,.32); color: var(--tc-success); }\n.tc-form-msg.error { background: rgba(179,63,63,.10); border: 1px solid rgba(179,63,63,.3); color: var(--tc-error); }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   MAP \/ LOCATION ROW\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-location-row {\n  display: grid; grid-template-columns: 1fr 1.3fr; gap: 24px;\n  margin-top: 48px;\n  opacity: 0; transform: translateY(28px);\n}\n.tc-location-row.tc-visible { animation: tcFadeUp .65s ease forwards; }\n\n.tc-map-card {\n  background: var(--tc-card); border: 1px solid var(--tc-border); border-radius: 16px;\n  overflow: hidden; min-height: 320px; position: relative;\n  transition: border-color .3s, box-shadow .3s;\n}\n.tc-map-card:hover { border-color: rgba(11,31,51,.3); box-shadow: 0 16px 45px rgba(11,31,51,.14); }\n\n\/* Embedded map placeholder (real iframe) *\/\n.tc-map-card iframe {\n  width: 100%; height: 100%; min-height: 320px; border: 0;\n  filter: grayscale(.35) sepia(.12) brightness(1.05) contrast(.95);\n  transition: filter .4s;\n}\n.tc-map-card:hover iframe { filter: grayscale(0) sepia(0) brightness(1) contrast(1); }\n\n.tc-office-card {\n  background: var(--tc-card); border: 1px solid var(--tc-border); border-radius: 16px;\n  padding: 40px; display: flex; flex-direction: column; justify-content: space-between;\n  transition: border-color .3s;\n}\n.tc-office-card:hover { border-color: rgba(217,142,43,.35); }\n.tc-office-card h3 {\n  font-family: 'Raleway', sans-serif; font-size: 18px; font-weight: 800;\n  color: var(--tc-text); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 10px;\n}\n.tc-office-card h3 span { color: var(--tc-amber); }\n.tc-office-card p { font-size: 13px; color: var(--tc-muted); line-height: 1.9; }\n.tc-office-hours {\n  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px;\n}\n.tc-oh-item {\n  background: rgba(11,31,51,.03); border: 1px solid var(--tc-border);\n  border-radius: 8px; padding: 12px 14px;\n  transition: border-color .25s, background .25s;\n}\n.tc-oh-item:hover { border-color: rgba(217,142,43,.35); background: rgba(217,142,43,.06); }\n.tc-oh-day { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--tc-amber); margin-bottom: 4px; }\n.tc-oh-time { font-size: 13px; color: rgba(11,31,51,.85); font-weight: 600; }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ANIMATIONS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n@keyframes tcFadeUp {\n  from { opacity: 0; transform: translateY(24px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   SCROLL REVEAL utility\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-reveal {\n  opacity: 0; transform: translateY(28px);\n  transition: opacity .6s ease, transform .6s ease;\n}\n.tc-reveal.tc-in { opacity: 1; transform: translateY(0); }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FLOATING LABEL ANIMATION for inputs\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.tc-field input:not(:placeholder-shown),\n.tc-field textarea:not(:placeholder-shown) {\n  background: rgba(217,142,43,.05);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   RESPONSIVE\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n@media (max-width: 960px) {\n  .tc-form-wrap { grid-template-columns: 1fr; }\n  .tc-form-left { border-right: none; border-bottom: 1px solid rgba(255,255,255,.08); padding: 40px 28px; }\n  .tc-form-right { padding: 36px 28px; }\n  .tc-cards-grid { grid-template-columns: 1fr; gap: 14px; }\n  .tc-location-row { grid-template-columns: 1fr; }\n  .tc-map-card { min-height: 260px; }\n  .tc-row { grid-template-columns: 1fr; }\n  #tc-cursor, #tc-cursor-ring { display: none; }\n}\n@media (max-width: 600px) {\n  #tc-contact-page { padding: 90px 0 60px; }\n  .tc-container { padding: 0 18px; }\n  .tc-stat-bar { flex-direction: column; }\n  .tc-stat-item + .tc-stat-item::before { display: none; }\n  .tc-service-grid { grid-template-columns: 1fr; }\n  .tc-form-right { padding: 28px 20px; }\n  .tc-form-left { padding: 32px 20px; }\n  .tc-submit-row { flex-direction: column; align-items: flex-start; }\n  .tc-submit-btn { width: 100%; text-align: center; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .tc-bg-track, .tc-blob { animation: none !important; }\n}\n<\/style>\n\n\n\n<!-- CURSOR -->\n<div id=\"tc-cursor\"><\/div>\n<div id=\"tc-cursor-ring\"><\/div>\n\n<!-- BACKGROUND CAROUSEL (real structural images) -->\n<div id=\"tc-bg-wrap\">\n  <div class=\"tc-bg-track\">\n    <!-- 6 structural engineering images -->\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1504307651254-35680f356dfd?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1486325212027-8081e485255e?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1590274853856-f22d5ee3d228?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1541888946425-d81bb19240f5?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1558618666-fcd25c85cd64?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1518709268805-4e9042af9f23?w=1600&amp;q=80')\"><\/div>\n    <!-- Duplicates for seamless loop -->\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1504307651254-35680f356dfd?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1486325212027-8081e485255e?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1590274853856-f22d5ee3d228?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1541888946425-d81bb19240f5?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1558618666-fcd25c85cd64?w=1600&amp;q=80')\"><\/div>\n    <div class=\"tc-bg-frame\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1518709268805-4e9042af9f23?w=1600&amp;q=80')\"><\/div>\n  <\/div>\n<\/div>\n<div id=\"tc-bg-overlay\"><\/div>\n<div id=\"tc-grid\"><\/div>\n<div class=\"tc-blob tcb1\"><\/div>\n<div class=\"tc-blob tcb2\"><\/div>\n<div class=\"tc-blob tcb3\"><\/div>\n<div class=\"tc-blob tcb4\"><\/div>\n<canvas id=\"tc-particles\"><\/canvas>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PAGE \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<div id=\"tc-contact-page\">\n  <div class=\"tc-container\">\n\n    <!-- HERO -->\n    <div class=\"tc-hero\">\n      <div class=\"tc-eyebrow\">TechCore Engineering<\/div>\n      <h1>Let&#8217;s <span class=\"tc-hl\">Build<\/span><br>Something Great<\/h1>\n      <div class=\"tc-sep\"><\/div>\n      <p>From initial structural consultation to project completion \u2014 our licensed engineers are ready to bring precision and confidence to your next challenge. Reach out today.<\/p>\n    <\/div>\n\n    <!-- STAT BAR -->\n    <div class=\"tc-stat-bar tc-reveal\">\n      <div class=\"tc-stat-item\">\n        <span class=\"tc-stat-num\" data-target=\"480\">0<\/span>\n        <span class=\"tc-stat-lbl\">Projects Completed<\/span>\n      <\/div>\n      <div class=\"tc-stat-item\">\n        <span class=\"tc-stat-num\" data-target=\"25\">0<\/span>\n        <span class=\"tc-stat-lbl\">Years Experience<\/span>\n      <\/div>\n      <div class=\"tc-stat-item\">\n        <span class=\"tc-stat-num\" data-target=\"28\">0<\/span>\n        <span class=\"tc-stat-lbl\">Countries Served<\/span>\n      <\/div>\n      <div class=\"tc-stat-item\">\n        <span class=\"tc-stat-num\" data-target=\"24\">0<\/span>\n        <span class=\"tc-stat-lbl\">Hour Response<\/span>\n      <\/div>\n    <\/div>\n\n    <!-- CONTACT CARDS -->\n    <div class=\"tc-cards-grid\">\n\n      <!-- Card 1: Phone -->\n      <div class=\"tc-c-card\" onclick=\"window.open('tel:+923475477745')\">\n        <div class=\"tc-c-icon-wrap\">\n          <svg class=\"tc-c-icon\" viewBox=\"0 0 24 24\"><path d=\"M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07A19.5 19.5 0 013.07 10.8a19.79 19.79 0 01-3.07-8.7A2 2 0 012 0h3a2 2 0 012 1.72c.13.96.36 1.9.7 2.81a2 2 0 01-.45 2.11L6.09 7.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0122 14.9v2.02z\"><\/path><\/svg>\n        <\/div>\n        <h3>Call Us Direct<\/h3>\n        <p><a href=\"tel:+923475477745\">+92-347-5477745<\/a><br><span style=\"font-size:11px;letter-spacing:1px;text-transform:uppercase;color:rgba(11,31,51,.4)\">Mon\u2013Sat \u00b7 9AM\u20136PM<\/span><\/p>\n      <\/div>\n\n      <!-- Card 2: Email -->\n      <div class=\"tc-c-card\" onclick=\"window.open('mailto:info@techcoree.com')\">\n        <div class=\"tc-c-icon-wrap\">\n          <svg class=\"tc-c-icon\" viewBox=\"0 0 24 24\"><path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"><\/path><polyline points=\"22,6 12,13 2,6\"><\/polyline><\/svg>\n        <\/div>\n        <h3>Email Us<\/h3>\n        <p><a href=\"mailto:info@techcoree.com\">info@techcoree.com<\/a><br><span style=\"font-size:11px;letter-spacing:1px;text-transform:uppercase;color:rgba(11,31,51,.4)\">Reply within 24 hours<\/span><\/p>\n      <\/div>\n\n      <!-- Card 3: WhatsApp -->\n      <div class=\"tc-c-card\" onclick=\"window.open('https:\/\/wa.me\/923475477745?text=Hello%20TechCore%20Engineering%2C%20I%20would%20like%20to%20enquire%20about%20your%20structural%20engineering%20services.','_blank')\">\n        <div class=\"tc-c-icon-wrap\" style=\"background:linear-gradient(135deg,#25d366,#128c52)\">\n          <svg class=\"tc-c-icon\" viewBox=\"0 0 24 24\" style=\"fill:#fff;stroke:none\">\n            <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z\"><\/path><path d=\"M11.99 2C6.47 2 2 6.48 2 12.02c0 1.76.48 3.41 1.32 4.84L2 22l5.25-1.37A9.93 9.93 0 0011.99 22c5.52 0 10-4.48 10-10S17.51 2 11.99 2zm0 18c-1.56 0-3-.42-4.24-1.15l-.3-.18-3.12.82.83-3.04-.2-.31A7.96 7.96 0 014 12.02C4 7.59 7.59 4 11.99 4S20 7.59 20 12.02C20 16.45 16.41 20 11.99 20z\"><\/path>\n          <\/svg>\n        <\/div>\n        <h3>WhatsApp<\/h3>\n        <p><a href=\"https:\/\/wa.me\/923475477745\" target=\"_blank\">+92-347-5477745<\/a><br><span style=\"font-size:11px;letter-spacing:1px;text-transform:uppercase;color:rgba(11,31,51,.4)\">Quick response guaranteed<\/span><\/p>\n      <\/div>\n\n    <\/div>\n\n    <!-- FORM BLOCK -->\n    <div class=\"tc-form-wrap tc-reveal\">\n\n      <!-- LEFT INFO -->\n      <div class=\"tc-form-left\">\n        <div>\n          <h2>Get Your<br><span>Free<\/span> Consultation<\/h2>\n          <p style=\"\n    color:#FDFBF6;\n    font-size:14px;\n    line-height:1.9;\n    font-weight:400;\n    letter-spacing:0.3px;\n    max-width:420px;\n    opacity:0.95;\n    margin-bottom:36px;\n\">Tell us about your project and one of our structural engineers will respond within 24 hours with expert guidance tailored to your requirements.<\/p>\n\n          <div class=\"tc-info-list\">\n            <div class=\"tc-info-row\">\n              <div class=\"tc-info-icon\">\n                <svg viewBox=\"0 0 24 24\"><path d=\"M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07A19.5 19.5 0 013.07 10.8a19.79 19.79 0 01-3.07-8.7A2 2 0 012 0h3a2 2 0 012 1.72c.13.96.36 1.9.7 2.81a2 2 0 01-.45 2.11L6.09 7.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0122 14.9v2.02z\"><\/path><\/svg>\n              <\/div>\n              <div class=\"tc-info-text\">\n                <div class=\"tc-info-label\">Phone<\/div>\n                <div class=\"tc-info-val\"><a href=\"tel:+923475477745\">+92-347-5477745<\/a><\/div>\n              <\/div>\n            <\/div>\n            <div class=\"tc-info-row\">\n              <div class=\"tc-info-icon\">\n                <svg viewBox=\"0 0 24 24\"><path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"><\/path><polyline points=\"22,6 12,13 2,6\"><\/polyline><\/svg>\n              <\/div>\n              <div class=\"tc-info-text\">\n                <div class=\"tc-info-label\">Email<\/div>\n                <div class=\"tc-info-val\"><a href=\"mailto:info@techcoree.com\">info@techcoree.com<\/a><\/div>\n              <\/div>\n            <\/div>\n            <div class=\"tc-info-row\">\n              <div class=\"tc-info-icon\">\n                <svg viewBox=\"0 0 24 24\"><path d=\"M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0118 0z\"><\/path><circle cx=\"12\" cy=\"10\" r=\"3\"><\/circle><\/svg>\n              <\/div>\n              <div class=\"tc-info-text\">\n                <div class=\"tc-info-label\">Office<\/div>\n                <div class=\"tc-info-val\">TechCore Tower, Engineering District<br>Lahore, Punjab, Pakistan<\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n\n          <a class=\"tc-wa-pill\" href=\"https:\/\/wa.me\/923475477745?text=Hello%20TechCore%2C%20I%27d%20like%20to%20enquire%20about%20your%20structural%20services.\" target=\"_blank\">\n            <svg viewBox=\"0 0 24 24\"><path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z\"><\/path><path d=\"M11.99 2C6.47 2 2 6.48 2 12.02c0 1.76.48 3.41 1.32 4.84L2 22l5.25-1.37A9.93 9.93 0 0011.99 22c5.52 0 10-4.48 10-10S17.51 2 11.99 2zm0 18c-1.56 0-3-.42-4.24-1.15l-.3-.18-3.12.82.83-3.04-.2-.31A7.96 7.96 0 014 12.02C4 7.59 7.59 4 11.99 4S20 7.59 20 12.02C20 16.45 16.41 20 11.99 20z\"><\/path><\/svg>\n            Chat on WhatsApp\n          <\/a>\n        <\/div>\n\n        <div class=\"tc-socials\">\n          <a href=\"#\" class=\"tc-soc-btn\" title=\"LinkedIn\">\n            <svg viewBox=\"0 0 24 24\"><path d=\"M16 8a6 6 0 016 6v7h-4v-7a2 2 0 00-2-2 2 2 0 00-2 2v7h-4v-7a6 6 0 016-6zM2 9h4v12H2z\"><\/path><circle cx=\"4\" cy=\"4\" r=\"2\"><\/circle><\/svg>\n          <\/a>\n          <a href=\"#\" class=\"tc-soc-btn\" title=\"Twitter\/X\">\n            <svg viewBox=\"0 0 24 24\"><path d=\"M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z\"><\/path><\/svg>\n          <\/a>\n          <a href=\"#\" class=\"tc-soc-btn\" title=\"Instagram\">\n            <svg viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\"><\/rect><path d=\"M16 11.37A4 4 0 1112.63 8 4 4 0 0116 11.37z\"><\/path><line x1=\"17.5\" y1=\"6.5\" x2=\"17.51\" y2=\"6.5\"><\/line><\/svg>\n          <\/a>\n        <\/div>\n      <\/div>\n\n      <!-- RIGHT FORM -->\n      <div class=\"tc-form-right\">\n        <h3>Send a Project Brief<\/h3>\n        <p>Fill in the details below and we&#8217;ll get back to you within 24 hours.<\/p>\n\n        <form id=\"tc-contact-form\" novalidate=\"\">\n          <!-- Name row -->\n          <div class=\"tc-row\">\n            <div class=\"tc-field\">\n              <label for=\"tc-fname\">First Name *<\/label>\n              <input type=\"text\" id=\"tc-fname\" name=\"from_first\" placeholder=\"Ahmed\" required=\"\">\n            <\/div>\n            <div class=\"tc-field\">\n              <label for=\"tc-lname\">Last Name *<\/label>\n              <input type=\"text\" id=\"tc-lname\" name=\"from_last\" placeholder=\"Khan\" required=\"\">\n            <\/div>\n          <\/div>\n\n          <!-- Email + Phone -->\n          <div class=\"tc-row\">\n            <div class=\"tc-field\">\n              <label for=\"tc-email\">Email Address *<\/label>\n              <input type=\"email\" id=\"tc-email\" name=\"from_email\" placeholder=\"ahmed@company.com\" required=\"\">\n            <\/div>\n            <div class=\"tc-field\">\n              <label for=\"tc-phone\">Phone \/ WhatsApp<\/label>\n              <input type=\"tel\" id=\"tc-phone\" name=\"from_phone\" placeholder=\"+92 300 0000000\">\n            <\/div>\n          <\/div>\n\n          <!-- Company + City -->\n          <div class=\"tc-row\">\n            <div class=\"tc-field\">\n              <label for=\"tc-company\">Company \/ Organisation<\/label>\n              <input type=\"text\" id=\"tc-company\" name=\"company\" placeholder=\"ABC Developers Ltd.\">\n            <\/div>\n            <div class=\"tc-field\">\n              <label for=\"tc-city\">Project City<\/label>\n              <input type=\"text\" id=\"tc-city\" name=\"city\" placeholder=\"Lahore, Karachi\u2026\">\n            <\/div>\n          <\/div>\n\n          <!-- Service Type -->\n          <div class=\"tc-field\">\n            <label>Services Required<\/label>\n            <div class=\"tc-service-grid\">\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_design\" value=\"Structural Design\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">Structural Design<\/span><\/label>\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_fea\" value=\"FEA Analysis\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">FEA Analysis<\/span><\/label>\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_foundations\" value=\"Foundation Engineering\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">Foundation Engineering<\/span><\/label>\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_seismic\" value=\"Seismic Assessment\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">Seismic Assessment<\/span><\/label>\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_retrofit\" value=\"Structural Retrofit\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">Structural Retrofit<\/span><\/label>\n              <label class=\"tc-service-check\"><input type=\"checkbox\" name=\"svc_inspection\" value=\"Site Inspection\"><span class=\"tc-check-box\"><\/span><span class=\"tc-svc-lbl\">Site Inspection<\/span><\/label>\n            <\/div>\n          <\/div>\n\n          <!-- Budget -->\n          <div class=\"tc-field\">\n            <label>Approximate Project Budget<\/label>\n            <div class=\"tc-budget-row\" id=\"tc-budget-row\">\n              <div class=\"tc-budget-btn\" data-val=\"&lt;$50K\">Under $50K<\/div>\n              <div class=\"tc-budget-btn\" data-val=\"$50K\u2013$200K\">$50K\u2013$200K<\/div>\n              <div class=\"tc-budget-btn\" data-val=\"$200K\u2013$1M\">$200K\u2013$1M<\/div>\n              <div class=\"tc-budget-btn\" data-val=\"$1M+\">$1M+<\/div>\n              <div class=\"tc-budget-btn\" data-val=\"TBD\">TBD<\/div>\n            <\/div>\n            <input type=\"hidden\" id=\"tc-budget\" name=\"budget\" value=\"\">\n          <\/div>\n\n          <!-- Project Brief -->\n          <div class=\"tc-field\">\n            <label for=\"tc-msg\">Project Brief *<\/label>\n            <textarea id=\"tc-msg\" name=\"message\" placeholder=\"Describe your structural engineering challenge \u2014 type of structure, height, span, loading conditions, site constraints, timeline\u2026\" required=\"\"><\/textarea>\n          <\/div>\n\n          <!-- Submit -->\n          <div class=\"tc-submit-row\">\n            <button type=\"submit\" class=\"tc-submit-btn\" id=\"tc-submit-btn\">\n              <span id=\"tc-btn-text\">Send Enquiry \u2192<\/span>\n            <\/button>\n            <p class=\"tc-submit-note\">Your message is sent to our email and forwarded to WhatsApp. We respond within 24 hours.<\/p>\n          <\/div>\n\n          <div class=\"tc-progress-bar-wrap\" id=\"tc-progress-wrap\">\n            <div class=\"tc-progress-bar\" id=\"tc-progress-bar\"><\/div>\n          <\/div>\n          <div class=\"tc-form-msg\" id=\"tc-form-msg\"><\/div>\n        <\/form>\n      <\/div>\n    <\/div>\n\n    <!-- LOCATION ROW -->\n    <div class=\"tc-location-row tc-reveal\">\n      <div class=\"tc-map-card\">\n        <!-- OpenStreetMap embed for Lahore, Pakistan -->\n        <iframe src=\"https:\/\/www.openstreetmap.org\/export\/embed.html?bbox=74.2,31.4,74.5,31.6&amp;layer=mapnik&amp;marker=31.5204,74.3587\" title=\"TechCore Engineering Office Location\" loading=\"lazy\">\n        <\/iframe>\n      <\/div>\n      <div class=\"tc-office-card\">\n        <div>\n          <h3>Our <span>Office<\/span><\/h3>\n          <p>TechCore Engineering Headquarters is located in the heart of Lahore&#8217;s engineering district. Our team of licensed structural engineers is available for in-person consultations by appointment.<\/p>\n        <\/div>\n        <div class=\"tc-office-hours\">\n          <div class=\"tc-oh-item\">\n            <div class=\"tc-oh-day\">Mon \u2013 Thu<\/div>\n            <div class=\"tc-oh-time\">9:00 AM \u2013 6:00 PM<\/div>\n          <\/div>\n          <div class=\"tc-oh-item\">\n            <div class=\"tc-oh-day\">Friday<\/div>\n            <div class=\"tc-oh-time\">9:00 AM \u2013 1:00 PM<\/div>\n          <\/div>\n          <div class=\"tc-oh-item\">\n            <div class=\"tc-oh-day\">Saturday<\/div>\n            <div class=\"tc-oh-time\">10:00 AM \u2013 3:00 PM<\/div>\n          <\/div>\n          <div class=\"tc-oh-item\">\n            <div class=\"tc-oh-day\">Sunday<\/div>\n            <div class=\"tc-oh-time\">Closed<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n  <\/div><!-- \/tc-container -->\n<\/div><!-- \/tc-contact-page -->\n\n\n<script>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   EMAILJS INIT\n   Replace 'YOUR_PUBLIC_KEY' with your EmailJS public key\n   Replace 'YOUR_SERVICE_ID' with your EmailJS service ID\n   Replace 'YOUR_TEMPLATE_ID' with your EmailJS template ID\n   See setup guide below.\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nemailjs.init('YOUR_PUBLIC_KEY');\nconst EJ_SERVICE  = 'YOUR_SERVICE_ID';\nconst EJ_TEMPLATE = 'YOUR_TEMPLATE_ID';\nconst TO_EMAIL    = 'info@techcoree.com';\nconst TO_WHATSAPP = '+923475477745';\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PARTICLE SYSTEM\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst cvs = document.getElementById('tc-particles');\nconst ctx = cvs.getContext('2d');\nfunction resizeCvs(){ cvs.width = window.innerWidth; cvs.height = window.innerHeight; }\nresizeCvs(); window.addEventListener('resize', resizeCvs);\n\nclass Dot {\n  constructor(){this.reset();}\n  reset(){\n    this.x = Math.random()*cvs.width; this.y = Math.random()*cvs.height;\n    this.vx=(Math.random()-.5)*.35; this.vy=(Math.random()-.5)*.35;\n    this.a=Math.random()*.3+.05; this.r=Math.random()*1.4+.4;\n    this.c=Math.random()>.65?'217,142,43':'11,31,51';\n  }\n  step(){this.x+=this.vx;this.y+=this.vy;if(this.x<0||this.x>cvs.width||this.y<0||this.y>cvs.height)this.reset();}\n  draw(){ctx.beginPath();ctx.arc(this.x,this.y,this.r,0,Math.PI*2);ctx.fillStyle=`rgba(${this.c},${this.a})`;ctx.fill();}\n}\nconst dots=[]; for(let i=0;i<85;i++) dots.push(new Dot());\nfunction animDots(){\n  ctx.clearRect(0,0,cvs.width,cvs.height);\n  dots.forEach(d=>{d.step();d.draw();});\n  for(let i=0;i<dots.length;i++) for(let j=i+1;j<dots.length;j++){\n    const dx=dots[i].x-dots[j].x, dy=dots[i].y-dots[j].y, d=Math.hypot(dx,dy);\n    if(d<105){ctx.beginPath();ctx.moveTo(dots[i].x,dots[i].y);ctx.lineTo(dots[j].x,dots[j].y);ctx.strokeStyle=`rgba(11,31,51,${.05*(1-d\/105)})`;ctx.lineWidth=.5;ctx.stroke();}\n  }\n  requestAnimationFrame(animDots);\n}\nanimDots();\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   CURSOR\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst cur=document.getElementById('tc-cursor'), cring=document.getElementById('tc-cursor-ring');\nlet mx=0,my=0,rx=0,ry=0;\ndocument.addEventListener('mousemove',e=>{mx=e.clientX;my=e.clientY;cur.style.left=mx+'px';cur.style.top=my+'px';});\n(function animCur(){rx+=(mx-rx)*.15;ry+=(my-ry)*.15;cring.style.left=rx+'px';cring.style.top=ry+'px';requestAnimationFrame(animCur);})();\ndocument.querySelectorAll('a,button,.tc-c-card,.tc-info-row,.tc-budget-btn,.tc-service-check,.tc-oh-item,input,select,textarea').forEach(el=>{\n  el.addEventListener('mouseenter',()=>{cur.style.width='22px';cur.style.height='22px';cring.style.width='56px';cring.style.height='56px';});\n  el.addEventListener('mouseleave',()=>{cur.style.width='14px';cur.style.height='14px';cring.style.width='42px';cring.style.height='42px';});\n});\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   SCROLL REVEAL\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst revObs = new IntersectionObserver((entries)=>{\n  entries.forEach((e,i)=>{\n    if(e.isIntersecting){\n      setTimeout(()=>e.target.classList.add('tc-in'), i*80);\n    }\n  });\n},{threshold:.12});\ndocument.querySelectorAll('.tc-reveal').forEach(el=>revObs.observe(el));\n\n\/* Contact cards stagger *\/\nconst cardObs = new IntersectionObserver((entries)=>{\n  entries.forEach(e=>{\n    if(e.isIntersecting) e.target.classList.add('tc-visible');\n  });\n},{threshold:.15});\ndocument.querySelectorAll('.tc-c-card').forEach(el=>cardObs.observe(el));\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   STAT COUNTER ANIMATION\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst statObs = new IntersectionObserver(entries=>{\n  entries.forEach(e=>{\n    if(e.isIntersecting){\n      e.target.querySelectorAll('.tc-stat-num').forEach(el=>{\n        const target=parseInt(el.dataset.target);\n        let v=0; const step=target\/60;\n        const t=setInterval(()=>{\n          v=Math.min(v+step,target);\n          el.textContent=(target>=100?Math.round(v)+'K+':target===24?Math.round(v)+'h':Math.round(v));\n          if(v>=target)clearInterval(t);\n        },20);\n      });\n      statObs.unobserve(e.target);\n    }\n  });\n},{threshold:.3});\nconst statBar=document.querySelector('.tc-stat-bar');\nif(statBar)statObs.observe(statBar);\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   BUDGET BUTTONS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\ndocument.querySelectorAll('.tc-budget-btn').forEach(btn=>{\n  btn.addEventListener('click',()=>{\n    document.querySelectorAll('.tc-budget-btn').forEach(b=>b.classList.remove('active'));\n    btn.classList.add('active');\n    document.getElementById('tc-budget').value=btn.dataset.val;\n  });\n});\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   3D TILT on form wrap\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst formWrap=document.querySelector('.tc-form-wrap');\nif(formWrap){\n  formWrap.addEventListener('mousemove',e=>{\n    const r=formWrap.getBoundingClientRect();\n    const cx=r.left+r.width\/2, cy=r.top+r.height\/2;\n    const rx2=-(e.clientY-cy)\/(r.height\/2)*4;\n    const ry2=(e.clientX-cx)\/(r.width\/2)*4;\n    formWrap.style.transform=`perspective(1200px) rotateX(${rx2}deg) rotateY(${ry2}deg)`;\n  });\n  formWrap.addEventListener('mouseleave',()=>{formWrap.style.transform='perspective(1200px) rotateX(0) rotateY(0)';});\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FORM SUBMISSION\n   Sends via EmailJS \u2192 triggers to email + WhatsApp\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\ndocument.getElementById('tc-contact-form').addEventListener('submit',async function(e){\n  e.preventDefault();\n\n  \/* Gather services *\/\n  const svcs=[...document.querySelectorAll('.tc-service-check input:checked')].map(c=>c.value).join(', ')||'Not specified';\n\n  \/* Basic validation *\/\n  const fname=document.getElementById('tc-fname').value.trim();\n  const lname=document.getElementById('tc-lname').value.trim();\n  const email=document.getElementById('tc-email').value.trim();\n  const msg=document.getElementById('tc-msg').value.trim();\n  if(!fname||!email||!msg){\n    showMsg('error','\u26a0 Please fill in your name, email, and project brief.');\n    return;\n  }\n  if(!\/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(email)){\n    showMsg('error','\u26a0 Please enter a valid email address.');\n    return;\n  }\n\n  const btn=document.getElementById('tc-submit-btn');\n  const btnTxt=document.getElementById('tc-btn-text');\n  btn.disabled=true; btnTxt.textContent='Sending\u2026';\n\n  \/* Show progress bar *\/\n  const pbWrap=document.getElementById('tc-progress-wrap');\n  const pb=document.getElementById('tc-progress-bar');\n  pbWrap.style.display='block';\n  setTimeout(()=>pb.style.width='70%',100);\n\n  \/* Build template params *\/\n  const templateParams={\n    to_email:    TO_EMAIL,\n    from_name:   `${fname} ${lname}`,\n    from_first:  fname,\n    from_last:   lname,\n    from_email:  email,\n    from_phone:  document.getElementById('tc-phone').value.trim()||'Not provided',\n    company:     document.getElementById('tc-company').value.trim()||'Not provided',\n    city:        document.getElementById('tc-city').value.trim()||'Not provided',\n    services:    svcs,\n    budget:      document.getElementById('tc-budget').value||'Not specified',\n    message:     msg,\n    whatsapp_no: TO_WHATSAPP,\n    reply_to:    email,\n  };\n\n  try {\n    await emailjs.send(EJ_SERVICE, EJ_TEMPLATE, templateParams);\n    pb.style.width='100%';\n    setTimeout(()=>{\n      pbWrap.style.display='none'; pb.style.width='0';\n      showMsg('success','\u2705 Message sent! We\\'ll reply to '+email+' within 24 hours. You can also chat with us on WhatsApp: '+TO_WHATSAPP);\n      document.getElementById('tc-contact-form').reset();\n      document.querySelectorAll('.tc-budget-btn').forEach(b=>b.classList.remove('active'));\n    },800);\n  } catch(err){\n    console.error('EmailJS error:',err);\n    pb.style.width='100%'; pb.style.background='#B33F3F';\n    setTimeout(()=>{pbWrap.style.display='none';pb.style.width='0';pb.style.background='';},600);\n    \/* Fallback: open WhatsApp with the brief *\/\n    const waText=`Hello TechCore Engineering!%0A%0AName: ${fname} ${lname}%0AEmail: ${email}%0APhone: ${document.getElementById('tc-phone').value||'N\/A'}%0ACompany: ${document.getElementById('tc-company').value||'N\/A'}%0ACity: ${document.getElementById('tc-city').value||'N\/A'}%0AServices: ${svcs}%0ABudget: ${document.getElementById('tc-budget').value||'TBD'}%0A%0AProject Brief:%0A${encodeURIComponent(msg)}`;\n    showMsg('error','\u26a0 Email service temporarily unavailable. <a href=\"https:\/\/wa.me\/'+TO_WHATSAPP+'?text='+waText+'\" target=\"_blank\" style=\"color:#25d366;text-decoration:underline\">Click here to send via WhatsApp instead \u2192<\/a>');\n  } finally {\n    btn.disabled=false; btnTxt.textContent='Send Enquiry \u2192';\n  }\n});\n\nfunction showMsg(type,html){\n  const el=document.getElementById('tc-form-msg');\n  el.className='tc-form-msg '+type;\n  el.innerHTML=html; el.style.display='block';\n  el.scrollIntoView({behavior:'smooth',block:'nearest'});\n}\n<\/script>\n\n<!--\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  EMAILJS SETUP GUIDE (read before going live)\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n1. Go to https:\/\/www.emailjs.com and create a FREE account.\n2. Add an Email Service (Gmail recommended) \u2192 copy the Service ID.\n3. Create an Email Template with these variables:\n     {{from_name}}, {{from_email}}, {{from_phone}},\n     {{company}}, {{city}}, {{services}}, {{budget}}, {{message}}\n   Set To: info@techcoree.com\n   Set Reply-To: {{reply_to}}\n   Copy the Template ID.\n4. Go to Account \u2192 API Keys \u2192 copy your Public Key.\n5. Replace in this file:\n     'YOUR_PUBLIC_KEY'   \u2192 your EmailJS public key\n     'YOUR_SERVICE_ID'   \u2192 your service ID\n     'YOUR_TEMPLATE_ID'  \u2192 your template ID\n6. WHATSAPP: The form auto-opens WhatsApp as a fallback if email fails,\n   and the left panel links directly to your WhatsApp number.\n   For full WhatsApp API integration, use https:\/\/www.whatsapp.com\/business\/api\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n-->\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Contact \u2014 TechCore Engineering TechCore Engineering Let&#8217;s BuildSomething Great From initial structural consultation to project completion \u2014 our licensed engineers [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-112","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/pages\/112","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/techcoree.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=112"}],"version-history":[{"count":3,"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/pages\/112\/revisions"}],"predecessor-version":[{"id":200,"href":"https:\/\/techcoree.com\/index.php?rest_route=\/wp\/v2\/pages\/112\/revisions\/200"}],"wp:attachment":[{"href":"https:\/\/techcoree.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}