/* ═══════════════════════════════════════════════════════════════════════
   category-detail.css — public category landing (/category/<slug>).

   Block: .gg-cd  (Category Detail)

   Sections, top-to-bottom:
     1. Compact premium hero (split: content-left + image-showcase-right)
     2. Popular services strip
     3. Sticky filter bar — full-bleed when stuck (mirrors business dir)
     4. Pros (businesses) grid — paginated + load more
     5. SEO content (Why GoGeter)
     6. Related categories
     7. Bottom CTA
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Body / page wrapper ─────────────────────────────────────────────── */
.gg-cd-body{ background: var(--gg-off-white, #FAFAFA); }
.gg-cd-body::before{
	content: ""; position: fixed; inset: 0;
	background:
		radial-gradient(1100px 460px at 8% -8%, rgba(237,41,56,.06), transparent 70%),
		radial-gradient(900px 420px at 110% 12%, rgba(237,41,56,.04), transparent 75%);
	pointer-events: none; z-index: 0;
}
.gg-cd{ width: 100%; padding: 20px 28px 32px; position: relative; z-index: 1; display: flex; flex-direction: column; gap: clamp(20px, 2.4vw, 32px); }
@media (max-width: 700px){ .gg-cd{ padding: 14px 14px 48px; } }

/* ── Atoms ───────────────────────────────────────────────────────────── */
.gg-cd__eyebrow{
	display: inline-flex; align-items: center; gap: 7px;
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-2xs, 11px);
	font-weight: 700;
	color: var(--gg-red, #ED2938);
	letter-spacing: .14em; text-transform: uppercase;
	margin-bottom: 4px;
}
.gg-cd__eyebrow i{ font-size: 13px; }
.gg-cd__eyebrow--light{ color: rgba(255,255,255,.82); }
.gg-cd__eyebrow--light i{ color: #fff; }

.gg-cd__btn{
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 10px 18px;
	border-radius: 12px;
	font-family: var(--gg-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	white-space: nowrap;
	transition: all 200ms ease;
	border: 1.5px solid transparent;
}
.gg-cd__btn i{ transition: transform 200ms ease; }
.gg-cd__btn--primary{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff;
	box-shadow: 0 10px 26px -10px rgba(237,41,56,.6), inset 0 1px 0 rgba(255,255,255,.18);
}
.gg-cd__btn--primary:hover{ filter: brightness(1.05); transform: translateY(-1px); color: #fff; }
.gg-cd__btn--primary:hover i{ transform: translateX(2px); }
.gg-cd__btn--dark{
	background: var(--gg-black, #0A0A0A);
	color: #fff;
}
.gg-cd__btn--dark:hover{ background: var(--gg-black-soft, #141414); transform: translateY(-1px); color: #fff; }
.gg-cd__btn--white{
	background: #fff;
	color: var(--gg-red-deep, #B91C28);
	box-shadow: 0 10px 26px -10px rgba(0,0,0,.4);
}
.gg-cd__btn--white:hover{ transform: translateY(-1px); }
.gg-cd__btn--white:hover i{ transform: translateX(2px); }

/* ── Breadcrumb ──────────────────────────────────────────────────────── */
.gg-cd__crumbs{ margin: 0; }
.gg-cd__crumbs-list{
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-xs, 12px);
	font-weight: 600;
	color: var(--gg-gray-500, #6B7280);
}
.gg-cd__crumbs-list li{ display: inline-flex; align-items: center; gap: 8px; }
.gg-cd__crumbs-list li:not(:last-child)::after{ content: "/"; color: var(--gg-gray-300, #D1D5DB); font-weight: 500; }
.gg-cd__crumbs-list a{ color: var(--gg-gray-500, #6B7280); transition: color 180ms ease; }
.gg-cd__crumbs-list a:hover{ color: var(--gg-red-deep, #B91C28); }
.gg-cd__crumbs-list span[aria-current]{ color: var(--gg-gray-800, #1F2937); }

/* ── HERO — compact premium split ───────────────────────────────────── */
.gg-cd__hero{
	position: relative;
	overflow: hidden;
	border-radius: 20px;
	padding: 0;
	background: linear-gradient(135deg, #FFF8F8 0%, #FFF1F2 45%, #FFFAF7 100%);
	border: 1px solid rgba(237,41,56,.14);
	box-shadow: 0 1px 2px rgba(237,41,56,.04), 0 16px 36px -22px rgba(237,41,56,.18);
}
.gg-cd__hero-bg{ position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.gg-cd__hero-glow{ position: absolute; border-radius: 50%; filter: blur(50px); }
.gg-cd__hero-glow--a{ top: -70px; left: -50px; width: 280px; height: 280px; background: radial-gradient(circle, rgba(237,41,56,.2), transparent 70%); }
.gg-cd__hero-glow--b{ bottom: -60px; right: -40px; width: 240px; height: 240px; background: radial-gradient(circle, rgba(245,158,11,.14), transparent 70%); }

.gg-cd__hero-grid{
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr);
	gap: clamp(18px, 2.4vw, 32px);
	align-items: center;
	padding: clamp(20px, 2.4vw, 32px) clamp(20px, 2.6vw, 36px);
}
@media (max-width: 900px){
	.gg-cd__hero-grid{ grid-template-columns: 1fr; gap: 22px; padding: clamp(18px, 4vw, 28px) clamp(16px, 4vw, 28px); }
}

.gg-cd__hero-content{ display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.gg-cd__hero-cat{
	display: inline-flex; align-items: center; gap: 6px;
	padding: 5px 11px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(237,41,56,.18);
	color: var(--gg-red-deep, #B91C28);
	font-family: var(--gg-font-head);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .14em; text-transform: uppercase;
	width: max-content;
	box-shadow: 0 4px 10px -4px rgba(237,41,56,.18);
}
.gg-cd__hero-cat i{ color: var(--gg-red, #ED2938); font-size: 12px; }

.gg-cd__hero-title{
	font-family: var(--gg-font-head);
	font-size: clamp(22px, 2.8vw, 36px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -.025em;
	color: var(--gg-black, #0A0A0A);
	margin: 2px 0 0;
}
.gg-cd__hero-accent{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: transparent;
}

.gg-cd__hero-dek{
	font-family: var(--gg-font-body);
	font-size: clamp(13px, 1vw, 15px);
	color: var(--gg-gray-700, #374151);
	line-height: 1.55;
	margin: 0;
	max-width: 56ch;
}

.gg-cd__hero-tags{
	list-style: none; padding: 0; margin: 2px 0 0;
	display: flex; flex-wrap: wrap; gap: 5px;
}
.gg-cd__hero-tags li{
	display: inline-flex; align-items: center; gap: 4px;
	padding: 3px 9px;
	border-radius: 999px;
	background: rgba(255,255,255,.7);
	border: 1px solid rgba(237,41,56,.16);
	color: var(--gg-gray-800, #1F2937);
	font-family: var(--gg-font-head);
	font-size: 10px;
	font-weight: 700;
}
.gg-cd__hero-tags li i{ font-size: 10px; color: var(--gg-red, #ED2938); }

.gg-cd__hero-stats{
	list-style: none; padding: 12px 0 0; margin: 4px 0 0;
	border-top: 1px dashed rgba(237,41,56,.2);
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(6px, 1vw, 14px);
}
@media (max-width: 540px){ .gg-cd__hero-stats{ grid-template-columns: repeat(2, 1fr); gap: 10px; } }
.gg-cd__hero-stats li{ display: flex; flex-direction: column; gap: 2px; line-height: 1.05; min-width: 0; }
.gg-cd__hero-stats strong{
	font-family: var(--gg-font-head);
	font-size: clamp(14px, 1.2vw, 17px);
	font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.02em;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gg-cd__hero-stats small{
	font-family: var(--gg-font-head);
	font-size: 9px;
	color: var(--gg-gray-500, #6B7280);
	letter-spacing: .1em; text-transform: uppercase;
	font-weight: 600;
}
.gg-cd__hero-cta{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }

.gg-cd__hero-showcase{
	position: relative;
	aspect-ratio: 4 / 3;
	width: 100%;
	max-width: 320px;
	margin-left: auto;
}
@media (max-width: 900px){ .gg-cd__hero-showcase{ aspect-ratio: 16 / 10; max-width: 480px; margin: 0 auto; } }
.gg-cd__hero-image{
	position: relative; width: 100%; height: 100%;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 22px 40px -22px rgba(237,41,56,.32), 0 8px 16px -8px rgba(15,23,42,.14);
	transform: rotate(-1deg);
}
.gg-cd__hero-image img{ width: 100%; height: 100%; object-fit: cover; }
.gg-cd__hero-tag{
	position: absolute; top: 14px; left: 14px; z-index: 3;
	display: inline-flex; align-items: center; gap: 5px;
	padding: 5px 11px;
	border-radius: 999px;
	background: linear-gradient(135deg, #F59E0B, #D97706);
	color: #fff;
	font-family: var(--gg-font-head);
	font-size: 9px; font-weight: 800;
	letter-spacing: .12em; text-transform: uppercase;
	box-shadow: 0 8px 18px -8px rgba(245,158,11,.45);
	transform: rotate(-3deg);
}
.gg-cd__hero-tag i{ color: #fff; font-size: 10px; }
.gg-cd__hero-chip{
	position: absolute; z-index: 4;
	bottom: -14px; right: -14px;
	background: #fff;
	border-radius: 14px;
	padding: 9px 12px;
	min-width: 110px;
	display: flex; flex-direction: column; gap: 1px;
	border: 1.5px solid rgba(245,158,11,.18);
	box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 16px 28px -14px rgba(15,23,42,.24);
	transform: rotate(4deg);
	font-family: var(--gg-font-head);
}
.gg-cd__hero-chip small{ font-size: 8px; color: var(--gg-gray-500, #6B7280); letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
.gg-cd__hero-chip strong{ font-size: 18px; color: var(--gg-black, #0A0A0A); letter-spacing: -.02em; line-height: 1; font-weight: 800; }
.gg-cd__hero-chip span{ font-family: var(--gg-font-body); font-size: 10px; color: var(--gg-gray-500, #6B7280); }
@media (max-width: 900px){ .gg-cd__hero-chip{ bottom: -12px; right: 8px; } }
@media (prefers-reduced-motion: reduce){
	.gg-cd__hero-image, .gg-cd__hero-tag, .gg-cd__hero-chip{ transform: none !important; }
}

/* ── Section heads (shared) ──────────────────────────────────────────── */
.gg-cd__sec-head{ display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px; }
.gg-cd__sec-title{
	margin: 0;
	font-family: var(--gg-font-head);
	font-size: clamp(var(--gg-text-lg, 18px), 1.8vw, var(--gg-text-xl, 22px));
	font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.02em;
}

/* ── Popular services strip ──────────────────────────────────────────── */
.gg-cd__svc{ background: var(--gg-white, #fff); border: 1px solid var(--gg-gray-200, #E5E7EB); border-radius: 16px; padding: clamp(16px, 2vw, 22px); box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.gg-cd__svc-grid{
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}
@media (max-width: 640px){ .gg-cd__svc-grid{ grid-template-columns: 1fr; } }
.gg-cd__svc-card{
	display: flex; align-items: center; gap: 12px;
	padding: 10px 14px;
	background: var(--gg-gray-50, #F9FAFB);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 12px;
	color: inherit;
	transition: all 200ms ease;
}
.gg-cd__svc-card:hover{
	background: #fff;
	border-color: var(--gg-red-subtle, rgba(237,41,56,.32));
	transform: translateY(-1px);
	box-shadow: 0 10px 22px -12px rgba(237,41,56,.22);
}
.gg-cd__svc-ico{
	flex-shrink: 0;
	display: grid; place-items: center;
	width: 38px; height: 38px;
	border-radius: 11px;
	background: var(--gg-red-light, #FFF1F2);
	color: var(--gg-red, #ED2938);
	font-size: 16px;
	transition: all 200ms ease;
}
.gg-cd__svc-card:hover .gg-cd__svc-ico{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff;
}
.gg-cd__svc-body{ flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gg-cd__svc-body strong{
	font-family: var(--gg-font-head);
	font-size: 13px; font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.01em;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gg-cd__svc-meta{ display: flex; flex-wrap: wrap; gap: 4px 10px; font-family: var(--gg-font-body); font-size: 11px; color: var(--gg-gray-500, #6B7280); }
.gg-cd__svc-meta i{ color: #FBBF24; font-size: 10px; }
.gg-cd__svc-price{ color: var(--gg-red-deep, #B91C28); font-weight: 700; font-family: var(--gg-font-head); }
.gg-cd__svc-arr{
	color: var(--gg-gray-400, #9CA3AF);
	font-size: 16px;
	transition: color 200ms ease, transform 200ms ease;
}
.gg-cd__svc-card:hover .gg-cd__svc-arr{ color: var(--gg-red, #ED2938); transform: translateX(2px); }

/* ── Popular cities for this category (3-up, geo-circle icon) ───────── */
.gg-cd__cts{ background: var(--gg-white, #fff); border: 1px solid var(--gg-gray-200, #E5E7EB); border-radius: 16px; padding: clamp(16px, 2vw, 22px); box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.gg-cd__cts-grid{
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}
@media (max-width: 940px){ .gg-cd__cts-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px){ .gg-cd__cts-grid{ grid-template-columns: 1fr; } }
.gg-cd__cts-card{
	display: flex; align-items: center; gap: 12px;
	padding: 10px 14px;
	background: var(--gg-gray-50, #F9FAFB);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 12px;
	color: inherit;
	transition: all 200ms ease;
}
.gg-cd__cts-card:hover{
	background: #fff;
	border-color: var(--gg-red-subtle, rgba(237,41,56,.32));
	transform: translateY(-1px);
	box-shadow: 0 10px 22px -12px rgba(237,41,56,.22);
}
.gg-cd__cts-ico{
	flex-shrink: 0;
	display: grid; place-items: center;
	width: 38px; height: 38px;
	border-radius: 999px;
	background: linear-gradient(135deg, #FEE2E2, #FECACA);
	color: var(--gg-red-deep, #B91C28);
	font-size: 16px;
	border: 1px solid rgba(237,41,56,.16);
	transition: all 200ms ease;
}
.gg-cd__cts-card:hover .gg-cd__cts-ico{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff;
	border-color: transparent;
}
.gg-cd__cts-body{ flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gg-cd__cts-body strong{
	font-family: var(--gg-font-head);
	font-size: 13px; font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.01em;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gg-cd__cts-body span{
	font-family: var(--gg-font-body);
	font-size: 11px;
	color: var(--gg-gray-500, #6B7280);
}
.gg-cd__cts-arr{
	color: var(--gg-gray-400, #9CA3AF);
	font-size: 16px;
	transition: color 200ms ease, transform 200ms ease;
}
.gg-cd__cts-card:hover .gg-cd__cts-arr{ color: var(--gg-red, #ED2938); transform: translateX(2px); }

/* ── Sticky filter bar (full-bleed when stuck) ──────────────────────── */
.gg-cd__sentinel{ display: block; height: 1px; margin: 0; }
.gg-cd__bar{
	position: sticky; top: 72px; z-index: 50;
	display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
	padding: 12px 16px;
	background: rgba(255,255,255,.86);
	backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 14px;
	box-shadow: 0 6px 20px -12px rgba(15,23,42,.18);
	transition: border-radius 220ms ease, box-shadow 220ms ease, background 220ms ease;
}
.gg-cd__bar.is-stuck{
	width: 100vw;
	margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
	padding-left: clamp(14px, 4vw, 28px); padding-right: clamp(14px, 4vw, 28px);
	border-radius: 0; border-left: 0; border-right: 0;
	background: rgba(255,255,255,.94);
	box-shadow: 0 8px 24px -12px rgba(15,23,42,.16);
}
.gg-cd__bar-summary{ display: flex; align-items: center; gap: 14px; flex: 1 1 auto; flex-wrap: wrap; }
.gg-cd__bar-count{ font-family: var(--gg-font-body); font-size: var(--gg-text-sm, 14px); color: var(--gg-gray-700, #374151); }
.gg-cd__bar-count strong{ font-family: var(--gg-font-head); font-weight: 800; color: var(--gg-black, #0A0A0A); }
.gg-cd__bar-meta{
	display: inline-flex; align-items: center; gap: 5px;
	font-family: var(--gg-font-head);
	font-size: 11px; font-weight: 700;
	color: var(--gg-gray-600, #4B5563);
	padding: 3px 9px;
	background: var(--gg-gray-50, #F9FAFB);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 999px;
}
.gg-cd__bar-meta i{ color: var(--gg-red, #ED2938); font-size: 11px; }
.gg-cd__bar-controls{ display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gg-cd__cell{
	position: relative;
	display: inline-flex; align-items: center;
	height: 40px; min-width: 160px;
	padding-left: 12px;
	background: var(--gg-white, #fff);
	border: 1.5px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 10px;
}
.gg-cd__cell:focus-within{ border-color: var(--gg-red, #ED2938); box-shadow: 0 0 0 4px var(--gg-red-subtle, rgba(237,41,56,.07)); }
.gg-cd__cell-ico{ color: var(--gg-red-deep, #B91C28); font-size: 13px; pointer-events: none; }

/* Bootstrap-select scoped to gg-cd */
.gg-cd__cell .bootstrap-select{
	--bs-dropdown-link-active-bg:    var(--gg-red-subtle, rgba(237,41,56,.07));
	--bs-dropdown-link-active-color: var(--gg-red-deep, #B91C28);
	--bs-dropdown-link-hover-bg:     var(--gg-red-subtle, rgba(237,41,56,.07));
	--bs-dropdown-link-hover-color:  var(--gg-red-deep, #B91C28);
	width: 100% !important; height: 100%;
}
.gg-cd__cell .bootstrap-select > .dropdown-toggle{
	position: relative;
	width: 100%; height: 100%;
	display: flex !important; align-items: center;
	padding: 0 30px 0 8px;
	border: 0 !important; border-radius: 0 !important;
	background: transparent !important; box-shadow: none !important; outline: 0 !important;
	font-family: var(--gg-font-head);
	font-weight: 700; font-size: 12px;
	color: var(--gg-gray-800, #1F2937) !important;
	text-align: left; white-space: nowrap;
}
.gg-cd__cell .bootstrap-select > .dropdown-toggle::after{
	content: '\F282'; font-family: 'bootstrap-icons';
	position: absolute; right: 12px; top: 50%;
	transform: translateY(-50%);
	border: 0 !important; margin: 0 !important;
	font-size: 11px;
	color: var(--gg-gray-400, #9CA3AF);
	transition: transform 150ms ease;
}
.gg-cd__cell .bootstrap-select.show > .dropdown-toggle::after{ transform: translateY(-50%) rotate(180deg); }
.gg-cd__cell .bootstrap-select .filter-option,
.gg-cd__cell .bootstrap-select .filter-option-inner,
.gg-cd__cell .bootstrap-select .filter-option-inner-inner{
	display: flex; align-items: center; width: 100%; height: 100%; overflow: hidden;
	text-overflow: ellipsis; white-space: nowrap;
}
.gg-cd__cell .bootstrap-select .dropdown-menu{
	z-index: 1100; border: 0; border-radius: 12px;
	box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 20px 40px -8px rgba(15,23,42,.18);
	margin-top: 6px !important; padding: 6px;
	min-width: 200px; overflow: hidden;
}
.gg-cd__cell .bootstrap-select .dropdown-menu li > a,
.gg-cd__cell .bootstrap-select .dropdown-menu .dropdown-item{
	padding: 9px 12px; border-radius: 8px;
	font-family: var(--gg-font-body);
	font-size: 13px;
	color: var(--gg-gray-800, #1F2937);
}
.gg-cd__cell .bootstrap-select .dropdown-menu li > a:hover,
.gg-cd__cell .bootstrap-select .dropdown-menu li.selected > a,
.gg-cd__cell .bootstrap-select .dropdown-menu .dropdown-item.active{
	background: var(--gg-red-subtle, rgba(237,41,56,.07)) !important;
	color: var(--gg-red-deep, #B91C28) !important;
}
.gg-cd__cell .bootstrap-select .bs-searchbox{ padding: 4px 4px 6px; border-bottom: 1px solid var(--gg-gray-100, #F3F4F6); margin-bottom: 4px; }
.gg-cd__cell .bootstrap-select .bs-searchbox input{
	width: 100%; border: 1px solid var(--gg-gray-200, #E5E7EB) !important; border-radius: 8px !important;
	padding: 8px 12px; background: var(--gg-gray-50, #F9FAFB) !important;
	font-size: 13px; outline: 0;
}

.gg-cd__clear{
	display: inline-flex; align-items: center; gap: 6px;
	font-family: var(--gg-font-head);
	font-size: 12px; font-weight: 700;
	color: var(--gg-gray-600, #4B5563);
	padding: 8px 14px;
	border-radius: 10px;
	border: 1.5px dashed var(--gg-gray-300, #D1D5DB);
	transition: all 200ms ease;
}
.gg-cd__clear:hover{ color: var(--gg-red-deep, #B91C28); border-color: var(--gg-red-subtle, rgba(237,41,56,.32)); }

/* ── Empty state ─────────────────────────────────────────────────────── */
.gg-cd__empty{
	text-align: center;
	padding: clamp(40px, 6vw, 72px) 20px;
	background: var(--gg-white, #fff);
	border: 1px dashed var(--gg-gray-200, #E5E7EB);
	border-radius: 18px;
}
.gg-cd__empty-ico{
	width: 64px; height: 64px; margin: 0 auto 18px;
	display: grid; place-items: center;
	border-radius: 18px;
	background: var(--gg-red-light, #FFF1F2);
	color: var(--gg-red, #ED2938);
	font-size: 28px;
}
.gg-cd__empty h2{
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-xl, 22px);
	font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	margin: 0 0 8px;
}
.gg-cd__empty p{
	font-family: var(--gg-font-body);
	font-size: var(--gg-text-base, 15px);
	color: var(--gg-gray-500, #6B7280);
	margin: 0 0 22px;
	max-width: 50ch; margin-inline: auto;
}

/* ── Listings grid (4-up, compact) ──────────────────────────────────── */
.gg-cd__grid{
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(12px, 1.4vw, 18px);
}
@media (max-width: 1280px){ .gg-cd__grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 940px){  .gg-cd__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px){  .gg-cd__grid{ grid-template-columns: 1fr; } }

.gg-cd__card{
	position: relative;
	display: flex; flex-direction: column;
	background: var(--gg-white, #fff);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(15,23,42,.04);
	transition: transform 280ms cubic-bezier(.16,1,.3,1), box-shadow 280ms ease;
}
.gg-cd__card:hover{
	transform: translateY(-4px);
	box-shadow: 0 1px 2px rgba(237,41,56,.06), 0 22px 38px -18px rgba(237,41,56,.22);
}
.gg-cd__card.is-new-loaded{ animation: gg-cd-cardin .5s cubic-bezier(.16,1,.3,1) both; }
@keyframes gg-cd-cardin{ from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* — Media — */
.gg-cd__card-media{
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--gg-gray-100, #F3F4F6);
}
.gg-cd__card-media-link{ position: absolute; inset: 0; display: block; }
.gg-cd__card-media img{
	width: 100%; height: 100%; object-fit: cover;
	transform: scale(1.03);
	transition: transform 800ms cubic-bezier(.16,1,.3,1);
}
.gg-cd__card:hover .gg-cd__card-media img{ transform: scale(1.08); }
.gg-cd__card-veil{
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.45) 100%);
}
.gg-cd__card-svc-chip{
	position: absolute; top: 10px; left: 10px; z-index: 2;
	display: inline-flex; align-items: center; gap: 5px;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(255,255,255,.96);
	color: var(--gg-red-deep, #B91C28);
	backdrop-filter: blur(8px);
	font-family: var(--gg-font-head);
	font-size: 10px; font-weight: 800;
	letter-spacing: .04em; text-transform: uppercase;
	box-shadow: 0 4px 10px -4px rgba(15,23,42,.2);
}
.gg-cd__card-svc-chip i{ color: var(--gg-red, #ED2938); font-size: 11px; }
.gg-cd__card-verified{
	position: absolute; top: 10px; right: 10px; z-index: 2;
	display: grid; place-items: center;
	width: 26px; height: 26px;
	border-radius: 999px;
	background: rgba(255,255,255,.96);
	color: #16A34A;
	font-size: 13px;
	backdrop-filter: blur(8px);
	box-shadow: 0 4px 10px -4px rgba(15,23,42,.2);
}
.gg-cd__card-pricetag{
	position: absolute; left: 10px; bottom: 10px; z-index: 2;
	display: inline-flex; align-items: baseline; gap: 4px;
	padding: 5px 10px 6px;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff;
	font-family: var(--gg-font-head);
	line-height: 1;
	box-shadow: 0 8px 18px -8px rgba(237,41,56,.6);
}
.gg-cd__card-pricetag small{ font-size: 9px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; opacity: .9; }
.gg-cd__card-pricetag strong{ font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.gg-cd__card-pricetag em{ font-style: normal; font-size: 10px; font-weight: 600; opacity: .9; }

/* — Body — */
.gg-cd__card-body{ padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.gg-cd__card-rating-row{ display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.gg-cd__card-rating{
	display: inline-flex; align-items: baseline; gap: 3px;
	font-family: var(--gg-font-head);
	font-size: 12px;
	color: var(--gg-gray-700, #374151);
}
.gg-cd__card-rating i{ color: #FBBF24; font-size: 11px; }
.gg-cd__card-rating strong{ font-weight: 800; color: var(--gg-black, #0A0A0A); }
.gg-cd__card-rating small{ color: var(--gg-gray-500, #6B7280); font-weight: 500; }
.gg-cd__card-pin{
	display: inline-flex; align-items: center; gap: 3px;
	font-family: var(--gg-font-head);
	font-size: 11px; font-weight: 700;
	color: var(--gg-gray-600, #4B5563);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	max-width: 55%;
}
.gg-cd__card-pin i{ color: var(--gg-red-deep, #B91C28); font-size: 11px; flex-shrink: 0; }

.gg-cd__card-title{
	margin: 0;
	font-family: var(--gg-font-head);
	font-size: 14.5px;
	font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.015em;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.gg-cd__card-title a{ color: inherit; transition: color 220ms ease; }
.gg-cd__card-title a:hover,
.gg-cd__card:hover .gg-cd__card-title a{ color: var(--gg-red-deep, #B91C28); }

.gg-cd__card-biz{
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--gg-gray-700, #374151);
	transition: color 200ms ease;
	min-width: 0;
}
.gg-cd__card-biz:hover{ color: var(--gg-red-deep, #B91C28); }
.gg-cd__card-biz-av{
	flex-shrink: 0;
	display: grid; place-items: center;
	width: 22px; height: 22px;
	border-radius: 999px;
	background: linear-gradient(135deg, #FEE2E2, #FECACA);
	color: var(--gg-red-deep, #B91C28);
	font-family: var(--gg-font-head);
	font-size: 9.5px; font-weight: 800;
	border: 1px solid rgba(237,41,56,.16);
}
.gg-cd__card-biz-name{
	font-family: var(--gg-font-body);
	font-size: 12px; font-weight: 600;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	min-width: 0;
}
.gg-cd__card-biz-tick{ color: #16A34A; font-size: 12px; flex-shrink: 0; }

.gg-cd__card-badges{ list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.gg-cd__card-badges li{
	display: inline-flex; align-items: center; gap: 3px;
	padding: 2px 7px 3px;
	border-radius: 6px;
	background: var(--gg-gray-50, #F9FAFB);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	font-family: var(--gg-font-head);
	font-size: 10px; font-weight: 700;
	color: var(--gg-gray-700, #374151);
	line-height: 1.2;
}
.gg-cd__card-badges li i{ color: var(--gg-red, #ED2938); font-size: 10px; }

.gg-cd__card-foot{
	margin-top: auto;
	padding-top: 10px;
	border-top: 1px dashed var(--gg-gray-200, #E5E7EB);
	display: flex; align-items: center; justify-content: space-between;
	gap: 8px;
}
.gg-cd__card-foot-meta{
	display: inline-flex; align-items: center; gap: 4px;
	font-family: var(--gg-font-head);
	font-size: 11px; font-weight: 700;
	color: var(--gg-gray-600, #4B5563);
}
.gg-cd__card-foot-meta i{ color: var(--gg-red, #ED2938); font-size: 11px; }
.gg-cd__card-book{
	display: inline-flex; align-items: center; gap: 5px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--gg-gray-100, #F3F4F6);
	color: var(--gg-gray-800, #1F2937);
	font-family: var(--gg-font-head);
	font-size: 11px; font-weight: 800;
	letter-spacing: .04em; text-transform: uppercase;
	transition: background 220ms ease, color 220ms ease, gap 220ms ease, box-shadow 220ms ease;
}
.gg-cd__card-book i{ font-size: 11px; transition: transform 220ms ease; }
.gg-cd__card-book:hover,
.gg-cd__card:hover .gg-cd__card-book{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff; gap: 8px;
	box-shadow: 0 8px 16px -8px rgba(237,41,56,.5);
}
.gg-cd__card-book:hover i,
.gg-cd__card:hover .gg-cd__card-book i{ transform: translateX(2px); }

/* ── Pagination + Load more ────────────────────────────────────────── */
.gg-cd__pager-meta{ text-align: center; margin: 22px 0 12px; font-family: var(--gg-font-body); font-size: var(--gg-text-sm, 13px); color: var(--gg-gray-500, #6B7280); }
.gg-cd__pager-meta strong{ color: var(--gg-gray-800, #1F2937); font-weight: 700; }
.gg-cd__pager{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.gg-cd__pager-btn{
	display: inline-flex; align-items: center; gap: 6px;
	padding: 9px 16px; border-radius: 10px;
	border: 1.5px solid var(--gg-gray-200, #E5E7EB);
	background: var(--gg-white, #fff);
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-xs, 12px); font-weight: 700;
	color: var(--gg-gray-700, #374151);
	transition: all 200ms ease;
}
.gg-cd__pager-btn:hover{ border-color: var(--gg-red-subtle, rgba(237,41,56,.32)); color: var(--gg-red-deep, #B91C28); }
.gg-cd__pager-btn.is-disabled{ opacity: .4; pointer-events: none; }
.gg-cd__pager-pages{ list-style: none; padding: 0; margin: 0; display: flex; align-items: center; gap: 6px; }
.gg-cd__pager-page{
	display: grid; place-items: center;
	min-width: 40px; height: 40px;
	padding: 0 8px; border-radius: 10px;
	border: 1.5px solid var(--gg-gray-200, #E5E7EB);
	background: var(--gg-white, #fff);
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-sm, 13px); font-weight: 700;
	color: var(--gg-gray-700, #374151);
	transition: all 200ms ease;
}
.gg-cd__pager-page:hover{ border-color: var(--gg-red-subtle, rgba(237,41,56,.32)); color: var(--gg-red-deep, #B91C28); }
.gg-cd__pager-page.is-current{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	border-color: transparent; color: #fff;
	box-shadow: 0 6px 14px -6px rgba(237,41,56,.5);
}
.gg-cd__pager-gap{ display: grid; place-items: center; min-width: 28px; height: 40px; color: var(--gg-gray-400, #9CA3AF); font-weight: 700; }
@media (max-width: 640px){ .gg-cd__pager-btn-label{ display: none; } }

.gg-cd__loadmore-wrap{ display: flex; justify-content: center; margin-top: clamp(12px, 2vw, 18px); }
.gg-cd__loadmore{
	position: relative; overflow: hidden;
	display: inline-flex; align-items: center; gap: 8px;
	padding: 13px 28px;
	border-radius: 999px;
	border: 1.5px solid var(--gg-red, #ED2938);
	background: var(--gg-white, #fff);
	color: var(--gg-red, #ED2938);
	font-family: var(--gg-font-head);
	font-size: var(--gg-text-sm, 13px); font-weight: 700; letter-spacing: .02em;
	transition: background 220ms ease, color 220ms ease, transform 220ms ease, box-shadow 220ms ease;
}
.gg-cd__loadmore-glow{
	position: absolute; top: 0; left: -100%;
	width: 100%; height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
	transition: left 600ms ease;
	pointer-events: none;
}
.gg-cd__loadmore:hover{
	background: var(--gg-red, #ED2938); color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 14px 32px -10px rgba(237,41,56,.55);
}
.gg-cd__loadmore:hover .gg-cd__loadmore-glow{ left: 100%; }
.gg-cd__loadmore[disabled]{ opacity: .65; pointer-events: none; }
.gg-cd__loadmore-spinner{
	display: none;
	width: 15px; height: 15px;
	border: 2px solid currentColor; border-right-color: transparent;
	border-radius: 50%;
	animation: gg-cd-spin .6s linear infinite;
}
.gg-cd__loadmore.is-loading{ background: var(--gg-red, #ED2938); color: #fff; }
.gg-cd__loadmore.is-loading .gg-cd__loadmore-spinner{ display: inline-block; }
@keyframes gg-cd-spin{ to { transform: rotate(360deg); } }

/* ── Why GoGeter (SEO content) ───────────────────────────────────────── */
.gg-cd__why{
	background: var(--gg-white, #fff);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 16px;
	padding: clamp(18px, 2vw, 26px) clamp(20px, 2.2vw, 28px);
	box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.gg-cd__why-text{
	font-family: var(--gg-font-body);
	font-size: var(--gg-text-base, 15px);
	color: var(--gg-gray-700, #374151);
	line-height: 1.65;
	margin: 0;
	max-width: 76ch;
}

/* ── Related categories ──────────────────────────────────────────────── */
.gg-cd__related-grid{
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}
@media (max-width: 1100px){ .gg-cd__related-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 540px){  .gg-cd__related-grid{ grid-template-columns: 1fr; } }
.gg-cd__related-card{
	display: flex; flex-direction: column; gap: 6px;
	padding: 16px;
	background: var(--gg-white, #fff);
	border: 1px solid var(--gg-gray-200, #E5E7EB);
	border-radius: 14px;
	color: inherit;
	transition: transform 240ms cubic-bezier(.16,1,.3,1), border-color 240ms ease, box-shadow 240ms ease;
}
.gg-cd__related-card:hover{ transform: translateY(-3px); border-color: var(--gg-red-subtle, rgba(237,41,56,.32)); box-shadow: 0 14px 28px -16px rgba(237,41,56,.2); }
.gg-cd__related-ico{
	display: grid; place-items: center;
	width: 36px; height: 36px;
	border-radius: 10px;
	background: var(--gg-red-light, #FFF1F2);
	color: var(--gg-red, #ED2938);
	font-size: 16px;
	transition: all 220ms ease;
}
.gg-cd__related-card:hover .gg-cd__related-ico{
	background: linear-gradient(135deg, var(--gg-red, #ED2938), var(--gg-red-deep, #B91C28));
	color: #fff; transform: rotate(-4deg) scale(1.05);
}
.gg-cd__related-card strong{
	font-family: var(--gg-font-head);
	font-size: 14px; font-weight: 800;
	color: var(--gg-black, #0A0A0A);
	letter-spacing: -.01em;
}
.gg-cd__related-card small{ font-family: var(--gg-font-body); font-size: 12px; color: var(--gg-gray-500, #6B7280); }
.gg-cd__related-cta{
	margin-top: auto;
	display: inline-flex; align-items: center; gap: 6px;
	font-family: var(--gg-font-head);
	font-size: 10px; font-weight: 800;
	letter-spacing: .04em; text-transform: uppercase;
	color: var(--gg-gray-700, #374151);
	transition: color 220ms ease;
}
.gg-cd__related-card:hover .gg-cd__related-cta{ color: var(--gg-red-deep, #B91C28); }

/* ── Bottom CTA ──────────────────────────────────────────────────────── */
.gg-cd__cta{
	position: relative; overflow: hidden;
	border-radius: var(--gg-r-xl, 16px);
	background: linear-gradient(135deg, var(--gg-black, #0A0A0A), var(--gg-black-soft, #141414));
}
.gg-cd__cta-glow{
	position: absolute; inset: 0;
	background:
		radial-gradient(600px 300px at 12% 120%, rgba(237,41,56,.4), transparent 70%),
		radial-gradient(500px 260px at 95% -20%, rgba(237,41,56,.28), transparent 70%);
	pointer-events: none;
}
.gg-cd__cta-inner{
	position: relative;
	display: flex; align-items: center; justify-content: space-between;
	gap: clamp(20px, 4vw, 48px); flex-wrap: wrap;
	padding: clamp(28px, 4vw, 48px) clamp(22px, 4vw, 48px);
}
.gg-cd__cta-title{
	font-family: var(--gg-font-head);
	font-size: clamp(var(--gg-text-xl, 22px), 2.6vw, var(--gg-text-2xl, 28px));
	font-weight: 800; letter-spacing: -.02em;
	color: #fff; margin: 0 0 8px; line-height: 1.15;
}
.gg-cd__cta-sub{
	font-family: var(--gg-font-body);
	font-size: var(--gg-text-base, 15px);
	color: rgba(255,255,255,.72);
	margin: 0; max-width: 520px;
}

/* ── Reduced motion ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
	.gg-cd__card, .gg-cd__card-media img, .gg-cd__svc-card, .gg-cd__related-card, .gg-cd__loadmore-glow{ transition: none !important; animation: none !important; }
}