/*
 * Szkoła Matematyki — home.css
 * Strona główna: hero, statystyki, metoda, cennik, założyciel,
 * formularz zapisu i mapa dojazdu.
 *
 * Generowane z podziału jednego arkusza. Edytuj ten plik, nie łącz z powrotem.
 */

/* Hero --------------------------------------------------------------------- */
.smf-hero {
	position: relative;
	overflow: hidden; /* blob nie może rozpychać strony w poziomie */
	background: var(--smf-surface);
	padding-block: var(--smf-s5) var(--smf-s6);
	scroll-margin-top: var(--smf-header-h);
}

.smf-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	opacity: .35;
	z-index: 0;
	pointer-events: none;
}

.smf-blob--a { width: 24rem; height: 24rem; background: #93c5fd; top: -4rem; left: -6rem; }

.smf-blob--b { width: 20rem; height: 20rem; background: var(--smf-gold); bottom: -4rem; right: -4rem; }

.smf-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--smf-s5);
	align-items: center;
}

.smf-pill {
	display: inline-flex;
	align-items: center;
	gap: .625rem;
	padding: .5rem 1rem;
	border-radius: 999px;
	background: var(--smf-blue-50);
	border: 1px solid var(--smf-blue-100);
	color: var(--smf-blue-dark);
	font-size: .8125rem;
	font-weight: 600;
	margin-bottom: var(--smf-s3);
}

.smf-dot { position: relative; display: flex; width: .625rem; height: .625rem; }

.smf-dot span { position: absolute; inset: 0; border-radius: 50%; background: var(--smf-blue); }

.smf-dot span:first-child { animation: smf-ping 1.6s cubic-bezier(0, 0, .2, 1) infinite; opacity: .7; }

@keyframes smf-ping { 75%, 100% { transform: scale(2.2); opacity: 0; } }

.smf-hero__title {
	font-size: clamp(2.125rem, 1.3rem + 3.6vw, 3.5rem);
	font-weight: 800;
	letter-spacing: -.02em;
	margin-bottom: var(--smf-s3);
}

.smf-mark { position: relative; white-space: nowrap; color: var(--smf-blue); }

.smf-mark svg {
	position: absolute;
	left: 0;
	bottom: -.35em;
	width: 100%;
	height: .3em;
	color: var(--smf-gold);
}

.smf-hero__text {
	font-size: 1.0625rem;
	color: #475569;
	max-width: 34rem;
	margin-bottom: var(--smf-s4);
}

.smf-hero__actions { display: flex; flex-direction: column; gap: .875rem; }

.smf-trust {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	margin-top: var(--smf-s4);
	padding-top: var(--smf-s4);
	border-top: 1px solid var(--smf-line);
}

.smf-trust__item { display: flex; align-items: center; gap: .75rem; }

.smf-trust__value { font-weight: 800; color: var(--smf-navy); font-family: Montserrat, sans-serif; }

.smf-trust__label { font-size: .75rem; color: var(--smf-muted); }

.smf-hero__media { position: relative; }

.smf-hero__media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--smf-radius-lg);
	border: 8px solid #fff;
	box-shadow: var(--smf-shadow-lg);
	position: relative;
	z-index: 1;
}

.smf-float {
	position: absolute;
	z-index: 2;
	top: 1.5rem;
	left: -.5rem;
	display: flex;
	align-items: center;
	gap: .875rem;
	padding: .875rem 1.125rem;
	border-radius: var(--smf-radius);
	background: #fff;
	box-shadow: var(--smf-shadow-lg);
}

.smf-float__title { font-weight: 700; font-size: .875rem; color: var(--smf-navy); }

.smf-float__sub { font-size: .75rem; color: var(--smf-muted); }

/* Statystyki --------------------------------------------------------------- */
.smf-stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--smf-s4) 1rem;
	text-align: center;
}

.smf-stats__value {
	font-family: Montserrat, sans-serif;
	font-size: clamp(2.25rem, 1.6rem + 2vw, 3rem);
	font-weight: 900;
	color: var(--smf-gold);
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.smf-stats__value small { font-size: .65em; }

.smf-stats__label {
	margin-top: .5rem;
	font-size: .8125rem;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--smf-on-navy);
}

/* Metoda ------------------------------------------------------------------- */
.smf-method { display: grid; gap: var(--smf-s5); }

.smf-method__img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--smf-radius-lg);
	box-shadow: var(--smf-shadow);
	margin-top: var(--smf-s3);
}

.smf-laws { display: grid; gap: var(--smf-s3) var(--smf-s4); }

.smf-law { display: flex; gap: 1rem; }

.smf-law__num {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	flex: 0 0 auto;
	border-radius: .875rem;
	background: #fff;
	box-shadow: var(--smf-shadow-sm);
	color: var(--smf-blue);
	font-family: Montserrat, sans-serif;
	font-weight: 700;
	font-size: 1.125rem;
}

.smf-law__title { font-size: 1.0625rem; font-weight: 700; margin-bottom: .375rem; }

.smf-law__text { font-size: .9375rem; color: var(--smf-muted); }

/* Cennik ------------------------------------------------------------------- */
.smf-pricing {
	display: grid;
	gap: var(--smf-s4);
	/* miejsce na etykietę wystającą ponad kartę */
	padding-top: 1rem;
	align-items: stretch;
}

.smf-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: var(--smf-s4);
	border-radius: var(--smf-radius-lg);
	background: var(--smf-surface);
	border: 1px solid var(--smf-line);
	box-shadow: var(--smf-shadow-sm);
	transition: box-shadow .2s ease, transform .2s var(--smf-ease);
}

.smf-plan:hover { box-shadow: var(--smf-shadow); }

.smf-plan--featured {
	background: var(--smf-navy);
	border-color: var(--smf-blue);
	box-shadow: var(--smf-shadow-lg);
	z-index: 2;
}

.smf-plan--restricted {
	background: linear-gradient(180deg, #fffdf7 0%, #ffffff 55%);
	border-color: #fcd34d;
}

.smf-plan__badge {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: .375rem 1rem;
	border-radius: 999px;
	background: var(--smf-gold);
	color: var(--smf-navy); /* nie biel: kontrast */
	font-size: .6875rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
	box-shadow: 0 6px 16px -6px rgba(245, 158, 11, .9);
}

.smf-plan--restricted .smf-plan__badge { background: var(--smf-navy); color: #fff; }

.smf-plan__name { font-size: 1.375rem; font-weight: 800; margin-top: .5rem; }

.smf-plan__sub { font-size: .9375rem; font-weight: 600; color: var(--smf-blue); margin-top: .25rem; }

.smf-plan__lead { font-size: .9375rem; color: var(--smf-muted); margin-top: .75rem; }

.smf-plan--featured .smf-plan__name { color: #fff; }

.smf-plan--featured .smf-plan__sub { color: var(--smf-gold); }

.smf-plan--featured .smf-plan__lead { color: var(--smf-on-navy); }

.smf-plan__price {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: .5rem;
	margin: var(--smf-s3) 0;
	padding-top: var(--smf-s3);
	border-top: 1px solid var(--smf-line);
}

.smf-plan--featured .smf-plan__price { border-color: rgba(255, 255, 255, .15); }

.smf-plan__amount {
	font-family: Montserrat, sans-serif;
	font-size: 2.25rem;
	font-weight: 800;
	color: var(--smf-navy);
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.smf-plan--featured .smf-plan__amount { color: #fff; }

.smf-plan__period { color: var(--smf-muted); font-weight: 500; font-size: .9375rem; }

.smf-plan--featured .smf-plan__period { color: #94a3b8; }

.smf-plan__was {
	font-size: 1rem;
	color: var(--smf-muted);
	text-decoration: line-through;
}

.smf-plan__features { display: grid; gap: .75rem; margin-bottom: var(--smf-s4); }

.smf-plan__features li {
	display: flex;
	align-items: flex-start;
	gap: .625rem;
	font-size: .9375rem;
	color: #334155;
}

.smf-plan__features .smf-icon {
	width: 1.125rem;
	height: 1.125rem;
	margin-top: .1875rem;
	color: var(--smf-green);
}

.smf-plan--featured .smf-plan__features li { color: #e2e8f0; }

.smf-plan--featured .smf-plan__features .smf-icon { color: var(--smf-gold); }

.smf-plan__foot { margin-top: auto; }

/* Zakup i podgląd produktu — dwie równorzędne ścieżki */
.smf-plan__actions { display: grid; gap: .625rem; }

.smf-plan__note {
	display: flex;
	gap: .5rem;
	margin-top: .875rem;
	padding: .75rem;
	border-radius: .75rem;
	background: #fffbeb;
	border: 1px solid #fde68a;
	font-size: .8125rem;
	color: #78350f;
}

.smf-plan__note .smf-icon { width: 1rem; height: 1rem; margin-top: .125rem; flex: 0 0 auto; }

/* Założyciel --------------------------------------------------------------- */
.smf-founder { display: grid; gap: var(--smf-s5); align-items: center; }

.smf-founder__media { position: relative; }

.smf-founder__media img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: top;
	border-radius: var(--smf-radius-lg);
	border: 6px solid #fff;
	box-shadow: var(--smf-shadow-lg);
}

.smf-founder__stamp {
	position: absolute;
	right: -.5rem;
	bottom: -1rem;
	padding: .875rem 1.125rem;
	border-radius: var(--smf-radius);
	background: var(--smf-gold);
	color: var(--smf-navy);
	box-shadow: var(--smf-shadow);
	text-align: center;
}

.smf-founder__stamp b { display: block; font-size: 1.5rem; font-family: Montserrat, sans-serif; line-height: 1; }

.smf-founder__stamp span { display: block; font-size: .625rem; text-transform: uppercase; letter-spacing: .06em; margin-top: .25rem; }

.smf-prose p { color: #475569; margin-bottom: var(--smf-s2); }

.smf-blockquote {
	margin: var(--smf-s3) 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--smf-blue);
	border-radius: 0 .75rem .75rem 0;
	background: #fff;
	box-shadow: var(--smf-shadow-sm);
	font-style: italic;
	color: #334155;
}

.smf-sign { display: flex; align-items: center; gap: .875rem; margin-top: var(--smf-s3); }

.smf-sign img { width: 3rem; height: 3rem; border-radius: 50%; }

.smf-sign b { display: block; color: var(--smf-navy); }

.smf-sign span { font-size: .875rem; color: var(--smf-muted); }

/* Zapisy / formularz ------------------------------------------------------- */
.smf-signup {
	display: grid;
	/*
	 * Bez minmax(0,…) niejawna kolumna dostaje szerokość min-content —
	 * długi adres e-mail rozpychał ją poza kontener na telefonie.
	 */
	grid-template-columns: minmax(0, 1fr);
	overflow: hidden;
	border-radius: var(--smf-radius-lg);
	box-shadow: var(--smf-shadow-lg);
}

.smf-signup__aside {
	background: var(--smf-blue);
	color: #fff;
	padding: var(--smf-s4);
}

.smf-signup__aside h2 { color: #fff; font-size: 1.625rem; font-weight: 800; margin-bottom: .75rem; }

.smf-signup__aside p { color: #dbeafe; margin-bottom: var(--smf-s3); }

.smf-contact-list { display: grid; gap: 1.125rem; }

.smf-contact-list li { display: flex; align-items: center; gap: .875rem; }

.smf-contact-list__icon {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	flex: 0 0 auto;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
}

.smf-contact-list small { display: block; font-size: .75rem; color: #bfdbfe; }

.smf-contact-list b { font-weight: 700; overflow-wrap: anywhere; }

.smf-contact-list a {
	display: inline-block;
	padding-block: .25rem; /* powiększa cel dotykowy do ~28px */
}

.smf-contact-list a:hover { text-decoration: underline; }

.smf-signup__form { background: #fff; padding: var(--smf-s4); }

.smf-signup__form h3 { font-size: 1.375rem; font-weight: 800; margin-bottom: var(--smf-s3); }

.smf-field { margin-bottom: 1rem; }

.smf-fields-2 { display: grid; gap: 1rem; }

.smf-label {
	display: block;
	font-size: .875rem;
	font-weight: 600;
	color: #334155;
	margin-bottom: .375rem;
}

.smf-req { color: #b91c1c; }

.smf-input,
.smf-select,
.smf-textarea {
	width: 100%;
	min-height: 3rem;
	padding: .75rem 1rem;
	border: 1px solid #cbd5e1;
	border-radius: .75rem;
	background: #f8fafc;
	font-size: 1rem; /* 16px — blokuje auto-zoom w iOS */
	transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.smf-textarea { min-height: 6rem; resize: vertical; }

.smf-select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	padding-right: 2.75rem;
}

.smf-input:focus,
.smf-select:focus,
.smf-textarea:focus {
	outline: none;
	background: #fff;
	border-color: var(--smf-blue);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .18);
}

.smf-consent { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: var(--smf-s3); }

.smf-consent input {
	width: 1.25rem;
	height: 1.25rem;
	margin-top: .1875rem;
	flex: 0 0 auto;
	accent-color: var(--smf-blue);
}

.smf-consent label { font-size: .8125rem; color: var(--smf-muted); }

.smf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.smf-alert {
	display: flex;
	gap: .625rem;
	align-items: flex-start;
	margin-bottom: var(--smf-s3);
	padding: .875rem 1rem;
	border-radius: .75rem;
	font-size: .875rem;
}

.smf-alert .smf-icon { margin-top: .125rem; }

.smf-alert--ok { background: var(--smf-green-50); border: 1px solid #bbf7d0; color: #14532d; }

.smf-alert--err { background: #fef2f2; border: 1px solid #fecaca; color: #7f1d1d; }

/* Mapa --------------------------------------------------------------------- */
.smf-map {
	position: relative;
	height: 22rem;
	background: #e2e8f0;
	/* mapa nie jest .smf-section, więc odstęp pod przyklejony nagłówek osobno */
	scroll-margin-top: var(--smf-header-h);
}

.smf-map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	filter: grayscale(1) contrast(1.1);
	transition: filter .5s ease;
}

.smf-map:hover iframe { filter: grayscale(0); }

.smf-map__card {
	position: absolute;
	left: 50%;
	bottom: 1.5rem;
	transform: translateX(-50%);
	width: min(92%, 46rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .875rem;
	text-align: center;
	padding: 1rem 1.25rem;
	border-radius: var(--smf-radius);
	background: #fff;
	border: 1px solid var(--smf-line);
	box-shadow: var(--smf-shadow-lg);
}

.smf-map__card b { display: block; color: var(--smf-navy); }

.smf-map__card p { font-size: .875rem; color: var(--smf-muted); }

/* Odnośnik do pełnego opisu w karcie cennika ------------------------------- */
.smf-plan__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .375rem;
	width: 100%;
	margin-top: .75rem;
	padding-block: .5rem;
	font-size: .875rem;
	font-weight: 600;
	color: var(--smf-blue);
}

.smf-plan__more:hover { text-decoration: underline; }

.smf-plan__more .smf-icon { width: .875rem; height: .875rem; }

.smf-plan--featured .smf-plan__more { color: var(--smf-gold); }

@media (min-width: 640px) {
	.smf-hero__actions { flex-direction: row; }
	.smf-fields-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.smf-map__card { flex-direction: row; text-align: left; }
}

@media (min-width: 768px) {
	.smf-pricing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.smf-laws { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.smf-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	/* minmax(0,…) — bez tego długie teksty rozpychają kolumny i psują proporcję */
	.smf-signup { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
	.smf-signup__aside, .smf-signup__form { padding: var(--smf-s5); }
	.smf-founder { grid-template-columns: 1fr 1fr; }
	.smf-map { height: 28rem; }
}

@media (min-width: 1024px) {
	.smf-hero { padding-block: var(--smf-s6); }
	.smf-hero__grid { grid-template-columns: 1fr 1fr; gap: var(--smf-s6); }
	.smf-hero__media img { aspect-ratio: 4 / 5; }
	.smf-float { left: -2rem; }
	.smf-method { grid-template-columns: 1fr 2fr; align-items: start; }
	.smf-pricing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media print {
	.smf-plan { break-inside: avoid; }
}

/*
 * Cztery kursy układamy 2 × 2, a NIE w jednym rzędzie.
 *
 * Zmierzone: przy czterech kolumnach karta ma 260 px, czyli 20–27 znaków
 * w wierszu — poniżej progu czytelności (35–60). Dwie kolumny dają ok. 550 px
 * na kartę i ponad 60 znaków. Z tego samego powodu nie ma tu unoszenia
 * wyróżnionej karty: w siatce 2 × 2 wyglądałoby przypadkowo, a rolę wyróżnika
 * pełnią granatowe tło i złota plakietka.
 */

/* Liczba lekcji — najkonkretniejsza informacja w karcie, tuż pod nazwą. */
.smf-plan__lessons {
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	margin-top: .5rem;
	padding: .25rem .625rem;
	border-radius: 999px;
	background: var(--smf-blue-50);
	color: var(--smf-blue-dark);
	font-size: .8125rem;
	font-weight: 700;
}

.smf-plan--featured .smf-plan__lessons {
	background: rgba(255, 255, 255, .12);
	color: var(--smf-gold);
}

.smf-plan--restricted .smf-plan__lessons {
	background: #fef3c7;
	color: #78350f;
}
/* Komunikat rekrutacji w hero --------------------------------------------- */
.smf-pill--alert { background: var(--smf-gold-50); border-color: #fcd34d; color: #78350f; }

.smf-pill--alert .smf-dot span { background: var(--smf-gold-deep); }

.smf a.smf-pill__link {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.smf a.smf-pill__link:hover { text-decoration-thickness: 2px; }

/* Terminy grup ------------------------------------------------------------- */
.smf-sched { display: grid; gap: var(--smf-s3); }

.smf-sched__item {
	display: flex;
	flex-direction: column;
	padding: var(--smf-s3);
	border-radius: var(--smf-radius-lg);
	background: var(--smf-bg);
	border: 1px solid var(--smf-line);
}

.smf-sched__item--urgent {
	background: var(--smf-gold-50);
	border-color: #fcd34d;
	box-shadow: 0 16px 32px -22px rgba(180, 83, 9, .6);
}

.smf-sched__flag {
	align-self: flex-start;
	margin-bottom: .875rem;
	padding: .25rem .625rem;
	border-radius: 999px;
	background: var(--smf-gold);
	color: var(--smf-navy);
	font-size: .6875rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.smf-sched__day {
	font-family: Montserrat, sans-serif;
	font-size: 1.375rem;
	font-weight: 800;
	line-height: 1.15;
	color: var(--smf-navy);
}

.smf-sched__time {
	display: flex;
	align-items: center;
	gap: .375rem;
	margin-top: .25rem;
	font-size: 1.0625rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--smf-blue-dark);
}

.smf-sched__time .smf-icon { width: 1.125rem; height: 1.125rem; flex: 0 0 auto; }

.smf-sched__item--urgent .smf-sched__time { color: var(--smf-gold-deep); }

.smf-sched__who { margin-top: .875rem; font-weight: 600; color: var(--smf-text); }

/* `who` jest pisane małą literą, bo w FAQ i formularzu siedzi w środku zdania. */
.smf-sched__who::first-letter { text-transform: uppercase; }

.smf-sched__note { margin-top: .25rem; font-size: .9375rem; color: #475569; }

.smf-sched__actions { display: grid; gap: .25rem; margin-top: auto; padding-top: var(--smf-s3); }

.smf a.smf-sched__alt {
	justify-self: center;
	padding-block: .5rem;
	font-size: .875rem;
	font-weight: 600;
	color: #78350f;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.smf-sched__foot {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	margin-top: var(--smf-s4);
	font-size: .9375rem;
	color: #475569;
	text-align: center;
}

.smf-sched__foot .smf-icon { width: 1.125rem; height: 1.125rem; flex: 0 0 auto; color: var(--smf-blue); }

@media (min-width: 640px) {
	.smf-sched { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
	.smf-sched { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Cennik z trzema kursami --------------------------------------------------
 * Na tablecie dwie kolumny zostawiłyby trzecią kartę samą, przyklejoną do
 * lewej. Centrujemy ją w tej samej szerokości, a od 1024 px idą trzy kolumny.
 */
@media (min-width: 768px) and (max-width: 1023px) {
	.smf-pricing--n3 > :last-child {
		grid-column: 1 / -1;
		justify-self: center;
		width: calc(50% - var(--smf-s4) / 2);
	}
}

@media (min-width: 1024px) {
	.smf-pricing--n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Założyciel: odnośnik do strony „O mnie” ---------------------------------- */
.smf-founder__more { margin-top: var(--smf-s3); }
/* Cennik z pięcioma kursami -----------------------------------------------
 * Na desktopie 3 + 2 z wyśrodkowanym dolnym rzędem (siatka sześciokolumnowa,
 * karta zajmuje dwie). Na tablecie 2 + 2 + 1, ostatnia karta wyśrodkowana.
 */
@media (min-width: 768px) and (max-width: 1023px) {
	.smf-pricing--n5 > :last-child {
		grid-column: 1 / -1;
		justify-self: center;
		width: calc(50% - var(--smf-s4) / 2);
	}
}

@media (min-width: 1024px) {
	.smf-pricing--n5 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.smf-pricing--n5 > * { grid-column: span 2; }
	.smf-pricing--n5 > :nth-child(4) { grid-column: 2 / span 2; }
}