/* ============================================================
   YAANSH SOFTECH — Global Stylesheet v2 (modern)
   ============================================================ */

:root{
    --navy:#0a2743;
    --navy-2:#0f3156;
    --blue:#06325b;
    --blue-2:#0d4a80;
    --sky:#3b82c4;
    --orange:#fd6f0c;
    --orange-dark:#e05e00;
    --ink:#1c2836;
    --muted:#5a6b7d;
    --surface:#f4f8fc;
    --line:#e3eaf2;
    --radius:18px;
    --shadow-sm:0 4px 14px rgba(10,39,67,.06);
    --shadow-lg:0 22px 50px rgba(10,39,67,.13);
}

*{ -webkit-font-smoothing:antialiased; }
html{ scroll-behavior:smooth; }

body{
    font-family:'Inter',system-ui,-apple-system,Arial,sans-serif;
    color:var(--ink);
    line-height:1.75;
    font-size:1rem;
    overflow-x:hidden;
}

h1,h2,h3,h4,h5,h6,.navbar-brand{
    font-family:'Plus Jakarta Sans',Arial,sans-serif;
    font-weight:700;
    color:var(--navy);
    line-height:1.25;
}

a{ text-decoration:none; transition:color .2s; }
img,iframe{ max-width:100%; }

/* Skip link (a11y + SEO) */
.skip-link{
    position:absolute; left:-9999px; top:0;
    background:var(--orange); color:#fff;
    padding:10px 18px; z-index:2000; border-radius:0 0 10px 0;
}
.skip-link:focus{ left:0; color:#fff; }

/* ---------- Top bar ---------- */
.topbar{
    background:var(--navy-2);
    color:#c9cbe9;
    font-size:.84rem;
    padding:7px 0;
}
.topbar a{ color:#c9cbe9; }
.topbar a:hover,.topbar a:focus{ color:var(--orange); }
.topbar i{ color:var(--orange); margin-right:6px; }

/* ---------- Navbar ---------- */
.navbar{
    background:rgba(10,39,67,.97);
    backdrop-filter:blur(10px);
    padding:14px 0;
    transition:box-shadow .25s, padding .25s;
}
.navbar.scrolled{
    box-shadow:0 10px 30px rgba(10,39,67,.35);
    padding:9px 0;
}
.navbar-brand{
    color:#fff !important;
    font-size:1.22rem;
    letter-spacing:.05em;
}
.navbar-brand span{ color:var(--orange); }
.navbar .nav-link{
    color:#dbe8f4 !important;
    font-weight:500;
    font-size:.93rem;
    padding:.55rem .8rem !important;
    border-radius:8px;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link.active{
    color:#fff !important;
    background:rgba(255,255,255,.08);
}
.navbar .nav-link.active{ color:var(--orange) !important; }

.dropdown-menu{
    --bs-dropdown-link-active-bg:var(--surface);
    --bs-dropdown-link-active-color:var(--blue);
    border:1px solid var(--line);
    border-top:3px solid var(--orange);
    border-radius:0 0 14px 14px;
    box-shadow:var(--shadow-lg);
    padding:8px;
    min-width:250px;
}
.dropdown-item{
    padding:9px 16px;
    font-size:.91rem;
    color:var(--ink);
    border-radius:9px;
}
.dropdown-item:hover,.dropdown-item:focus{
    background:var(--surface);
    color:var(--blue);
}
@media (min-width:992px){
    .navbar .dropdown:hover > .dropdown-menu{ display:block; margin-top:0; }
    .navbar .dropdown > .dropdown-toggle:active{ pointer-events:none; }
}

.btn-nav-cta{
    background:linear-gradient(135deg,var(--orange),#ff8c3a);
    color:#1a1633 !important;
    font-weight:700;
    border-radius:10px;
    padding:9px 20px !important;
    box-shadow:0 6px 18px rgba(253,111,12,.35);
}
.btn-nav-cta:hover,.btn-nav-cta:focus{
    background:linear-gradient(135deg,var(--orange-dark),var(--orange));
    color:#1a1633 !important;
    transform:translateY(-1px);
}

/* ---------- Buttons ---------- */
.btn{ transition:.22s; }
.btn-accent{
    background:linear-gradient(135deg,var(--orange),#ff8c3a);
    color:#1a1633;
    font-weight:700;
    padding:13px 32px;
    border-radius:12px;
    border:none;
    box-shadow:0 8px 22px rgba(253,111,12,.35);
}
.btn-accent:hover,.btn-accent:focus{
    background:linear-gradient(135deg,var(--orange-dark),var(--orange));
    color:#1a1633;
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(253,111,12,.45);
}
.btn-ghost{
    border:2px solid rgba(255,255,255,.55);
    color:#fff;
    font-weight:600;
    padding:12px 30px;
    border-radius:12px;
    background:transparent;
}
.btn-ghost:hover,.btn-ghost:focus{ background:#fff; color:var(--navy); border-color:#fff; }
.btn-outline-primary{
    border:2px solid var(--blue);
    color:var(--blue);
    font-weight:600;
    border-radius:12px;
    padding:11px 26px;
}
.btn-outline-primary:hover{ background:var(--blue); border-color:var(--blue); }

/* ---------- Hero (home) ---------- */
.hero{
    background:
        radial-gradient(900px 480px at 88% 0%, rgba(59,130,196,.22), transparent 62%),
        radial-gradient(700px 420px at 5% 100%, rgba(253,111,12,.14), transparent 60%),
        linear-gradient(140deg, var(--navy) 0%, #0d4a80 55%, var(--blue) 100%);
    color:#fff;
    padding:112px 0 96px;
    position:relative;
    overflow:hidden;
}
.hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size:46px 46px;
    mask-image:radial-gradient(circle at 70% 30%, black 0%, transparent 75%);
    -webkit-mask-image:radial-gradient(circle at 70% 30%, black 0%, transparent 75%);
    pointer-events:none;
}
.hero .container{ position:relative; z-index:1; }
.hero h1{
    color:#fff;
    font-size:clamp(2.15rem,4.6vw,3.45rem);
    font-weight:800;
    letter-spacing:-.02em;
}
.hero h1 .accent{
    background:linear-gradient(90deg,var(--orange),#ffa35c);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.hero .lead{ color:#c3d5e7; max-width:560px; font-size:1.08rem; }
.hero-eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.18);
    color:#ffc79b;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.12em;
    text-transform:uppercase;
    padding:7px 18px;
    border-radius:50px;
    margin-bottom:24px;
}
.hero-eyebrow::before{
    content:""; width:8px; height:8px; border-radius:50%;
    background:var(--orange);
    box-shadow:0 0 0 4px rgba(253,111,12,.25);
}
.hero-stats{
    display:flex; gap:40px; flex-wrap:wrap;
    margin-top:46px;
    border-top:1px solid rgba(255,255,255,.14);
    padding-top:30px;
}
.hero-stats h3{ color:var(--orange); margin:0; font-size:1.75rem; font-weight:800; }
.hero-stats small{ color:#9db6cf; }

.hero-panel{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.14);
    border-radius:22px;
    padding:24px;
    backdrop-filter:blur(8px);
    box-shadow:0 30px 70px rgba(0,0,0,.35);
}
.hero-panel .bar{
    height:10px; border-radius:6px;
    background:rgba(255,255,255,.15);
    margin-bottom:12px;
}
.hero-panel .bar.orange{ background:linear-gradient(90deg,var(--orange),#ffa35c); width:55%; }
.hero-panel .tile{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.10);
    border-radius:14px;
    padding:15px;
    color:#dbe8f4;
    font-size:.8rem;
    transition:.25s;
}
.hero-panel .tile:hover{ background:rgba(255,255,255,.14); transform:translateY(-3px); }
.hero-panel .tile b{ display:block; color:#fff; font-size:1.02rem; margin-bottom:2px; }
.hero-panel .tile i{ color:var(--orange); margin-right:6px; }

/* ---------- Page hero (inner pages) ---------- */
.page-hero{
    background:
        radial-gradient(700px 380px at 90% 0%, rgba(59,130,196,.2), transparent 60%),
        linear-gradient(140deg, var(--navy) 0%, var(--blue) 100%);
    color:#fff;
    padding:72px 0 62px;
    position:relative;
    overflow:hidden;
}
.page-hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size:46px 46px;
    pointer-events:none;
}
.page-hero .container{ position:relative; z-index:1; }
.page-hero h1{ color:#fff; font-size:clamp(1.85rem,3.4vw,2.55rem); font-weight:800; letter-spacing:-.01em; }
.page-hero p{ color:#c3d5e7; max-width:660px; margin-bottom:0; font-size:1.03rem; }
.breadcrumb{ margin-bottom:16px; font-size:.87rem; }
.breadcrumb a{ color:#ffa35c; }
.breadcrumb a:hover{ color:var(--orange); }
.breadcrumb-item.active{ color:#c3d5e7; }
.breadcrumb-item+.breadcrumb-item::before{ color:#7e97b2; }

/* ---------- Sections ---------- */
main section.section{ padding:84px 0; }
main section.section.alt{ background:var(--surface); }
.section-eyebrow{
    color:var(--orange);
    font-weight:700;
    font-size:.79rem;
    letter-spacing:.15em;
    text-transform:uppercase;
    margin-bottom:12px;
}
.section-title{
    font-size:clamp(1.6rem,3vw,2.25rem);
    margin-bottom:16px;
    letter-spacing:-.01em;
}
.section-title.underline{
    position:relative;
    padding-bottom:16px;
}
.section-title.underline::after{
    content:"";
    position:absolute; left:0; bottom:0;
    width:64px; height:4px; border-radius:4px;
    background:linear-gradient(90deg,var(--orange),#ffa35c);
}
.text-center .section-title.underline::after{ left:50%; transform:translateX(-50%); }
.section-sub{ color:var(--muted); max-width:700px; }

/* ---------- Cards ---------- */
.card-soft{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:32px 28px;
    height:100%;
    position:relative;
    transition:transform .28s, box-shadow .28s, border-color .28s;
    box-shadow:var(--shadow-sm);
}
.card-soft::before{
    content:"";
    position:absolute; top:0; left:24px; right:24px;
    height:3px; border-radius:0 0 4px 4px;
    background:linear-gradient(90deg,var(--orange),#ffa35c);
    opacity:0;
    transition:opacity .28s;
}
.card-soft:hover{
    transform:translateY(-7px);
    box-shadow:var(--shadow-lg);
    border-color:transparent;
}
.card-soft:hover::before{ opacity:1; }
.card-soft .icon{
    width:56px; height:56px;
    border-radius:15px;
    background:linear-gradient(135deg,var(--blue),var(--sky));
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1.45rem;
    margin-bottom:20px;
    box-shadow:0 8px 20px rgba(253,111,12,.28);
}
.card-soft h5{ margin-bottom:10px; font-size:1.08rem; }
.card-soft p{ color:var(--muted); font-size:.94rem; margin-bottom:0; }
.card-soft .more{
    display:inline-flex; align-items:center; gap:6px;
    margin-top:16px;
    color:var(--blue);
    font-weight:600;
    font-size:.9rem;
}
.card-soft .more i{ transition:transform .2s; }
.card-soft .more:hover{ color:var(--orange); }
.card-soft .more:hover i{ transform:translateX(4px); }

/* Feature list — fixed: reliable SVG check instead of icon-font glyph */
.check-list{ list-style:none; padding:0; margin:0; }
.check-list li{
    padding:9px 0 9px 36px;
    position:relative;
}
.check-list li::before{
    content:"";
    position:absolute; left:0; top:13px;
    width:22px; height:22px;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff9800'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Stat boxes */
.stat-box{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    text-align:center;
    padding:32px 16px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .25s, box-shadow .25s;
}
.stat-box:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.stat-box h3{
    font-size:2rem; margin-bottom:4px; font-weight:800;
    background:linear-gradient(135deg,var(--blue),var(--sky));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-box p{ color:var(--muted); margin:0; font-size:.9rem; }

/* Process steps */
.step{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:30px 26px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .25s, box-shadow .25s;
}
.step:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.step .num{
    font-family:'Plus Jakarta Sans',sans-serif;
    font-weight:800;
    font-size:1rem;
    color:#fff;
    background:linear-gradient(135deg,var(--blue),var(--sky));
    width:42px; height:42px;
    border-radius:12px;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:18px;
    box-shadow:0 8px 18px rgba(253,111,12,.28);
}
.step h6{ margin-bottom:8px; font-size:1rem; }
.step p{ color:var(--muted); font-size:.9rem; margin:0; }

/* Pills */
.pill{
    display:inline-block;
    background:#fff;
    border:1px solid var(--line);
    border-radius:50px;
    padding:8px 20px;
    font-size:.86rem;
    font-weight:500;
    color:var(--ink);
    margin:4px;
    box-shadow:var(--shadow-sm);
    transition:.2s;
}
.pill:hover{ border-color:var(--orange); color:var(--blue); transform:translateY(-2px); }

/* Accordion */
.accordion{ --bs-accordion-border-color:var(--line); --bs-accordion-btn-focus-box-shadow:none; }
.accordion-item{ border-radius:14px !important; overflow:hidden; margin-bottom:10px; border:1px solid var(--line); }
.accordion-button{ font-weight:600; font-size:.96rem; }
.accordion-button:not(.collapsed){
    background:var(--surface);
    color:var(--blue);
    box-shadow:none;
}

/* Portfolio */
.folio-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    background:#fff;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .28s, box-shadow .28s;
}
.folio-card:hover{ transform:translateY(-7px); box-shadow:var(--shadow-lg); }
.folio-thumb{
    height:172px;
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-size:2.5rem;
    position:relative;
}
.folio-thumb::after{
    content:"";
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:28px 28px;
}
.folio-body{ padding:24px; }
.folio-body .tag{
    font-size:.74rem; font-weight:700;
    color:var(--orange);
    text-transform:uppercase; letter-spacing:.11em;
}
.folio-body p{ color:var(--muted); font-size:.92rem; margin-bottom:0; }

/* Blog */
.blog-card{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; height:100%; box-shadow:var(--shadow-sm); transition:transform .28s, box-shadow .28s; }
.blog-card:hover{ transform:translateY(-7px); box-shadow:var(--shadow-lg); }
.blog-thumb{ height:150px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2rem; }
.blog-body{ padding:24px; }
.blog-body small{ color:var(--muted); }
.blog-body h5{ font-size:1.03rem; }
.blog-body h5 a{ color:var(--navy); }
.blog-body h5 a:hover{ color:var(--blue); }

/* Case studies */
.case-card{
    background:#fff;
    border:1px solid var(--line);
    border-left:5px solid var(--orange);
    border-radius:var(--radius);
    padding:34px 30px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .25s, box-shadow .25s;
}
.case-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.case-card h4{ font-size:1.25rem; }
.case-card .result{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:12px;
    padding:15px 18px;
    margin-top:18px;
    font-size:.94rem;
}
.case-card .result b{ color:var(--blue); }

/* ---------- CTA band ---------- */
.cta-band{
    background:
        radial-gradient(700px 350px at 85% 0%, rgba(253,111,12,.18), transparent 60%),
        linear-gradient(135deg,var(--blue) 0%,var(--navy) 100%);
    color:#fff;
    padding:72px 0;
    position:relative;
    overflow:hidden;
}
.cta-band::before{
    content:"";
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size:46px 46px;
    pointer-events:none;
}
.cta-band .container{ position:relative; z-index:1; }
.cta-band h2{ color:#fff; font-size:clamp(1.6rem,3vw,2.2rem); }
.cta-band p{ color:#c3d5e7; }

/* ---------- Contact ---------- */
.contact-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:32px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .25s, box-shadow .25s;
}
.contact-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.contact-card .icon{
    width:54px;height:54px;border-radius:14px;
    background:linear-gradient(135deg,var(--blue),var(--sky));
    color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:1.35rem;
    margin-bottom:16px;
    box-shadow:0 8px 20px rgba(253,111,12,.28);
}
.form-label{ font-size:.9rem; }
.form-control,.form-select{
    border:1px solid var(--line);
    border-radius:12px;
    padding:12px 16px;
    font-size:.95rem;
}
.form-control:focus,.form-select:focus{
    border-color:var(--sky);
    box-shadow:0 0 0 .25rem rgba(59,130,196,.14);
}

/* ---------- Footer ---------- */
footer{
    background:var(--navy);
    color:#a8bfd6;
    padding:66px 0 0;
}
footer .foot-h{ color:#fff; font-size:1rem; margin-bottom:20px; }
footer .brand{ color:#fff; font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; letter-spacing:.05em; font-size:1.2rem; }
footer .brand span{ color:var(--orange); }
footer ul{ list-style:none; padding:0; margin:0; }
footer ul li{ margin-bottom:10px; }
footer a{ color:#a8bfd6; font-size:.91rem; }
footer a:hover,footer a:focus{ color:var(--orange); }
footer .contact-line{ display:flex; gap:12px; margin-bottom:14px; font-size:.91rem; }
footer .contact-line i{ color:var(--orange); margin-top:4px; }
.footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
    margin-top:48px;
    padding:20px 0;
    font-size:.84rem;
    color:#7e97b2;
}

/* Careers */
.job-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .25s, box-shadow .25s;
}
.job-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.job-card .badge{ background:var(--surface); color:var(--blue); font-weight:600; border:1px solid var(--line); }

/* ---------- Floating buttons ---------- */
.float-wa{
    position:fixed; right:22px; bottom:22px; z-index:1050;
    width:56px; height:56px; border-radius:50%;
    background:#25d366; color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1.6rem;
    box-shadow:0 12px 30px rgba(37,211,102,.45);
    transition:.25s;
}
.float-wa:hover,.float-wa:focus{ color:#fff; transform:translateY(-3px) scale(1.05); }
.back-top{
    position:fixed; right:26px; bottom:92px; z-index:1050;
    width:46px; height:46px; border-radius:14px;
    background:var(--navy); color:#fff; border:1px solid rgba(255,255,255,.15);
    display:flex; align-items:center; justify-content:center;
    font-size:1.1rem;
    opacity:0; visibility:hidden; transform:translateY(10px);
    transition:.3s;
}
.back-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.back-top:hover{ color:var(--orange); }

/* ---------- Scroll reveal ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Responsive & motion ---------- */
@media (max-width:991.98px){
    .hero{ padding:82px 0 70px; }
    .hero-stats{ gap:26px; }
    main section.section{ padding:64px 0; }
    .navbar .nav-link{ margin:2px 0; }
    .navbar-collapse{ padding-top:10px; }
    .btn-nav-cta{ display:inline-block; margin-top:8px; }
}
@media (prefers-reduced-motion:reduce){
    html{ scroll-behavior:auto; }
    *,*::before,*::after{ transition:none !important; animation:none !important; }
    .reveal{ opacity:1; transform:none; }
}

/* ---------- Logo ---------- */
.navbar-brand img{ height:44px; width:auto; display:block; }
footer .brand-logo img{ height:46px; width:auto; }
@media (max-width:575.98px){ .navbar-brand img{ height:38px; } }

/* ---------- Hero carousel ---------- */
.hero-carousel .carousel-item{ padding:0; }
.hero-carousel .carousel-indicators{
    position:relative; margin:38px 0 0; justify-content:flex-start;
}
.hero-carousel .carousel-indicators [data-bs-target]{
    width:34px; height:5px; border-radius:4px;
    background:rgba(255,255,255,.28); border:0; opacity:1;
    transition:.3s;
}
.hero-carousel .carousel-indicators .active{
    background:linear-gradient(90deg,var(--orange),#ffa35c);
    width:52px;
}
.hero-illus{
    width:100%; max-width:560px; height:auto; display:block; margin:0 auto;
    filter:drop-shadow(0 30px 60px rgba(0,0,0,.35));
}
.slide-illus{
    width:100%; max-width:440px; height:auto; display:block; margin:0 auto;
}

/* Form feedback */
.form-note{ font-size:.85rem; color:var(--muted); }
.success-icon{
    width:92px; height:92px; border-radius:50%;
    background:linear-gradient(135deg,var(--sky),#6faede);
    color:#fff; font-size:2.6rem;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 24px;
    box-shadow:0 18px 44px rgba(59,130,196,.4);
}

/* ============================================================
   v3 — Reference-style header, hero slider, overlap cards, demos
   ============================================================ */

/* ---------- Topbar (light like reference) ---------- */
.topbar{
    background:#fff;
    color:var(--muted);
    border-bottom:1px solid var(--line);
    font-size:.85rem;
    padding:9px 0;
}
.topbar a{ color:var(--ink); font-weight:500; }
.topbar a:hover,.topbar a:focus{ color:var(--blue); }
.topbar i{ color:var(--blue); }
.topbar .social a{
    display:inline-flex; align-items:center; justify-content:center;
    width:28px; height:28px; border-radius:8px;
    color:var(--muted); font-size:.95rem; margin-left:4px;
}
.topbar .social a:hover{ background:var(--surface); color:var(--blue); }

/* ---------- White navbar with angled brand block ---------- */
.navbar{
    background:#fff;
    backdrop-filter:none;
    padding:0;
    border-bottom:1px solid var(--line);
}
.navbar.scrolled{ box-shadow:0 12px 34px rgba(10,39,67,.12); padding:0; }
.navbar .container{ min-height:74px; }
.navbar-brand{ padding:0; margin-right:1.2rem; }
.brand-block{
    display:flex; align-items:center;
    padding:11px 0;
    margin:0;
}
.navbar .nav-link{
    color:var(--ink) !important;
    font-weight:600;
    font-size:.93rem;
    padding:.6rem .85rem !important;
    border-radius:8px;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus{ color:var(--blue) !important; background:var(--surface); }
.navbar .nav-link.active{ color:var(--blue) !important; background:transparent; }

.btn-nav-cta{
    background:linear-gradient(120deg,var(--orange),#ff9142);
    color:#fff !important;
    font-weight:700;
    border-radius:50px;
    padding:10px 24px !important;
    box-shadow:0 8px 22px rgba(253,111,12,.35);
}
.btn-nav-cta:hover,.btn-nav-cta:focus{
    background:linear-gradient(120deg,#e05e00,#f76a00);
    color:#fff !important;
    transform:translateY(-1px);
}
.btn-nav-cta i{ transition:transform .2s; }
.btn-nav-cta:hover i{ transform:translateX(4px); }

/* ---------- Buttons -> gradient like reference ---------- */
.btn-accent{
    background:linear-gradient(120deg,var(--orange),#ff9142);
    color:#fff;
    border-radius:50px;
    box-shadow:0 10px 26px rgba(253,111,12,.35);
}
.btn-accent:hover,.btn-accent:focus{
    background:linear-gradient(120deg,#e05e00,#f76a00);
    color:#fff;
    box-shadow:0 14px 32px rgba(253,111,12,.45);
}
.btn-accent i,.btn-ghost i{ transition:transform .2s; }
.btn-accent:hover i,.btn-ghost:hover i{ transform:translateX(5px); }
.btn-ghost{ border-radius:50px; }
.btn-outline-primary{ border-radius:50px; }
.btn-success{ border-radius:50px; }

/* ---------- Hero slider (full, reference style) ---------- */
.hero{ padding:96px 0 118px; }
.hero-badge{
    display:inline-flex; align-items:center; gap:8px;
    background:#fff;
    color:var(--blue);
    font-weight:700;
    font-size:.86rem;
    padding:9px 24px;
    border-radius:50px;
    box-shadow:0 10px 26px rgba(0,0,0,.22);
    margin-bottom:24px;
}
.hero-badge::before{
    content:""; width:8px; height:8px; border-radius:50%;
    background:linear-gradient(120deg,var(--orange),#ffa35c);
}
.hero .slide-title{
    color:#fff;
    font-size:clamp(2.1rem,4.5vw,3.3rem);
    font-weight:800;
    letter-spacing:-.02em;
    line-height:1.18;
    margin:0;
}
.hero .slide-title .accent{
    background:linear-gradient(90deg,#ffa35c,var(--orange));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero .slide-text{ color:#c3d5e7; max-width:540px; font-size:1.06rem; margin-top:18px; }
.hero-carousel .carousel-control-prev,
.hero-carousel .carousel-control-next{
    width:52px; height:52px;
    top:50%; transform:translateY(-50%);
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.3);
    border-radius:50%;
    opacity:1;
    transition:.25s;
}
.hero-carousel .carousel-control-prev{ left:-6px; }
.hero-carousel .carousel-control-next{ right:-6px; }
.hero-carousel .carousel-control-prev:hover,
.hero-carousel .carousel-control-next:hover{
    background:linear-gradient(120deg,var(--orange),#ff9142);
    border-color:transparent;
}
.hero-carousel .carousel-indicators{
    justify-content:center; margin:34px 0 0;
}
/* slide content entrance animations */
@keyframes slideUp{ from{ opacity:0; transform:translateY(34px);} to{ opacity:1; transform:none;} }
@keyframes slideRight{ from{ opacity:0; transform:translateX(50px) scale(.96);} to{ opacity:1; transform:none;} }
@keyframes floatY{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }
.hero-carousel .carousel-item.active .hero-badge{ animation:slideUp .55s .05s both; }
.hero-carousel .carousel-item.active .slide-title{ animation:slideUp .6s .15s both; }
.hero-carousel .carousel-item.active .slide-text{ animation:slideUp .6s .28s both; }
.hero-carousel .carousel-item.active .slide-cta{ animation:slideUp .6s .4s both; }
.hero-carousel .carousel-item.active .hero-illus{ animation:slideRight .7s .2s both; }
.hero-stats{ border-top:1px solid rgba(255,255,255,.14); }

/* ---------- Overlap cards under hero ---------- */
.overlap-row{
    position:relative;
    z-index:5;
    margin-top:-72px;
}
.overlap-card{
    background:#fff;
    border-radius:16px;
    padding:30px 22px;
    text-align:center;
    height:100%;
    box-shadow:0 22px 50px rgba(10,39,67,.13);
    border-bottom:4px solid transparent;
    transition:transform .28s, border-color .28s;
    display:block;
}
.overlap-card:hover{ transform:translateY(-8px); border-bottom-color:var(--orange); }
.overlap-card .icon{
    width:62px; height:62px; margin:0 auto 16px;
    border-radius:50%;
    background:var(--surface);
    color:var(--blue);
    display:flex; align-items:center; justify-content:center;
    font-size:1.6rem;
    transition:.28s;
}
.overlap-card:hover .icon{
    background:linear-gradient(120deg,var(--orange),#ff9142);
    color:#fff;
    transform:rotateY(180deg);
}
.overlap-card h3{ font-size:1rem; margin:0; color:var(--navy); }
.overlap-card p{ font-size:.85rem; color:var(--muted); margin:8px 0 0; }

/* ---------- Demo cards ---------- */
.demo-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:30px 26px;
    height:100%;
    box-shadow:var(--shadow-sm);
    transition:transform .28s, box-shadow .28s;
}
.demo-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.demo-card .icon{
    width:56px; height:56px; border-radius:15px;
    background:linear-gradient(120deg,var(--orange),#ff9142);
    color:#fff; font-size:1.4rem;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:18px;
    box-shadow:0 8px 20px rgba(253,111,12,.3);
}
.demo-links{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.demo-links .btn{
    font-size:.83rem; font-weight:600;
    padding:8px 16px;
    border-radius:50px;
}
.btn-demo-front{ background:var(--surface); color:var(--blue); border:1px solid var(--line); }
.btn-demo-front:hover{ background:linear-gradient(120deg,var(--orange),#ff9142); color:#fff; border-color:transparent; }
.btn-demo-admin{ background:#fff7ed; color:#c2610c; border:1px solid #fed7aa; }
.btn-demo-admin:hover{ background:var(--orange); color:#fff; border-color:transparent; }
.btn-demo-user{ background:#f0fdfa; color:#0f766e; border:1px solid #99f6e4; }
.btn-demo-user:hover{ background:#14b8a6; color:#fff; border-color:transparent; }
.demo-note{
    background:linear-gradient(120deg,#eaf2fa,#f2f7fc);
    border:1px solid #d3e2f0;
    border-radius:14px;
    padding:18px 24px;
    font-size:.94rem;
}
.demo-note i{ color:var(--blue); }

/* ---------- Section heading animation & misc polish ---------- */
.section-title.underline::after{ transition:width .5s ease; }
.section-title.underline:hover::after{ width:96px; }
.pill:hover{ box-shadow:0 8px 20px rgba(253,111,12,.15); }

/* ---------- Mobile ---------- */
@media (max-width:991.98px){
    .brand-block{ padding:11px 34px 11px 14px; }
    .navbar .container{ min-height:64px; }
    .navbar-collapse{ padding:12px 0 18px; }
    .hero{ padding:64px 0 104px; }
    .hero-carousel .carousel-control-prev,
    .hero-carousel .carousel-control-next{ display:none; }
    .hero .slide-illus-wrap{ margin-top:34px; }
    .overlap-row{ margin-top:-64px; }
    .hero-stats{ gap:22px; padding-top:22px; margin-top:30px; }
    .hero-stats h3{ font-size:1.4rem; }
}
@media (max-width:575.98px){
    .hero .slide-text{ font-size:.98rem; }
    .demo-links .btn{ flex:1 1 100%; text-align:center; }
    .btn-accent,.btn-ghost{ padding:11px 22px; }
}
@media (prefers-reduced-motion:reduce){
    .hero-carousel .carousel-item.active .hero-badge,
    .hero-carousel .carousel-item.active .slide-title,
    .hero-carousel .carousel-item.active .slide-text,
    .hero-carousel .carousel-item.active .slide-cta,
    .hero-carousel .carousel-item.active .hero-illus{ animation:none; }
}


/* ============================================================
   v4 — Real brand logo + big-brand polish
   ============================================================ */
.navbar-brand img{ height:52px; width:auto; }
footer .brand-logo img{ height:54px; width:auto; }
@media (max-width:575.98px){ .navbar-brand img{ height:42px; } }

/* Cleaner, calmer surfaces for a big-brand feel */
body{ letter-spacing:.005em; }
h1,h2,h3,h4,h5,h6{ letter-spacing:-.015em; }
.card-soft,.step,.stat-box,.folio-card,.blog-card,.case-card,.contact-card,.job-card,.demo-card{
    box-shadow:0 2px 10px rgba(10,39,67,.05);
}
.card-soft:hover,.folio-card:hover,.blog-card:hover,.demo-card:hover{
    box-shadow:0 20px 46px rgba(10,39,67,.12);
}
.card-soft::before{ background:linear-gradient(90deg,var(--orange),#ff9142); }
.section-title.underline::after{ background:linear-gradient(90deg,var(--orange),#ff9142); }
.hero{
    background:
        radial-gradient(900px 480px at 88% 0%, rgba(59,130,196,.25), transparent 62%),
        radial-gradient(700px 420px at 5% 100%, rgba(253,111,12,.12), transparent 60%),
        linear-gradient(140deg, #0a2743 0%, #06325b 55%, #0d4a80 100%);
}
.page-hero{
    background:
        radial-gradient(700px 380px at 90% 0%, rgba(59,130,196,.22), transparent 60%),
        linear-gradient(140deg, #0a2743 0%, #06325b 100%);
}
.cta-band{
    background:
        radial-gradient(700px 350px at 85% 0%, rgba(253,111,12,.16), transparent 60%),
        linear-gradient(135deg,#06325b 0%,#0a2743 100%);
}
.hero-badge{ color:#06325b; }
.hero .slide-title .accent{
    background:linear-gradient(90deg,#ffa35c,var(--orange));
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.btn-ghost:hover,.btn-ghost:focus{ color:#06325b; }
.overlap-card:hover .icon{ background:linear-gradient(120deg,var(--blue),var(--blue-2)); }
.demo-card .icon{ background:linear-gradient(120deg,var(--blue),var(--blue-2)); box-shadow:0 8px 20px rgba(6,50,91,.28); }
.btn-demo-admin{ background:#fff3ea; color:#c65807; border-color:#ffd3b0; }
.btn-demo-admin:hover{ background:var(--orange); }
.btn-demo-user{ background:#eef5fc; color:#0d4a80; border-color:#c6dcf0; }
.btn-demo-user:hover{ background:var(--blue-2); }

/* ============================================================
   v5 — Premium light theme (navy anchors, orange leads)
   ============================================================ */

/* ---------- Topbar: slim navy brand strip ---------- */
.topbar{
    background:#0f2b47;
    border-bottom:none;
    color:#c7d6e6;
    font-size:.84rem;
    padding:8px 0;
}
.topbar a{ color:#e8f0f8; font-weight:500; }
.topbar a:hover,.topbar a:focus{ color:#ffb27a; }
.topbar i{ color:var(--orange); }
.topbar .social a{ color:#c7d6e6; }
.topbar .social a:hover{ background:rgba(255,255,255,.1); color:var(--orange); }

/* ---------- Header: clean white bar, structured ---------- */
.navbar{
    background:#fff;
    border-bottom:1px solid var(--line);
    box-shadow:0 1px 0 rgba(10,39,67,.03);
}
.navbar.scrolled{ box-shadow:0 10px 30px rgba(10,39,67,.1); }
.navbar .container{ min-height:80px; }
.brand-block{ padding:14px 0; }
.navbar-brand img{ height:50px; width:auto; }
.navbar .nav-link{
    color:#12395e !important;
    font-weight:600;
    font-size:.92rem;
    padding:.65rem .8rem !important;
    border-radius:0;
    background:transparent !important;
    position:relative;
}
.navbar .nav-link::after{
    content:"";
    position:absolute; left:.8rem; right:.8rem; bottom:6px;
    height:2.5px; border-radius:2px;
    background:var(--orange);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .28s ease;
}
.navbar .nav-link.dropdown-toggle::after{ display:inline-block; position:static; height:auto; background:none; transform:none; border-top:.3em solid; border-right:.3em solid transparent; border-left:.3em solid transparent; margin-left:.35em; vertical-align:.15em; }
.navbar .nav-link:hover,.navbar .nav-link:focus,.navbar .nav-link.active{ color:var(--orange) !important; }
.navbar .nav-link:hover::after,.navbar .nav-link.active::after{ transform:scaleX(1); }
.navbar .nav-link.dropdown-toggle:hover::after{ transform:none; }
.dropdown-menu{ border-top:3px solid var(--orange); }
.dropdown-item:hover,.dropdown-item:focus{ background:#fff4ec; color:var(--orange-dark); }
.btn-nav-cta{
    background:linear-gradient(120deg,var(--orange),#ff8c3a) !important;
    color:#fff !important;
    border-radius:50px;
    padding:11px 26px !important;
    box-shadow:0 8px 20px rgba(253,111,12,.32);
}
.btn-nav-cta::after{ display:none !important; }

/* ---------- Custom hamburger: always visible, animated ---------- */
.navbar-toggler{
    border:1.5px solid #d9e2ec;
    border-radius:12px;
    padding:11px 12px;
    margin:16px 0;
    background:#fff;
    box-shadow:none !important;
}
.hamburger{
    display:block; width:24px; height:18px; position:relative;
}
.hamburger span{
    position:absolute; left:0; width:100%; height:2.6px;
    background:#0f2b47; border-radius:3px;
    transition:transform .3s ease, opacity .2s ease, top .3s ease;
}
.hamburger span:nth-child(1){ top:0; }
.hamburger span:nth-child(2){ top:7.7px; }
.hamburger span:nth-child(3){ top:15.4px; }
.navbar-toggler[aria-expanded="true"] .hamburger span:nth-child(1){ top:7.7px; transform:rotate(45deg); background:var(--orange); }
.navbar-toggler[aria-expanded="true"] .hamburger span:nth-child(2){ opacity:0; }
.navbar-toggler[aria-expanded="true"] .hamburger span:nth-child(3){ top:7.7px; transform:rotate(-45deg); background:var(--orange); }

/* ---------- Mobile menu panel ---------- */
@media (max-width:991.98px){
    .navbar .container{ min-height:70px; }
    .navbar-brand img{ height:42px; }
    .brand-block{ padding:12px 0; }
    .navbar-collapse{
        background:#fff;
        border-top:1px solid var(--line);
        margin:0 -12px;
        padding:8px 18px 20px;
        max-height:calc(100vh - 90px);
        overflow-y:auto;
    }
    .navbar .nav-link{ padding:.85rem .25rem !important; border-bottom:1px solid #eef2f7; }
    .navbar .nav-link::after{ display:none; }
    .dropdown-menu{
        border:none; border-left:3px solid var(--orange);
        box-shadow:none; border-radius:0;
        background:#fafbfd; margin:0 0 6px; padding:4px 0;
    }
    .btn-nav-cta{ display:block; text-align:center; margin-top:14px; }
    .navbar .nav-item:last-child .nav-link{ border-bottom:none; }
}

/* ---------- Hero: light, premium ---------- */
.hero{
    background:
        radial-gradient(820px 460px at 92% -10%, rgba(253,111,12,.09), transparent 60%),
        radial-gradient(700px 420px at 0% 110%, rgba(18,57,94,.07), transparent 60%),
        linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
    padding:84px 0 118px;
}
.hero::before{
    background-image:radial-gradient(rgba(15,43,71,.11) 1.1px, transparent 1.1px);
    background-size:26px 26px;
    mask-image:radial-gradient(circle at 75% 25%, black 0%, transparent 70%);
    -webkit-mask-image:radial-gradient(circle at 75% 25%, black 0%, transparent 70%);
}
.hero-badge{
    background:#fff1e6;
    color:#c65807;
    border:1px solid #ffd8b8;
    box-shadow:none;
}
.hero .slide-title{ color:#0f2b47; }
.hero .slide-title .accent{
    background:linear-gradient(90deg,var(--orange),#ff8c3a);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero .slide-text{ color:var(--muted); }
.hero-illus{ filter:drop-shadow(0 26px 48px rgba(15,43,71,.16)); }
.btn-ghost{
    border:2px solid #d9e2ec;
    color:#0f2b47;
    background:#fff;
}
.btn-ghost:hover,.btn-ghost:focus{
    border-color:var(--orange); color:var(--orange-dark); background:#fff;
}
.hero-carousel .carousel-control-prev,
.hero-carousel .carousel-control-next{
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 10px 24px rgba(15,43,71,.12);
}
.hero-carousel .carousel-control-prev-icon,
.hero-carousel .carousel-control-next-icon{ filter:invert(.75) sepia(.2); width:1.3rem; height:1.3rem; }
.hero-carousel .carousel-control-prev:hover,
.hero-carousel .carousel-control-next:hover{
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    border-color:transparent;
}
.hero-carousel .carousel-control-prev:hover .carousel-control-prev-icon,
.hero-carousel .carousel-control-next:hover .carousel-control-next-icon{ filter:none; }
.hero-carousel .carousel-indicators [data-bs-target]{ background:rgba(15,43,71,.16); }
.hero-carousel .carousel-indicators .active{ background:linear-gradient(90deg,var(--orange),#ff8c3a); }
.hero-stats{ border-top:1px solid var(--line); }
.hero-stats h3{ color:var(--orange); }
.hero-stats small{ color:var(--muted); }
.overlap-row{ margin-top:-76px; }
.overlap-card{ box-shadow:0 16px 40px rgba(15,43,71,.1); }
.overlap-card .icon{ background:#fff1e6; color:var(--orange-dark); }
.overlap-card:hover .icon{ background:linear-gradient(120deg,var(--orange),#ff8c3a); color:#fff; }
.overlap-card h3{ color:#0f2b47; }

/* ---------- Inner page heroes: light ---------- */
.page-hero{
    background:
        radial-gradient(700px 380px at 92% -10%, rgba(253,111,12,.09), transparent 60%),
        linear-gradient(180deg,#ffffff 0%,#f6f8fb 100%);
    border-bottom:1px solid var(--line);
    padding:58px 0 52px;
}
.page-hero::before{
    background-image:radial-gradient(rgba(15,43,71,.1) 1.1px, transparent 1.1px);
    background-size:26px 26px;
    mask-image:radial-gradient(circle at 80% 30%, black 0%, transparent 70%);
    -webkit-mask-image:radial-gradient(circle at 80% 30%, black 0%, transparent 70%);
}
.page-hero h1{ color:#0f2b47; }
.page-hero p{ color:var(--muted); }
.breadcrumb a{ color:var(--orange-dark); }
.breadcrumb a:hover{ color:var(--orange); }
.breadcrumb-item.active{ color:var(--muted); }
.breadcrumb-item+.breadcrumb-item::before{ color:#b3c2d1; }

/* ---------- Components: orange leads, navy for text ---------- */
.section-eyebrow{ color:var(--orange-dark); }
.card-soft .icon, .demo-card .icon, .contact-card .icon{
    background:#fff1e6; color:var(--orange-dark);
    box-shadow:none;
}
.card-soft:hover .icon, .demo-card:hover .icon, .contact-card:hover .icon{
    background:linear-gradient(120deg,var(--orange),#ff8c3a); color:#fff;
}
.step .num{
    background:#fff1e6; color:var(--orange-dark); box-shadow:none;
}
.step:hover .num{ background:linear-gradient(120deg,var(--orange),#ff8c3a); color:#fff; }
.stat-box h3{
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.card-soft .more{ color:var(--orange-dark); }
.card-soft .more:hover{ color:var(--orange); }
.pill:hover{ border-color:var(--orange); color:var(--orange-dark); box-shadow:0 8px 20px rgba(253,111,12,.14); }
.accordion-button:not(.collapsed){ background:#fff4ec; color:var(--orange-dark); }
.folio-body .tag{ color:var(--orange-dark); }
.blog-body h5 a:hover{ color:var(--orange-dark); }
.success-icon{
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    box-shadow:0 18px 44px rgba(253,111,12,.35);
}
.check-list li::before{
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fd6f0c'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.btn-outline-primary{ border-color:#0f2b47; color:#0f2b47; }
.btn-outline-primary:hover{ background:#0f2b47; border-color:#0f2b47; color:#fff; }
.btn-demo-front{ background:#f6f8fb; color:#12395e; border:1px solid var(--line); }
.btn-demo-front:hover{ background:#0f2b47; color:#fff; border-color:transparent; }
.btn-demo-user{ background:#eef5fc; color:#12395e; border-color:#cfdfee; }
.btn-demo-user:hover{ background:#12395e; }
.demo-note{ background:#fff7f0; border-color:#ffe0c4; }
.demo-note i{ color:var(--orange-dark); }
.form-control:focus,.form-select:focus{
    border-color:var(--orange);
    box-shadow:0 0 0 .25rem rgba(253,111,12,.13);
}

/* ---------- CTA band: orange energy ---------- */
.cta-band{
    background:
        radial-gradient(700px 350px at 85% 0%, rgba(255,255,255,.14), transparent 60%),
        linear-gradient(120deg,#f76a00 0%,var(--orange) 55%,#ff8c3a 100%);
}
.cta-band p{ color:#fff3e8; }
.cta-band .btn-accent{
    background:#fff; color:var(--orange-dark);
    box-shadow:0 12px 30px rgba(0,0,0,.16);
}
.cta-band .btn-accent:hover{ background:#0f2b47; color:#fff; }
.cta-band .btn-ghost{ border-color:rgba(255,255,255,.7); color:#fff; background:transparent; }
.cta-band .btn-ghost:hover{ background:#fff; color:var(--orange-dark); border-color:#fff; }

/* ---------- Footer: deep neutral navy ---------- */
footer{ background:#0f2233; color:#a9bccd; }
footer .foot-h{ color:#fff; }
footer a{ color:#a9bccd; }
footer a:hover,footer a:focus{ color:#ffb27a; }
footer .contact-line i{ color:var(--orange); }
.footer-bottom{ border-top-color:rgba(255,255,255,.09); color:#7f95a9; }
.back-top{ background:#0f2233; }
.back-top:hover{ color:var(--orange); }

/* ============================================================
   v5.1 — High-visibility mobile toggle
   ============================================================ */
.navbar-toggler{
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    border:none;
    border-radius:13px;
    padding:14px 13px;
    margin:14px 0;
    box-shadow:0 6px 18px rgba(253,111,12,.4);
    transition:transform .2s;
}
.navbar-toggler:active{ transform:scale(.94); }
.navbar-toggler:focus{ box-shadow:0 6px 18px rgba(253,111,12,.4), 0 0 0 3px rgba(253,111,12,.25); }
.hamburger{ width:25px; height:19px; }
.hamburger span{
    background:#ffffff;
    height:3px;
    border-radius:3px;
}
.hamburger span:nth-child(2){ top:8px; }
.hamburger span:nth-child(3){ top:16px; }
.navbar-toggler[aria-expanded="true"]{ background:#0f2b47; box-shadow:0 6px 18px rgba(15,43,71,.35); }
.navbar-toggler[aria-expanded="true"] .hamburger span:nth-child(1){ top:8px; transform:rotate(45deg); background:#fff; }
.navbar-toggler[aria-expanded="true"] .hamburger span:nth-child(3){ top:8px; transform:rotate(-45deg); background:#fff; }

/* ============================================================
   v6 — V2 components: counters, timeline, tiles, industries
   ============================================================ */

/* Counters */
.counter-box{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px 14px;
    height:100%;
    box-shadow:0 2px 10px rgba(10,39,67,.05);
    transition:transform .25s, box-shadow .25s;
}
.counter-box:hover{ transform:translateY(-5px); box-shadow:0 20px 46px rgba(10,39,67,.12); }
.counter-box i{ font-size:1.7rem; color:var(--orange); }
.counter-box h3{
    font-size:2.1rem; font-weight:800; margin:10px 0 2px; color:#0f2b47;
}
.counter-box p{ color:var(--muted); font-size:.9rem; margin:0; }

/* Mini value cards (about section) */
.mini-value{
    background:#fff; border:1px solid var(--line); border-radius:14px;
    padding:16px 14px; height:100%; font-size:.86rem; color:var(--muted);
}
.mini-value i{ color:var(--orange); font-size:1.2rem; display:block; margin-bottom:6px; }
.mini-value b{ display:block; color:#0f2b47; margin-bottom:2px; }
.mini-value span{ display:block; line-height:1.45; }

/* Product tiles */
.product-tile{
    display:flex; gap:14px; align-items:flex-start;
    background:#fff; border:1px solid var(--line); border-radius:16px;
    padding:20px 18px; height:100%;
    box-shadow:0 2px 10px rgba(10,39,67,.05);
    transition:transform .25s, box-shadow .25s, border-color .25s;
}
.product-tile:hover{ transform:translateY(-5px); box-shadow:0 18px 40px rgba(10,39,67,.12); border-color:#ffd3b0; }
.product-tile > i{
    flex:0 0 auto; width:46px; height:46px; border-radius:12px;
    background:#fff1e6; color:var(--orange-dark);
    display:flex; align-items:center; justify-content:center; font-size:1.25rem;
    transition:.25s;
}
.product-tile:hover > i{ background:linear-gradient(120deg,var(--orange),#ff8c3a); color:#fff; }
.product-tile h3{ font-size:.98rem; margin:2px 0 2px; color:#0f2b47; }
.product-tile p{ font-size:.82rem; color:var(--muted); margin:0 0 8px; }
.tile-links a{
    font-size:.8rem; font-weight:700; color:var(--orange-dark); margin-right:14px;
}
.tile-links a:hover{ color:var(--orange); }
.product-tile.highlight{ background:linear-gradient(135deg,#fff7f0,#fff1e6); border-color:#ffd3b0; }

/* Industry cards */
.industry-card{
    display:block;
    background:#fff; border:1px solid var(--line); border-radius:16px;
    padding:22px 10px; height:100%;
    color:#0f2b47; font-weight:600; font-size:.88rem;
    box-shadow:0 2px 10px rgba(10,39,67,.05);
    transition:transform .25s, box-shadow .25s, border-color .25s;
}
.industry-card i{
    display:block; font-size:1.7rem; color:var(--orange); margin-bottom:10px;
    transition:transform .25s;
}
.industry-card:hover{ transform:translateY(-5px); border-color:#ffd3b0; color:var(--orange-dark); box-shadow:0 18px 40px rgba(10,39,67,.12); }
.industry-card:hover i{ transform:scale(1.15); }
.industry-card span{ display:block; }

/* Timeline */
.timeline{ position:relative; max-width:900px; margin:0 auto; }
.timeline::before{
    content:""; position:absolute; left:24px; top:8px; bottom:8px;
    width:3px; border-radius:3px;
    background:linear-gradient(180deg,var(--orange),#ffd3b0);
}
.tl-item{ position:relative; padding:0 0 30px 74px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-dot{
    position:absolute; left:8px; top:0;
    width:36px; height:36px; border-radius:50%;
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    color:#fff; font-family:'Plus Jakarta Sans',sans-serif; font-weight:800;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 16px rgba(253,111,12,.35);
}
.tl-body{
    background:#fff; border:1px solid var(--line); border-radius:14px;
    padding:18px 22px;
    box-shadow:0 2px 10px rgba(10,39,67,.05);
    transition:transform .25s, box-shadow .25s;
}
.tl-body:hover{ transform:translateX(4px); box-shadow:0 14px 34px rgba(10,39,67,.1); }
.tl-body h3,.tl-body h2{ margin-bottom:4px; color:#0f2b47; }
.tl-body p{ color:var(--muted); font-size:.92rem; margin:0; }

/* Tech chips */
.tech-grid{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.tech-chip{
    display:inline-flex; align-items:center; gap:9px;
    background:#fff; border:1px solid var(--line); border-radius:50px;
    padding:11px 22px; font-weight:600; font-size:.92rem; color:#0f2b47;
    box-shadow:0 2px 8px rgba(10,39,67,.05);
    transition:transform .22s, border-color .22s, box-shadow .22s;
}
.tech-chip i{ color:var(--orange); font-size:1.1rem; }
.tech-chip:hover{ transform:translateY(-4px); border-color:#ffd3b0; box-shadow:0 12px 26px rgba(10,39,67,.1); }

/* Testimonial placeholder */
.testimonial-note{
    background:#fff; border:1px dashed #ffd3b0; border-radius:var(--radius);
    padding:44px 34px;
}
.testimonial-note i{ font-size:2.2rem; color:var(--orange); display:block; margin-bottom:14px; }
.testimonial-note p{ color:var(--muted); font-size:1.02rem; }

/* Homepage contact list */
.contact-list{ list-style:none; padding:0; margin:0; }
.contact-list li{
    display:flex; gap:16px; align-items:flex-start;
    padding:13px 0; border-bottom:1px solid var(--line);
}
.contact-list li:last-child{ border-bottom:none; }
.contact-list i{
    flex:0 0 auto; width:42px; height:42px; border-radius:12px;
    background:#fff1e6; color:var(--orange-dark);
    display:flex; align-items:center; justify-content:center; font-size:1.05rem;
}
.contact-list b{ display:block; color:#0f2b47; font-size:.88rem; }
.contact-list span{ font-size:.94rem; color:var(--muted); }
.contact-list a{ color:var(--orange-dark); font-weight:600; }
.contact-list a:hover{ color:var(--orange); }

/* Footer: socials + newsletter */
.foot-social a{
    display:inline-flex; align-items:center; justify-content:center;
    width:38px; height:38px; border-radius:11px;
    background:rgba(255,255,255,.07); color:#c7d6e6;
    font-size:1rem; margin-right:8px;
    transition:.22s;
}
.foot-social a:hover{ background:var(--orange); color:#fff; transform:translateY(-3px); }
.foot-newsletter{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.09);
    border-radius:16px;
    padding:24px 26px;
}
.newsletter-form{ display:flex; gap:10px; }
.newsletter-form input[type=email]{
    flex:1; border:1px solid rgba(255,255,255,.16); border-radius:50px;
    background:rgba(255,255,255,.06); color:#fff;
    padding:12px 22px; font-size:.94rem; min-width:0;
}
.newsletter-form input[type=email]::placeholder{ color:#8fa5ba; }
.newsletter-form input[type=email]:focus{ outline:none; border-color:var(--orange); }
.newsletter-form .btn{ white-space:nowrap; padding:12px 26px; }
@media (max-width:575.98px){ .newsletter-form{ flex-direction:column; } }

/* Sticky call button (stacks above WhatsApp) */
.float-call{
    position:fixed; right:22px; bottom:92px; z-index:1050;
    width:56px; height:56px; border-radius:50%;
    background:linear-gradient(120deg,#0f2b47,#12395e); color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1.35rem;
    box-shadow:0 12px 30px rgba(15,43,71,.4);
    transition:.25s;
}
.float-call:hover,.float-call:focus{ color:#fff; transform:translateY(-3px) scale(1.05); }
.back-top{ bottom:162px; }

/* 404 + sitemap */
.err-code{
    font-family:'Plus Jakarta Sans',sans-serif;
    font-size:clamp(5rem,14vw,8.5rem); font-weight:800; line-height:1;
    background:linear-gradient(120deg,var(--orange),#ff8c3a);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sitemap-list{ list-style:none; padding:0; margin:0; }
.sitemap-list li{ margin-bottom:9px; }
.sitemap-list a{ color:var(--ink); font-size:.94rem; }
.sitemap-list a:hover{ color:var(--orange-dark); }

/* ============================================================
   v7 — Premium alternating timeline (desktop) + section polish
   ============================================================ */
@media (min-width: 992px){
    .timeline:not(.timeline-vertical){ max-width:1000px; }
    .timeline:not(.timeline-vertical)::before{
        left:50%; transform:translateX(-50%);
    }
    .timeline:not(.timeline-vertical) .tl-item{
        width:50%; padding:0 54px 34px 0;
    }
    .timeline:not(.timeline-vertical) .tl-item:nth-child(even){
        margin-left:50%; padding:0 0 34px 54px;
    }
    .timeline:not(.timeline-vertical) .tl-dot{
        left:auto; right:-18px;
    }
    .timeline:not(.timeline-vertical) .tl-item:nth-child(even) .tl-dot{
        right:auto; left:-18px;
    }
    .timeline:not(.timeline-vertical) .tl-item:nth-child(odd) .tl-body{ text-align:right; }
    .timeline:not(.timeline-vertical) .tl-item:nth-child(odd) .tl-body:hover{ transform:translateX(-4px); }
}

/* Industry cards — guaranteed sizing on all breakpoints */
.industry-card{ min-height:112px; display:flex; flex-direction:column; align-items:center; justify-content:center; }

/* Product tiles: equalize on small screens */
@media (max-width:575.98px){
    .product-tile{ padding:16px 14px; }
    .product-tile h3{ font-size:.92rem; }
}


/* ============================================================
   FIX — Get a Quote button + nav wrapping (v2.3)
   ============================================================ */
.navbar .nav-link.btn-nav-cta{
    background:linear-gradient(120deg,#fd6f0c,#ff8c3a) !important;
    color:#fff !important;
    border-radius:50px;
    padding:11px 26px !important;
    white-space:nowrap;
    border-bottom:none;
    box-shadow:0 8px 20px rgba(253,111,12,.32);
}
.navbar .nav-link.btn-nav-cta:hover,
.navbar .nav-link.btn-nav-cta:focus{
    background:linear-gradient(120deg,#e05e00,#f76a00) !important;
    color:#fff !important;
    transform:translateY(-1px);
}
.navbar .nav-link.btn-nav-cta::after{ display:none !important; }

/* Keep menu items on one line; tighten spacing on laptop widths */
.navbar .navbar-nav .nav-link{ white-space:nowrap; }
@media (min-width:992px) and (max-width:1299.98px){
    .navbar .nav-link{ padding:.6rem .5rem !important; font-size:.85rem; }
    .navbar .nav-link.btn-nav-cta{ padding:9px 18px !important; }
}