/* ==============================

POLARGRID TECHNOLOGIES

Version 1.0

============================== */

:root{

    --primary:#0057D9;

    --secondary:#00C2FF;

    --dark:#081B33;

    --light:#F7F9FC;

    --success:#00C853;

    --white:#ffffff;

}

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

body{

    font-family:'Inter',sans-serif;

    background:#ffffff;

    color:#222;

    overflow-x:hidden;

}

h1,h2,h3,h4,h5,h6{

    font-family:'Poppins',sans-serif;

}

section{

    padding:90px 0;

}

a{

    text-decoration:none;

}

.hero{

    position:relative;

    overflow:hidden;

    padding:120px 0;

    background-color:#F7FAFF;

    background-image:linear-gradient(135deg, rgba(247,250,255,.96), rgba(255,255,255,.97)), linear-gradient(rgba(0,87,217,.065) 1px, transparent 1px), linear-gradient(90deg, rgba(0,87,217,.065) 1px, transparent 1px);

    background-size:auto, 36px 36px, 36px 36px;

}

.hero-badge{

    display:inline-flex;

    gap:.45rem;

    align-items:center;

    padding:.55rem .9rem;

    margin-bottom:1.45rem;

    color:var(--primary);

    font-size:.75rem;

    font-weight:700;

    letter-spacing:.04em;

    text-transform:uppercase;

    background:#eaf2ff;

    border:1px solid rgba(0,87,217,.12);

    border-radius:999px;

}

.hero-badge span{color:#57a0ff;}

.hero-title{

    max-width:650px;

    margin-bottom:1.4rem;

    color:var(--dark);

    font-size:clamp(2.8rem, 5vw, 4.6rem);

    font-weight:800;

    line-height:1.08;

    letter-spacing:-.045em;

}

.hero-title span{display:block; color:var(--primary);}

.hero-description{

    max-width:590px;

    margin-bottom:2rem;

    color:#526276;

    font-size:1.08rem;

    line-height:1.75;

}

.hero-actions .btn{border-radius:8px; font-weight:600;}

.hero-stats{margin-top:3.5rem;}

.hero-stat-card{

    height:100%;

    min-height:92px;

    padding:1rem .8rem;

    background:rgba(255,255,255,.82);

    border:1px solid rgba(8,27,51,.08);

    border-radius:12px;

    box-shadow:0 8px 20px rgba(8,27,51,.04);

}

.hero-stat-card strong,.hero-stat-card span{display:block;}

.hero-stat-card strong{color:var(--dark); font-family:'Poppins',sans-serif; font-size:1rem; font-weight:700;}

.hero-stat-card span{margin-top:.2rem; color:#6a7889; font-size:.8rem;}

.hero-visual{

    padding:1rem;

    background:#fff;

    border:1px solid rgba(0,87,217,.1);

    border-radius:24px;

    box-shadow:0 24px 55px rgba(8,27,51,.15);

}

.hero-visual img{width:100%; border-radius:16px;}

.floating-animation{animation:hero-float 5s ease-in-out infinite;}

@keyframes hero-float{

    0%,100%{transform:translateY(0);}

    50%{transform:translateY(-12px);}

}

@media (prefers-reduced-motion:reduce){

    .floating-animation{animation:none;}

}

@media (max-width:991.98px){

    .hero{padding:85px 0;}

    .hero-visual{max-width:620px; margin:0 auto;}

}

.contact-hero{

    background:linear-gradient(135deg, var(--dark), #0057D9);

    padding:100px 0 90px;

}

.contact-hero .lead{

    max-width:720px;

    color:rgba(255,255,255,.82);

}

.contact-card{

    border-radius:16px;

}

.contact-icon{

    display:grid;

    place-items:center;

    flex:0 0 44px;

    height:44px;

    color:var(--primary);

    background:#eaf2ff;

    border-radius:12px;

}

.form-control, .form-select{

    padding:.7rem .85rem;

}

.contact-section{

    padding:100px 0;

    background:var(--light);

}

.contact-details-card{

    padding:1.6rem;

    background:#fff;

    border:1px solid rgba(8,27,51,.08);

    border-radius:16px;

    box-shadow:0 12px 28px rgba(8,27,51,.06);

}

.contact-details-card .contact-detail{

    padding-bottom:1.25rem;

    margin-bottom:1.25rem;

    border-bottom:1px solid rgba(8,27,51,.08);

}

.contact-details-card .contact-detail:last-child{

    padding-bottom:0;

    border-bottom:0;

}

.contact-whatsapp{

    padding-bottom:1.25rem;

    margin-bottom:1.25rem;

    border-bottom:1px solid rgba(8,27,51,.08);

}

.contact-whatsapp .btn{

    border-color:var(--primary);

    font-weight:600;

}

.contact-whatsapp .btn:hover{

    color:#fff;

    background:var(--primary);

}

.contact-map-card{

    padding:1.25rem;

    background:#fff;

    border:1px solid rgba(8,27,51,.08);

    border-radius:16px;

    box-shadow:0 12px 28px rgba(8,27,51,.06);

}

.contact-map-card .ratio{

    overflow:hidden;

    border-radius:10px;

}

.contact-capabilities .capability-card{

    display:flex;

    align-items:center;

    gap:.7rem;

    height:100%;

    padding:.9rem 1rem;

    color:var(--dark);

    font-size:.86rem;

    font-weight:600;

    background:#fff;

    border:1px solid rgba(0,87,217,.1);

    border-radius:12px;

    box-shadow:0 8px 20px rgba(8,27,51,.04);

    transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;

}

.contact-capabilities .capability-card i{

    color:var(--primary);

}

.contact-capabilities .capability-card:hover{

    border-color:rgba(0,87,217,.28);

    box-shadow:0 14px 26px rgba(8,27,51,.1);

    transform:translateY(-4px);

}

.contact-card{

    border-radius:18px;

    box-shadow:0 16px 36px rgba(8,27,51,.1) !important;

}

.contact-card .form-control,
.contact-card .form-select{

    border-color:rgba(8,27,51,.16);

}

.contact-card .form-control:focus,
.contact-card .form-select:focus{

    border-color:var(--primary);

    box-shadow:0 0 0 .2rem rgba(0,87,217,.12);

}

.contact-submit{

    min-width:200px;

    border-radius:8px;

    font-weight:600;

}

@media (max-width:767.98px){

    .contact-hero{

        padding:75px 0 70px;

    }

    .contact-section{

        padding:70px 0;

    }

    .contact-card .card-body{

        padding:1.5rem !important;

    }

}

.why-choose{

    padding:105px 0;

    background:#fff;

}

.section-eyebrow{

    margin-bottom:.55rem;

    color:var(--primary);

    font-size:.78rem;

    font-weight:700;

    letter-spacing:.1em;

    text-transform:uppercase;

}

.why-card{

    padding:2rem 1.6rem;

    background:#fff;

    border:1px solid rgba(8,27,51,.08);

    border-radius:18px;

    box-shadow:0 12px 30px rgba(8,27,51,.06);

    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;

}

.why-card:hover{

    transform:translateY(-8px);

    border-color:rgba(0,87,217,.25);

    box-shadow:0 20px 38px rgba(8,27,51,.13);

}

.why-icon{

    display:grid;

    place-items:center;

    width:52px;

    height:52px;

    margin-bottom:1.45rem;

    color:var(--primary);

    font-size:1.35rem;

    background:linear-gradient(135deg, #eaf2ff, #f5fbff);

    border-radius:14px;

    transition:transform .28s ease, background .28s ease, color .28s ease;

}

.why-card:hover .why-icon{

    color:#fff;

    background:var(--primary);

    transform:rotate(-6deg) scale(1.08);

}

.why-card p{

    color:#657488;

    font-size:.94rem;

    line-height:1.7;

}

.industries-section{

    padding:105px 0;

    background:var(--light);

}

.industry-card{

    padding:1.8rem 1.5rem;

    background:#fff;

    border:1px solid rgba(8,27,51,.07);

    border-radius:18px;

    box-shadow:0 10px 26px rgba(8,27,51,.055);

    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;

}

.industry-card:hover{

    transform:translateY(-7px);

    border-color:rgba(0,87,217,.25);

    box-shadow:0 19px 36px rgba(8,27,51,.13);

}

.industry-icon{

    display:grid;

    place-items:center;

    width:50px;

    height:50px;

    margin-bottom:1.35rem;

    color:var(--primary);

    font-size:1.45rem;

    background:#eaf2ff;

    border-radius:14px;

    transition:transform .28s ease, background .28s ease, color .28s ease;

}

.industry-card:hover .industry-icon{

    color:#fff;

    background:var(--primary);

    transform:scale(1.08);

}

.industry-card p{

    color:#657488;

    font-size:.92rem;

    line-height:1.6;

}

.industries-showcase{

    max-width:980px;

    padding:1rem;

    margin:0 auto 3rem;

    background:#fff;

    border:1px solid rgba(0,87,217,.1);

    border-radius:20px;

    box-shadow:0 16px 36px rgba(8,27,51,.09);

}

.industries-showcase img{

    display:block;

    width:100%;

    border-radius:13px;

}

.industries-visual{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:1.25rem;
    padding:2rem 1rem;
}

.ecosystem-visual{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:1rem;
}

.ecosystem-visual-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:.6rem;
    min-height:140px;
    padding:1.25rem 1rem;
    text-align:center;
    background:linear-gradient(135deg,#eaf2ff,#f5fbff);
    border-radius:16px;
}

.ecosystem-visual-item i{
    color:var(--primary);
    font-size:2.1rem;
}

.ecosystem-visual-item span{
    color:var(--dark);
    font-family:'Poppins',sans-serif;
    font-size:.85rem;
    font-weight:600;
}

.products-section{

    padding:90px 0;

}

.product-card{

    overflow:hidden;

    background:#fff;

    border:1px solid rgba(8,27,51,.08);

    border-radius:18px;

    box-shadow:0 12px 28px rgba(8,27,51,.07);

    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;

}

.product-card:hover{

    border-color:rgba(0,87,217,.25);

    box-shadow:0 20px 38px rgba(8,27,51,.13);

    transform:translateY(-7px);

}

.product-image{

    display:flex;

    align-items:center;

    justify-content:center;

    height:220px;

    padding:1.25rem;

    background:#f4f9ff;

}

.product-image img{

    width:100%;

    height:100%;

    object-fit:contain;

}

.product-card-body{

    padding:1.5rem;

}

.product-card-body p{

    color:#657488;

    font-size:.94rem;

    line-height:1.65;

}

.technology-stack{

    padding:105px 0;

    background:#f4f9ff;

}

.technology-card{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    min-height:150px;

    padding:1.25rem .75rem;

    text-align:center;

    background:rgba(255,255,255,.86);

    border:1px solid rgba(0,87,217,.1);

    border-radius:16px;

    box-shadow:0 8px 22px rgba(8,27,51,.045);

    transition:transform .28s ease, color .28s ease, background .28s ease, box-shadow .28s ease;

}

.technology-card:hover{

    color:#fff;

    background:var(--primary);

    box-shadow:0 18px 32px rgba(0,87,217,.24);

    transform:translateY(-7px);

}

.technology-card i{

    margin-bottom:.75rem;

    color:var(--primary);

    font-size:2rem;

    line-height:1;

    transition:transform .28s ease, color .28s ease;

}

.technology-card:hover i{

    color:#fff;

    transform:scale(1.12);

}

.technology-card span{

    color:var(--dark);

    font-family:'Poppins',sans-serif;

    font-size:.88rem;

    font-weight:600;

    transition:color .28s ease;

}

.technology-card:hover span{color:#fff;}

.workflow-section{

    padding:105px 0;

    background:#fff;

}

.workflow-steps{

    position:relative;

}

.workflow-step{

    position:relative;

    padding:1.7rem 1rem;

    text-align:center;

    background:#fff;

    border:1px solid rgba(0,87,217,.1);

    border-radius:18px;

    box-shadow:0 9px 24px rgba(8,27,51,.055);

    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;

}

.workflow-step:hover{

    border-color:rgba(0,87,217,.28);

    box-shadow:0 18px 34px rgba(8,27,51,.12);

    transform:translateY(-7px);

}

.workflow-icon{

    display:grid;

    place-items:center;

    width:52px;

    height:52px;

    margin:0 auto 1.15rem;

    color:#fff;

    font-size:1.3rem;

    background:var(--primary);

    border-radius:50%;

    box-shadow:0 8px 16px rgba(0,87,217,.22);

    transition:transform .28s ease, background .28s ease;

}

.workflow-step:hover .workflow-icon{

    background:var(--dark);

    transform:scale(1.08);

}

.workflow-step p{

    color:#68778a;

    font-size:.82rem;

    line-height:1.55;

}

@media (min-width:992px){

    .workflow-step:not(.workflow-final)::after{

        position:absolute;

        z-index:2;

        top:50%;

        right:-1.4rem;

        color:#76a9f9;

        content:'→';

        font-size:1.45rem;

        font-weight:600;

        line-height:1;

        transform:translateY(-50%);

    }

}

.solutions-section{

    padding:105px 0;

    background:var(--light);

}

.solution-card{

    display:flex;

    flex-direction:column;

    padding:2rem;

    background:#fff;

    border:1px solid rgba(8,27,51,.08);

    border-radius:18px;

    box-shadow:0 12px 30px rgba(8,27,51,.06);

    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;

}

.solution-card:hover{

    border-color:rgba(0,87,217,.3);

    box-shadow:0 22px 40px rgba(8,27,51,.13);

    transform:translateY(-8px);

}

.solution-icon{

    display:grid;

    place-items:center;

    width:52px;

    height:52px;

    margin-bottom:1.4rem;

    color:var(--primary);

    font-size:1.45rem;

    background:#eaf2ff;

    border-radius:14px;

    transition:color .28s ease, background .28s ease, transform .28s ease;

}

.solution-card:hover .solution-icon{

    color:#fff;

    background:var(--primary);

    transform:scale(1.08);

}

.solution-card > p{

    color:#657488;

    font-size:.94rem;

    line-height:1.65;

}

.solution-features{

    padding:0;

    margin:1rem 0 1.5rem;

    list-style:none;

}

.solution-features li{

    margin-bottom:.55rem;

    color:#526276;

    font-size:.88rem;

}

.solution-features li::before{

    margin-right:.55rem;

    color:var(--success);

    content:'✓';

    font-weight:700;

}

.solution-link{

    margin-top:auto;

    color:var(--primary);

    font-size:.9rem;

    font-weight:700;

}

.solution-link span{

    display:inline-block;

    transition:transform .25s ease;

}

.solution-card:hover .solution-link span{transform:translateX(5px);}

/* ==============================
PRODUCT PAGES (MILESTONE 2)
============================== */

.product-hero-visual{position:relative;}

.product-hero-visual .hero-fallback-icon{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--primary);
    font-size:4.5rem;
    background:linear-gradient(135deg,#eaf2ff,#f5fbff);
    border-radius:16px;
}

.product-hero-visual img{
    position:relative;
    z-index:1;
    width:100%;
    min-height:320px;
    object-fit:contain;
    border-radius:16px;
}

.accordion-item{border-color:rgba(8,27,51,.08);}

.accordion-button{font-weight:600; color:var(--dark);}

.accordion-button:not(.collapsed){
    color:var(--primary);
    background:#eaf2ff;
    box-shadow:none;
}

.accordion-button:focus{box-shadow:0 0 0 .2rem rgba(0,87,217,.12);}

/* ==============================
LEGAL PAGES (PRIVACY & TERMS)
============================== */

.legal-meta{
    color:#657488;
    font-size:.9rem;
}

.legal-content{
    font-size:1rem;
    line-height:1.85;
    color:#455266;
}

.legal-content h2{
    margin-top:2.75rem;
    margin-bottom:1rem;
    color:var(--dark);
    font-size:1.4rem;
    font-weight:700;
    scroll-margin-top:100px;
}

.legal-content h2:first-of-type{margin-top:0;}

.legal-content p,
.legal-content ul{margin-bottom:1rem;}

.legal-content ul{padding-left:1.25rem;}

.legal-content li{margin-bottom:.4rem;}

.legal-toc{
    position:sticky;
    top:100px;
}

.legal-toc .nav-link{
    padding:.4rem .75rem;
    color:#526276;
    font-size:.88rem;
    border-radius:8px;
}

.legal-toc .nav-link:hover,
.legal-toc .nav-link.active{
    color:var(--primary);
    background:#eaf2ff;
}
