/* =========================================================
   Laser Credit page styles
   ========================================================= */

.credit-hero {
	min-height: 900px;
	background-color: var(--lb-ink);
	background-size: cover; background-position: center;
}
.credit-hero .hero__content { padding-top: 360px; }

/* ---------- WHAT IS LASER CREDIT ---------- */
.section-what-credit { background: var(--lb-white); padding-block: 140px; }
.what-credit__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; align-items: start; }
.what-credit__copy { display: flex; flex-direction: column; gap: 20px; }
.what-credit__copy h2 { color: var(--lb-ink); }
.what-credit__copy p { font-family: var(--lb-font-body); font-weight: 300; font-size: 16px; line-height: 1.7; color: var(--lb-grey-500); }
.what-credit__benefits { display: grid; grid-template-columns: 1fr; gap: 20px; }
.what-credit__benefits article {
	padding: 28px 32px; background: var(--lb-off-white);
	border-left: 4px solid var(--lb-cream);
	border-radius: 0 var(--lb-radius-md) var(--lb-radius-md) 0;
}
.what-credit__benefits h3 { font-family: var(--lb-font-heading); font-weight: 500; font-size: 22px; color: var(--lb-ink); margin-bottom: 6px; }
.what-credit__benefits p { font-family: var(--lb-font-body); font-weight: 400; font-size: 14px; color: var(--lb-grey-500); }

/* ---------- CREDIT TIERS ---------- */
.section-credit-tiers { background: var(--lb-ink); color: var(--lb-white); padding-block: 140px; }
.credit-tiers__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; max-width: 880px; margin-inline: auto; }
.credit-tier {
	padding: 48px 40px; background: rgba(255,255,255,0.04);
	border: 1px solid var(--lb-white-20); border-radius: var(--lb-radius-md);
	text-align: center; transition: border-color .3s ease, transform .3s ease;
}
.credit-tier:hover { transform: translateY(-4px); border-color: var(--lb-cream); }
.credit-tier--featured { background: var(--lb-cream); color: var(--lb-ink); border-color: var(--lb-cream); }
.credit-tier__pct {
	font-family: var(--lb-font-display); font-weight: 400; font-size: 96px;
	color: var(--lb-cream); line-height: 1; letter-spacing: -2px;
}
.credit-tier--featured .credit-tier__pct { color: var(--lb-ink); }
.credit-tier h3 { font-family: var(--lb-font-heading); font-weight: 500; font-size: 20px; letter-spacing: 1px; text-transform: uppercase; color: var(--lb-white); margin: 8px 0; }
.credit-tier--featured h3 { color: var(--lb-ink); }
.credit-tier p { font-family: var(--lb-font-body); font-weight: 300; font-size: 14px; color: var(--lb-white-90); }
.credit-tier--featured p { color: var(--lb-ink); }
.credit-tier strong { color: var(--lb-cream); font-weight: 600; }
.credit-tier--featured strong { color: var(--lb-ink); font-weight: 700; }

/* ---------- HOW IT WORKS ---------- */
.section-how-credit { background: var(--lb-white); padding-block: 140px; }
.how-credit__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-ink); margin-top: 20px;
}
.how-credit__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.how-credit__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.how-credit-step {
	border: 3px solid var(--lb-cream); /* same card pattern as about-page Our Approach */
	background: var(--lb-white);
	padding: 64px 40px 72px; text-align: center;
	display: flex; flex-direction: column; align-items: center; gap: 18px;
}
.how-credit-step__num { font-family: var(--lb-font-body); font-weight: 400; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: var(--lb-grey-500); }
.how-credit-step h3 { font-family: var(--lb-font-heading); font-weight: 600; font-size: 25px; color: var(--lb-ink); }
.how-credit-step p { font-family: var(--lb-font-body); font-weight: 300; font-size: 15px; line-height: 1.9; color: var(--lb-grey-500); max-width: 380px; }

/* ---------- HOW TO PURCHASE ---------- */
.section-purchase { background: var(--lb-white); padding-block: 140px; }
.purchase__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-ink); margin-top: 20px;
}
.purchase__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.purchase__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.purchase-tile {
	position: relative; aspect-ratio: 671/440;
	background-size: cover; background-position: center;
	padding: 32px 40px 34px;
	display: flex; flex-direction: column; justify-content: space-between;
	align-items: flex-start;
}
/* scrim for legibility — the baked-in gradients are too subtle over light photos */
.purchase-tile::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(rgba(0,0,0,0.10) 30%, rgba(0,0,0,0.62) 80%);
	pointer-events: none;
}
.purchase-tile__num, .purchase-tile__copy { position: relative; z-index: 1; }
.purchase-tile__num {
	font-family: var(--lb-font-heading); font-weight: 300; font-size: 44px;
	letter-spacing: 2px; color: rgba(255,255,255,0.65); line-height: 1;
}
.purchase-tile__copy h3 {
	font-family: var(--lb-font-heading); font-weight: 500; font-size: 32px;
	color: var(--lb-white); margin-bottom: 12px;
}
.purchase-tile__copy p {
	font-family: var(--lb-font-body); font-weight: 300; font-size: 13px;
	letter-spacing: 1.5px; line-height: 1.65; color: rgba(255,255,255,0.9);
	max-width: 470px;
}

/* ---------- IMPORTANT INFO ---------- */
.section-important { background: var(--lb-white); padding-block: 150px; }
.important__inner {
	display: grid; grid-template-columns: 1fr 1fr; gap: 110px;
	align-items: center;
}
.important__copy { display: flex; flex-direction: column; }
.important__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-ink); margin: 22px 0 36px;
}
.important__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.important__copy > p:not(.eyebrow-sm) {
	font-family: var(--lb-font-body); font-weight: 300; font-size: 16px;
	line-height: 1.9; color: var(--lb-grey-500); max-width: 560px;
	margin-bottom: 26px;
}
.important__copy > p:last-child { margin-bottom: 0; }
.important__media { margin: 0; aspect-ratio: 1/1; overflow: hidden; }
.important__media img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- TERMS & CONDITIONS ---------- */
.section-terms { background: var(--lb-white); padding-block: 140px; }
.terms__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-ink); margin-top: 20px;
}
.terms__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.terms__list { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; max-width: 1180px; margin-inline: auto; }
.terms__list li {
	border: 2px solid rgba(253,235,187,0.7); /* thin cream frame per Figma */
	background: var(--lb-white);
	padding: 44px 36px 48px;
	display: flex; flex-direction: column; gap: 10px;
}
.terms__num {
	font-family: var(--lb-font-body); font-weight: 400; font-size: 14px;
	letter-spacing: 1.5px; color: var(--lb-grey-500); line-height: 1;
	margin-bottom: 6px;
}
.terms__list h4 { font-family: var(--lb-font-heading); font-weight: 600; font-size: 21px; color: var(--lb-ink); }
.terms__list p { font-family: var(--lb-font-body); font-weight: 300; font-size: 15px; line-height: 1.8; color: var(--lb-grey-500); max-width: 480px; }

/* ---------- CANCELLATION ---------- */
.section-cancellation {
	background-color: var(--lb-ink); color: var(--lb-white);
	background-size: cover; background-position: center;
	padding-block: 120px 110px;
}
.cancellation__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-white); margin-top: 20px;
}
.cancellation__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.cancellation__grid {
	display: grid; grid-template-columns: repeat(2, minmax(0, 440px));
	justify-content: center; gap: 48px; margin-bottom: 72px;
}
/* Figma: fill FFFFFF 49%, stroke FDEBBB 50% inside weight 4, Glass effect, padding 48 */
.cancellation-card {
	padding: 48px;
	background: rgba(255,255,255,0.49);
	border: 4px solid rgba(253,235,187,0.5);
	backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	text-align: center;
}
.cancellation-card h3 {
	font-family: var(--lb-font-body); font-weight: 600; font-size: 26px;
	color: var(--lb-ink); margin-bottom: 30px;
}
.cancellation-card__row {
	padding: 24px 0; border-bottom: 1px solid rgba(26,26,26,0.4);
}
.cancellation-card__row:last-child { border-bottom: 0; padding-bottom: 8px; }
.cancellation-card__label {
	display: block;
	font-family: var(--lb-font-body); font-weight: 400; font-size: 14px;
	line-height: 1.7; color: rgba(26,26,26,0.75);
}
.cancellation-card__row strong {
	display: block; margin-top: 8px;
	font-family: var(--lb-font-body); font-weight: 400; font-size: 28px;
	color: var(--lb-ink);
}
.cancellation__note {
	max-width: 680px; margin: 0 auto; text-align: center;
	font-family: var(--lb-font-body); font-weight: 300; font-size: 15px;
	line-height: 1.8; color: var(--lb-white);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1180px) {
	.what-credit__inner { grid-template-columns: 1fr; }
	.important__inner { grid-template-columns: 1fr; gap: 48px; }
	.credit-tiers__grid { grid-template-columns: 1fr; }
	.how-credit__steps { grid-template-columns: 1fr; }
	.purchase__grid { grid-template-columns: 1fr 1fr; }
	.terms__list { grid-template-columns: 1fr; }
	.cancellation__grid { grid-template-columns: 1fr; }
}
@media (max-width: 880px) {
	.section-what-credit, .section-credit-tiers, .section-how-credit, .section-purchase, .section-important, .section-terms, .section-cancellation { padding-block: 80px; }
	.purchase__grid { grid-template-columns: 1fr; }
	.purchase-tile { padding: 22px 24px; }
	.purchase-tile__copy h3 { font-size: 24px; }
	.credit-tier__pct { font-size: 72px; }
}

/* ===== PRE-PAY & SAVE (copy + pillars + image) ===== */
.section-what-credit { background: var(--lb-white); padding-block: 130px; }
.what-credit__inner {
	display: grid; grid-template-columns: 1fr 1.05fr; gap: 80px;
	align-items: center;
}
.what-credit__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-ink); margin: 20px 0 36px;
}
.what-credit__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.what-credit__copy > p {
	font-family: var(--lb-font-body); font-weight: 300;
	font-size: 16px; line-height: 1.8; color: var(--lb-grey-700);
	margin-bottom: 22px;
}
.what-credit__pillars {
	margin-top: 48px;
	display: flex; flex-direction: column; gap: 42px;
}
.what-credit__media { margin: 0; }
.what-credit__media img { width: 100%; height: auto; display: block; }
@media (max-width: 980px) {
	.what-credit__inner { grid-template-columns: 1fr; gap: 40px; }
}

/* ===== DISCOUNT TIERS (glass cards over photo) ===== */
.section-credit-tiers {
	background-size: cover; background-position: center;
	background-color: #161412;
	padding-block: 110px 130px;
}
.credit-tiers__heading {
	font-family: var(--lb-font-heading); font-weight: 300;
	font-size: var(--lb-heading-section); line-height: 1.1;
	color: var(--lb-white); margin-top: 20px;
}
.credit-tiers__heading em {
	font-family: var(--lb-font-heading); font-weight: 700;
	font-style: normal; letter-spacing: 0;
}
.credit-tiers__grid {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px; max-width: 1100px; margin: 64px auto 0;
}
.credit-tier {
	background: rgba(34,31,28,0.55);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: none; border-radius: 0;
	padding: 60px 32px 64px; text-align: center;
	transform: none;
}
.credit-tier__pct {
	font-family: var(--lb-font-body); font-weight: 500;
	font-size: 56px; line-height: 1; color: var(--lb-cream);
	margin-bottom: 14px;
}
.credit-tier__label {
	display: block;
	font-family: var(--lb-font-body); font-weight: 300;
	font-size: 15px; color: var(--lb-white-70);
	margin-bottom: 30px;
}
.credit-tier p {
	font-family: var(--lb-font-body); font-weight: 500;
	font-size: 19px; color: var(--lb-white);
}
@media (max-width: 860px) {
	.credit-tiers__grid { grid-template-columns: 1fr; gap: 24px; }
}