/* Dune I.T. Group — Pile Style Light (Home) */

/* ---------- Design Tokens ---------- */
:root { --text: #111827;--muted: #6b7280;--text-muted: var(--muted);--border: rgba(0,0,0,.12);--bg: #ffffff;--hover: #f4f7ff;--primary: #0078ff;--accent: #00c9a7;--grad: linear-gradient(135deg,var(--primary),var(--accent));--ring: rgba(0,120,255,.18);}
html {font-size: 16px;   line-height: 1.5; box-sizing: border-box; height: 100%;scroll-behavior: smooth;font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;   }
*, *::before, *::after { box-sizing: inherit;}
body {min-height: 100%;margin: 0;background: var(--bg);color: var(--text);font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;    line-height: 1.5;}

a { color: inherit;text-decoration: none;}
a:focus-visible, button:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--ring);  border-radius: 10px; }
img { max-width: 100%; height: auto; display: block;}


/* btn */
.btn {display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; border-radius: 12px; font-weight: 700; text-decoration: none;
    border: 1px solid var(--border); box-shadow: 0 8px 22px rgba(0,0,0,.10), inset 0 0 0 1px rgba(255,255,255,.04);transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;}
.btn-primary { background-image: linear-gradient(135deg,#0c7cf0,#00c9a7);border: 0;box-shadow: 0 8px 22px rgba(0,120,255,.25);}
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); }
.btn-outline-primary {border-color: #0c7cf0;color: #0c7cf0;}
.btn-outline-primary:hover { background-color: rgba(12,124,240,0.08); color: #0a66d6; box-shadow: 0 6px 16px rgba(0,120,255,.18); }
.btn.ghost { background: rgba(0, 0, 0, 0.25); color: #fff; border: 1px solid rgba(255, 255, 255, 0.10); transition: all .18s ease; }
.btn.ghost:hover {background: var(--grad); color: #000; border-color: transparent;transform: translateY(-2px);box-shadow: 0 8px 24px rgba(0,120,255,.35); }
/* btn */


/* General */

/* CTA */
.cta-block { padding: clamp(36px,7vw,72px) 20px; }
.cta-inner { max-width: 980px;  margin: 0 auto; text-align: center; background: linear-gradient(145deg,#1e2633,#2b3340); border: 1px solid rgba(255,255,255,.08); border-radius: 18px;padding: clamp(20px,5vw,36px); box-shadow: 0 16px 44px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.05);}
.cta-inner h2 { margin: 0 0 8px; font-size: clamp(20px,3.2vw,30px); color: #f3f6fa; }
.cta-inner p { margin: 0 0 14px; color: #b3bdca; }
@media (prefers-reduced-motion:reduce) { * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important;  scroll-behavior: auto !important; }}

.cta-block .btn {display: inline-block;padding: 0.75rem 1.8rem; font-size: 1rem;font-weight: 600;border-radius: 12px;text-decoration: none;transition: all 0.25s ease;cursor: pointer;line-height: 1.2;}
.cta-block .btn.primary {background: linear-gradient(135deg, #0078ff, #00c9a7);color: #fff;border: none;box-shadow: 0 4px 12px rgba(0,120,255,0.3);}
.cta-block .btn.primary:hover {transform: translateY(-2px);box-shadow: 0 6px 18px rgba(0,120,255,0.4);opacity: 0.95; }
.cta-block .btn.ghost { background: transparent; color: #a9c4ff; border: 2px solid #a9c4ff; box-shadow: none; }
.cta-block .btn.ghost:hover { background: rgba(169,196,255,0.12); color: #c7dbff; border-color: #c7dbff; }

.cta-block .cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 18px; }
/* CTA */


.card:hover {background: linear-gradient(135deg,#1daeff,#00e0c6);color: #001016; transform: translateY(-3px); box-shadow: 0 16px 36px rgba(0,120,255,.35);}
.card:hover p { color: #001016;  }

/* General */

/* ---------- Trading Engines (distinct from Home) ---------- */
.trading { position: relative; z-index: 1; }

.t-hero {background: radial-gradient(900px 520px at 70% 35%, rgba(0,120,255,.10), transparent 60%), radial-gradient(700px 380px at 25% 75%, rgba(0,201,167,.10), transparent 60%), var(--bg);
    border-bottom: 1px solid var(--border);}
.t-hero-inner { max-width: 1120px;margin: 0 auto;padding: clamp(24px,5vw,44px) 20px;display: grid;grid-template-columns: 1.1fr .9fr;gap: 24px;}
@media (max-width:980px) {.t-hero-inner { grid-template-columns: 1fr; }}
.t-hero-content .crumbs { margin: 0 0 6px; font-size: 13px; color: var(--text-muted);}
.t-hero-content .crumbs a { text-decoration: underline; text-underline-offset: 2px; }
.t-hero-content h1 { margin: 0 0 10px; font-size: clamp(26px,4.6vw,44px); letter-spacing: -.02em; font-weight: 800; text-align: left; background: linear-gradient(135deg,#0078ff,#00c9a7);
    -webkit-background-clip: text; background-clip: text; color: transparent; }
.t-hero-content .lede { margin: 0 0 14px; max-width: 56ch; text-align: left; color: #344155; }
.t-hero .cta { justify-content: flex-start; }

.kpi-pills { display: flex; flex-wrap: wrap; gap: 8px;  margin-top: 16px;}
.kpi-pills .pill {padding: 6px 10px; border-radius: 999px; font-size: 12px;font-weight: 600; background: linear-gradient(135deg, rgba(0,120,255,.12), rgba(0,201,167,.12));
        border: 1px solid rgba(0,120,255,.25); color: #003e5a;}

.viz-wrap { width: 100%; max-width: 520px; aspect-ratio: 16/9; border-radius: 18px; background: linear-gradient(145deg,#1a2330,#273243); border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 16px 44px rgba(0,120,255,.25), inset 0 0 0 1px rgba(255,255,255,.05); position: relative; overflow: hidden; padding: 14px; }
.viz {width: 100%;height: 100%; opacity: .95;}
.viz path, .viz g { stroke-width: 1; }

.glass-cards { position: absolute; left: 14px;bottom: 14px;display: flex; gap: 8px; }
.gcard {backdrop-filter: blur(6px);background: linear-gradient(145deg, rgba(0,120,255,.22), rgba(0,224,198,.12));border: 1px solid rgba(255,255,255,.14); color: #e6eaf0;
    border-radius: 10px; padding: 6px 10px; font-size: 12px; box-shadow: 0 6px 18px rgba(0,0,0,.4); display: grid; grid-auto-flow: column; gap: 6px; }
.gcard .label { opacity: .75; }
.gcard .val {  font-weight: 700; }

/* Feature matrix */
.t-section { max-width: 1120px; margin: 34px auto 0; padding: 0 20px; }
.t-section h2 { margin: 0 0 12px; font-size: clamp(22px,3vw,30px);  color: var(--text); }

.matrix { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px;}
.matrix > div { border: 1px solid rgba(0,120,255,.15);border-radius: 14px; padding: 14px;background: linear-gradient(145deg, rgba(255,255,255,.75), rgba(240,247,255,.88));  box-shadow: 0 6px 16px rgba(0,0,0,.05);}
.matrix h3 { margin: 0 0 6px;font-size: 16px; color: #005c80;}
.matrix ul {margin: 0; padding-left: 18px;}
.matrix li {margin: 6px 0; color: var(--text);}
@media (max-width:1120px) { .matrix { grid-template-columns: 1fr 1fr; }}
@media (max-width:640px) { .matrix { grid-template-columns: 1fr; }}

.t-band { margin-top: 28px; padding: 18px 20px;background: linear-gradient(180deg, rgba(0,174,255,.05), rgba(0,224,198,.03)); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);}
.t-band .pipeline {  max-width: 1120px; margin: 0 auto;  display: flex;  flex-wrap: wrap;  gap: 10px; }
.t-band .pipeline span { padding: 8px 12px; border-radius: 999px; font-weight: 700;font-size: 12px;background: linear-gradient(135deg,#1daeff,#00e0c6);color: #fff;border: none;box-shadow: 0 2px 8px rgba(0,120,255,.25);   }
.t-band .note { max-width: 1120px; margin: 10px auto 0;color: var(--text-muted);font-size: 13px;}

.trading .btn.ghost {background: rgba(0,0,0,.25);color: #8a93a0;border: 1px solid rgba(255,255,255,.10);transition: all .18s ease;}
.trading .btn.ghost:hover {  background: rgba(0,0,0,.45); color: #fff;  transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.4); }
/* ---------- Trading Engines (distinct from Home) ---------- */


.a-section {max-width: 1120px;margin: 34px auto 0;padding: 0 20px; }
.a-section h2 {margin: 0 0 12px;font-size: clamp(22px,3vw,30px);color: var(--text);}
.a-section .text {margin: 0;color: var(--text);}
.a-section.insight {position: relative; text-align: center;  padding: clamp(28px, 4.5vw, 48px) 20px;
        background: radial-gradient(700px 400px at 60% 35%, rgba(0,120,255,0.10), transparent 65%), radial-gradient(600px 320px at 25% 75%, rgba(0,201,167,0.08), transparent 65%), #f8f9fb; /* slightly darker than white bg */
        border-top: 1px solid rgba(0,0,0,0.06); border-bottom: 1px solid rgba(0,0,0,0.06);  border-radius: 12px; }
.a-section.insight h2 {font-size: clamp(22px, 2.8vw, 30px); font-weight: 700; margin-bottom: 10px; background: linear-gradient(135deg, #0078ff, #00c9a7); -webkit-background-clip: text;background-clip: text;color: transparent; }
.a-section.insight p { margin: 0 auto; max-width: 75ch; color: #475060; line-height: 1.65; font-size: 1.03rem; }


/* ---------- About page (scoped) ---------- */
/* Ghost button scoped to About */
/*
.about { position: relative; z-index: 1;}
    .a-hero {
    background: radial-gradient(900px 520px at 65% 35%, rgba(0,120,255,.10), transparent 60%), radial-gradient(700px 380px at 25% 75%, rgba(0,201,167,.10), transparent 60%), var(--bg);
    border-bottom: 1px solid var(--border);
}
.a-hero-inner {max-width: 1120px; margin: 0 auto; padding: clamp(24px, 5vw, 44px) 20px;display: grid;grid-template-columns: 1.1fr 0.9fr;gap: 24px;align-items: center;}
@media (max-width: 960px) {.a-hero-inner { grid-template-columns: 1fr;}}
.a-hero-content h1 {margin: 0 0 10px;font-size: clamp(26px, 4.6vw, 44px);letter-spacing: -0.02em;font-weight: 800;background: linear-gradient(135deg, #0078ff, #00c9a7); -webkit-background-clip: text;
    background-clip: text; color: transparent;}
.a-hero-content .lede { margin: 0 0 14px; max-width: 56ch; color: #344155; }
.a-hero-image img {width: 100%; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.08);box-shadow: 0 20px 50px rgba(0, 120, 255, 0.25); object-fit: cover; }
.a-hero .cta {justify-content: flex-start;}
.a-hero-facts {display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-content: start; }

    
.a-grid {display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: 14px;}
@media (max-width:1120px) {.a-grid {grid-template-columns: 1fr 1fr;}}
@media (max-width:640px) {.a-grid {grid-template-columns: 1fr;}}

.a-card {border: 1px solid rgba(0,120,255,.15);border-radius: 14px;padding: 14px;background: linear-gradient(145deg, rgba(255,255,255,.75), rgba(240,247,255,.88));box-shadow: 0 6px 16px rgba(0,0,0,.05);}
.a-card h3 {margin: 0 0 6px;font-size: 16px;color: #005c80;}
.a-card p {margin: 0;color: var(--text);}

.about .btn.ghost { background: rgba(0,0,0,.20);color: #8a93a0; border: 1px solid rgba(255,255,255,.10);}
.about .btn.ghost:hover { background: rgba(0,0,0,.40); color: #fff; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.capabilities { position: relative; background: linear-gradient(180deg, rgba(0,120,255,0.04), rgba(0,201,167,0.04)); border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);padding: clamp(36px,6vw,72px) 20px; border-radius: 16px;box-shadow: 0 8px 24px rgba(0,0,0,0.08); }

.cap-intro {max-width: 900px; margin: 0 auto 24px; text-align: center; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px; padding: 16px 20px; color: var(--text); box-shadow: inset 0 0 30px rgba(0,120,255,0.06); }
.cap-intro abbr { text-decoration: underline dotted; text-underline-offset: 3px; cursor: help; color: var(--primary);font-weight: 600; }
.capabilities h2 { text-align: center;margin-bottom: 18px;}
.capabilities .cap-matrix { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1120px) { .capabilities .cap-matrix { grid-template-columns: 1fr 1fr; }}
@media (max-width: 640px) { .capabilities .cap-matrix {  grid-template-columns: 1fr; }}
.capabilities .cap-matrix > div { background: linear-gradient(145deg,#1e2633,#2b3340);border: 1px solid rgba(255,255,255,0.08); border-radius: 14px;
    padding: 16px; box-shadow: 0 8px 22px rgba(0,0,0,0.25);transition: transform .18s ease, box-shadow .18s ease;}
.capabilities .cap-matrix > div:hover {transform: translateY(-3px);  box-shadow: 0 16px 36px rgba(0,120,255,0.25); }
.capabilities .cap-matrix h3 { margin-bottom: 8px;background: linear-gradient(135deg,#1daeff,#00e0c6);-webkit-background-clip: text; background-clip: text;color: transparent;}
.capabilities .cap-matrix li {color: #d6dee8;}
*/

/* ---------- Technology Page ---------- */
.technology {
    position: relative;
    z-index: 1;
}

.tch-hero { background: radial-gradient(900px 520px at 65% 35%, rgba(0,120,255,.10), transparent 60%), radial-gradient(700px 380px at 25% 75%, rgba(0,201,167,.10), transparent 60%), var(--bg);   border-bottom: 1px solid var(--border);}
.tch-hero-inner { max-width: 1120px; margin: 0 auto; padding: clamp(24px,5vw,44px) 20px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px; align-items: center; }
@media (max-width: 960px) {.tch-hero-inner { grid-template-columns: 1fr; }}

.tch-hero-content h1 {font-size: clamp(28px, 5vw, 48px);font-weight: 800;margin-bottom: 10px;background: linear-gradient(135deg, #0078ff, #00c9a7);-webkit-background-clip: text;background-clip: text; color: transparent;}
.tch-hero-content .lede { margin-bottom: 14px;max-width: 60ch; color: #344155;}
.tch-hero-image img { width: 100%;border-radius: 18px;border: 1px solid rgba(255,255,255,.08);box-shadow: 0 20px 50px rgba(0,120,255,.25);object-fit: cover;}

.tech-grid {display: grid;grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px;}
@media (max-width: 960px) {.tech-grid { grid-template-columns: 1fr 1fr;}}
@media (max-width: 640px) {.tech-grid { grid-template-columns: 1fr; }}

.tech-card {background: linear-gradient(145deg,#1e2633,#2b3340);border: 1px solid rgba(255,255,255,.08);border-radius: 14px; padding: 16px; box-shadow: 0 8px 22px rgba(0,0,0,.25);transition: transform .18s ease, box-shadow .18s ease;}
.tech-card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(0,120,255,.25); }
.tech-card h3 { margin-bottom: 6px; background: linear-gradient(135deg,#1daeff,#00e0c6); -webkit-background-clip: text;  background-clip: text; color: transparent; }
.tech-card p {  color: #d6dee8; margin: 0; }

.tch-hero .btn { display: inline-block; padding: 0.75rem 1.8rem; font-size: 1rem; font-weight: 600; border-radius: 12px; text-decoration: none;transition: all 0.25s ease; cursor: pointer;line-height: 1.2; }
.tch-hero .btn.primary {background: linear-gradient(135deg, #0078ff, #00c9a7); color: #fff; border: none; box-shadow: 0 4px 12px rgba(0,120,255,0.25); }
.tch-hero .btn.primary:hover { transform: translateY(-2px);box-shadow: 0 6px 18px rgba(0,120,255,0.35); opacity: 0.95; }

.tch-hero .btn.ghost {background: transparent; color: #0078ff; border: 2px solid #0078ff; box-shadow: none; }
.tch-hero .btn.ghost:hover {background: rgba(0,120,255,0.08); color: #005fcc; border-color: #005fcc; }

/* Optional: button spacing */
.tch-hero .cta {display: flex;flex-wrap: wrap; gap: 12px; margin-top: 18px;}

/* ---------- Technology Page ---------- */


/* ---------- Industries Page ---------- */
.ind-hero {
    position: relative;
    background: radial-gradient(900px 520px at 65% 35%, rgba(0,120,255,.10), transparent 60%), radial-gradient(700px 380px at 25% 75%, rgba(0,201,167,.10), transparent 60%), var(--bg);
    border-bottom: 1px solid var(--border);
    overflow: hidden;
}

.ind-hero-inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: clamp(28px,5vw,48px) 20px;
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 24px;
    align-items: center;
}

@media (max-width: 980px) {
    .ind-hero-inner {
        grid-template-columns: 1fr;
        text-align: center;
    }
}

.ind-hero-content h1 {
    font-size: clamp(28px, 5vw, 48px);
    color: var(--text);
    font-weight: 800;
    margin-bottom: 10px;
}

.ind-hero-content .lede {
    font-size: clamp(15px, 1.7vw, 18px);
    color: var(--text-muted);
    max-width: 58ch;
}

.ind-hero-image img {
    width: 100%;
    height: auto;
    border-radius: 14px;
    box-shadow: 0 16px 44px rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.08);
}
/* Grid of industries */
.ind-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
}

@media (max-width: 1024px) {
    .ind-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .ind-grid {
        grid-template-columns: 1fr;
    }
}

.ind-card {
    background: linear-gradient(145deg, #1e2633, #2b3340);
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.08);
    padding: 16px;
    color: #e6eaf0;
    box-shadow: 0 8px 22px rgba(0,0,0,.35);
    transition: transform .18s ease, box-shadow .18s ease;
}

    .ind-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 36px rgba(0,120,255,.35);
    }

    .ind-card h3 {
        margin-bottom: 8px;
        color: #f1f5fa; /* brightened header text for visibility */
        font-size: 18px;
        font-weight: 700;
    }


    .ind-card p {
        color: #b3bdca;
        font-size: 14px;
    }

/* Insight section */
.insight {
    background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,0));
    padding: clamp(30px,6vw,60px) 20px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

    .insight p {
        max-width: 900px;
        margin: 0 auto;
        color: var(--text-muted);
        font-size: 16px;
    }
/* ---------- Industries Page ---------- */


/* ---------- Solution Page ------------- */
.sol-page { position: relative;z-index: 1; color: var(--text);}

/* HERO */
.sol-hero {background: radial-gradient(800px 400px at 70% 30%, rgba(0,120,255,.1), transparent 60%), radial-gradient(600px 360px at 30% 80%, rgba(0,201,167,.1), transparent 60%), var(--bg);border-bottom: 1px solid var(--border);}
.sol-hero-inner { max-width: 1120px;margin: 0 auto;padding: clamp(28px, 6vw, 64px) 20px;}
.sol-hero h1 {font-size: clamp(30px, 5vw, 48px);font-weight: 800;background: var(--grad);-webkit-background-clip: text;background-clip: text;color: transparent;margin: 0 0 10px;}

.sol-lede {max-width: 65ch;color: var(--text-muted); margin: 0;}
.sol-section {padding: clamp(36px, 7vw, 72px) 20px; border-bottom: 1px solid rgba(255,255,255,.06); }

.sol-dark { background: linear-gradient(145deg,#1b2230,#2b3340);}
.sol-light {background: var(--bg); border-bottom: 1px solid var(--border); }

.sol-inner { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 32px; }
@media (max-width: 900px) { .sol-inner { display: flex; flex-direction: column; }
.sol-reverse { flex-direction: column-reverse; }
}

/* HEADINGS */
.sol-text h2 {font-size: clamp(22px, 4vw, 32px); font-weight: 800; margin-bottom: 10px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sol-light .sol-text h2 { background: none;color: #0b182f;}

/* BODY COPY */
.sol-text p { color: #cfd6e3; margin-bottom: 12px;}
.sol-light .sol-text p { color: #374151;}
.sol-text ul { margin: 0 0 12px 18px;color: #d6dee8;}
.sol-text li { margin: 4px 0; }
.sol-light .sol-text ul { color: #4b5563;}

/* IMAGES */
.sol-img img { width: 100%; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); box-shadow: 0 16px 40px rgba(0,120,255,.25); object-fit: cover;}
.sol-light .sol-img img { box-shadow: 0 12px 32px rgba(0,120,255,.18);}

/* TAGS */
.sol-tags {display: flex; flex-wrap: wrap; gap: 8px; }
.sol-tags span { padding: 8px 12px; border-radius: 999px;font-weight: 700;font-size: 12px;color: #fff;background: linear-gradient(135deg,#1daeff,#00e0c6);box-shadow: 0 2px 8px rgba(0,120,255,.25); }

/* CTA */

.sol-cta {text-align: center;padding: clamp(48px, 8vw, 96px) 20px;background: radial-gradient(700px 400px at 20% 30%, rgba(0,120,255,.1), transparent 60%), radial-gradient(600px 360px at 80% 80%, rgba(0,201,167,.1), transparent 60%), var(--bg);}
.sol-cta h3 {font-size: clamp(22px, 4vw, 32px); margin-bottom: 8px; }
.sol-cta p {color: var(--text-muted); max-width: 70ch; margin: 0 auto 20px; }

.sol-btn {display: inline-block;background: var(--grad);color: #fff;padding: 12px 24px;border-radius: 12px;font-weight: 700;text-decoration: none;box-shadow: 0 6px 20px rgba(0,120,255,.25);transition: transform .15s ease;}
.sol-btn:hover { transform: translateY(-2px);}

.sol-text .sol-link { display: inline-block; margin-top: 1.25rem; color: var(--primary); font-weight: 500; text-decoration: none; transition: color 0.2s ease, text-decoration 0.2s ease;}
.sol-text .sol-link:hover { color: var(--accent); text-decoration: underline;}

    /*****HOME*/
/* ===========================================================
   Home Page Styles (hm-) — Two-Scheme Color System
   - .hm-dark → for dark backgrounds (hero, glass/panel cards)
   - .hm-light → for light backgrounds (light cards, light sections)
   =========================================================== */

/* ----- Base scope for page ----- */
.home.hm {
    --ring: rgba(0,120,255,.18);
    color: var(--hm-body);
}

/* ================================
   COLOR SCHEMES (variables only)
   ================================ */

/* Dark scheme: use on dark backgrounds (hero, panel/glass cards) */
.hm-dark {
    --hm-head: #ffffff; /* headings, strong labels */
    --hm-body: #e9f1ff; /* paragraph text */
    --hm-muted: #cbd8f5; /* secondary/body-muted */
    --hm-link: #b7dbff; /* inline link color */
    --hm-link-hover: #d1e8ff;
}

/* Light scheme: use on light backgrounds (white / very light) */
.hm-light {
    --hm-head: #0b1220;
    --hm-body: #1a2433;
    --hm-muted: #334155;
    --hm-link: #0647a6;
    --hm-link-hover: #053a88;
}

/* Typography binding (inherits scheme vars) */
.hm-dark h1, .hm-dark h2, .hm-dark h3, .hm-dark .h1, .hm-dark .h2, .hm-dark .h3 {color: var(--hm-head);}
.hm-light h1, .hm-light h2, .hm-light h3, .hm-light .h1, .hm-light .h2, .hm-light .h3 {color: var(--hm-head);}
.hm-dark p, .hm-dark li, .hm-dark .lead, .hm-dark .text-body {color: var(--hm-body);}
.hm-light p, .hm-light li, .hm-light .lead, .hm-light .text-body {color: var(--hm-body);}
.hm-dark .text-muted, .hm-dark .text-secondary { color: var(--hm-muted) !important;}
.hm-light .text-muted, .hm-light .text-secondary { color: var(--hm-muted) !important;}
.hm-dark .lnk { color: var(--hm-link);}
.hm-dark .lnk:hover { color: var(--hm-link-hover); text-decoration: underline; }
.hm-light .lnk { color: var(--hm-link);}
.hm-light .lnk:hover { color: var(--hm-link-hover); text-decoration: underline; }
.hm-gradient-text { color: var(--hm-head);}
.hm-dark .hm-gradient-text { background: linear-gradient(135deg,#0c7cf0,#00c9a7);-webkit-background-clip: text; background-clip: text; color: transparent;}
.hm-light .hm-gradient-text { background: none; color: var(--hm-head);}
.hm-section-py { padding: clamp(28px,6vw,64px) 0;}

.hm-hero { position: relative;background: radial-gradient(900px 520px at 85% 20%, rgba(0,120,255,.18), transparent 60%), radial-gradient(700px 420px at 15% 90%, rgba(0,201,167,.15), transparent 65%), linear-gradient(180deg, #0d1320 0%, #0a0f1a 100%);
    border-bottom: 1px solid rgba(255,255,255,.08);color: #edf3ff;isolation: isolate;z-index: 0;}
.hm-hero h1, .hm-hero h2, .hm-hero h3 {
        color: #ffffff;
        font-weight: 700;
        line-height: 1.15;
    }

    .hm-hero .brand {
        background: linear-gradient(135deg, #1daeff, #00e0c6);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .hm-hero .lead, .hm-hero p {
        color: #e8efff;
        font-size: 1.1rem;
        font-weight: 400;
        max-width: 60ch;
    }

    .hm-hero .btn-primary {
        background: linear-gradient(135deg, #0078ff, #00c9a7);
        border: none;
        color: #fff;
        font-weight: 600;
        box-shadow: 0 10px 24px rgba(0,120,255,.28);
    }

        .hm-hero .btn-primary:hover {
            filter: brightness(1.1);
            transform: translateY(-1px);
        }

    .hm-hero .btn-outline-primary {
        border: 1px solid rgba(255,255,255,0.5);
        color: #f2f7ff;
    }

        .hm-hero .btn-outline-primary:hover {
            background: rgba(255,255,255,0.1);
            color: #ffffff;
        }

    .hm-hero .hm-pill {
        color: #fff;
        border: 1px solid rgba(255,255,255,0.25);
        background: rgba(255,255,255,0.08);
    }

    .hm-hero .hm-hero-img img {
        border-radius: 20px;
        box-shadow: 0 20px 40px rgba(0,0,0,0.45);
        border: 1px solid rgba(255,255,255,0.1);
    }

    .hm-hero .hm-hero-accent {
        position: absolute;
        inset: auto 0 -40px 0;
        height: 120px;
        background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.5) 100%);
        filter: blur(16px);
        pointer-events: none;
        opacity: 0.7;
        z-index: 0;
    }

/* ---------- GLOBAL ELEMENTS ---------- */
.hm .hm-section-py { padding: 20px 0;}
@media (max-width: 767.98px) { .hm .hm-section-py { padding: 44px 0; }}

.hm-pill { padding: .2rem .6rem; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(255,255,255,.08);  color: #fff;}
.hm-chip { display: inline-flex; align-items: center;gap: .4rem;padding: .45rem .75rem;border-radius: 999px;font-size: .8rem;font-weight: 700;color: #fff;background: linear-gradient(135deg,#1daeff,#00e0c6);    box-shadow: 0 2px 8px rgba(0,120,255,.25);}

.hm-divider {display: grid;place-items: center;padding: 16px 0;}
.hm-divider > span { width: 100%; max-width: 1200px; height: 1px; display: block;}
.hm-gradient > span {background: linear-gradient(90deg, transparent, rgba(0,120,255,.35), transparent);}
.hm-dotted > span {background: repeating-linear-gradient(90deg, rgba(0,120,255,.35) 0 12px, transparent 12px 24px);}

.hm-values {background: linear-gradient(180deg, rgba(0,120,255,.05), transparent 60%), var(--bg);border-top: 1px solid var(--border);border-bottom: 1px solid var(--border);}
.hm-card-glass {background: linear-gradient(135deg, rgba(0,120,255,.18) 0%, rgba(0,201,167,.12) 100%), rgba(20,28,44,.85);border: 1px solid rgba(255,255,255,.15);
    border-radius: 14px; box-shadow: 0 6px 24px rgba(0,120,255,.25), inset 0 1px 0 rgba(255,255,255,.08);color: #eaf3ff;transition: transform .25s ease, box-shadow .25s ease;}
.hm-card-glass:hover {transform: translateY(-4px); box-shadow: 0 10px 32px rgba(0,200,255,.35), inset 0 1px 0 rgba(255,255,255,.1);}
.hm-card-glass h3 { color: #ffffff; font-weight: 600; }
.hm-card-glass p {color: #d4e2ff;}

.hm-card-panel {
    background: linear-gradient(145deg,#1e2633,#2b3340);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 14px;
    color: var(--hm-body);
}

    .hm-card-panel h3 {
        color: var(--hm-head);
    }

.hm-card-light {
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
    color: var(--hm-body);
}

    .hm-card-light h3 {
        color: var(--hm-head);
    }

.hm-shadow-xs {
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.hm-shadow-md {
    box-shadow: 0 16px 40px rgba(0,120,255,.22);
}

/* ---------- SOLUTIONS / TECH / CTA ---------- */
.hm-sol, .hm-tech, .hm-cta, .hm-trust, .hm-values {
    color: var(--hm-body);
}

    /* Alternating solution rows for contrast */
    .hm-sol .hm-card-row {
        margin-bottom: 24px;
    }

        .hm-sol .hm-card-row:nth-child(odd) {
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
            padding: 16px;
        }

@media (max-width: 991.98px) {
    .hm-sol .hm-card-row {
        padding: 12px;
        border-radius: 14px;
    }
}

.hm-card-row img {
    object-fit: cover;
    border-radius: 16px;
}

/* Tech band background */
.hm-tech {
    background: radial-gradient(700px 360px at 25% 25%, rgba(0,120,255,.10), transparent 60%), radial-gradient(700px 360px at 75% 75%, rgba(0,201,167,.10), transparent 60%), var(--bg);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

    .hm-tech .hm-chip {
        font-size: .9rem;
    }

.hm-cta { background: linear-gradient(180deg, transparent, rgba(0,120,255,.06)); border-top: 1px solid var(--border);}
.hm-trust {border-top: 1px solid var(--border); box-shadow: 0 -14px 28px -24px rgba(0,0,0,.35) inset;}

.rounded-4 { border-radius: 1.25rem !important; }
.fw-700 { font-weight: 700;}
.lnk {font-weight: 600; text-decoration: none; border-bottom: 1px solid transparent; color: var(--hm-link);}
.lnk:hover { color: var(--hm-link-hover); border-bottom-color: currentColor; }

.hm-hero, .hm-card-glass, .hm-card-panel {--hm-head: #ffffff;--hm-body: #e9f1ff;--hm-muted: #cbd8f5;--hm-link: #b7dbff;--hm-link-hover: #d1e8ff;}
.hm-sol, .hm-tech, .hm-cta, .hm-trust, .hm-values, .hm-card-light { --hm-head: #0b1220; --hm-body: #1a2433; --hm-muted: #4b5563; --hm-link: #0647a6; --hm-link-hover: #053a88;}

.text-muted { color: var(--hm-muted) !important;}
@media (prefers-reduced-motion: reduce) { .btn:hover { transform: none !important; }}
@media (min-width:1400px) {.container-xl { max-width: 1240px; }}

/* ---------- Image height per device ---------- */

.hm-card-row .ratio.ratio-16x9 { --bs-aspect-ratio: 80%; }
@media (min-width: 768px) and (max-width: 991.98px) {.hm-card-row .ratio.ratio-16x9 {--bs-aspect-ratio: 40%; }} /* balanced height for iPads/tablets */
@media (max-width: 767.98px) {.hm-card-row .ratio.ratio-16x9 { --bs-aspect-ratio: 56.25%; }}/* true 16:9 on mobile */ 

/* ------ Home ------- */


/******EXTRA*******/
.text-muted { color: #777    !important;}
.btn-smx { padding: 0.25rem 0.5rem; font-size: 0.75rem; line-height: 1.0;  display: inline-flex; align-items: center; justify-content: center; }
.btn-success, .btn-warning, .btn-info, .btn-danger { width: 140px !important; height: 34px !important; padding: 0 !important; line-height: 34px !important; text-align: center; }
.form-control[readonly] {
    background: #334155 !important;
    color: #e5e7eb !important;
    opacity: 1 !important;
}

/****** FORM  ***********/
/** Forms **/
.form-group, .input-group { margin-bottom: 0.7em !important; clear: both !important }
.form-group label { font-size: 14px !important;  margin-bottom: 1px !important; }
.input-group label { font-size: 13px !important; margin-bottom: 1px !important; width: 100% !important; }
.input-group .required:before, .form-group .required:before { content: "\2605"; padding: 0 2px 0 0 !important; color: #c00 !important; }
/** Forms **/
.box-page-height {
    min-height: 90vh;
}

    .box-page-height .row {
        height: auto !important;
    }
 .box-page{display:flex;align-items:center;justify-content:center;padding:1rem;background:linear-gradient(135deg,#020617,#1e293b);color:#e5e7eb;}
.box-form .box-card{background:rgba(31,41,55,.9);border-radius:16px;border:1px solid rgba(148,163,184,.25);box-shadow:0 20px 40px rgba(0,0,0,.6);padding:1.75rem;display:flex;flex-direction:column;justify-content:center;}
.box-title{font-size:1.25rem;font-weight:600;color:#e5e7eb; text-align:center}
.box-form .btn-primary{font-weight:500;border-radius:999px;}
.box-form label{display:block;font-size:13px;margin-bottom:1px;color:#d1d5db;}
.box-form input,.box-form select,.box-form textarea{width:100%;padding:.25rem .4rem;border-radius:5px;border:1px solid #64748b;background:#334155;color:#e5e7eb;font-size:.9rem;line-height:1.3;transition:border-color .2s ease,background .2s ease;}
.box-form input:focus,.box-form select:focus,.box-form textarea:focus{outline:none;border-color:#60a5fa;background:#3b4d63;color:#fff;}
.box-form input[type="text"],.box-form input[type="password"],.box-form select{box-sizing:border-box;padding:.25rem .4rem;font-size:.9rem;line-height:1.3;}

.validation-errors, .validation-errors li, .validation-message { color: #ffca2c !important; }
/******************* FROM **************************/


/* tablex */

.tablex tbody tr:nth-child(odd) { background-color: #e9ecef !important;}
.tablex td { text-align: center !important; color: #333;}
.tablex th { background-color: #444 !important; text-align: center !important; color: #ffffff !important;}
.tablex .td-label { width: 170px;vertical-align: middle !important; white-space: nowrap; }
.table-bordered {border:1px solid #bbb!important}

/* Sortable Table */
.sortable-table th { cursor: pointer; user-select: none;}
.sortable-table th::after { content: "";}
.sortable-table th:not(.no-sort):hover::after { content: " ▲"; opacity: 0.4; margin-left: 4px; font-size: 10px; color: #eee; }
.sortable-table th:not(.no-sort)[data-sort-dir="asc"]::after { content: " ▲"; opacity: 1; }
.sortable-table th:not(.no-sort)[data-sort-dir="desc"]::after { content: " ▼"; opacity: 1; }
/* Sortable Table*/

/* tablex */
@media print {
    @page {
        size: auto;
        margin: 0.25in;
    }

    html,
    body {
        margin: 0 !important;
        padding: 0 !important;
        height: auto !important;
        overflow: visible !important;
    }

    .no-print,
    nav,
    header,
    .navbar,
    .top-row,
    .sidebar {
        display: none !important;
    }

    main,
    article.content,
    .content,
    .page,
    .layout,
    .print-area {
        position: static !important;
        top: auto !important;
        left: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .print-area {
        padding: 10px !important;
        box-sizing: border-box !important;
        page-break-after: avoid !important;
        break-after: avoid !important;
    }
}