@media (max-width: 991px) {

	.hero_msg p.hero_title {
		color: #fff;
		font-size: 62px;
		line-height: 72px;
	}
	.hero {
		background-image: url(../images/mobile_hero.jpg);
		background-size: cover;
		padding: 60px 0;
	}
	.hero h2,
	.hero p {
		color: #fff;
	}
	#gif1,
	#gif2,
	#gif3 {
		display: none;
	}
	ul.header_meta {
		margin: 20px auto 0 auto;
		float: none;
		display: table;
	}
	#burger {
		display: block;
	}
	ul.header_meta {
		width: 100%;
		float: left;
	}
	li.header_basket {
		background-color: #efefef;
		padding: 8px 16px 8px 36px !important;
		border-radius: 3px;
		background-position: 10px center;
		width: 48%;
		float: left;
		margin: 0 !important;
	}
	li.header_account {
		margin: 0 !important;
		width: 48%;
		float: right !important;
		background-color: #efefef;
		padding: 8px 16px 8px 36px !important;
		border-radius: 3px;
		background-position: 10px center;
	}
	li.header_search { display: none !important; }
	.search_container {
		display: block;
	}
	.search_container .col-xs-8 {
		padding-right: 0 !important;
	}
	.hero_intro,
	.hero_categories,
	.hero_about,
	.hero_blogs,
	.hero_wwd,
	.hero_artists,
	.related.products {
		padding: 60px 0;
	}
	.hero_about .row,
	.flex-row {
		align-items: unset;
		display: block;
	}
	.hero_about_text {
		width: 100%;
		float: left;
		margin: 60px 0 0 0;
	}
	.blog_item {
		margin: 0 0 30px 0;
	}
	.hero_artists .fimg {
		margin: 0 0 30px 0;
	}
	.hero_blogs .col-sm-4:last-child .blog_item {
		margin: 0;
	}
	.footer_item,
	.footer_logo {
		margin: 0 0 30px 0;
	}
	.legal .tandc {
		float: left;
		margin-top: 15px;
	}
	.legal .tandc a {
		margin: 10px 10px 0 0;
	}
	.page_header,
	.blog_header {
		padding: 30px;
	}
	.page_header img {
		max-width: 100%;
	}
	.about_1 .fimg,
	.about_2 .fimg {
		margin: 0 0 30px 0;
	}
	.woocommerce-products-header__title.page-title {
		width: 100%;
		float: left;
	}
	.tax-artist .woocommerce-products-header__title.page-title {
		margin-top: 30px;
	}
	.tax-artist .page_header h1,
	.tax-artist .page_header p {
		text-align: center;
	}
	.tax-artist .page_header p.artist_website {
	}
	ul.products.row.columns-4 li {
		width: 50% !important;
		float: left !important;
		clear: both !important;
		margin: 0 0 30px 0 !important;
	}
	.product_inside {
		min-height: 0;
	}
	.product_thumb {
		padding: 10px;
	}
	.blog_header {
		margin: 0 0 30px 0;
	}
	.frameset {
		margin-top: 30px;
	}
	.custom-card span,
	.customise_and_subscribe {
		display: block;
		width: 100%;
		text-align: center;
	}
	.designed_by {

	}
	.featured_artist img {
		margin: 0 0 30px 0;
	}
	.card-global-actions {
		border-top: 1px solid #efefef;
		margin-top: 10px;
		padding-top: 10px;
		position: relative;
	}
	#card-background-container, #card-music-container, #card-sticker-container {
		position: unset;
		margin: 0;
		float: left;
		display: contents;
	}
	#custom-card-container-header {
		padding: 10px 0;
	}
	#card-background-options,
	#card-sticker-options,
	#card-music-options {
		top: 70px;
		right: 0;
		left: 0;
		width: 100%;
	}
	#card-music-options,
	#card-sticker-options {
		max-height: 260px;
		overflow: scroll;
	}
	.card-stage {
		padding: 15px;
	}
	#canvas-front,
	#canvas-inside1,
	#canvas-inside2,
	#canvas-back {
		width: 100%;
		height: auto;
		max-width: 500px;
		margin: 0 auto;  /* optional: center on desktop */
	}
	#custom-card-container-body {
		padding: 60px 30px;
	}
	#card-container-inside .card-stage {
		margin: 0 0 15px 0;
	}
	#custom-card-container-footer {
		bottom: 0;
	}
	#card-page-front {
		background-size: 25px;
		width: 25px;
		height: 36px;
	}
	#card-page-inside {
		background-size: 25px;
		width: 25px;
		height: 36px;
	}
	#card-page-back {
		background-size: 25px;
		width: 26px;
		height: 36px;
	}
	.form-horizontal.ecard_details {
		width: 100%;
		float: left;
	}
	.form-horizontal .form-group {
		margin: 0 0 15px 0;
	}
	.ecard_details label {
		padding: 0 15px;
		font-size: 14px;
		margin-top: 6px;
		margin-bottom: 10px;
	}
	#ecard-intro,
	#ecard-intro video {
		width: 100%;
		float: left;
	}
	.page-id-68 #custom-card-container-footer { display: none; }

	#card-background,
	#card-sticker,
	#card-music {
		background-position: 5px;
		padding: 5px 5px 5px 30px;
	}

	.home_featured_card_container .row {
		display: block;
		align-items: unset;
	}
	.home_featured_card_container img {
		margin: 0 0 30px 0;
	}
	.woocommerce-MyAccount-content,
	.woocommerce-MyAccount-content h2 {
		clear: both;
	}
	ul#card-page-nav li {
		padding: 15px;
	}

	label[for=ecard_date] span {
		display: inline;
	}

	/* Homepage: images can never overflow their column */
	.home_featured_card_container img {
		max-width: 100%;
		height: auto;
	}

	/* My Account — Google review CTA stacks on small screens */
	.review_cta {
		display: block;
		padding: 24px 28px;
	}
	.review_cta_btn {
		margin-top: 16px;
		width: 100%;
		justify-content: center;
	}

	/* eCard preview bar — stack label above the buttons on phones */
	#preview-bar {
		flex-wrap: wrap;
		gap: 8px;
		padding: 10px 14px;
	}
	.preview-bar-label {
		width: 100%;
		font-size: 12px;
	}
	.preview-bar-actions {
		width: 100%;
	}
	#preview-back,
	#preview-basket {
		flex: 1;
		padding: 10px 8px;
	}
	body.lolve-preview #ecard-page {
		padding-top: 92px;
	}

	/* Subscriptions — banner and pricing page stack on small screens */
	.hero_subs {
		padding: 0 0 60px 0;
	}
	.subs_banner {
		display: block;
		padding: 26px 28px;
	}
	.subs_banner_btn {
		margin-top: 16px;
		width: 100%;
		text-align: center;
	}
	.subs_page {
		padding: 60px 0;
	}
	.subs_plan {
		margin: 0 0 20px 0;
	}
	.subs_perks {
		display: block;
	}
	.subs_perk {
		margin: 0 0 26px 0;
	}

	/* Homepage reviews cards */
	.hero_reviews {
		padding: 60px 0;
	}
	.home_review {
		margin: 0 0 20px 0;
	}
	.home_review_row .col-sm-4:last-child .home_review {
		margin: 0;
	}
}

/* Phone sizes — scale homepage typography down so nothing falls off screen */
@media (max-width: 767px) {

	body {
		overflow-x: hidden;
	}
	.hero_msg p.hero_title {
		font-size: 42px;
		line-height: 46px;
		overflow-wrap: break-word;
	}
	.hero_msg p {
		font-size: 24px;
		line-height: 30px;
	}
	.hero_msg a {
		font-size: 18px;
	}
	.title_bar h2,
	.hero_intro h1,
	.hero_artists .title_bar h2,
	.home_featured_card_container h2 {
		font-size: 32px;
		line-height: 38px;
		overflow-wrap: break-word;
	}
	.hero_intro p,
	.hero_artists p {
		font-size: 18px;
		line-height: 26px;
	}
	.home_featured_card_container h3 {
		font-size: 22px;
	}
}

/* ============================================================
   MOBILE MENU — slide-in drawer (burger toggle)
   Desktop untouched: style.css keeps #mobile_menu display:none,
   these overrides only apply ≤991px where the burger shows.
   ============================================================ */
@media (max-width: 991px) {

	#burger { cursor: pointer; }

	body.mm-lock { overflow: hidden; }

	#mobile_menu_overlay {
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		background: rgba(16, 18, 21, 0.45);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.25s ease, visibility 0.25s ease;
		z-index: 99998;
	}
	#mobile_menu_overlay.show {
		opacity: 1;
		visibility: visible;
	}

	#mobile_menu {
		display: block; /* overrides display:none in style.css */
		position: fixed;
		top: 0; right: 0; bottom: 0;
		width: 340px;
		max-width: 88vw;
		background: #fff;
		z-index: 99999;
		transform: translateX(103%);
		transition: transform 0.28s ease;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		box-shadow: -18px 0 40px rgba(16, 18, 21, 0.18);
		padding-bottom: env(safe-area-inset-bottom, 20px);
	}
	#mobile_menu.open { transform: translateX(0); }

	#mobile_menu .mm-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 16px 20px;
		border-bottom: 1px solid #f1f1f1;
		position: sticky;
		top: 0;
		background: #fff;
		z-index: 2;
	}
	#mobile_menu .mm-title {
		font-family: "Crimson Text", serif;
		font-weight: 600;
		font-size: 24px;
		color: #101215;
	}
	#mm-close {
		background: none;
		border: none;
		padding: 8px;
		font-size: 18px;
		line-height: 1;
		color: #808080;
	}

	#mobile_menu ul.mm-list {
		list-style: none;
		margin: 0;
		padding: 6px 0 12px 0;
	}
	#mobile_menu .mm-list > li {
		border-bottom: 1px solid #f7f7f7;
	}
	#mobile_menu .mm-list > li > a {
		display: block;
		padding: 14px 20px;
		font-size: 16px;
		font-weight: 500;
		color: #101215;
		text-decoration: none;
	}
	#mobile_menu .mm-list > li > a:hover { text-decoration: none; }

	/* Nested WP sub-menus (if any are ever added in wp-admin) */
	#mobile_menu .mm-list .sub-menu {
		list-style: none;
		margin: 0;
		padding: 0 0 8px 32px;
	}
	#mobile_menu .mm-list .sub-menu a {
		display: block;
		padding: 8px 0;
		font-size: 15px;
		color: #555;
	}

	/* Accordion rows (eCards / Gifts / Flowers / Artists) */
	#mobile_menu li.mm-acc {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#mobile_menu li.mm-acc > a { flex: 1; }
	.mm-acc-toggle {
		background: none;
		border: none;
		padding: 14px 20px;
		color: #808080;
		line-height: 1;
	}
	.mm-acc-toggle .bi {
		font-size: 14px;
		display: inline-block;
		transition: transform 0.2s ease;
	}
	#mobile_menu li.mm-acc.open { background: #fafafa; }
	#mobile_menu li.mm-acc.open > .mm-acc-toggle .bi { transform: rotate(180deg); }
	#mobile_menu li.mm-acc.open > a { color: #0b5e94; }

	/* Panes */
	#mobile_menu .mm-pane {
		display: none;
		width: 100%;
		padding: 0 20px 18px 20px;
	}
	#mobile_menu li.mm-acc.open > .mm-pane { display: block; }

	#mobile_menu .mm-shopall {
		display: block;
		padding: 4px 0 12px 0;
		font-size: 15px;
		font-weight: 600;
		color: #0071BC;
	}
	#mobile_menu .mm-shopall .bi { font-size: 13px; }

	#mobile_menu .mm-pills {
		padding: 0 0 12px 0;
	}
	#mobile_menu .mm-pills-label {
		display: block;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.09em;
		text-transform: uppercase;
		color: #9a9a9a;
		margin: 0 0 8px 0;
	}
	#mobile_menu .mm-pill {
		display: inline-block;
		padding: 6px 12px;
		margin: 0 6px 6px 0;
		background: #f1f1f1;
		border-radius: 999px;
		font-size: 14px;
		color: #101215;
	}
	#mobile_menu .mm-pill.is-now {
		background: #e9f2fa;
		color: #0b5e94;
	}
	.mm-dot {
		display: inline-block;
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: #1a8cdb;
		margin-right: 7px;
		vertical-align: 1px;
	}

	/* Collapsible groups inside the eCards pane */
	#mobile_menu .mm-group {
		border-top: 1px solid #efefef;
	}
	#mobile_menu .mm-group-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		background: none;
		border: none;
		padding: 12px 0;
		font-size: 15px;
		font-weight: 600;
		color: #101215;
		text-align: left;
	}
	#mobile_menu .mm-group-head .bi {
		font-size: 12px;
		color: #9a9a9a;
		transition: transform 0.2s ease;
	}
	#mobile_menu .mm-group.open > .mm-group-head .bi { transform: rotate(180deg); }
	#mobile_menu .mm-group > ul.mm-plain { display: none; }
	#mobile_menu .mm-group.open > ul.mm-plain { display: block; }

	#mobile_menu ul.mm-plain {
		list-style: none;
		margin: 0;
		padding: 0 0 10px 0;
	}
	#mobile_menu ul.mm-plain li a {
		display: flex;
		align-items: center;
		padding: 9px 0 9px 6px;
		font-size: 15px;
		color: #555;
	}
	#mobile_menu ul.mm-plain li a .mm-dot { flex-shrink: 0; }
	#mobile_menu ul.mm-plain li a small {
		margin-left: auto;
		padding-left: 12px;
		color: #9a9a9a;
		font-size: 12px;
	}

	#mobile_menu .mm-flatlist {
		border-top: 1px solid #efefef;
		padding: 10px 0 0 0;
		margin: 4px 0 0 0;
	}
	#mobile_menu .mm-flat {
		display: block;
		padding: 9px 0;
		font-size: 15px;
		font-weight: 500;
		color: #101215;
	}
	#mobile_menu .mm-flat .bi {
		color: #7a7a7a;
		margin-right: 8px;
	}
	#mobile_menu .mm-flat-charity .bi { color: #d64561; }

	#mobile_menu .mm-note {
		font-size: 14px;
		color: #808080;
		margin: 0;
		padding: 4px 0 0 0;
	}
}

/* Very small phones */
@media (max-width: 400px) {

	.hero_msg p.hero_title {
		font-size: 34px;
		line-height: 38px;
	}
	.hero_msg p {
		font-size: 20px;
		line-height: 26px;
	}
}