/* Homepage conversion refresh — scoped to index.php sections. */
.hero-3d {
    min-height: 94vh;
    display: grid;
    align-items: center;
    background: #070b12;
}

.hero-3d::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(227, 6, 19, .8), transparent);
}

.hero-3d .hero-content {
    width: min(1240px, calc(100% - 48px));
    margin-inline: auto;
    gap: clamp(2rem, 7vw, 7rem);
    grid-template-columns: minmax(0, 1.18fr) minmax(320px, .82fr);
}

.hero-3d .hero-text { max-width: 790px; }

.hero-3d .hero-subtitle {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    padding: .55rem .8rem;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 999px;
    background: rgba(255,255,255,.045);
    color: #d7e0eb;
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.hero-live-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #36d399;
    box-shadow: 0 0 0 5px rgba(54,211,153,.12);
}

.hero-3d .hero-title {
    max-width: 830px;
    margin: 1.25rem 0 1.35rem;
    font-size: clamp(3.25rem, 5.35vw, 5rem);
    line-height: .96;
    letter-spacing: -.065em;
    color: #f7faf9;
    background: none;
    -webkit-text-fill-color: #f7faf9;
}

.hero-3d .gradient-text {
    display: block;
    color: #f04a52;
    background: none;
    -webkit-text-fill-color: currentColor;
}

.hero-3d .hero-description {
    max-width: 680px;
    color: #b4becb;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.7;
}

.hero-3d .hero-buttons { margin-top: 1.8rem; }
.hero-3d .btn-modern { border-radius: 12px; }

.hero-assurances {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem 1.25rem;
    margin-top: 1.4rem;
    color: #8f9bab;
    font-size: .8rem;
}

.hero-assurances i { margin-right: .35rem; color: #36d399; }

.hero-3d .hero-mascot {
    position: relative;
    padding: 1.5rem;
}

.hero-3d .hero-mascot::before {
    content: "";
    position: absolute;
    inset: 7%;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 50%;
    box-shadow: 0 0 0 45px rgba(255,255,255,.018), 0 0 0 90px rgba(227,6,19,.025);
}

.confidence-strip { position: relative; z-index: 2; padding: 0; background: #0d131d; border-bottom: 1px solid rgba(255,255,255,.08); }
.confidence-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.confidence-grid > div { min-height: 112px; display: flex; flex-direction: column; justify-content: center; padding: 1.4rem 1.6rem; border-right: 1px solid rgba(255,255,255,.08); }
.confidence-grid > div:last-child { border-right: 0; }
.confidence-grid strong { color: #fff; font-size: .95rem; }
.confidence-grid span { margin-top: .25rem; color: #8793a3; font-size: .76rem; line-height: 1.5; }

.outcome-section { position: relative; padding: clamp(5rem,9vw,9rem) 0; background: #f3f1ec; color: #111827; }
.outcome-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(3rem,7vw,7rem); align-items: start; }
.eyebrow { color: #c51520; font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.outcome-copy h2 { margin: 1rem 0 1.25rem; color: #111827; font-size: clamp(2.3rem,4vw,4.25rem); line-height: 1; letter-spacing: -.05em; }
.outcome-copy p { max-width: 570px; color: #5b6470; font-size: 1.04rem; line-height: 1.75; }
.outcome-section .outcome-copy,
.outcome-section .fade-in { opacity: 1 !important; transform: none !important; }
.outcome-section .outcome-copy h2 { color: #111820 !important; -webkit-text-fill-color: #111820 !important; }
.outcome-section .outcome-copy p { color: #59636e !important; }
.outcome-cards { border-top: 1px solid #cfd1cd; }
.outcome-cards article { display: grid; grid-template-columns: 54px 1fr; column-gap: 1rem; padding: 1.55rem 0; border-bottom: 1px solid #cfd1cd; }
.outcome-cards article > span { grid-row: 1 / 3; color: #c51520; font: 700 .76rem/1 'JetBrains Mono', monospace; }
.outcome-cards h3 { margin: 0 0 .35rem; color: #17202c; font-size: 1.22rem; }
.outcome-cards p { margin: 0; color: #646d78; line-height: 1.6; }

/* Homepage section contrast and readability */
.products-section { background: #ebe7de !important; }
.products-section .section-title,
.products-section .product-title { color: #111820 !important; -webkit-text-fill-color: #111820 !important; }
.products-section .section-description,
.products-section .product-description { color: #59636e !important; }
.products-section .products-grid { align-items: stretch; }
.products-section .product-card { height: 100%; background: #fff !important; border: 1px solid rgba(17,24,32,.13) !important; }
.products-section .product-status { color: #a90f16 !important; background: rgba(215,25,32,.07) !important; }
.products-section .product-detail-link { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1rem; color: #a90f16; font-size: .82rem; font-weight: 750; text-decoration: none; }
.products-section .product-detail-link:hover { gap: .7rem; }

.development-cycle-section { background: #111820 !important; }
.development-cycle-section .section-title { max-width: 900px; margin-inline: auto; color: #fff !important; -webkit-text-fill-color: #fff !important; }
.development-cycle-section .section-description { color: #b5bec7 !important; }
.development-cycle-section .cycle-steps { gap: 1rem; }
.development-cycle-section .cycle-steps { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); }
.development-cycle-section .cycle-step { width: auto !important; min-width: 0; margin: 0 !important; display: grid !important; grid-template-columns: 64px minmax(0,1fr); align-items: start; gap: 1rem; padding: 1.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: #18222b !important; transform: none !important; }
.development-cycle-section .step-content { width: auto !important; min-width: 0; }
.development-cycle-section .step-number { color: #ef5057 !important; background: transparent !important; }
.development-cycle-section .step-title { color: #fff !important; -webkit-text-fill-color: #fff !important; }
.development-cycle-section .step-description { color: #aeb8c2 !important; }

.portfolio-section { background: #f5f2eb !important; }
.portfolio-section .section-title,
.portfolio-section .portfolio-content h3 { color: #111820 !important; -webkit-text-fill-color: #111820 !important; }
.portfolio-section .section-description,
.portfolio-section .portfolio-content p { color: #59636e !important; }
.portfolio-section .portfolio-item-advanced { background: #fff !important; border: 1px solid rgba(17,24,32,.13) !important; }
.portfolio-section .portfolio-stats { display: none; }
.portfolio-section .portfolio-category { color: #b41118 !important; }
.portfolio-section .portfolio-filter { display: none; }
.portfolio-section .portfolio-item-advanced:nth-child(n+4) { display: none !important; }
.portfolio-section .portfolio-more { margin-top: 2rem; text-align: center; }

.about-section { background: #111820 !important; }
.about-section .section-title { color: #fff !important; -webkit-text-fill-color: #fff !important; }
.about-section .about-description { color: #b5bec7 !important; }
.about-section .feature-item { color: #eef2f4 !important; }
.about-section .feature-item i { color: #35c99b !important; }
.about-section .about-stats { border-color: rgba(255,255,255,.1) !important; }
.about-section .about-content { display: grid !important; grid-template-columns: minmax(0,1fr) 260px; gap: 2.5rem; align-items: center; }
.about-section .about-text { min-width: 0; }
.about-section .about-mascot { width: auto !important; }
.about-section .about-stats { grid-column: 1 / -1; width: 100% !important; display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; }
.about-section .stat-item { width: auto !important; min-height: 145px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(255,255,255,.055) !important; border: 1px solid rgba(255,255,255,.1) !important; }
.about-section .stat-number { color: #ef5057 !important; -webkit-text-fill-color: #ef5057 !important; }
.about-section .stat-label { color: #b5bec7 !important; }
.about-section .tech-item { color: #dce2e7 !important; background: rgba(255,255,255,.055) !important; border-color: rgba(255,255,255,.1) !important; }

.contact-section { margin-top: 0 !important; padding: clamp(4.5rem,8vw,7rem) 0 !important; background: #ebe7de !important; }
.contact-shell { display: grid; grid-template-columns: minmax(0,.92fr) minmax(460px,1.08fr); overflow: hidden; border-radius: 28px; background: #111820; box-shadow: 0 30px 80px rgba(17,24,32,.16); }
.contact-intro { padding: clamp(2rem,4.5vw,4.5rem); color: #fff; background: radial-gradient(circle at 10% 10%,rgba(215,25,32,.24),transparent 42%),#111820; }
.contact-eyebrow,.contact-form-heading>span { display: inline-block; margin-bottom: 1rem; color: #ef5057; font-size: .76rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.contact-intro h2 { max-width: 650px; margin: 0 0 1.25rem; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: clamp(2.3rem,4vw,4.15rem); line-height: 1.04; letter-spacing: -.045em; }
.contact-intro>p { max-width: 600px; margin: 0; color: #b9c2ca !important; font-size: 1.04rem; line-height: 1.75; }
.contact-promises { display: grid; gap: .75rem; margin: 2rem 0 2.5rem; color: #eef2f4; font-size: .93rem; }
.contact-promises span { display: flex; align-items: center; gap: .7rem; }
.contact-promises i { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #111820; background: #58d3aa; font-size: .65rem; }
.contact-section .contact-info { gap: .7rem; }
.contact-section .contact-item { padding: .8rem 0 !important; gap: .85rem; color: inherit; text-decoration: none; background: transparent !important; border: 0 !important; border-radius: 0 !important; backdrop-filter: none; }
.contact-section a.contact-item:hover { transform: translateX(5px); box-shadow: none; }
.contact-section .contact-icon { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; color: #fff !important; background: rgba(255,255,255,.07) !important; }
.contact-section .contact-icon i { margin: 0; color: #ef5057 !important; font-size: 1rem; }
.contact-section .contact-details h4 { margin: 0 0 .18rem; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: .9rem; }
.contact-section .contact-details p { color: #aeb8c2 !important; font-size: .88rem; }
.contact-section .contact-form { padding: clamp(2rem,4vw,4rem); border: 0 !important; border-radius: 0; background: #fff !important; box-shadow: none; }
.contact-form-heading { margin-bottom: 1.75rem; }
.contact-form-heading>span { margin-bottom: .7rem; color: #b41118; }
.contact-form-heading h3 { margin: 0 0 .6rem; color: #111820; font-size: clamp(1.65rem,2.5vw,2.25rem); line-height: 1.15; letter-spacing: -.025em; }
.contact-form-heading p { margin: 0; color: #68727c; line-height: 1.6; }
.contact-section .modern-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.contact-section .modern-form .form-group { margin: 0; }
.contact-section .modern-form .form-group:nth-last-of-type(2),
.contact-section .modern-form .form-group:nth-last-of-type(1),
.contact-section .modern-form button { grid-column: 1 / -1; }
.contact-section .modern-form label { display: block; margin: 0 0 .45rem; color: #28313a; font-size: .78rem; font-weight: 750; letter-spacing: .02em; }
.contact-section .modern-form label span { color: #8b949d; font-weight: 500; }
.contact-section .modern-form input,
.contact-section .modern-form textarea,
.contact-section .modern-form select { width: 100%; padding: .9rem 1rem; border: 1px solid #d8dcd9 !important; border-radius: 10px; outline: none; background: #f8f7f3 !important; color: #111820 !important; transition: border-color .2s,box-shadow .2s; }
.contact-section .modern-form input:focus,
.contact-section .modern-form textarea:focus,
.contact-section .modern-form select:focus { border-color: #d71920 !important; box-shadow: 0 0 0 3px rgba(215,25,32,.1); }
.contact-section .modern-form input::placeholder,
.contact-section .modern-form textarea::placeholder { color: #7b858e !important; opacity: 1; }
.contact-section .modern-form textarea { resize: vertical; min-height: 112px; }
.contact-section .modern-form .btn-modern { display: flex; justify-content: center; align-items: center; gap: .7rem; min-height: 52px; margin-top: .3rem; border-radius: 10px; background: #d71920; box-shadow: 0 12px 28px rgba(215,25,32,.2); }

/* Old animation rules could wash these sections out after programmatic navigation. */
.products-section .fade-in,
.development-cycle-section .fade-in,
.portfolio-section .fade-in,
.about-section .fade-in,
.contact-section .fade-in { opacity: 1 !important; transform: none !important; }

@media (max-width: 900px) {
    .hero-3d { min-height: auto; padding: 9rem 0 5rem; }
    .hero-3d .hero-content { width: min(100% - 32px, 680px); display: block; }
    .hero-3d .hero-mascot { display: none; }
    .confidence-grid { grid-template-columns: repeat(2,1fr); }
    .confidence-grid > div:nth-child(2) { border-right: 0; }
    .confidence-grid > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.08); }
    .outcome-layout { grid-template-columns: 1fr; }
    .about-section .about-content { grid-template-columns: 1fr; }
    .about-section .about-mascot { display: none; }
    .about-section .about-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .contact-shell { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .hero-3d { padding-top: 7.5rem; }
    .hero-3d .hero-content { width: calc(100% - 28px); }
    .hero-3d .hero-title { font-size: clamp(2.8rem,14vw,4rem); }
    .hero-assurances { display: grid; }
    .confidence-grid { grid-template-columns: 1fr; }
    .confidence-grid > div { min-height: 92px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
    .outcome-section { padding: 4.5rem 0; }
    .contact-section .container { width: calc(100% - 24px); }
    .contact-shell { border-radius: 20px; }
    .contact-intro,.contact-section .contact-form { padding: 2rem 1.25rem; }
    .contact-intro h2 { font-size: 2.35rem; }
    .contact-section .modern-form { grid-template-columns: 1fr; }
    .contact-section .modern-form .form-group,
    .contact-section .modern-form button { grid-column: 1; }
    .development-cycle-section .cycle-steps { grid-template-columns: 1fr; }
    .development-cycle-section .cycle-step { grid-template-columns: 48px minmax(0,1fr); padding: 1.2rem; }
    .about-section .about-stats { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-live-dot { box-shadow: none; }
}