/**
 * Smokefreelife Berkshire – 2026 redesign
 *
 * Loaded after main.css. Rules are scoped with the `.sfl` body class so they
 * win over main.css and the older Customizer "Additional CSS".
 *
 * Contents
 *  1. Tokens & base
 *  2. Buttons (pill with round arrow)
 *  3. Header & navigation
 *  4. Heroes (homepage / campaign / inner pages)
 *  5. Sections, headings, callouts, ticks
 *  6. Cards, photos and page-specific blocks
 *  7. Contact section & form
 *  8. Footer
 *  9. Existing templates restyled (sections, tabs, locations, news, modals, forms)
 * 10. Homepage content blocks & success stories popup
 * 11. Responsive
 */

/* ------------------------------------------------------------------------
 * 1. Tokens & base
 * --------------------------------------------------------------------- */
:root {
	--sfl-navy: #012a49;
	--sfl-navy-deep: #011d33;
	--sfl-lime: #97c83b;
	--sfl-lime-dark: #84b22c;
	--sfl-grey: #f0f0f0;
	--sfl-ink: #0d1b26;
	--sfl-muted: #5b6670;
	--sfl-white: #fff;
	--sfl-radius: 20px;
	--sfl-radius-sm: 10px;
	--sfl-shadow: 0 10px 30px rgba(1, 42, 73, .06);
	--sfl-font: "Montserrat", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
	--sfl-container: 1200px;
	--sfl-gutter: 20px;
}

body.sfl {
	font-family: var(--sfl-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--sfl-navy);
	background: var(--sfl-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Base element styles use :where() so any component class can override them. */
:where(.sfl) :where(h1, h2, h3, h4, h5, h6) {
	font-family: var(--sfl-font);
	color: inherit;
	letter-spacing: 0;
}
:where(.sfl) h1 { font-size: 3.25rem; font-weight: 400; line-height: 1.2; }
:where(.sfl) h2 { font-size: 2rem; font-weight: 400; line-height: 1.25; }
:where(.sfl) h3 { font-size: 1.375rem; font-weight: 700; line-height: 1.3; margin-bottom: 1rem; }
:where(.sfl) h4 { font-size: 1.25rem; font-weight: 700; line-height: 1.3; }
:where(.sfl) h5 { font-size: 1.125rem; font-weight: 700; }
:where(.sfl) h6 { font-size: 1rem; font-weight: 700; }
:where(.sfl) :where(p, ul, ol, table, form) { margin-bottom: 1.5rem; }
:where(.sfl) :where(strong, b) { font-weight: 700; }

:where(.sfl) a { color: var(--sfl-navy); text-decoration: underline; text-decoration-color: var(--sfl-lime); text-underline-offset: 3px; }
:where(.sfl) a:hover { color: var(--sfl-lime-dark); }
.sfl a.sfl-pill, .sfl a.btn, .sfl .sfl-nav a, .sfl .sfl-brand, .sfl .sfl-social a, .sfl .nav-link, .sfl .dropdown-item { text-decoration: none; }

.sfl .container {
	max-width: calc(var(--sfl-container) + var(--sfl-gutter) * 2);
	padding-left: var(--sfl-gutter);
	padding-right: var(--sfl-gutter);
}

.sfl .sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.sfl-skip {
	position: absolute; left: 16px; top: -100px; z-index: 10000;
	background: var(--sfl-lime); color: var(--sfl-navy) !important; padding: 10px 18px; border-radius: 30px; font-weight: 700;
}
.sfl-skip:focus { top: 16px; }

.sfl :focus-visible { outline: 3px solid var(--sfl-lime); outline-offset: 3px; }

/* ------------------------------------------------------------------------
 * 2. Buttons
 * --------------------------------------------------------------------- */
.sfl-pill {
	--pill-bg: var(--sfl-lime);
	--pill-fg: var(--sfl-navy);
	--pill-icon-bg: var(--sfl-navy);
	--pill-icon-fg: var(--sfl-white);
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 48px;
	padding: 4px 4px 4px 28px;
	border: 0;
	border-radius: 30px;
	background: var(--pill-bg);
	color: var(--pill-fg) !important;
	font-family: var(--sfl-font);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-align: left;
	text-decoration: none !important;
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sfl-pill:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(1, 42, 73, .18); }
.sfl-pill__label { flex: 1 1 auto; }
.sfl-pill__icon {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--pill-icon-bg);
	color: var(--pill-icon-fg);
	transition: transform .2s ease;
}
.sfl-pill__icon svg { width: 20px; height: 20px; }
.sfl-pill:hover .sfl-pill__icon { transform: translateX(2px); }

.sfl-pill--lime:hover { --pill-bg: #a3d14a; }
.sfl-pill--white { --pill-bg: var(--sfl-white); --pill-icon-bg: var(--sfl-lime); --pill-icon-fg: var(--sfl-navy); }
.sfl-pill--navy { --pill-bg: var(--sfl-navy); --pill-fg: var(--sfl-lime); --pill-icon-bg: var(--sfl-lime); --pill-icon-fg: var(--sfl-navy); }
.sfl-pill--outline { --pill-bg: transparent; --pill-fg: var(--sfl-white); --pill-icon-bg: var(--sfl-white); --pill-icon-fg: var(--sfl-navy); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .85); }
.sfl-pill--outline:hover { --pill-bg: rgba(255, 255, 255, .12); }
.sfl-pill--block { display: flex; width: 100%; }
.sfl-pill--block .sfl-pill__label { text-align: center; padding-left: 40px; }

.sfl-pills { display: inline-flex; flex-direction: column; align-items: stretch; gap: 14px; max-width: 100%; }
.sfl-pills__row { display: flex; flex-wrap: nowrap; gap: 14px; }
.sfl-pills__row .sfl-pill { flex: 1 1 auto; white-space: nowrap; }

/* Legacy buttons (.btn / .cta / Gravity Forms submit) adopt the pill. */
.sfl .btn,
.sfl .cta,
.sfl .gform_wrapper .gform_footer input[type=submit],
.sfl .gform_wrapper .gform_footer input.button,
.sfl .gform_wrapper .gform_page_footer input[type=button],
.sfl .gform_wrapper .gform_page_footer input[type=submit],
.sfl .gform_wrapper button.gform_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	min-height: 48px;
	padding: 12px 30px;
	border: 0;
	border-radius: 30px;
	background: var(--sfl-lime);
	color: var(--sfl-navy);
	font-family: var(--sfl-font);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	text-transform: none;
	text-decoration: none;
	transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.sfl .btn:hover, .sfl .btn:focus, .sfl .cta:hover, .sfl .cta:focus,
.sfl .gform_wrapper .gform_footer input[type=submit]:hover,
.sfl .gform_wrapper button.gform_button:hover {
	background: #a3d14a;
	color: var(--sfl-navy);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(1, 42, 73, .18);
}
.sfl .btn-primary { background: var(--sfl-navy); color: var(--sfl-lime); }
.sfl .btn-primary:hover, .sfl .btn-primary:focus { background: var(--sfl-navy-deep); color: var(--sfl-lime); }
.sfl .btn-sm { min-height: 40px; padding: 8px 22px; font-size: 14px; }
.sfl .btn-block { width: 100%; }

.sfl .btn--arrow { position: relative; padding-right: 56px; text-transform: none; }
.sfl .btn--arrow::after {
	content: "";
	position: absolute;
	right: 4px;
	top: 50%;
	width: 40px;
	height: 40px;
	transform: translateY(-50%);
	border-radius: 50%;
	background: var(--sfl-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.3 6.3a1 1 0 0 1 1.4 0l5 5a1 1 0 0 1 0 1.4l-5 5a1 1 0 1 1-1.4-1.4l3.3-3.3H4v-2h13.6l-3.3-3.3a1 1 0 0 1 0-1.4z' fill='%23ffffff'/%3E%3C/svg%3E") center / 20px no-repeat;
}
.sfl .btn-primary.btn--arrow::after {
	background-color: var(--sfl-lime);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.3 6.3a1 1 0 0 1 1.4 0l5 5a1 1 0 0 1 0 1.4l-5 5a1 1 0 1 1-1.4-1.4l3.3-3.3H4v-2h13.6l-3.3-3.3a1 1 0 0 1 0-1.4z' fill='%23012a49'/%3E%3C/svg%3E");
}
.sfl .btn--arrow.btn-block { justify-content: flex-start; }

/* ------------------------------------------------------------------------
 * 3. Header & navigation
 * --------------------------------------------------------------------- */
.sfl-header {
	position: relative;
	z-index: 50;
	background: var(--sfl-navy);
	color: var(--sfl-white);
}
.sfl-header--overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: transparent;
}
.sfl-header__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 30px;
	padding-bottom: 18px;
}
.sfl-brand { display: inline-flex; align-items: flex-end; gap: 14px; }
.sfl-brand__logo { width: 293px; height: auto; }
.sfl-brand__ecig { width: 90px; height: auto; margin-bottom: 4px; }

.sfl-nav { margin-top: 36px; width: 100%; }
.sfl-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.sfl-nav__list > li { position: relative; margin: 0; }
.sfl-nav__list a,
.sfl #menu-main-menu li a {
	display: block;
	text-transform: none;
	font-family: var(--sfl-font) !important;
	padding: 6px 2px;
	color: var(--sfl-white);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	white-space: nowrap;
	border-bottom: 2px solid transparent;
	transition: color .2s ease, border-color .2s ease;
}
.sfl-nav__list a:hover,
.sfl-nav__list .current-menu-item > a,
.sfl-nav__list .current_page_item > a { color: var(--sfl-lime); border-bottom-color: var(--sfl-lime); }

.sfl-nav__list .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	min-width: 220px;
	margin: 0;
	padding: 10px 0;
	list-style: none;
	background: var(--sfl-white);
	border-radius: var(--sfl-radius-sm);
	box-shadow: 0 12px 30px rgba(0, 0, 0, .15);
	transform: translate(-50%, 8px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.sfl-nav__list li:hover > .sub-menu,
.sfl-nav__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.sfl-nav__list .sub-menu a { color: var(--sfl-navy); padding: 8px 18px; border: 0; }
.sfl-nav__list .sub-menu a:hover { background: var(--sfl-grey); color: var(--sfl-navy); }

.sfl-nav-toggle {
	display: none;
	position: absolute;
	right: var(--sfl-gutter);
	top: 32px;
	width: 48px;
	height: 48px;
	padding: 12px;
	border: 0;
	border-radius: 50%;
	background: var(--sfl-lime);
	cursor: pointer;
}
.sfl-nav-toggle__bar { display: block; height: 2px; margin: 5px 0; background: var(--sfl-navy); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
.sfl-nav-open .sfl-nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sfl-nav-open .sfl-nav-toggle__bar:nth-child(2) { opacity: 0; }
.sfl-nav-open .sfl-nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ------------------------------------------------------------------------
 * 4. Heroes
 * --------------------------------------------------------------------- */
.sfl-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 100vh;
	min-height: 100svh;
	padding: 230px 0 110px;
	background-color: var(--sfl-navy);
	background-size: cover;
	background-position: center;
	color: var(--sfl-white);
	text-align: center;
	isolation: isolate;
}
.sfl-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(1, 42, 73, .82) 0%, rgba(1, 42, 73, .62) 45%, rgba(1, 42, 73, .78) 100%);
}
.sfl-hero__inner { display: flex; flex-direction: column; align-items: center; }

.sfl-hero__headline,
.sfl .sfl-hero__title h1 {
	margin: 0 0 6px;
	color: var(--sfl-lime);
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
}
/* Homepage title comes from the CMS as <div class="za-banner-text"><h2/><h1/></div>. */
.sfl .sfl-hero__title .za-banner-text { margin: 0; padding: 0; text-align: center; }
.sfl .sfl-hero__title h2 {
	margin: 0 0 8px;
	color: var(--sfl-white);
	font-size: 1.25rem;
	font-weight: 600;
	letter-spacing: .2em;
}
.sfl .sfl-hero__title .za-line { display: none; }

.sfl-hero__kicker { font-size: 1.5rem; font-weight: 600; color: var(--sfl-lime); margin-bottom: 8px; }
.sfl-hero__text {
	max-width: 1060px;
	margin: 0 auto 36px;
	font-size: 2.125rem;
	font-weight: 400;
	line-height: 1.24;
	color: var(--sfl-white);
}
.sfl-hero .sfl-ticks { margin-bottom: 44px; }
.sfl-hero .sfl-pills { min-width: 460px; }
.sfl-hero .sfl-ticks--inline { width: min(1320px, calc(100vw - 32px)); gap: 10px 24px; }
.sfl-hero__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 26px; }
.sfl-hero__links .sfl-pill { min-width: 220px; }

/* Inner page banner */
.sfl-page-hero {
	position: relative;
	padding: 90px 0 100px;
	background-color: var(--sfl-navy);
	background-size: cover;
	background-position: center;
	color: var(--sfl-white);
	text-align: center;
	isolation: isolate;
}
.sfl-page-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(1, 42, 73, .72);
}
.sfl-page-hero::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 120px;
	height: 6px;
	transform: translateX(-50%);
	border-radius: 6px 6px 0 0;
	background: var(--sfl-lime);
}
.sfl-page-hero__title { margin: 0; color: var(--sfl-white); font-size: 3.25rem; font-weight: 400; line-height: 1.15; }
.sfl-page-hero--compact { padding: 60px 0 70px; }
.sfl-page-hero--compact .sfl-page-hero__title { font-size: 2.5rem; }

/* ------------------------------------------------------------------------
 * 5. Sections, headings, callouts, ticks
 * --------------------------------------------------------------------- */
.sfl-section { position: relative; padding: 110px 0; }
.sfl-section--tight { padding: 70px 0; }
.sfl-section--grey { background: var(--sfl-grey); }
.sfl-section--navy { background: var(--sfl-navy); color: var(--sfl-white); }

.sfl-heading { max-width: 1000px; margin: 0 auto 36px; text-align: center; }
.sfl-heading h2 { margin: 0 0 18px; font-size: 3.25rem; font-weight: 400; line-height: 1.15; color: var(--sfl-navy); }
.sfl-heading h2 span { color: var(--sfl-lime); }
.sfl-heading p { margin: 0 auto 10px; font-size: 14px; line-height: 1.8; }
.sfl-heading .sfl-heading__sub { margin-top: 14px; font-size: 18px; font-weight: 700; }
.sfl-heading--light h2, .sfl-heading--light p { color: var(--sfl-white); }

.sfl-display { margin: 0 0 46px; font-size: 3.25rem; font-weight: 400; line-height: 1.2; color: var(--sfl-navy); }

.sfl-callout {
	display: inline-block;
	margin: 0;
	padding: 12px 25px;
	border-radius: var(--sfl-radius-sm);
	background: var(--sfl-lime);
	color: var(--sfl-navy);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
}
.sfl-callout--center { display: block; margin-top: 30px; padding: 15px 25px; text-align: center; }

.sfl-ticks { margin: 0 0 30px; padding: 0; list-style: none; }
.sfl-ticks li { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 26px; font-size: 14px; line-height: 1.5; }
.sfl-ticks li svg { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px; }
.sfl-ticks--inline { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; }
.sfl-ticks--inline li { margin: 0; font-size: 15px; font-weight: 500; color: var(--sfl-white); }

/* ------------------------------------------------------------------------
 * 6. Cards, photos and page-specific blocks
 * --------------------------------------------------------------------- */
.sfl-card {
	position: relative;
	padding: 30px;
	border-radius: var(--sfl-radius);
	background: var(--sfl-white);
	color: var(--sfl-ink);
	box-shadow: var(--sfl-shadow);
}
.sfl-card p { margin: 0; font-size: 16px; line-height: 1.3; }
.sfl-card__title { margin: 0 0 14px; font-size: 1.25rem; font-weight: 700; line-height: 1.1; color: var(--sfl-ink); }

.sfl-cards { display: grid; gap: 20px; }
.sfl-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sfl-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.sfl-card--feature { display: flex; align-items: flex-start; gap: 26px; padding: 37px 30px 34px; }
.sfl-card--feature p { font-size: 15px; line-height: 1.35; }
.sfl-card--feature .sfl-card__title { margin-top: 12px; margin-bottom: 18px; }
.sfl-card--stack { flex-direction: column; gap: 6px; }

.sfl-card__icon { flex: 0 0 66px; width: 66px; height: 66px; color: var(--sfl-navy); fill: var(--sfl-navy); }
.sfl-card__icon svg { width: 100%; height: 100%; display: block; }
.sfl-card__icon--user-headset, .sfl-card__icon--talent { color: var(--sfl-lime); fill: var(--sfl-lime); }

.sfl-photo { position: relative; z-index: 0; }
.sfl-photo img { display: block; width: 100%; height: auto; border-radius: var(--sfl-radius); position: relative; z-index: 1; }
.sfl-photo::before {
	content: "";
	position: absolute;
	z-index: 0;
	inset: 0;
	border-radius: var(--sfl-radius);
}
.sfl-photo--navy-right::before { background: var(--sfl-navy); transform: translate(20px, 20px); }
.sfl-photo--lime-left::before { background: var(--sfl-lime); transform: translate(-18px, 22px); }

/* Intro (campaign) */
.sfl-intro__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 488px); gap: 60px 140px; align-items: start; }
.sfl-intro__list-title { margin: 0 0 30px; font-size: 18px; font-weight: 700; }
.sfl-intro__main .sfl-ticks li { margin-bottom: 26px; font-size: 14px; }
.sfl-intro__aside { padding-top: 0; }
.sfl-intro__aside > p { margin: 0 0 38px; font-size: 14px; line-height: 1.8; }

/* Quit together (campaign) */
.sfl-together__items {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 70px 0 50px;
	padding: 0;
	min-height: 300px;
	list-style: none;
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 66% auto;
}
.sfl-together__item { display: flex; flex-direction: column; align-items: center; margin: 0; text-align: center; }
.sfl-together__item--2 { padding-top: 152px; }
.sfl-together__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 101px;
	height: 101px;
	margin-bottom: 16px;
	border-radius: 12px;
	background: var(--sfl-navy);
	fill: var(--sfl-lime);
}
.sfl-together__icon svg { width: 54px; height: 54px; }
.sfl-together__label { max-width: 180px; font-size: 20px; font-weight: 700; line-height: 1.05; color: #000; }

/* Taking the first step */
.sfl-steps__grid { display: grid; grid-template-columns: minmax(0, 530px) minmax(0, 590px); justify-content: space-between; gap: 50px; align-items: start; margin-top: 50px; }
.sfl-steps__media { padding: 0 0 22px 18px; }
.sfl-steps__media img { aspect-ratio: 530 / 742; object-fit: cover; }
.sfl-steps__cards { display: grid; gap: 20px; padding-top: 36px; }
.sfl-steps__cards .sfl-card { padding: 30px 30px 36px; }
.sfl-steps__cards .sfl-card p { max-width: 460px; }
.sfl-steps__cards .sfl-pills { width: 100%; max-width: 460px; }
.sfl-steps .sfl-callout--center { margin-top: 32px; }

/* ------------------------------------------------------------------------
 * 7. Contact section & form
 * --------------------------------------------------------------------- */
.sfl-contact { padding-bottom: 80px; }
.sfl-contact .sfl-heading { margin-bottom: 0; }
.sfl-contact__band {
	position: relative;
	padding: 52px 0;
	background: linear-gradient(90deg, var(--sfl-lime) 0, var(--sfl-lime) 58px, transparent 58px, transparent calc(100% - 58px), var(--sfl-navy) calc(100% - 58px));
}
.sfl-contact__grid { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 610px); justify-content: space-between; gap: 40px; padding: 0 44px; }
.sfl-contact__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 18px; align-content: start; }
.sfl-contact__list li { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 18px; line-height: 1.3; color: #000; }
.sfl-contact__list strong { display: block; font-size: 15px; }
.sfl-contact__list a { color: #000; text-decoration: none; word-break: break-word; }
.sfl-contact__list a:hover { color: var(--sfl-navy); text-decoration: underline; }
.sfl-contact__icon {
	flex: 0 0 62px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: #02033a;
	fill: var(--sfl-white);
	color: var(--sfl-white);
}
.sfl-contact__icon svg { width: 30px; height: 30px; }

.sfl-form { margin: 0; display: grid; gap: 16px; }
.sfl-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.sfl-form__field { position: relative; display: block; margin: 0; }
.sfl-form input[type=text],
.sfl-form input[type=tel],
.sfl-form input[type=email],
.sfl-form select,
.sfl .gform_wrapper input[type=text],
.sfl .gform_wrapper input[type=tel],
.sfl .gform_wrapper input[type=email],
.sfl .gform_wrapper input[type=number],
.sfl .gform_wrapper input[type=url],
.sfl .gform_wrapper select,
.sfl .gform_wrapper textarea,
.sfl .form-control {
	width: 100%;
	min-height: 46px;
	padding: 10px 24px;
	border: 1px solid var(--sfl-navy);
	border-radius: 30px;
	background: var(--sfl-white);
	color: var(--sfl-navy);
	font-family: var(--sfl-font);
	font-size: 14px;
	font-weight: 500;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.sfl .gform_wrapper textarea { border-radius: var(--sfl-radius); padding-top: 14px; }
.sfl-form input::placeholder, .sfl .gform_wrapper ::placeholder { color: var(--sfl-navy); opacity: 1; }
.sfl-form input:focus, .sfl-form select:focus,
.sfl .gform_wrapper input:focus, .sfl .gform_wrapper select:focus, .sfl .gform_wrapper textarea:focus, .sfl .form-control:focus {
	outline: none;
	border-color: var(--sfl-lime);
	box-shadow: 0 0 0 3px rgba(151, 200, 59, .35);
}
.sfl-form__field--select select { padding-right: 52px; cursor: pointer; }
.sfl-form__field--select svg { position: absolute; right: 22px; top: 50%; width: 22px; height: 22px; transform: translateY(-50%); pointer-events: none; color: var(--sfl-navy); }
.sfl-form .sfl-pill { margin-top: 10px; }
.sfl-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sfl-alert { padding: 14px 20px; border-radius: var(--sfl-radius-sm); font-size: 15px; font-weight: 600; }
.sfl-alert--success { background: rgba(151, 200, 59, .2); color: var(--sfl-navy); border: 1px solid var(--sfl-lime); }
.sfl-alert--error { background: #fdecea; color: #8a1c13; border: 1px solid #f3b8b2; }

/* ------------------------------------------------------------------------
 * 8. Footer
 * --------------------------------------------------------------------- */
.sfl-cta-strip { padding: 60px 0; background: var(--sfl-grey); }
.sfl-cta-strip__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.sfl-cta-strip__text :last-child { margin-bottom: 0; }
.sfl-cta-strip--center .container { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.sfl-cta-strip .sfl-pill { min-width: 240px; }

.sfl-footer { font-family: var(--sfl-font); color: var(--sfl-navy); }
.sfl-footer__main { padding: 52px 0 40px; background: var(--sfl-white); text-align: center; border-top: 1px solid #e7e9ec; }
.sfl-footer__brand { display: inline-flex; align-items: flex-end; justify-content: center; flex-wrap: wrap; gap: 12px 14px; margin-bottom: 18px; }
.sfl-footer__logo img { width: 216px; height: auto; }
.sfl-footer__ecig { width: 66px; height: auto; margin-bottom: 2px; }
.sfl-footer__s4h img { width: 112px; height: auto; margin-bottom: 4px; }
.sfl-footer__accreditation { max-width: 480px; margin: 0 auto 26px; font-size: 15px; line-height: 1.5; color: var(--sfl-muted); }

.sfl-footer__logos,
.sfl-footer__partners ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 18px 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.sfl-footer__logos li, .sfl-footer__partners li { margin: 0; }
.sfl-footer__logos img { max-height: 44px; max-width: 120px; width: auto; height: auto; filter: grayscale(1); opacity: .75; transition: filter .2s ease, opacity .2s ease; }
.sfl-footer__logos img:hover { filter: none; opacity: 1; }
.sfl-footer__partners { margin-top: 36px; padding-top: 28px; border-top: 1px solid #eceef0; }
.sfl-footer__partners p { margin: 0 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--sfl-muted); }
.sfl-footer__partners img { max-height: 54px; max-width: 120px; width: auto; height: auto; filter: grayscale(1); opacity: .7; transition: filter .2s ease, opacity .2s ease; }
.sfl-footer__partners a:hover img { filter: none; opacity: 1; }

.sfl-footer__bar { background: var(--sfl-lime); }
.sfl-footer__bar .container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; min-height: 57px; padding-top: 10px; padding-bottom: 10px; }
.sfl-footer__credits { display: flex; flex-wrap: wrap; gap: 6px 24px; margin: 0; font-size: 15px; font-weight: 600; color: var(--sfl-navy); }
.sfl-footer__credits a { color: var(--sfl-navy); text-decoration: none; }
.sfl-footer__credits a:hover { text-decoration: underline; color: var(--sfl-navy); }
.sfl-social { display: flex; gap: 12px; margin: 0; padding: 0; list-style: none; }
.sfl-social li { margin: 0; }
.sfl-social a { display: inline-flex; width: 26px; height: 26px; color: var(--sfl-navy); transition: transform .2s ease, color .2s ease; }
.sfl-social a:hover { color: var(--sfl-white); transform: translateY(-2px); }
.sfl-social svg { width: 100%; height: 100%; }

/* ------------------------------------------------------------------------
 * 9. Existing templates restyled
 * --------------------------------------------------------------------- */

/* Sections */
.sfl .section { padding: 100px 0; }
.sfl .section--small-padding { padding: 60px 0; }
.sfl .section .container { height: auto; }
.sfl .section img { border-radius: var(--sfl-radius); }
.sfl .section--alternate, .sfl .section--alternate3 { background: var(--sfl-grey); color: var(--sfl-navy); }
.sfl .section--alternate2 { background: var(--sfl-white); color: var(--sfl-navy); }
.sfl .section--alternate4 { background: var(--sfl-navy); color: var(--sfl-white); }
.sfl .section--alternate4 a:not(.btn):not(.sfl-pill) { color: var(--sfl-lime); }
.sfl .section--alternate4 h1, .sfl .section--alternate4 h2, .sfl .section--alternate4 h3,
.sfl .section--alternate4 h4, .sfl .section--alternate4 h5 { color: var(--sfl-white); }

.sfl .section__title { margin: 0 auto 50px; text-align: center; }
.sfl .section__title h2 {
	position: static;
	display: block;
	min-width: 0;
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	transform: none;
	background: none;
	border-radius: 0;
	color: inherit;
	font-size: 3rem;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
}
.sfl .section__title h2::after {
	content: "";
	display: block;
	width: 70px;
	height: 4px;
	margin: 22px auto 0;
	border-radius: 4px;
	background: var(--sfl-lime);
}
.sfl .section--alternate4 .section__title h2 { color: var(--sfl-white); }
/* Pages whose content starts with the title keep a sensible top gap. */
.sfl .section--about, .sfl .section--healthcare { padding-top: 100px; }

/* Body copy inside CMS content */
.sfl .section p, .sfl .section li { font-size: 16px; line-height: 1.7; }
.sfl .section ul:not(.nav):not(.slick-dots):not(.sfl-ticks) { padding-left: 1.2em; }
.sfl .section ul:not(.nav):not(.slick-dots):not(.sfl-ticks) li::marker { color: var(--sfl-lime); }
.sfl .section h3, .sfl .section h4 { color: inherit; }

/* Tabs */
.sfl .section--small-tabs .nav-tabs,
.sfl .section--stop .nav-tabs {
	position: static;
	transform: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	width: 100%;
	margin: 0 0 40px;
	border: 0;
}
.sfl .section--small-tabs-alignleft .nav-tabs { justify-content: flex-start; }
.sfl .section--small-tabs .nav-tabs .nav-item,
.sfl .section--stop .nav-tabs .nav-item { flex: 0 1 auto; max-width: none; width: auto; margin: 0; padding: 0; }
.sfl .section--small-tabs .nav-tabs .nav-item .nav-link,
.sfl .section--stop .nav-tabs .nav-item .nav-link {
	width: auto;
	height: auto;
	min-height: 46px;
	padding: 10px 24px !important;
	border: 2px solid var(--sfl-lime);
	border-radius: 30px;
	background: transparent;
	color: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	transition: background-color .2s ease, color .2s ease;
}
.sfl .section--stop .nav-tabs .nav-item .nav-link { min-height: 56px; padding: 12px 36px !important; font-size: 18px; font-weight: 700; }
.sfl .section--small-tabs .nav-tabs .nav-item .nav-link:hover,
.sfl .section--stop .nav-tabs .nav-item .nav-link:hover { background: rgba(151, 200, 59, .18); color: inherit; }
.sfl .section--small-tabs .nav-tabs .nav-item .nav-link.active,
.sfl .section--stop .nav-tabs .nav-item .nav-link.active { background: var(--sfl-lime); color: var(--sfl-navy); }
.sfl .section--stop { padding-top: 70px; padding-bottom: 0; background: var(--sfl-white); }
.sfl .section--stop .tab-pane { padding: 40px 0 100px; background-size: 36% auto; background-color: var(--sfl-white); border-radius: 0; }
.sfl .tab-content > .tab-pane { line-height: 1.7; }
.sfl .dropdown-tabs .dropdown-toggle { text-align: left; font-weight: 600; }
.sfl .dropdown-tabs .dropdown-menu { border: 0; border-radius: var(--sfl-radius-sm); box-shadow: 0 12px 30px rgba(0, 0, 0, .15); }
.sfl .dropdown-tabs .dropdown-item { color: var(--sfl-navy); font-weight: 500; }

/* Location / clinic cards */
.sfl .locations-row { padding-bottom: 0; }
.sfl .location {
	height: calc(100% - 24px);
	margin-bottom: 24px;
	padding: 30px 30px 14px;
	border-radius: var(--sfl-radius);
	background: var(--sfl-white);
	color: var(--sfl-ink);
	box-shadow: var(--sfl-shadow);
}
.sfl .location h4 { padding-left: 0; color: var(--sfl-navy); font-size: 1.25rem; }
.sfl .location h4 .icon { display: none; }
.sfl .location a { color: var(--sfl-navy); font-weight: 700; }
.sfl .section--alternate4 .location a:not(.btn):not(.sfl-pill) { color: var(--sfl-navy); }
.sfl .map-holder { margin-top: 20px; }
.sfl .map-holder .map, .sfl .wpgmza_map { border-radius: var(--sfl-radius); overflow: hidden; }

/* People / success stories */
.sfl .person-item__content { margin: 12px; padding: 24px; border-radius: var(--sfl-radius); background: var(--sfl-white); color: var(--sfl-ink); box-shadow: var(--sfl-shadow); }
.sfl .person-item h4 { color: var(--sfl-navy); }
.sfl .person-item a { color: var(--sfl-navy); font-weight: 700; text-decoration-color: var(--sfl-lime); }
.sfl .person-slider .slick-prev, .sfl .person-slider .slick-next,
.sfl .news-slider .slick-prev, .sfl .news-slider .slick-next { width: 44px; height: 44px; background-color: var(--sfl-navy); border-radius: 50%; }
.sfl .person-slider .slick-prev:hover, .sfl .person-slider .slick-next:hover { background-color: var(--sfl-lime); }

/* Courses */
.sfl .course { height: calc(100% - 24px); margin-bottom: 24px; padding: 30px; border-radius: var(--sfl-radius); background: var(--sfl-grey); color: var(--sfl-navy); }
.sfl .course h4 { border-color: rgba(1, 42, 73, .2); }

/* News & events */
.sfl .news-item { border-radius: var(--sfl-radius); overflow: hidden; background: var(--sfl-white); box-shadow: var(--sfl-shadow); }
.sfl .news-item img { border-radius: 0; aspect-ratio: 16 / 10; object-fit: cover; }
.sfl .news-item__content { background: var(--sfl-white); padding: 24px 26px; }
.sfl .news-item__title { color: var(--sfl-navy); }
.sfl .news-item a { text-decoration: none; }
.sfl .news-slider .news-item { margin: 0 10px 24px; }
.sfl .twitter-feed { padding: 24px; border-radius: var(--sfl-radius); background: var(--sfl-grey); }

/* Modals */
.sfl .modal-dialog .modal-content { border: 0; border-radius: var(--sfl-radius); overflow: hidden; }
.sfl .modal-dialog .modal-header { background: var(--sfl-navy); }
.sfl .modal-dialog .close { color: var(--sfl-lime); opacity: 1; text-shadow: none; font-size: 2rem; }
.sfl .modal-body h2 { color: var(--sfl-navy); }

/* Gravity Forms */
.sfl .gform_wrapper { font-family: var(--sfl-font); }
.sfl .gform_wrapper .gfield_label, .sfl .gform_wrapper legend.gfield_label { color: var(--sfl-navy); font-weight: 700; font-size: 15px; }
.sfl .gform_wrapper .gfield_required { color: #c0392b; }
.sfl .gform_wrapper .gform_footer { justify-content: flex-start; }
/* Legacy GF markup ships very specific selectors; match them. */
body.sfl .gform_wrapper.gform_legacy_markup_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
body.sfl .gform_wrapper.gform_legacy_markup_wrapper select,
body.sfl .gform_wrapper.gform_legacy_markup_wrapper textarea {
	width: 100%;
	min-height: 46px;
	padding: 10px 24px;
	border: 1px solid var(--sfl-navy);
	border-radius: 30px;
	background: var(--sfl-white);
	color: var(--sfl-navy);
	font-family: var(--sfl-font);
	font-size: 14px;
}
body.sfl .gform_wrapper.gform_legacy_markup_wrapper textarea { border-radius: var(--sfl-radius); padding-top: 14px; }
body.sfl .gform_wrapper.gform_legacy_markup_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus,
body.sfl .gform_wrapper.gform_legacy_markup_wrapper select:focus,
body.sfl .gform_wrapper.gform_legacy_markup_wrapper textarea:focus {
	outline: none;
	border-color: var(--sfl-lime);
	box-shadow: 0 0 0 3px rgba(151, 200, 59, .35);
}
body.sfl .gform_wrapper.gform_legacy_markup_wrapper .top_label div.ginput_container { margin-top: 6px; }
body.sfl .gform_wrapper.gform_legacy_markup_wrapper ul.gform_fields li.gfield { padding-right: 0; }

/* Timeline / calculator typography */
.sfl .section--timeline .time { color: var(--sfl-lime); font-weight: 700; }
.sfl .calculator-savings { border-radius: var(--sfl-radius); }

/* Store locator (WP Google Maps) */
.sfl .map-holder .wpgmza_marker_list_class,
.sfl .map-holder .wpgmza_marker_list_class * { color: var(--sfl-navy); }
.sfl .map-holder .wpgmza_marker_list_class .wpgmza_marker_holder,
.sfl .map-holder .wpgmza-basic-list-item { border-radius: var(--sfl-radius-sm); }
.sfl .map-holder label { color: inherit; }

/* About page partner logos */
.sfl .partner-flex { display: flex; align-items: center; justify-content: center; }
.sfl .partner-flex img { max-height: 90px; width: auto; object-fit: contain; border-radius: 0; }

/* Stop smoking timeline (Reasons to Quit) */
.sfl .timeline-items .item { background: var(--sfl-lime); color: var(--sfl-navy); border-radius: var(--sfl-radius-sm); }
.sfl .timeline-items .item p { color: var(--sfl-navy); }
.sfl .timeline-items .item p.time { color: var(--sfl-navy); font-weight: 800; letter-spacing: .08em; opacity: .75; }
.sfl .timeline-items .timeline-bar,
.sfl .timeline-items .timeline-bar:before,
.sfl .timeline-items .timeline-bar:after,
.sfl .timeline-items .item:after { background-color: var(--sfl-navy); }

/* Cost savings calculator (Reasons to Quit) */
.sfl .cost-calculator, .sfl .cost-calculator p { font-weight: 600; }
.sfl .cost-calculator .form-control { color: var(--sfl-navy); }
.sfl .calculator-inputs .form-control { border: 1px solid var(--sfl-navy); border-radius: 30px; background: var(--sfl-white); }
.sfl .calculator-savings { background: var(--sfl-navy); border-radius: var(--sfl-radius); }
.sfl .calculator-savings h3 { color: var(--sfl-lime); font-weight: 700; }
.sfl .calculator-savings .savings-row { background: rgba(255, 255, 255, .08); color: var(--sfl-white); font-weight: 600; }
.sfl .calculator-savings .savings-row .savings { color: var(--sfl-lime); font-weight: 700; }
.sfl .arrow-blue:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.3 6.3a1 1 0 0 1 1.4 0l5 5a1 1 0 0 1 0 1.4l-5 5a1 1 0 1 1-1.4-1.4l3.3-3.3H4v-2h13.6l-3.3-3.3a1 1 0 0 1 0-1.4z' fill='%2397c83b'/%3E%3C/svg%3E");
}

/* News & events listing (page-news-and-events.php) */
.sfl-news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.sfl-news-card { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--sfl-radius); background: var(--sfl-white); box-shadow: var(--sfl-shadow); }
.sfl-section:not(.sfl-section--grey) .sfl-news-card { box-shadow: 0 0 0 1px #e6e9ec, var(--sfl-shadow); }
.sfl-news-card__media { display: block; aspect-ratio: 16 / 10; background: var(--sfl-grey); overflow: hidden; }
.sfl-news-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.sfl-news-card:hover .sfl-news-card__media img { transform: scale(1.04); }
.sfl-news-card__body { display: flex; flex: 1; flex-direction: column; padding: 24px 26px 26px; }
.sfl-news-card__body p { margin: 0 0 16px; font-size: 15px; line-height: 1.55; color: var(--sfl-ink); }
.sfl .sfl-news-card__meta { margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--sfl-muted); }
.sfl-news-card__title { margin: 0 0 12px; font-size: 1.25rem; font-weight: 700; line-height: 1.25; }
.sfl-news-card__title a { color: var(--sfl-navy); text-decoration: none; }
.sfl-news-card__title a:hover { color: var(--sfl-lime-dark); }
.sfl .sfl-news-card__more { margin-top: auto; font-weight: 700; color: var(--sfl-navy); }
.sfl-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 40px; flex-wrap: wrap; }
.sfl-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px; border-radius: 30px; border: 2px solid var(--sfl-lime); color: var(--sfl-navy); font-weight: 700; text-decoration: none; }
.sfl-pagination .page-numbers.current, .sfl-pagination a.page-numbers:hover { background: var(--sfl-lime); color: var(--sfl-navy); }

/* ------------------------------------------------------------------------
 * 10. Homepage CMS blocks & popup
 * --------------------------------------------------------------------- */

/* Notice card (Homepage_Bfc_Text_Area) */
.sfl .sfl-notice .card-container {
	width: auto;
	margin: 0;
	padding: 0 0 26px;
	border: 0;
	border-radius: var(--sfl-radius);
	background: var(--sfl-white);
	box-shadow: 0 10px 40px rgba(1, 42, 73, .1);
	overflow: hidden;
}
.sfl .sfl-notice .card-header {
	padding: 22px 32px;
	border: 0;
	border-radius: 0;
	background: var(--sfl-navy);
	color: var(--sfl-white);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	text-align: left;
}
.sfl .sfl-notice ul.za-newhomebox-sty { margin: 0; padding: 22px 32px 6px 32px; list-style: none; }
.sfl .sfl-notice ul.za-newhomebox-sty li { position: relative; padding-left: 30px; margin-bottom: 14px; color: var(--sfl-ink); font-size: 15px; line-height: 1.55; }
.sfl .sfl-notice ul.za-newhomebox-sty li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 2px;
	width: 18px;
	height: 18px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%2397c83b'/%3E%3Cpath d='M15.2 7.3l-7.4 6.6-3.1-3 .8-.9 2.3 2.3 6.6-5.9z' fill='%23012a49'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sfl .sfl-notice p.za-newbox-footer-text {
	margin: 0 32px;
	padding: 14px 22px;
	border-radius: var(--sfl-radius-sm);
	background: var(--sfl-lime);
	color: var(--sfl-navy);
	font-size: 15px;
	font-weight: 700;
}

/* Support boxes (homepage repeater) */
.sfl .sfl-card__content { font-size: 15px; line-height: 1.55; color: var(--sfl-ink); }
.sfl .sfl-card__content p { font-size: 15px; line-height: 1.55; margin-bottom: 14px; }
.sfl .sfl-card__content > strong { display: block; margin: 12px 0; }
.sfl .sfl-card__content h2 { margin: 18px 0 12px; font-size: 18px; font-weight: 700; }
.sfl .sfl-card__content h2 a { color: var(--sfl-navy); text-decoration-color: var(--sfl-lime); }
.sfl .sfl-card__content .za-box-buttons-sty { display: flex; flex-direction: column; gap: 10px; width: auto; margin: 0; }
.sfl .sfl-card__content .za-btn-1-sty,
.sfl .sfl-card__content .za-btn-2-sty { float: none; margin: 0; padding: 0; border-radius: 30px; background: var(--sfl-lime); }
.sfl .sfl-card__content .za-btn-2-sty { background: var(--sfl-navy); }
.sfl .sfl-card__content .za-btn-1-sty img,
.sfl .sfl-card__content .za-btn-2-sty img { display: none; }
.sfl .sfl-card__content .za-btn-1-sty a,
.sfl .sfl-card__content .za-btn-2-sty a { display: block; padding: 13px 24px; color: var(--sfl-navy); font-size: 15px; font-weight: 700; text-decoration: none; }
.sfl .sfl-card__content .za-btn-2-sty a { color: var(--sfl-lime); }
.sfl .sfl-card__content .za-text-quit { padding: 14px 0 4px; font-size: 15px; font-weight: 600; text-decoration: none; color: var(--sfl-navy); }
.sfl .sfl-card__content .za-disclimir-sty p { margin: 0; font-size: 12px !important; }

/* Success stories popup (homepage) */
.sfl .ss-popup { background: rgba(1, 29, 51, .75); }
.sfl .ss-popup-content { background: var(--sfl-navy); border-radius: var(--sfl-radius); font-family: var(--sfl-font); }
.sfl .ss-title h2 { background: var(--sfl-lime); color: var(--sfl-navy); font-size: 1.5rem; font-weight: 700; }
.sfl .ss-card h4 { color: var(--sfl-white); }
.sfl .ss-card a.ss-trigger { color: var(--sfl-lime); font-weight: 700; }
.sfl .ss-close { color: var(--sfl-lime); }
.sfl #ss-popup .ss-nav { border-color: var(--sfl-lime); color: var(--sfl-white); }

/* Hide legacy header pieces that may be printed by old content. */
.sfl .section-logo { display: none; }

/* 404 (main.css styles body.error404 as a full-screen splash; undo that) */
body.sfl.error404 { display: block; height: auto; padding-top: 0; color: var(--sfl-navy); }
.sfl-404 { padding: 120px 0; text-align: center; }
.sfl.error404 .sfl-404 h2 { margin-bottom: 18px; font-size: 3.25rem; font-weight: 400; color: var(--sfl-navy); }

/* ------------------------------------------------------------------------
 * 11. Responsive
 * --------------------------------------------------------------------- */
@media (max-width: 1199.98px) {
	.sfl-header__inner { align-items: flex-start; padding-top: 24px; padding-bottom: 20px; }
	.sfl-brand__logo { width: 220px; }
	.sfl-brand__ecig { width: 70px; }
	.sfl-nav-toggle { display: block; top: 26px; }
	.sfl-nav {
		display: none;
		margin-top: 20px;
		padding: 10px 0;
		border-radius: var(--sfl-radius);
		background: var(--sfl-navy);
		box-shadow: 0 20px 40px rgba(0, 0, 0, .25);
	}
	.sfl-nav-open .sfl-nav { display: block; }
	.sfl-nav__list { flex-direction: column; gap: 0; }
	.sfl-nav__list a, .sfl #menu-main-menu li a { padding: 13px 24px; border: 0; font-size: 16px; }
	.sfl-nav__list a:hover, .sfl-nav__list .current-menu-item > a { background: rgba(255, 255, 255, .06); }
	.sfl-nav__list .sub-menu { position: static; transform: none; opacity: 1; visibility: visible; box-shadow: none; background: transparent; padding: 0 0 0 16px; }
	.sfl-nav__list .sub-menu a { color: var(--sfl-white); }

	.sfl-hero { padding-top: 170px; }
	.sfl-intro__grid { gap: 50px 60px; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); }
	.sfl-steps__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

@media (max-width: 991.98px) {
	.sfl h1, .sfl-page-hero__title { font-size: 2.5rem; }
	.sfl-heading h2, .sfl-display, .sfl .section__title h2 { font-size: 2.375rem; }
	.sfl-hero__headline, .sfl .sfl-hero__title h1 { font-size: 2.75rem; }
	.sfl-hero__text { font-size: 1.625rem; }
	.sfl-section, .sfl .section { padding: 80px 0; }

	.sfl-cards--3, .sfl-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sfl-intro__grid, .sfl-steps__grid, .sfl-contact__grid { grid-template-columns: 1fr; }
	.sfl-intro__aside { max-width: 560px; }
	.sfl-steps__media { max-width: 460px; margin: 0 auto; }
	.sfl-steps__cards { padding-top: 0; }
	.sfl-contact__band { background: none; }
	.sfl-contact__band::before, .sfl-contact__band::after { content: ""; position: absolute; top: 0; bottom: 0; width: 12px; }
	.sfl-contact__band::before { left: 0; background: var(--sfl-lime); }
	.sfl-contact__band::after { right: 0; background: var(--sfl-navy); }
	.sfl-contact__grid { padding: 0 10px; }
	.sfl-together__items { background-size: 80% auto; }
	.sfl-cta-strip__inner { flex-direction: column; text-align: center; }
}

@media (max-width: 767.98px) {
	:root { --sfl-gutter: 16px; }
	body.sfl { font-size: 15px; }
	.sfl-brand__logo { width: 180px; }
	.sfl-brand__ecig { width: 58px; }
	.sfl-nav-toggle { top: 22px; }

	.sfl-hero { min-height: 0; padding: 150px 0 80px; }
	.sfl-hero__headline, .sfl .sfl-hero__title h1 { font-size: 2.125rem; }
	.sfl .sfl-hero__title h2 { font-size: 1rem; }
	.sfl-hero__text { font-size: 1.25rem; margin-bottom: 26px; }
	.sfl-ticks--inline { flex-direction: column; align-items: flex-start; text-align: left; gap: 12px; }
	.sfl-hero .sfl-ticks { margin-bottom: 30px; }
	.sfl-hero .sfl-pills, .sfl-steps__cards .sfl-pills { width: 100%; min-width: 0; }
	.sfl-pills__row .sfl-pill { white-space: normal; }
	.sfl-hero .sfl-ticks--inline { width: auto; }
	.sfl-pills__row { flex-direction: column; }
	.sfl-pill { font-size: 14px; padding-left: 22px; }
	.sfl-pill__label { word-break: break-word; }
	.sfl-hero__links { flex-direction: column; width: 100%; }

	.sfl-page-hero { padding: 50px 0 60px; }
	.sfl h1, .sfl-page-hero__title { font-size: 2rem; }
	.sfl-heading h2, .sfl-display, .sfl .section__title h2 { font-size: 1.875rem; }
	.sfl-display { margin-bottom: 30px; }
	.sfl-section, .sfl .section { padding: 60px 0; }
	.sfl-section--tight { padding: 40px 0; }

	.sfl-cards--2, .sfl-cards--3, .sfl-news-grid { grid-template-columns: 1fr; }
	.sfl-card--feature { flex-direction: column; gap: 14px; padding: 28px 24px; }
	.sfl-card--feature .sfl-card__title { margin-top: 0; }
	.sfl-card__icon { width: 54px; height: 54px; flex-basis: 54px; }
	.sfl-callout { display: block; }
	.sfl-photo--navy-right::before { transform: translate(12px, 12px); }
	.sfl-photo--lime-left::before { transform: translate(-12px, 14px); }
	.sfl-steps__media { padding-left: 12px; }

	.sfl-together__items { grid-template-columns: 1fr; gap: 30px; min-height: 0; margin: 40px 0; background: none !important; }
	.sfl-together__item--2 { padding-top: 0; }

	.sfl-contact__list li { font-size: 16px; }
	.sfl-contact__icon { width: 52px; height: 52px; flex-basis: 52px; }
	.sfl-form__row { grid-template-columns: 1fr; gap: 16px; }

	.sfl-footer__bar .container { flex-direction: column; justify-content: center; text-align: center; }
	.sfl-footer__credits { justify-content: center; }

	.sfl .section--small-tabs .nav-tabs, .sfl .section--stop .nav-tabs { display: none; }
	.sfl .sfl-notice .card-header, .sfl .sfl-notice ul.za-newhomebox-sty { padding-left: 22px; padding-right: 22px; }
	.sfl .sfl-notice p.za-newbox-footer-text { margin: 0 22px; }
}
