@media (max-width: 1240px) {
	.article-shell.has-deal-box {
		grid-template-columns: minmax(170px, 210px) minmax(0, 820px);
	}

	.deal-sidebar {
		display: none;
	}
}

@media (max-width: 980px) {
	.dg-container,
	.article-shell {
		width: min(calc(100% - 28px), 860px);
	}

	.header-inner {
		min-height: 66px;
	}

	.menu-toggle {
		display: inline-grid;
	}

	.search-toggle {
		display: inline-grid;
	}

	.desktop-header-search {
		display: none;
	}

	.primary-navigation {
		position: absolute;
		top: 66px;
		left: 0;
		right: 0;
		display: none;
		margin: 0;
		border-bottom: 1px solid var(--dg-border);
		background: var(--dg-white);
	}

	.primary-navigation.is-open {
		display: block;
	}

	.primary-menu {
		width: min(calc(100% - 28px), 860px);
		margin-inline: auto;
		padding: 8px 0 14px;
		flex-direction: column;
		align-items: stretch;
	}

	.primary-menu a {
		justify-content: space-between;
		min-height: 44px;
	}

	.hero-grid,
	.split-latest {
		grid-template-columns: 1fr;
	}

	.hero-copy h1 {
		font-size: 38px;
	}

	.hero-panel {
		min-height: 260px;
	}

	.hero-illustration {
		height: 260px;
	}

	.hero-bag {
		left: 24%;
		top: 72px;
		width: 118px;
		height: 132px;
	}

	.hero-bag::before {
		left: 28px;
		top: -34px;
		width: 62px;
		height: 62px;
		border-width: 10px;
	}

	.hero-percent {
		right: 27%;
		top: 68px;
		width: 74px;
		height: 94px;
		font-size: 46px;
	}

	.hero-gift {
		right: 16%;
		bottom: 44px;
		width: 76px;
		height: 62px;
	}

	.card-grid-three,
	.category-grid,
	.category-grid-large,
	.related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.coupon-hub-header {
		align-items: flex-start;
		flex-direction: column;
	}

	.coupon-flow-pills {
		justify-content: flex-start;
	}

	.coupon-industry-grid,
	.coupon-brand-grid,
	.coupon-feature-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.coupon-industry-grid--compact {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.coupon-mini-card-row {
		grid-template-columns: 54px minmax(0, 1fr) auto;
	}

	.coupon-mini-card-row .coupon-mini-code,
	.coupon-mini-card-row .coupon-mini-deal-button,
	.coupon-mini-card-row .coupon-mini-meta {
		grid-column: 2 / -1;
	}

	.coupon-mini-card-row .coupon-mini-meta {
		justify-content: flex-start;
		text-align: left;
	}

	.coupon-category-flow--focused .coupon-mini-card-row {
		grid-template-columns: 62px minmax(0, 1fr) minmax(128px, auto);
		grid-template-areas:
			"logo copy discount"
			"logo code code"
			"meta meta deal";
		min-height: 160px;
		padding: 16px;
	}

	.coupon-category-flow--focused .coupon-row-list {
		grid-template-columns: 1fr;
	}

	.coupon-category-flow--focused .coupon-mini-logo {
		grid-area: logo;
		grid-row: auto;
	}

	.coupon-category-flow--focused .coupon-mini-logo-mark {
		width: 58px;
		height: 58px;
	}

	.coupon-category-flow--focused .coupon-mini-copy {
		grid-area: copy;
	}

	.coupon-category-flow--focused .coupon-mini-discount {
		grid-area: discount;
	}

	.coupon-category-flow--focused .coupon-mini-code {
		grid-area: code;
	}

	.coupon-category-flow--focused .coupon-mini-deal-button {
		grid-area: deal;
	}

	.coupon-category-flow--focused .coupon-mini-meta {
		grid-area: meta;
	}

	.coupon-flow-guide {
		grid-template-columns: 1fr;
	}

	.coupon-category-flow--physical .coupon-row-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.coupon-flow-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.article-shell,
	.article-shell.has-deal-box {
		display: grid;
		grid-template-columns: minmax(0, 820px);
		gap: 16px;
		padding-top: 18px;
	}

	.toc-sidebar {
		position: static;
	}

	.article-toc {
		overflow: hidden;
	}

	.toc-toggle {
		display: flex;
	}

	.toc-list {
		display: none;
		padding-top: 0;
	}

	.article-toc.is-open .toc-list {
		display: block;
	}

	.article-header h1 {
		font-size: 36px;
	}

	.entry-content {
		padding: 28px;
		font-size: 17px;
	}

	.entry-content h2 {
		font-size: 27px;
	}

	.entry-content h3 {
		font-size: 22px;
	}
}

@media (max-width: 680px) {
	body.mobile-deal-visible {
		padding-bottom: 76px;
	}

	body {
		font-size: 15px;
	}

	.dg-container,
	.article-shell {
		width: min(calc(100% - 24px), 620px);
	}

	.dg-section[id],
	.archive-section[id],
	.coupon-hub-section[id] {
		scroll-margin-top: 76px;
	}

	.site-header {
		position: sticky;
	}

	.brand-ticket {
		width: 35px;
		height: 28px;
		font-size: 12px;
	}

	.brand-word,
	.footer-brand {
		font-size: 22px;
	}

	.brand-word small,
	.footer-brand small {
		font-size: 12px;
	}

	.icon-button {
		width: 40px;
		height: 40px;
	}

	.header-actions {
		gap: 6px;
	}

	.header-search-form,
	.not-found-search,
	.dg-search-form {
		grid-template-columns: 1fr;
	}

	.header-search-form button,
	.dg-search-form button {
		min-height: 44px;
	}

	.home-hero {
		padding-top: 30px;
	}

	.hero-copy h1 {
		font-size: 32px;
		line-height: 1.12;
	}

	.hero-description {
		font-size: 16px;
	}

	.hero-actions {
		display: grid;
		grid-template-columns: 1fr;
	}

	.button {
		width: 100%;
	}

	.hero-panel {
		min-height: 220px;
		border-radius: 14px;
	}

	.hero-illustration {
		height: 220px;
	}

	.hero-bag {
		left: 18%;
		top: 68px;
		width: 98px;
		height: 110px;
		border-radius: 16px 16px 10px 10px;
	}

	.hero-bag::before {
		left: 24px;
		top: -28px;
		width: 50px;
		height: 50px;
		border-width: 8px;
	}

	.hero-percent {
		right: 22%;
		top: 56px;
		width: 64px;
		height: 82px;
		border-radius: 14px;
		font-size: 39px;
	}

	.hero-gift {
		right: 10%;
		bottom: 34px;
		width: 64px;
		height: 54px;
	}

	.section-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}

	.section-heading h2 {
		font-size: 23px;
	}

	.card-grid-three,
	.category-grid,
	.category-grid-large,
	.related-grid {
		grid-template-columns: 1fr;
	}

	.coupon-hub-section {
		gap: 16px;
	}

	.coupon-hub-title {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}

	.coupon-hub-logo,
	.coupon-hub-divider,
	.coupon-flow-pills,
	.coupon-flow-guide {
		display: none;
	}

	.coupon-hub-title h2 {
		font-size: 24px;
	}

	.coupon-hub-title p,
	.coupon-hub-block-heading p {
		font-size: 13px;
	}

	.coupon-hub-block-heading {
		align-items: flex-start;
		gap: 10px;
	}

	.coupon-hub-block-heading h2,
	.coupon-hub-block-heading h3 {
		font-size: 16px;
	}

	.coupon-hub-block-heading .view-all {
		flex: 0 0 auto;
		font-size: 12px;
	}

	.coupon-industry-grid,
	.coupon-brand-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 8px;
	}

	.coupon-industry-card,
	.coupon-brand-card {
		gap: 5px;
		min-height: 76px;
		padding: 8px 4px;
	}

	.coupon-industry-icon,
	.coupon-brand-tile-logo {
		width: 34px;
		height: 34px;
		border-radius: 8px;
	}

	.coupon-industry-icon svg,
	.coupon-brand-tile-logo svg {
		width: 20px;
		height: 20px;
	}

	.coupon-industry-name,
	.coupon-brand-card-name {
		font-size: 9px;
		line-height: 1.15;
	}

	.coupon-industry-count,
	.coupon-brand-card-count {
		display: none;
	}

	.coupon-feature-grid {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.coupon-mini-card-card,
	.coupon-mini-card-row {
		display: grid;
		grid-template-columns: 42px minmax(0, 1fr) auto;
		align-items: center;
		justify-items: stretch;
		gap: 7px 9px;
		min-height: auto;
		padding: 9px;
		text-align: left;
	}

	.coupon-mini-logo {
		grid-row: 1 / 3;
	}

	.coupon-mini-logo-mark {
		width: 42px;
		height: 42px;
		border-radius: 10px;
	}

	.coupon-mini-logo-mark svg {
		width: 24px;
		height: 24px;
	}

	.coupon-mini-brand {
		font-size: 10px;
	}

	.coupon-mini-copy h3 {
		font-size: 12px;
		line-height: 1.24;
	}

	.coupon-mini-copy p {
		display: none;
	}

	.coupon-mini-discount,
	.coupon-mini-card-card .coupon-mini-discount {
		min-height: 26px;
		padding: 5px 8px;
		border-radius: 7px;
		background: #eafbf2;
		color: var(--dg-green);
		font-size: 10px;
		text-align: center;
	}

	.coupon-mini-code {
		grid-column: 2 / -1;
		width: 100%;
		min-height: 32px;
		padding: 6px 9px;
		font-size: 11px;
	}

	.coupon-mini-deal-button {
		grid-column: 2 / -1;
		width: 100%;
		min-height: 34px;
		padding: 7px 10px;
		font-size: 11px;
	}

	.coupon-category-flow--focused {
		gap: 14px;
	}

	.coupon-category-flow--focused .coupon-row-list {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.coupon-category-flow--physical .coupon-row-list {
		grid-template-columns: 1fr;
	}

	.coupon-mini-card-product {
		min-height: 0;
		padding: 12px;
	}

	.coupon-mini-product-media {
		aspect-ratio: 16 / 10;
	}

	.coupon-category-flow--focused .coupon-mini-card-row {
		grid-template-columns: 48px minmax(0, 1fr) minmax(112px, auto);
		grid-template-areas:
			"logo copy discount"
			"logo code code"
			"logo meta deal";
		gap: 8px 10px;
		min-height: 148px;
		padding: 12px;
		border-radius: 10px;
	}

	.coupon-category-flow--focused .coupon-mini-logo {
		grid-area: logo;
		grid-row: auto;
		align-self: start;
	}

	.coupon-category-flow--focused .coupon-mini-logo-mark {
		width: 46px;
		height: 46px;
		border-radius: 10px;
	}

	.coupon-category-flow--focused .coupon-mini-logo-mark svg {
		width: 26px;
		height: 26px;
	}

	.coupon-category-flow--focused .coupon-mini-copy {
		grid-area: copy;
	}

	.coupon-category-flow--focused .coupon-mini-copy h3 {
		font-size: 13px;
		line-height: 1.25;
	}

	.coupon-category-flow--focused .coupon-mini-discount {
		grid-area: discount;
	}

	.coupon-category-flow--focused .coupon-mini-code {
		grid-area: code;
		min-height: 34px;
	}

	.coupon-category-flow--focused .coupon-mini-deal-button {
		grid-area: deal;
		width: 100%;
		min-width: 112px;
		min-height: 38px;
		font-size: 12px;
	}

	.coupon-category-flow--physical .coupon-mini-card-product {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: none;
	}

	.coupon-category-flow--physical .coupon-mini-card-product > * {
		grid-area: auto;
	}

	.coupon-mini-meta,
	.coupon-mini-card-row .coupon-mini-meta {
		display: none;
	}

	.coupon-category-flow--physical .coupon-mini-card-product .coupon-mini-meta {
		display: flex;
	}

	.article-card-compact {
		grid-template-columns: 92px minmax(0, 1fr);
	}

	.article-card-compact .card-body {
		padding: 12px;
	}

	.card-title,
	.deal-title {
		font-size: 17px;
	}

	.category-card {
		min-height: 132px;
	}

	.deal-card {
		grid-template-columns: auto minmax(0, 1fr);
		align-items: start;
	}

	.deal-actions {
		grid-column: 1 / -1;
		align-items: stretch;
	}

	.archive-hero {
		padding: 28px 0 16px;
	}

	.archive-hero-coupon-category {
		padding: 22px 0 12px;
	}

	.archive-hero-coupon-category + .archive-layout {
		padding-top: 6px;
	}

	.archive-hero h1,
	.article-header h1 {
		font-size: 30px;
	}

	.archive-description,
	.article-subtitle {
		font-size: 16px;
	}

	.article-header {
		padding-top: 26px;
	}

	.article-featured-image {
		border-radius: 12px;
	}

	.article-featured-image img {
		aspect-ratio: 16 / 10;
	}

	.entry-content {
		padding: 22px;
		border-radius: 12px;
		font-size: 16px;
		line-height: 1.75;
	}

	.entry-content h2 {
		font-size: 25px;
	}

	.entry-content h3 {
		font-size: 21px;
	}

	.mobile-deal-bar {
		position: fixed;
		left: 10px;
		right: 10px;
		bottom: 10px;
		z-index: 120;
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto 34px;
		align-items: center;
		gap: 10px;
		min-height: 58px;
		padding: 9px 9px 9px 12px;
		border: 1px solid #cfe0ff;
		border-radius: 12px;
		background: var(--dg-white);
		box-shadow: 0 16px 34px rgba(8, 28, 58, 0.2);
	}

	.mobile-deal-bar[hidden] {
		display: none;
	}

	.mobile-deal-bar span {
		display: block;
		color: var(--dg-muted);
		font-size: 11px;
		font-weight: 800;
		text-transform: uppercase;
	}

	.mobile-deal-bar strong {
		display: block;
		color: var(--dg-green);
		font-size: 14px;
		line-height: 1.2;
		overflow-wrap: anywhere;
	}

	.mobile-deal-bar a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 38px;
		padding: 8px 10px;
		border-radius: 8px;
		background: var(--dg-orange);
		color: var(--dg-white);
		font-size: 12px;
		font-weight: 850;
		text-align: center;
	}

	.mobile-deal-close {
		display: grid;
		place-items: center;
		width: 34px;
		height: 34px;
		padding: 0;
		border: 1px solid var(--dg-border);
		border-radius: 50%;
		background: #f8fafc;
		color: var(--dg-muted);
	}

	.footer-inner {
		align-items: flex-start;
		flex-direction: column;
	}
}

@media (max-width: 420px) {
	.article-card-compact {
		grid-template-columns: 1fr;
	}

	.article-card-compact .card-thumbnail {
		aspect-ratio: 16 / 9;
	}

	.mobile-deal-bar {
		grid-template-columns: minmax(0, 1fr) 34px;
	}

	.mobile-deal-bar a {
		grid-column: 1 / -1;
	}
}
