/**
 * Fees & Pricing Page — all four sections.
 *
 * Figma source: UCDnXDulIVO8cyPbnrvJb5, nodes 1434:243 – 1434:378
 * Colour palette: teal (#2aadb5), dark-teal (#0e5f65), pink (#d4799a),
 *                 ink (#2e404f), slate (#5a6f80), surface (#f5f9fa).
 *
 * BEM namespace: .azuri-fees-*
 */

/* ==========================================================================
   1. INTRO
   ========================================================================== */

.azuri-fees-intro {
	background-color: var(--azuri-color-white, #fff);
	padding-top:      80px;
	padding-bottom:   50px;
}

.azuri-fees-intro__inner {
	align-items:  center;
	display:      flex;
	flex-direction: column;
	gap:          18px;
	max-width:    900px;
	margin-left:  auto;
	margin-right: auto;
	padding:      0;
	text-align:   center;
}

/* Eyebrow */
.azuri-fees-intro__eyebrow {
	color:          var(--azuri-color-teal, #2aadb5);
	font-family:    var(--azuri-font-family-base);
	font-size:      12px;
	font-weight:    var(--azuri-font-weight-semibold, 600);
	letter-spacing: 3px;
	line-height:    1;
	margin:         0;
	text-transform: uppercase;
}

/* Heading */
.azuri-fees-intro__heading {
	font-family: var(--azuri-font-family-base);
	font-size:   42px;
	font-weight: 300;
	line-height: 1.2;
	margin:      0;
	color:       var(--azuri-color-ink, #2e404f);
}

.azuri-fees-intro__heading-plain {
	font-weight: 300;
	color:       var(--azuri-color-ink, #2e404f);
}

.azuri-fees-intro__heading-italic {
	color:        var(--azuri-color-teal-700, #0e5f65);
	font-style:   italic;
	font-weight:  300;
	margin-left:  0;
}

/* Description */
.azuri-fees-intro__desc {
	color:       var(--azuri-color-slate, #5a6f80);
	font-family: var(--azuri-font-family-base);
	font-size:   15px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 26px;
	margin:      0;
	max-width:   820px;
}

/* ==========================================================================
   2. FEE CARDS
   ========================================================================== */

.azuri-fees-cards {
	background-color: #f5f9fa;
	padding-top:      50px;
	padding-bottom:   80px;
}

.azuri-fees-cards__row {
	gap:            0;
	align-items:    stretch;
}

.azuri-fees-cards__col-inner {
	display:  flex;
	height:   100%;
	padding:  0;
}

/* --- Card shell --- */
.azuri-fees-card {
	background:    var(--azuri-color-white, #fff);
	border-radius: 14px;
	box-shadow:    0 8px 24px rgba(15, 26, 46, 0.07);
	display:       flex;
	flex-direction: column;
	padding:       32px;
	width:         100%;
}

/* Badge */
.azuri-fees-card__badge-wrap {
	margin-bottom: 14px;
}

.azuri-fees-card__badge {
	border-radius:  var(--azuri-radius-pill, 999px);
	display:        inline-block;
	font-family:    var(--azuri-font-family-base);
	font-size:      8px;
	font-weight:    var(--azuri-font-weight-semibold, 600);
	letter-spacing: 1.5px;
	padding:        6px 12px;
	text-transform: uppercase;
}

/* Badge colour modifiers */
.azuri-fees-card--teal .azuri-fees-card__badge {
	background-color: rgba(42, 173, 181, 0.12);
	color:            var(--azuri-color-teal, #2aadb5);
}

.azuri-fees-card--dark-teal .azuri-fees-card__badge {
	background-color: rgba(14, 95, 101, 0.12);
	color:            var(--azuri-color-teal-700, #0e5f65);
}

.azuri-fees-card--pink .azuri-fees-card__badge {
	background-color: rgba(212, 121, 154, 0.12);
	color:            var(--azuri-color-pink, #d4789a);
}

/* Title */
.azuri-fees-card__title {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   20px;
	font-weight: var(--azuri-font-weight-medium, 500);
	line-height: 1.2;
	margin:      0 0 8px;
}

/* Fee row */
.azuri-fees-card__fee-row {
	align-items: baseline;
	display:     flex;
	gap:         6px;
	margin-bottom: 0;
}

.azuri-fees-card__fee-amount {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   36px;
	font-weight: 300;
	line-height: 1.1;
}

.azuri-fees-card__fee-label {
	color:       var(--azuri-color-slate, #5a6f80);
	font-size:   13px;
	font-weight: var(--azuri-font-weight-regular, 400);
}

/* Divider */
.azuri-fees-card__divider {
	background-color: #e1e8ed;
	height:           1px;
	margin:           18px 0;
	width:            100%;
}

/* Rebate row */
.azuri-fees-card__rebate-row {
	align-items:     center;
	display:         flex;
	justify-content: space-between;
	padding:         8px 0;
}

.azuri-fees-card__rebate-label {
	color:     var(--azuri-color-slate, #5a6f80);
	font-size: 13px;
}

.azuri-fees-card__rebate-amount {
	color:       var(--azuri-color-teal-700, #0e5f65);
	font-size:   15px;
	font-weight: var(--azuri-font-weight-semibold, 600);
}

/* You Pay box */
.azuri-fees-card__you-pay {
	align-items:     center;
	border-radius:   10px;
	display:         flex;
	justify-content: space-between;
	margin-top:      10px;
	padding:         14px 16px;
}

.azuri-fees-card--teal .azuri-fees-card__you-pay {
	background-color: rgba(42, 173, 181, 0.08);
}

.azuri-fees-card--dark-teal .azuri-fees-card__you-pay {
	background-color: rgba(14, 95, 101, 0.08);
}

.azuri-fees-card--pink .azuri-fees-card__you-pay {
	background-color: rgba(212, 121, 154, 0.08);
}

.azuri-fees-card__you-pay-label {
	color:       var(--azuri-color-ink, #2e404f);
	font-size:   13px;
	font-weight: var(--azuri-font-weight-medium, 500);
}

.azuri-fees-card__you-pay-amount {
	font-size:   18px;
	font-weight: var(--azuri-font-weight-semibold, 600);
}

.azuri-fees-card--teal .azuri-fees-card__you-pay-amount {
	color: var(--azuri-color-teal, #2aadb5);
}

.azuri-fees-card--dark-teal .azuri-fees-card__you-pay-amount {
	color: var(--azuri-color-teal-700, #0e5f65);
}

.azuri-fees-card--pink .azuri-fees-card__you-pay-amount {
	color: var(--azuri-color-pink, #d4789a);
}

/* --- Disclaimer bar --- */
.azuri-fees-cards__disclaimer-row {
	margin-top: 28px;
}

.azuri-fees-cards__disclaimer-inner {
	padding: 0;
}

.azuri-fees-disclaimer {
	background-color: rgba(255, 245, 225, 0.55);
	border:           1px solid rgba(251, 190, 73, 0.4);
	border-radius:    10px;
	padding:          16px 20px;
	text-align:       center;
}

.azuri-fees-disclaimer__text {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   14px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 22px;
	margin:      0;
}

/* ==========================================================================
   3. SAFETY NETS
   ========================================================================== */

.azuri-fees-safety {
	background-color: var(--azuri-color-white, #fff);
	padding-top:      90px;
	padding-bottom:   90px;
}

.azuri-fees-safety__row {
	gap: 0;
}

/* Left column */
.azuri-fees-safety__left {
	display:        flex;
	flex-direction: column;
	gap:            18px;
	padding-right:  40px;
}

/* Eyebrow */
.azuri-fees-safety__eyebrow {
	color:          var(--azuri-color-teal);
	font-family:    var(--azuri-font-family-base);
	font-size:      12px;
	font-weight:    var(--azuri-font-weight-semibold, 600);
	letter-spacing: 3px;
	line-height:    1;
	margin:         0;
	text-transform: uppercase;
}

/* Heading */
.azuri-fees-safety__heading {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   40px;
	font-weight: 300;
	line-height: 1.2;
	margin:      0;
}

.azuri-fees-safety__heading-plain {
	color:       var(--azuri-color-ink, #2e404f);
	font-weight: 300;
}

.azuri-fees-safety__heading-italic {
	color:       var(--azuri-color-teal-700, #0e5f65);
	font-style:  italic;
	font-weight: 300;
}

/* Description */
.azuri-fees-safety__desc {
	color:       var(--azuri-color-slate, #5a6f80);
	font-family: var(--azuri-font-family-base);
	font-size:   15px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 26px;
	margin:      0;
	max-width:   480px;
}

/* Right column */
.azuri-fees-safety__right {
	display:        flex;
	flex-direction: column;
	justify-content: center;
	padding-left:   40px;
}

/* Steps list */
.azuri-fees-safety__steps {
	display:        flex;
	flex-direction: column;
	gap:            16px;
	list-style:     none;
	margin:         0;
	padding:        0;
}

.azuri-fees-safety__step {
	align-items:      flex-start;
	background-color: #f5f9fa;
	border-radius:    12px;
	display:          flex;
	gap:              20px;
	padding:          22px 24px;
}

/* Number badge */
.azuri-fees-safety__step-num {
	align-items:     center;
	border-radius:   var(--azuri-radius-pill, 999px);
	color:           var(--azuri-color-white, #fff);
	display:         flex;
	flex-shrink:     0;
	font-family:     var(--azuri-font-family-base);
	font-size:       14px;
	font-weight:     var(--azuri-font-weight-semibold, 600);
	height:          40px;
	justify-content: center;
	line-height:     1;
	width:           40px;
}

.azuri-fees-safety__step-num--teal {
	background-color: var(--azuri-color-teal, #2aadb5);
}

.azuri-fees-safety__step-num--dark-teal {
	background-color: var(--azuri-color-teal-700, #0e5f65);
}

/* Step content */
.azuri-fees-safety__step-content {
	display:        flex;
	flex-direction: column;
	gap:            6px;
}

.azuri-fees-safety__step-heading {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   16px;
	font-weight: var(--azuri-font-weight-medium, 500);
	line-height: 1.4;
	margin:      0;
}

.azuri-fees-safety__step-text {
	color:       var(--azuri-color-slate, #5a6f80);
	font-family: var(--azuri-font-family-base);
	font-size:   14px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 22px;
	margin:      0;
}

/* ==========================================================================
   4. EMSN
   ========================================================================== */

.azuri-fees-emsn {
	background-color: #f5f9fa;
	padding-top:      80px;
	padding-bottom:   80px;
}

.azuri-fees-emsn__inner {
	padding: 0;
}

/* Card */
.azuri-fees-emsn__card {
	align-items:   flex-start;
	background:    var(--azuri-color-white, #fff);
	border-radius: 16px;
	box-shadow:    0 8px 24px rgba(15, 26, 46, 0.07);
	display:       flex;
	gap:           48px;
	padding:       44px 48px;
}

/* Teal stat box */
.azuri-fees-emsn__stat-box {
	align-items:      center;
	background-color: var(--azuri-color-teal, #2aadb5);
	border-radius:    14px;
	color:            var(--azuri-color-white, #fff);
	display:          flex;
	flex-direction:   column;
	flex-shrink:      0;
	gap:              4px;
	height:           160px;
	justify-content:  center;
	padding:          28px;
	text-align:       center;
	width:            220px;
}

.azuri-fees-emsn__stat-figure {
	font-family: var(--azuri-font-family-base);
	font-size:   72px;
	font-weight: 300;
	line-height: 1;
}

.azuri-fees-emsn__stat-label {
	font-family: var(--azuri-font-family-base);
	font-size:   12px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 1.5;
	opacity:     0.9;
	text-align:  center;
}

/* Card body */
.azuri-fees-emsn__card-body {
	display:        flex;
	flex: 1;
	flex-direction: column;
	gap:            14px;
	min-width:      0;
}

/* Badge */
.azuri-fees-emsn__badge-wrap {
	display: flex;
}

.azuri-fees-emsn__badge {
	background-color: rgba(42, 173, 181, 0.08);
	border-radius:    var(--azuri-radius-pill, 999px);
	color:            var(--azuri-color-teal);
	display:          inline-block;
	font-family:      var(--azuri-font-family-base);
	font-size:        10px;
	font-weight:      var(--azuri-font-weight-semibold, 600);
	letter-spacing:   1.5px;
	padding:          6px 12px;
	text-transform:   uppercase;
}

/* Title */
.azuri-fees-emsn__title {
	color:       var(--azuri-color-ink, #2e404f);
	font-family: var(--azuri-font-family-base);
	font-size:   24px;
	font-weight: var(--azuri-font-weight-medium, 500);
	line-height: 1.3;
	margin:      0;
}

/* Description */
.azuri-fees-emsn__desc {
	color:       var(--azuri-color-slate, #5a6f80);
	font-family: var(--azuri-font-family-base);
	font-size:   15px;
	font-weight: var(--azuri-font-weight-regular, 400);
	line-height: 26px;
	margin:      0;
}

/* ==========================================================================
   RESPONSIVE — tablet & mobile (≤ 1023px)
   ========================================================================== */

@media (max-width: 1023.98px) {

	/* Intro */
	.azuri-fees-intro {
		padding-top:    60px;
		padding-bottom: 40px;
	}

	.azuri-fees-intro__heading {
		font-size: 32px;
	}

	.azuri-fees-intro__inner {
		max-width: 100%;
	}

	/* Cards */
	.azuri-fees-cards {
		padding-top:    40px;
		padding-bottom: 60px;
	}

	.azuri-fees-cards__col-inner {
		padding: 8px 0;
	}

	/* Safety Nets */
	.azuri-fees-safety {
		padding-top:    60px;
		padding-bottom: 60px;
	}

	.azuri-fees-safety__left {
		padding-right: 0;
		margin-bottom: 40px;
	}

	.azuri-fees-safety__right {
		padding-left: 0;
	}

	.azuri-fees-safety__heading {
		font-size: 32px;
	}

	/* EMSN */
	.azuri-fees-emsn {
		padding-top:    60px;
		padding-bottom: 60px;
	}

	.azuri-fees-emsn__card {
		flex-direction: column;
		gap:            32px;
		padding:        32px;
	}

	.azuri-fees-emsn__stat-box {
		width:  100%;
		height: auto;
		padding: 24px;
	}

	.azuri-fees-emsn__stat-figure {
		font-size: 56px;
	}
}

/* ==========================================================================
   RESPONSIVE — mobile only (≤ 767px)
   ========================================================================== */

@media (max-width: 767.98px) {

	.azuri-fees-intro__heading {
		font-size: 28px;
	}

	.azuri-fees-safety__heading {
		font-size: 28px;
	}

	.azuri-fees-card__fee-amount {
		font-size: 36px;
	}
}
