/* ==========================================================================
   Section 2: Aggressive. Nimble. Responsive.
   Layout: aggressive_nimble_responsive
   Figma node: 493:1949
   Reference: pages/homepage-v4/figma/screenshots/02-aggressive-nimble-responsive.png
   Notes: two-column band; left = heading + quote on brand-navy;
          right = "How can we help?" pill on brand-blue flush to right edge.
   ========================================================================== */

.aggressive-nimble-responsive {
    background-color: var(--color-brand-navy);
    padding: 0;
    width: 100%;
    min-height: 305px;
    color: var(--color-white);
    overflow: hidden;
}

.aggressive-nimble-responsive-row {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    min-height: 305px;
    padding-left: clamp(24px, 5.2vw, 100px);
    padding-left: 5.2%;
    padding-right: 0;
    /* gap: clamp(40px, 16vw, 295px); */
}

.aggressive-nimble-responsive-left-col {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding-top: 36px;
	padding-bottom: 36px;
	padding-right: 15px;
	gap: 32px;
	max-width: calc(100% - 580px);
}

.aggressive-nimble-responsive-heading {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: clamp(36px, 4vw, 66px);
    font-weight: 400;
    line-height: 1.27;
    margin: 0;
}
@media (max-width: 1366px) {
    .aggressive-nimble-responsive-heading { white-space: normal; }
}

.aggressive-nimble-responsive-subheading {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
    font-style: italic;
    max-width: 516px;
    margin: 0;
    padding: 0;
    border: none;
}

/* Right column: "How can we help?" pill on brand-blue */
.aggressive-nimble-responsive-help-card {
	flex: 0 0 580px;
	max-width: 580px;
	background-color: var(--color-brand-blue);
	color: var(--color-white);
	padding: 22px 45px 34px 48px;
	display: flex;
	flex-direction: column;
	align-self: stretch;
	margin: 0 0 0 auto;
}

.aggressive-nimble-responsive-help-heading {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 500;
    line-height: 1.7;
    margin: 0 0 10px 0;
}

/* Responsive */
@media (max-width: 1440px) {
    .aggressive-nimble-responsive-row{
        padding-left: 35px;
    }
    /* .aggressive-nimble-responsive-row { gap: clamp(30px, 8vw, 180px); } */
    .aggressive-nimble-responsive-help-card { flex-basis: 520px; }
}

@media (max-width: 1200px) {
    .aggressive-nimble-responsive-row { gap: 40px; padding-left: 40px; }
    .aggressive-nimble-responsive-help-card { flex-basis: 460px; padding: 30px; }
}

@media (max-width: 991px) {
    .aggressive-nimble-responsive-row {
        flex-direction: column;
        padding-left: 20px;
        padding-right: 20px;
        gap: 0;
    }
    .aggressive-nimble-responsive-left-col {
        padding-top: 35px;
        padding-bottom: 35px;
        padding-right: 24px;
        max-width: 100%;
    }
    .aggressive-nimble-responsive-help-card {
        flex-basis: auto;
        width: 100%;
        max-width: none;
    }
}

@media (max-width: 767px) {
    .aggressive-nimble-responsive-help-card { padding: 28px 24px; }
    .aggressive-nimble-responsive-left-col { gap: 20px; padding-top: 36px; padding-bottom: 36px; }
}