:root{
  --bg:#070f1a; --bg2:#0a1626; --teal:#1ad6c0; --teal2:#34e8d0; --teal-soft:#13a99a;
  --purple:#7c5cff; --pink:#ff5c9e;
  --ink:#eaf4f6; --muted:#8aa0b3; --card:#0e1d30; --card2:#10233a; --line:rgba(255,255,255,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',sans-serif;background:var(--bg);color:var(--ink);overflow-x:hidden}
h1,h2,h3,h4,h5,.head{font-family:'Sora',sans-serif}
a{text-decoration:none}
.grad-text{background:linear-gradient(100deg,var(--teal2),#6ad6ff 60%,var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.btn-teal{background:linear-gradient(100deg,var(--teal),var(--teal-soft));border:none;color:#04161a;font-weight:600;border-radius:50px;padding:.75rem 1.7rem;transition:.3s;box-shadow:0 8px 24px rgba(26,214,192,.25)}
.btn-teal:hover{transform:translateY(-3px);box-shadow:0 14px 36px rgba(26,214,192,.45);color:#04161a}
.btn-outline-teal{border:1px solid rgba(26,214,192,.5);color:var(--teal2);border-radius:50px;padding:.75rem 1.7rem;font-weight:600;transition:.3s;background:rgba(26,214,192,.05);backdrop-filter:blur(6px)}
.btn-outline-teal:hover{background:var(--teal);color:#04161a;border-color:var(--teal)}
.section{padding:100px 0;position:relative}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--teal2);font-weight:600;background:rgba(26,214,192,.08);padding:.45rem 1.1rem;border-radius:50px;border:1px solid rgba(26,214,192,.22)}
.navbar{background:rgba(7,15,26,.72);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);transition:.3s}
.navbar .nav-link{color:var(--ink)!important;font-weight:500;margin:0 .35rem;transition:.2s}
.navbar .nav-link:hover{color:var(--teal2)!important}
.brand-logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--teal),var(--purple));display:inline-flex;align-items:center;justify-content:center;color:#04161a;font-weight:800;font-family:'Sora';box-shadow:0 6px 18px rgba(26,214,192,.4)}
.hero{position:relative;padding:170px 0 120px;overflow:hidden;background:var(--bg)}
.hero .orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;z-index:0}
.orb1{width:520px;height:520px;background:radial-gradient(circle,rgba(26,214,192,.5),transparent 70%);top:-160px;right:-80px}
.orb2{width:440px;height:440px;background:radial-gradient(circle,rgba(124,92,255,.4),transparent 70%);bottom:-160px;left:-120px}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;opacity:.35;mask-image:radial-gradient(circle at 60% 40%,#000,transparent 78%)}
.hero .container{position:relative;z-index:2}
.hero h1{font-weight:800;font-size:clamp(2.4rem,5.2vw,4rem);line-height:1.08;letter-spacing:-1px}
.hero-visual{position:relative;border-radius:24px;background:linear-gradient(160deg,var(--card2),var(--card));border:1px solid var(--line);padding:1.4rem;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.hero-visual .bar{height:10px;border-radius:6px;background:rgba(255,255,255,.06);margin-bottom:.7rem}
.float-card{background:linear-gradient(150deg,rgba(26,214,192,.12),rgba(124,92,255,.06));border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem;backdrop-filter:blur(6px);transition:.35s}
.float-card:hover{transform:translateY(-4px);border-color:rgba(26,214,192,.4)}
.card-soft{background:linear-gradient(160deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:20px;transition:.35s;position:relative;overflow:hidden}
.card-soft::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--teal),transparent);opacity:0;transition:.35s}
.card-soft:hover{transform:translateY(-8px);border-color:rgba(26,214,192,.45);box-shadow:0 26px 60px rgba(0,0,0,.45)}
.card-soft:hover::after{opacity:1}
.badge-cat{font-size:.62rem;letter-spacing:1.8px;font-weight:700;color:var(--teal2);text-transform:uppercase;background:rgba(26,214,192,.1);padding:.25rem .6rem;border-radius:6px}
.prod-icon{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,rgba(26,214,192,.28),rgba(124,92,255,.12));display:flex;align-items:center;justify-content:center;font-size:1.55rem;color:var(--teal2);border:1px solid rgba(26,214,192,.25)}
.svc-icon{width:66px;height:66px;border-radius:18px;background:linear-gradient(135deg,var(--teal),var(--teal-soft));display:flex;align-items:center;justify-content:center;font-size:1.7rem;color:#04161a;margin-bottom:1.1rem;box-shadow:0 10px 26px rgba(26,214,192,.3)}
.muted{color:var(--muted)}
.divider-glow{height:1px;background:linear-gradient(90deg,transparent,var(--teal),transparent);opacity:.45}
.form-control,.form-select{background:#0a1828;border:1px solid var(--line);color:var(--ink);border-radius:12px;padding:.85rem 1rem}
.form-control:focus,.form-select:focus{background:#0a1828;color:var(--ink);border-color:var(--teal);box-shadow:0 0 0 .2rem rgba(26,214,192,.18)}
.form-control::placeholder{color:#5d7689}
.form-label{font-weight:500;font-size:.88rem;margin-bottom:.4rem;color:#cfe0e6}
.ticket-box{background:linear-gradient(135deg,rgba(26,214,192,.16),rgba(124,92,255,.06));border:1px dashed var(--teal);border-radius:16px;padding:1.5rem;text-align:center;display:none}
.ticket-id{font-family:'Sora';font-size:2rem;font-weight:800;color:var(--teal2);letter-spacing:3px}
.upload-zone{border:2px dashed var(--line);border-radius:14px;padding:1.7rem;text-align:center;cursor:pointer;transition:.3s;background:#0a1828}
.upload-zone:hover{border-color:var(--teal);background:#0c1d30}
.contact-pill{display:flex;align-items:center;gap:.85rem;background:linear-gradient(150deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;transition:.3s}
.contact-pill:hover{border-color:rgba(26,214,192,.4);transform:translateX(4px)}
.contact-ic{width:46px;height:46px;border-radius:12px;background:rgba(26,214,192,.14);color:var(--teal2);display:flex;align-items:center;justify-content:center;font-size:1.25rem}
.footer{background:#060c15;border-top:1px solid var(--line);padding:64px 0 26px}
.foot-link{color:var(--muted);display:block;padding:.28rem 0;transition:.2s}
.foot-link:hover{color:var(--teal2);transform:translateX(3px)}
.fab{position:fixed;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.6rem;box-shadow:0 10px 30px rgba(37,211,102,.5);z-index:1000;transition:.3s;animation:pulse 2.5s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
.fab:hover{transform:scale(1.1);color:#fff}
.stat-num{font-family:'Sora';font-weight:800;font-size:2.3rem;background:linear-gradient(100deg,var(--teal2),#6ad6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.testi{background:linear-gradient(160deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:20px;padding:1.7rem;height:100%;transition:.3s}
.testi:hover{border-color:rgba(26,214,192,.35);transform:translateY(-5px)}
.accordion-item{background:linear-gradient(160deg,var(--card2),var(--card));border:1px solid var(--line);margin-bottom:.8rem;border-radius:14px!important;overflow:hidden}
.accordion-button{background:transparent;color:var(--ink);font-weight:500;font-family:'Sora'}
.accordion-button:not(.collapsed){background:rgba(26,214,192,.1);color:var(--teal2);box-shadow:none}
.accordion-button:focus{box-shadow:none}
.accordion-button::after{filter:invert(.7)}
.accordion-body{color:var(--muted)}
.js .reveal{opacity:0;transform:translateY(34px);transition:.8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.show{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}
.tag-list li{padding:.45rem 0;color:var(--muted);display:flex;gap:.6rem;align-items:center}
.tag-list i{color:var(--teal2)}
.cta-band{background:linear-gradient(120deg,rgba(26,214,192,.14),rgba(124,92,255,.12));border:1px solid var(--line);border-radius:24px;padding:3rem;position:relative;overflow:hidden}
.section-head h2{font-weight:700;letter-spacing:-.5px}

/* Blog Card Styles */
.blog-card .card-img-top{width:100%;height:200px;object-fit:cover;border-radius:20px 20px 0 0}
.blog-card .badge-cat{position:absolute;top:14px;left:14px;z-index:2}
.blog-card .card-soft{padding:0!important}
.blog-card .card-body{padding:1.5rem}
.blog-card .blog-date{font-size:.78rem;color:var(--muted)}
.blog-hero{position:relative;padding:170px 0 100px;overflow:hidden;background:var(--bg);text-align:center}
.blog-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;opacity:.35;mask-image:radial-gradient(circle at 50% 50%,#000,transparent 78%)}
.blog-hero .container{position:relative;z-index:2}
.blog-hero .orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;z-index:0}
.search-box{position:relative}
.search-box input{padding-left:2.5rem}
.search-box i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--muted)}

@media(max-width:768px){.section{padding:64px 0}.hero{padding:130px 0 70px}.blog-hero{padding:130px 0 60px}}