/* Hero Visual */
.hero-visual{position:relative;display:flex;justify-content:center;align-items:center}
.hero-visual-card{width:100%;max-width:380px;border-radius:var(--radius-md);padding:16px;position:relative}
.hero-visual-card::before{content:'';position:absolute;inset:-1px;border-radius:var(--radius-lg);padding:1px;background:var(--gradient-primary);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0.3}
.code-block{font-family:'Fira Code',monospace;font-size:13px;line-height:1.8}
.code-line{display:flex;gap:16px}
.line-number{color:var(--primary);opacity:0.4;min-width:24px;text-align:right}
.line-content{color:var(--text)}
.code-keyword{color:var(--primary)}
.code-function{color:var(--secondary)}
.code-string{color:var(--accent)}
.code-comment{color:var(--text-muted);font-style:italic}
.floating-badge{position:absolute;padding:5px 10px;background:var(--dark-light);border:1px solid var(--dark-border);border-radius:var(--radius-sm);font-size:10px;font-weight:600;display:flex;align-items:center;gap:5px;animation:floatBadge 3s ease-in-out infinite;box-shadow:var(--shadow-soft);color:var(--text)}
.floating-badge i{font-size:11px;color:var(--primary)}
.floating-badge.badge-top{top:-20px;right:-20px;animation-delay:0s}
.floating-badge.badge-bottom{bottom:-20px;left:-20px;animation-delay:1.5s}
@keyframes floatBadge{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about-image{position:relative}
.about-image-wrapper{position:relative;border-radius:var(--radius-lg);overflow:hidden}
.about-image-wrapper::before{content:'';position:absolute;inset:0;background:var(--gradient-primary);opacity:0.05;z-index:1}
.about-image-placeholder{width:100%;aspect-ratio:4/3;background:var(--dark-light);display:flex;align-items:center;justify-content:center;font-size:80px;color:var(--primary);border-radius:var(--radius-lg);border:1px solid var(--dark-border)}
.about-exp-badge{position:absolute;bottom:-20px;right:-20px;padding:20px;background:var(--gradient-primary);border-radius:var(--radius-md);text-align:center;color:var(--white);box-shadow:var(--shadow-glow)}
.about-exp-badge .exp-number{font-family:var(--font-display);font-size:32px;font-weight:800;display:block}
.about-exp-badge .exp-text{font-size:12px;opacity:0.8}
.about-content .about-text{font-size:16px;color:var(--text-muted);line-height:1.8;margin-bottom:24px}
.about-features{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
.about-feature{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--dark-light);border:1px solid var(--dark-border);border-radius:var(--radius-sm);font-size:14px;font-weight:600;color:var(--text);box-shadow:var(--shadow-soft)}
.about-feature i{color:var(--primary);font-size:14px}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.service-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:var(--radius-lg);padding:32px;transition:var(--transition);position:relative;overflow:hidden;box-shadow:var(--shadow-soft)}
.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);transform:scaleX(0);transition:transform 0.4s ease;transform-origin:left}
.service-card:hover{transform:translateY(-8px);border-color:var(--primary);box-shadow:var(--shadow-glow)}
.service-card:hover::before{transform:scaleX(1)}
.service-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--dark-light);border-radius:var(--radius-md);font-size:24px;color:var(--primary);margin-bottom:20px}

/* About Page Specific Styles */
.quote-card {
    background: linear-gradient(145deg, rgba(30, 41, 59, 0.8), rgba(15, 23, 42, 0.9));
    border: 1px solid rgba(37, 99, 235, 0.1);
    border-radius: var(--radius-lg);
    padding: 40px;
    position: relative;
}

.quote-icon {
    font-size: 40px;
    color: var(--primary);
    opacity: 0.1;
    position: absolute;
    top: 20px;
    left: 20px;
}

.founder-info {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--dark-border);
}

.founder-name {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 5px;
}

.founder-role {
    font-size: 14px;
    color: var(--primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.about-text {
    position: relative;
    z-index: 1;
    font-size: 17px;
    line-height: 1.8;
    color: var(--text-muted);
}
.service-card:hover .service-icon{background:var(--primary);color:var(--white)}
.service-title{font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--text);margin-bottom:12px}
.service-description{font-size:14px;color:var(--text-muted);line-height:1.7;margin-bottom:20px}
.service-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--primary-light)}
.service-link i{font-size:12px;transition:transform 0.3s}
.service-card:hover .service-link i{transform:translateX(4px)}
