/* =========================================================
   INDUSTRIES PAGE 
========================================================= */

.ind-page {

    --ind-navy: #061a2d;
    --ind-navy-2: #092b4b;
    --ind-blue: #287cf0;
    --ind-blue-light: #5ca8ff;
    --ind-orange: #ff9d22;

    --ind-text: #091b2e;
    --ind-muted: #69798c;

    --ind-light: #f5f8fc;
    --ind-border: #e2eaf2;

    color: var(--ind-text);
    background: #fff;

    overflow: hidden;
}

.ind-container {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.ind-section {
    padding: 110px 0;
}

.ind-white {
    background: #fff;
}

.ind-light {
    background: #f5f8fc;
}


/* =========================================================
   COMMON
========================================================= */

.ind-eyebrow {

    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: #71b6ff;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: 2px;
    text-transform: uppercase;
}

.ind-blue-eyebrow {
    color: #2878eb;
}

.ind-btn {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 50px;
    padding: 0 23px;

    border-radius: 9px;

    font-size: 12px;
    font-weight: 700;

    text-decoration: none;

    transition: .3s ease;
}

.ind-btn-primary {

    color: #fff;

    background:
        linear-gradient(
            135deg,
            #ffb02c,
            #f48613
        );

    box-shadow:
        0 12px 30px rgba(245,139,20,.24);
}

.ind-btn-primary:hover {

    transform: translateY(-3px);

    box-shadow:
        0 18px 38px rgba(245,139,20,.35);
}

.ind-btn-outline {

    color: #fff;

    border: 1px solid rgba(255,255,255,.2);

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

    backdrop-filter: blur(10px);
}

.ind-btn-outline:hover {

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

    transform: translateY(-3px);
}


/* =========================================================
   HERO
========================================================= */

.ind-hero {

    position: relative;

    min-height: 750px;

    display: flex;
    align-items: center;

    color: #fff;

    background:
        radial-gradient(
            circle at 80% 35%,
            rgba(39,125,248,.24),
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #041526,
            #082b4b 58%,
            #063c78
        );

    overflow: hidden;
}

.ind-hero-grid-bg {

    position: absolute;
    inset: 0;

    opacity: .35;

    background-image:
        linear-gradient(
            rgba(255,255,255,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.035) 1px,
            transparent 1px
        );

    background-size: 60px 60px;
}

.ind-hero-glow {

    position: absolute;

    border-radius: 50%;

    filter: blur(80px);

    pointer-events: none;
}

.ind-glow-1 {

    width: 350px;
    height: 350px;

    right: 5%;
    top: 5%;

    background: rgba(35,120,255,.15);
}

.ind-glow-2 {

    width: 250px;
    height: 250px;

    left: 20%;
    bottom: -150px;

    background: rgba(80,175,255,.1);
}

.ind-hero .ind-container {

    position: relative;
    z-index: 3;
}

.ind-hero-layout {

    display: grid;

    grid-template-columns:
        .86fr 1.14fr;

    gap: 65px;

    align-items: center;
}

.ind-hero-content h1 {

    max-width: 650px;

    margin: 17px 0 25px;

    font-size:
        clamp(48px, 5.5vw, 76px);

    line-height: .98;

    letter-spacing: -4px;
}

.ind-hero-content h1 span {

    display: block;

    color: #55a4ff;
}

.ind-hero-content > p {

    max-width: 570px;

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

    font-size: 15px;

    line-height: 1.8;
}

.ind-hero-buttons {

    display: flex;
    flex-wrap: wrap;

    gap: 11px;

    margin-top: 32px;
}

.ind-trust-row {

    display: flex;

    gap: 42px;

    margin-top: 52px;
}

.ind-trust-row div {

    display: flex;
    flex-direction: column;

    gap: 4px;
}

.ind-trust-row strong {

    font-size: 25px;
}

.ind-trust-row span {

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

    font-size: 14px;

    letter-spacing: 1px;

    text-transform: uppercase;
}


/* =========================================================
   HERO DASHBOARD
========================================================= */

.ind-hero-visual {

    position: relative;

    min-height: 510px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.ind-orbit {

    position: absolute;

    border: 1px solid rgba(70,160,255,.16);

    border-radius: 50%;
}

.ind-orbit-1 {

    width: 510px;
    height: 510px;
}

.ind-orbit-2 {

    width: 390px;
    height: 390px;
}

.ind-orbit-3 {

    width: 280px;
    height: 280px;
}

.ind-industry-dashboard {

    position: relative;
    z-index: 3;

    width: min(100%, 580px);

    padding: 16px;

    border: 1px solid rgba(255,255,255,.14);

    border-radius: 17px;

    background:
        rgba(6,25,43,.84);

    box-shadow:
        0 35px 90px rgba(0,0,0,.4);

    backdrop-filter: blur(20px);
}

.ind-dashboard-head {

    display: flex;

    align-items: center;
    justify-content: space-between;

    padding: 3px 4px 15px;
}

.ind-dashboard-head small {

    display: block;

    margin-bottom: 4px;

    color: #55a5ff;

    font-size: 7px;

    letter-spacing: 1.3px;
}

.ind-dashboard-head strong {

    font-size: 12px;

    color: rgba(255,255,255,.86);
}

.ind-status {

    padding: 5px 8px;

    border-radius: 20px;

    color: #5be1a7;

    background: rgba(65,215,153,.1);

    font-size: 8px;
}

.ind-dashboard-main {

    display: grid;

    grid-template-columns: 120px 1fr;

    min-height: 350px;

    border:
        1px solid rgba(255,255,255,.08);

    border-radius: 11px;

    overflow: hidden;
}

.ind-dashboard-side {

    padding: 15px 9px;

    border-right:
        1px solid rgba(255,255,255,.07);

    background: rgba(255,255,255,.025);
}

.ind-dashboard-side div {

    display: flex;

    align-items: center;

    gap: 8px;

    margin-bottom: 6px;

    padding: 9px 8px;

    border-radius: 6px;

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

    font-size: 14px;
}

.ind-dashboard-side span {

    color: rgba(255,255,255,.35);
}

.ind-dashboard-side .ind-side-active {

    color: #fff;

    background:
        rgba(48,126,239,.17);
}

.ind-dashboard-side .ind-side-active span {

    color: #62adff;
}

.ind-dashboard-content {

    padding: 18px;
}

.ind-dash-title {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 14px;

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

    font-size: 10px;
}

.ind-dash-title small {

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

    font-size: 8px;
}

.ind-stat-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 8px;
}

.ind-stat-grid > div {

    padding: 12px;

    border:
        1px solid rgba(255,255,255,.07);

    border-radius: 8px;

    background: rgba(255,255,255,.035);
}

.ind-stat-grid small {

    display: block;

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

    font-size: 10px;

    letter-spacing: .8px;
}

.ind-stat-grid strong {

    display: block;

    margin: 7px 0 3px;

    color: #fff;

    font-size: 21px;
}

.ind-stat-grid em {

    color: #49d49d;

    font-size: 7px;

    font-style: normal;
}

.ind-stat-grid em.ind-warning {

    color: #ffae48;
}

.ind-dashboard-chart {

    margin-top: 12px;

    padding: 13px;

    border:
        1px solid rgba(255,255,255,.07);

    border-radius: 8px;

    background: rgba(255,255,255,.025);
}

.ind-chart-head {

    display: flex;

    justify-content: space-between;

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

    font-size: 8px;
}

.ind-chart-head small {

    color: rgba(255,255,255,.28);
}

.ind-chart {

    height: 120px;

    display: flex;

    align-items: flex-end;

    gap: 12px;

    padding-top: 18px;
}

.ind-chart i {

    flex: 1;

    max-width: 25px;

    border-radius: 4px 4px 0 0;

    background:
        linear-gradient(
            to top,
            #1e69d2,
            #56a7ff
        );

    opacity: .85;
}

.ind-dash-bottom {

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 8px;

    margin-top: 10px;
}

.ind-dash-bottom div {

    display: flex;

    align-items: center;

    gap: 5px;

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

    font-size: 7px;
}

.ind-dash-bottom strong {

    margin-left: auto;

    color: rgba(255,255,255,.75);
}

.ind-dot-blue,
.ind-dot-orange,
.ind-dot-green {

    width: 6px;
    height: 6px;

    border-radius: 50%;
}

.ind-dot-blue {
    background: #3e91ff;
}

.ind-dot-orange {
    background: #ffad3f;
}

.ind-dot-green {
    background: #42d29c;
}


/* floating cards */

.ind-floating {

    position: absolute;
    z-index: 5;

    display: flex;
    align-items: center;

    gap: 10px;

    padding: 12px 15px;

    border:
        1px solid rgba(255,255,255,.13);

    border-radius: 10px;

    background:
        rgba(7,31,53,.9);

    box-shadow:
        0 20px 50px rgba(0,0,0,.35);

    backdrop-filter: blur(15px);
}

.ind-floating-top {

    top: 48px;
    right: -12px;
}

.ind-floating-bottom {

    bottom: 45px;
    left: -15px;
}

.ind-floating-icon,
.ind-floating-mini-icon {

    width: 32px;
    height: 32px;

    display: grid;
    place-items: center;

    border-radius: 8px;

    color: #62adff;

    background:
        rgba(43,126,242,.14);
}

.ind-floating-mini-icon {

    color: #ffae44;

    background:
        rgba(255,167,57,.12);
}

.ind-floating small {

    display: block;

    color: #65aaff;

    font-size: 10px;

    letter-spacing: 1px;
}

.ind-floating strong {

    display: block;

    margin-top: 3px;

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

    font-size: 14px;
}

.ind-floating > span {

    color: #42d49c;

    font-size: 12px;
}


/* =========================================================
   INTRO
========================================================= */

.ind-intro-grid {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 100px;

    align-items: center;
}

.ind-intro-grid h2 {

    max-width: 550px;

    margin: 15px 0 0;

    font-size:
        clamp(35px, 4vw, 53px);

    line-height: 1.04;

    letter-spacing: -2.3px;
}

.ind-intro-grid h2 span {

    display: block;

    color: var(--ind-blue);
}

.ind-intro-grid > div:last-child {

    padding-left: 30px;

    border-left:
        1px solid var(--ind-border);
}

.ind-intro-grid p {

    margin: 0 0 17px;

    color: var(--ind-muted);

    font-size: 14px;

    line-height: 1.85;
}


/* =========================================================
   CENTER HEADING
========================================================= */

.ind-center-heading {

    max-width: 750px;

    margin: 0 auto 60px;

    text-align: center;
}

.ind-center-heading h2 {

    margin: 14px 0;

    font-size:
        clamp(35px, 4vw, 53px);

    line-height: 1.04;

    letter-spacing: -2.2px;
}

.ind-center-heading h2 span {

    color: var(--ind-blue);
}

.ind-center-heading p {

    max-width: 600px;

    margin: auto;

    color: var(--ind-muted);

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   INDUSTRY CARDS
========================================================= */

.ind-industry-grid {

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 17px;
}

.ind-industry-card {

    position: relative;

    min-height: 330px;

    display: flex;
    flex-direction: column;

    padding: 26px;

    overflow: hidden;

    border:
        1px solid var(--ind-border);

    border-radius: 16px;

    color: var(--ind-text);

    background: #fff;

    text-decoration: none;

    transition: .35s ease;
}

.ind-industry-card:before {

    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -100px;
    bottom: -100px;

    border-radius: 50%;

    background:
        rgba(40,124,240,.055);

    transition: .35s ease;
}

.ind-industry-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #b9d4f5;

    box-shadow:
        0 25px 55px rgba(15,50,85,.1);
}

.ind-industry-card:hover:before {

    transform: scale(1.5);
}

.ind-card-active {

    border-color:
        rgba(40,124,240,.35);

    box-shadow:
        0 15px 40px rgba(40,124,240,.07);
}

.ind-card-icon {

    width: 48px;
    height: 48px;

    display: grid;
    place-items: center;

    border-radius: 11px;

    color: var(--ind-blue);

    background: #eaf3ff;

    font-size: 21px;
}

.ind-card-number {

    position: absolute;

    right: 23px;
    top: 28px;

    color: #c4cfda;

    font-size: 11px;

    font-weight: 700;
}

.ind-industry-card h3 {

    margin: 25px 0 8px;

    font-size: 20px;

    letter-spacing: -.5px;
}

.ind-industry-card p {

    max-width: 330px;

    margin: 0;

    color: var(--ind-muted);

    font-size: 12px;

    line-height: 1.7;
}

.ind-card-tags {

    display: flex;
    flex-wrap: wrap;

    gap: 6px;

    margin-top: 18px;
}

.ind-card-tags span {

    padding: 6px 8px;

    border-radius: 5px;

    color: #65768a;

    background: #f1f5f9;

    font-size: 8px;

    font-weight: 700;
}

.ind-card-link {

    display: flex;

    align-items: center;
    justify-content: space-between;

    margin-top: auto;
    padding-top: 22px;

    color: var(--ind-blue);

    font-size: 10px;

    font-weight: 800;
}

.ind-card-link b {

    font-size: 17px;
}


/* =========================================================
   DARK WORKFLOW
========================================================= */

.ind-dark {

    position: relative;

    color: #fff;

    background:
        radial-gradient(
            circle at 70% 30%,
            rgba(38,123,244,.18),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #041526,
            #082a49
        );

    overflow: hidden;
}

.ind-workflow-heading {

    display: flex;

    justify-content: space-between;
    align-items: flex-end;

    gap: 50px;

    margin-bottom: 80px;
}

.ind-workflow-heading h2 {

    max-width: 600px;

    margin: 14px 0 0;

    font-size:
        clamp(35px, 4vw, 52px);

    line-height: 1.03;

    letter-spacing: -2px;
}

.ind-workflow-heading h2 span {

    display: block;

    color: #55a4ff;
}

.ind-workflow-heading > p {

    max-width: 360px;

    margin: 0;

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

    font-size: 13px;

    line-height: 1.7;
}

.ind-workflow {

    position: relative;

    display: grid;

    grid-template-columns:
        repeat(5,1fr);

    gap: 25px;
}

.ind-workflow-line {

    position: absolute;

    left: 10%;

    right: 10%;

    top: 28px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(72,157,255,.05),
            rgba(72,157,255,.5),
            rgba(72,157,255,.05)
        );
}

.ind-workflow-item {

    position: relative;
    z-index: 2;

    text-align: center;
}

.ind-workflow-circle {

    width: 57px;
    height: 57px;

    display: grid;
    place-items: center;

    margin: 0 auto 20px;

    border:
        1px solid rgba(74,158,255,.4);

    border-radius: 50%;

    color: #66adff;

    background:
        #082d50;

    box-shadow:
        0 0 0 8px rgba(42,127,242,.05);

    font-size: 11px;

    font-weight: 800;
}

.ind-workflow-item > span {

    color: #56a5ff;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.ind-workflow-item h3 {

    margin: 9px 0;

    font-size: 15px;
}

.ind-workflow-item p {

    max-width: 170px;

    margin: auto;

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

    font-size: 10px;

    line-height: 1.7;
}


/* =========================================================
   COMPARISON
========================================================= */

.ind-split-heading {

    margin-bottom: 45px;
}

.ind-split-heading h2 {

    max-width: 750px;

    margin: 15px 0 0;

    font-size:
        clamp(35px, 4vw, 53px);

    line-height: 1.03;

    letter-spacing: -2.3px;
}

.ind-split-heading h2 span {

    color: var(--ind-blue);
}

.ind-comparison {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 20px;
}

.ind-comparison-side {

    padding: 35px;

    border-radius: 17px;

    border:
        1px solid var(--ind-border);
}

.ind-traditional {

    background:
        #f8fafc;
}

.ind-proclep {

    color: #fff;

    border-color:
        rgba(48,132,246,.3);

    background:
        linear-gradient(
            135deg,
            #071d32,
            #0a345a
        );

    box-shadow:
        0 20px 50px rgba(7,37,68,.12);
}

.ind-comparison-header {

    display: flex;

    align-items: center;
    justify-content: space-between;
}

.ind-comparison-header > span {

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.ind-traditional .ind-comparison-header > span {

    color: #8997a6;
}

.ind-proclep .ind-comparison-header > span {

    color: #62acff;
}

.ind-comparison-header div {

    width: 29px;
    height: 29px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    font-size: 13px;
}

.ind-traditional .ind-comparison-header div {

    color: #a1acb7;

    background: #e8edf2;
}

.ind-proclep .ind-comparison-header div {

    color: #55d9a0;

    background: rgba(65,216,156,.1);
}

.ind-comparison-side h3 {

    max-width: 430px;

    margin: 28px 0 30px;

    font-size: 27px;

    line-height: 1.18;

    letter-spacing: -.8px;
}

.ind-comparison-side ul {

    display: flex;
    flex-direction: column;

    gap: 14px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.ind-comparison-side li {

    display: flex;

    align-items: center;

    gap: 11px;

    font-size: 11px;

    line-height: 1.5;
}

.ind-traditional li {

    color: #69788a;
}

.ind-proclep li {

    color: rgba(255,255,255,.62);
}

.ind-comparison-side li span {

    flex: 0 0 20px;

    width: 20px;
    height: 20px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    font-size: 14px;
}

.ind-traditional li span {

    color: #a1abb5;

    background: #e9eef2;
}

.ind-proclep li span {

    color: #53d69f;

    background: rgba(69,215,157,.1);
}


/* =========================================================
   IMPACT
========================================================= */

.ind-impact {

    position: relative;

    padding: 115px 0;

    color: #fff;

    background:
        radial-gradient(
            circle at 15% 60%,
            rgba(30,115,242,.23),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #061a2d,
            #0a3157
        );

    overflow: hidden;
}

.ind-impact-grid {

    position: absolute;
    inset: 0;

    opacity: .25;

    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: 55px 55px;
}

.ind-impact-layout {

    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        .9fr 1.1fr;

    gap: 90px;

    align-items: center;
}

.ind-impact-content h2 {

    max-width: 550px;

    margin: 15px 0;

    font-size:
        clamp(37px,4vw,55px);

    line-height: 1.03;

    letter-spacing: -2.5px;
}

.ind-impact-content h2 span {

    display: block;

    color: #55a4ff;
}

.ind-impact-content p {

    max-width: 500px;

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

    font-size: 14px;

    line-height: 1.8;
}

.ind-impact-content .ind-btn {

    margin-top: 25px;
}

.ind-impact-stats {

    display: grid;

    grid-template-columns:
        repeat(2,1fr);

    gap: 13px;
}

.ind-impact-card {

    min-height: 180px;

    padding: 25px;

    border:
        1px solid rgba(255,255,255,.1);

    border-radius: 13px;

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

    backdrop-filter:
        blur(10px);

    transition: .3s ease;
}

.ind-impact-card:hover {

    transform: translateY(-5px);

    background:
        rgba(255,255,255,.07);
}

.ind-impact-card small {

    color: #5ca7ff;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.2px;
}

.ind-impact-card strong {

    display: block;

    margin: 17px 0 7px;

    font-size: 25px;
}

.ind-impact-card span {

    display: block;

    max-width: 190px;

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

    font-size: 10px;

    line-height: 1.6;
}


/* =========================================================
   FINAL CTA
========================================================= */

.ind-final-cta {

    padding-bottom: 110px;
}

.ind-final-box {

    position: relative;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 40px;

    padding: 60px 65px;

    overflow: hidden;

    border-radius: 20px;

    color: #fff;

    background:
        radial-gradient(
            circle at 90% 50%,
            rgba(45,134,255,.3),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #061a2d,
            #0a3762
        );
}

.ind-final-glow {

    position: absolute;

    width: 300px;
    height: 300px;

    left: -160px;
    bottom: -200px;

    border:
        1px solid rgba(255,255,255,.1);

    border-radius: 50%;
}

.ind-final-box > div {

    position: relative;
    z-index: 2;
}

.ind-final-box h2 {

    max-width: 600px;

    margin: 13px 0;

    font-size:
        clamp(32px,4vw,49px);

    line-height: 1.05;

    letter-spacing: -2px;
}

.ind-final-box h2 span {

    color: #58a6ff;
}

.ind-final-box p {

    max-width: 540px;

    margin: 0;

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

    font-size: 13px;

    line-height: 1.7;
}

.ind-final-buttons {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;
}

.ind-final-outline {

    color: #fff;

    border:
        1px solid rgba(255,255,255,.18);

    background:
        rgba(255,255,255,.05);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .ind-hero-layout {

        grid-template-columns: 1fr;

        gap: 60px;
    }

    .ind-hero {

        padding: 100px 0;
    }

    .ind-hero-content {

        max-width: 720px;

        margin: auto;

        text-align: center;
    }

    .ind-hero-content h1 {

        margin-left: auto;
        margin-right: auto;
    }

    .ind-hero-content > p {

        margin-left: auto;
        margin-right: auto;
    }

    .ind-hero-buttons,
    .ind-trust-row {

        justify-content: center;
    }

    .ind-hero-visual {

        max-width: 650px;

        width: 100%;

        margin: auto;
    }

    .ind-intro-grid {

        gap: 50px;
    }

    .ind-impact-layout {

        gap: 50px;
    }
}


@media (max-width: 900px) {

    .ind-industry-grid {

        grid-template-columns:
            repeat(2,1fr);
    }

    .ind-workflow {

        grid-template-columns:
            repeat(3,1fr);

        row-gap: 55px;
    }

    .ind-workflow-line {

        display: none;
    }

    .ind-workflow-heading {

        align-items: flex-start;

        flex-direction: column;
    }

    .ind-impact-layout {

        grid-template-columns: 1fr;
    }

    .ind-impact-content {

        text-align: center;
    }

    .ind-impact-content h2,
    .ind-impact-content p {

        margin-left: auto;
        margin-right: auto;
    }

    .ind-impact-stats {

        max-width: 700px;

        width: 100%;

        margin: auto;
    }

    .ind-final-box {

        align-items: flex-start;

        flex-direction: column;
    }
}


@media (max-width: 700px) {

    .ind-section {

        padding: 80px 0;
    }

    .ind-container {

        width:
            min(100% - 30px, 1180px);
    }

    .ind-hero {

        min-height: auto;

        padding: 80px 0;
    }

    .ind-hero-content h1 {

        font-size: 47px;

        letter-spacing: -2.8px;
    }

    .ind-hero-content > p {

        font-size: 14px;
    }

    .ind-hero-buttons {

        flex-direction: column;
    }

    .ind-hero-buttons .ind-btn {

        width: 100%;
    }

    .ind-trust-row {

        gap: 20px;

        margin-top: 40px;
    }

    .ind-trust-row strong {

        font-size: 21px;
    }

    .ind-trust-row span {

        font-size: 7px;
    }

    .ind-hero-visual {

        min-height: 400px;
    }

    .ind-orbit-1 {

        width: 390px;
        height: 390px;
    }

    .ind-orbit-2 {

        width: 300px;
        height: 300px;
    }

    .ind-orbit-3 {

        width: 220px;
        height: 220px;
    }

    .ind-dashboard-main {

        grid-template-columns: 80px 1fr;
    }

    .ind-dashboard-side div {

        font-size: 7px;
    }

    .ind-dashboard-content {

        padding: 12px;
    }

    .ind-stat-grid {

        grid-template-columns: 1fr;
    }

    .ind-stat-grid > div {

        padding: 9px;
    }

    .ind-stat-grid strong {

        font-size: 17px;
    }

    .ind-chart {

        height: 85px;

        gap: 6px;
    }

    .ind-floating-top {

        right: -5px;
        top: 15px;
    }

    .ind-floating-bottom {

        left: -5px;
        bottom: 20px;
    }

    .ind-floating {

        padding: 9px 11px;
    }

    .ind-floating strong {

        font-size: 8px;
    }

    .ind-intro-grid {

        grid-template-columns: 1fr;

        gap: 30px;
    }

    .ind-intro-grid > div:last-child {

        padding-left: 0;

        padding-top: 25px;

        border-left: 0;

        border-top:
            1px solid var(--ind-border);
    }

    .ind-center-heading h2,
    .ind-intro-grid h2,
    .ind-split-heading h2 {

        font-size: 36px;

        letter-spacing: -1.6px;
    }

    .ind-industry-grid {

        grid-template-columns: 1fr;
    }

    .ind-industry-card {

        min-height: 290px;
    }

    .ind-workflow {

        grid-template-columns:
            repeat(2,1fr);

        gap: 45px 20px;
    }

    .ind-comparison {

        grid-template-columns: 1fr;
    }

    .ind-comparison-side {

        padding: 27px;
    }

    .ind-comparison-side h3 {

        font-size: 23px;
    }

    .ind-impact {

        padding: 85px 0;
    }

    .ind-impact-content h2 {

        font-size: 38px;
    }

    .ind-final-box {

        padding: 40px 28px;
    }

    .ind-final-buttons {

        width: 100%;

        flex-direction: column;
    }

    .ind-final-buttons .ind-btn {

        width: 100%;
    }
}


@media (max-width: 480px) {

    .ind-hero-content h1 {

        font-size: 40px;

        letter-spacing: -2.2px;
    }

    .ind-trust-row {

        gap: 13px;
    }

    .ind-trust-row strong {

        font-size: 18px;
    }

    .ind-trust-row span {

        font-size: 10px;
    }

    .ind-hero-visual {

        min-height: 350px;
    }

    .ind-industry-dashboard {

        padding: 9px;
    }

    .ind-dashboard-main {

        min-height: 285px;

        grid-template-columns: 1fr;
    }

    .ind-dashboard-side {

        display: none;
    }

    .ind-dashboard-content {

        padding: 12px;
    }

    .ind-dashboard-head strong {

        font-size: 10px;
    }

    .ind-dash-bottom {

        grid-template-columns: 1fr;
    }

    .ind-dash-bottom div {

        padding: 3px 0;
    }

    .ind-floating {

        transform: scale(.82);
    }

    .ind-floating-top {

        right: -20px;
    }

    .ind-floating-bottom {

        left: -20px;
    }

    .ind-workflow {

        grid-template-columns: 1fr;
    }

    .ind-workflow-item p {

        max-width: 240px;
    }

    .ind-impact-stats {

        grid-template-columns: 1fr;
    }

    .ind-impact-card {

        min-height: 150px;
    }

    .ind-final-box h2 {

        font-size: 33px;
    }
}