/* Dark premium section — branded deep-blue gradient with atmospheric overlays */
.reviews-section {
 position: relative;
 background: var(--inverse-bg);
 background-image:
 radial-gradient(60% 80% at 20% 0%, color-mix(in srgb, var(--brand-deep) 60%, var(--inverse-bg)) 0%, transparent 60%),
 radial-gradient(50% 70% at 100% 100%, color-mix(in srgb, var(--brand) 25%, var(--inverse-bg)) 0%, transparent 55%),
 linear-gradient(180deg, var(--inverse-bg) 0%, color-mix(in srgb, var(--inverse-bg) 92%, #000) 100%);
 overflow: hidden;
 }
.reviews-bg-glow {
 position: absolute;
 top: -200px;
 left: 50%;
 transform: translateX(-50%);
 width: 1000px;
 height: 600px;
 background: radial-gradient(closest-side, color-mix(in srgb, var(--inverse-accent) 18%, transparent), transparent);
 filter: blur(40px);
 pointer-events: none;
 z-index: 0;
 }
.reviews-bg-grid {
 position: absolute;
 inset: 0;
 background-image:
 linear-gradient(color-mix(in srgb, var(--inverse-text) 4%, transparent) 1px, transparent 1px),
 linear-gradient(90deg, color-mix(in srgb, var(--inverse-text) 4%, transparent) 1px, transparent 1px);
 background-size: 80px 80px;
 mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
 -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
 pointer-events: none;
 z-index: 0;
 }
.google-badge {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 10px 20px;
 background: color-mix(in srgb, var(--inverse-text) 8%, transparent);
 border: 1px solid color-mix(in srgb, var(--inverse-text) 18%, transparent);
 backdrop-filter: blur(12px);
 border-radius: 999px;
 font-size: 13px;
 font-weight: 600;
 letter-spacing: 0.02em;
 color: var(--inverse-text);
 box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.4);
 }
.rating-summary {
 display: inline-flex;
 align-items: center;
 gap: 14px;
 flex-wrap: wrap;
 justify-content: center;
 }
.rating-stars {
 display: inline-flex;
 gap: 2px;
 color: #FBBF24;
 filter: drop-shadow(0 4px 12px color-mix(in srgb, #F59E0B 50%, transparent));
 }
.rating-stars svg { width: 22px; height: 22px; }
.rating-text { font-size: 14px; color: var(--inverse-muted); }
.rating-text strong { font-weight: 700; color: var(--inverse-text); }
.rating-divider {
 display: inline-block;
 width: 1px;
 height: 16px;
 background: color-mix(in srgb, var(--inverse-text) 25%, transparent);
 }
.rating-link {
 font-size: 13px;
 font-weight: 600;
 color: var(--inverse-accent);
 transition: color 300ms;
 }
.rating-link:hover { color: var(--inverse-text); }
 /* === AI SUMMARY CARD === */
.reviews-summary-card {
 max-width: 1100px;
 margin: 0 auto;
 background: color-mix(in srgb, var(--inverse-text) 6%, transparent);
 border: 1px solid color-mix(in srgb, var(--inverse-accent) 25%, transparent);
 backdrop-filter: blur(16px);
 -webkit-backdrop-filter: blur(16px);
 border-radius: 24px;
 padding: clamp(24px, 3vw, 40px);
 position: relative;
 z-index: 1;
 }
.reviews-summary-header {
 display: flex;
 align-items: flex-start;
 gap: 16px;
 margin-bottom: 24px;
 padding-bottom: 24px;
 border-bottom: 1px solid color-mix(in srgb, var(--inverse-text) 15%, transparent);
 }
.reviews-summary-icon {
 width: 48px;
 height: 48px;
 flex-shrink: 0;
 background: linear-gradient(135deg, #FBBF24, #F59E0B);
 border-radius: 14px;
 display: grid;
 place-items: center;
 color: #FFFFFF;
 box-shadow: 0 8px 24px -6px color-mix(in srgb, #F59E0B 50%, transparent);
 }
.reviews-summary-icon svg { width: 26px; height: 26px; }
.reviews-summary-title {
 font-family: 'Fraunces', Georgia, serif;
 font-weight: 500;
 font-size: clamp(1.25rem, 2vw, 1.6rem);
 line-height: 1.2;
 letter-spacing: -0.025em;
 color: var(--inverse-text);
 margin-top: 4px;
 font-variation-settings: "opsz" 144, "SOFT" 30, "WONK" 0;
 }
.reviews-summary-grid {
 display: grid;
 grid-template-columns: 1fr;
 gap: 16px;
 }
 @media (min-width: 768px) {.reviews-summary-grid { grid-template-columns: 1fr 1fr; } }
.reviews-summary-item {
 display: flex;
 gap: 12px;
 color: var(--inverse-muted);
 font-size: 14px;
 line-height: 1.6;
 }
.reviews-summary-item svg { color: var(--inverse-accent); }
.reviews-summary-item strong { color: var(--inverse-text); font-weight: 600; }

 /* === REVIEW CARDS GRID — flexbox for elegant centering of orphan rows === */
.reviews-grid {
 display: flex;
 flex-wrap: wrap;
 gap: 20px;
 max-width: 1320px;
 margin: 0 auto;
 position: relative;
 z-index: 1;
 justify-content: center;
 }
.reviews-grid >.review-card {
 flex: 0 1 100%;
 min-width: 280px;
 }
 @media (min-width: 768px) {
.reviews-grid >.review-card { flex-basis: calc(50% - 10px); }
 }
 @media (min-width: 1100px) {
.reviews-grid >.review-card { flex-basis: calc(33.333% - 14px); }
 }

.review-card {
 background: var(--bg);
 border: 1px solid color-mix(in srgb, var(--inverse-accent) 20%, transparent);
 border-radius: 22px;
 padding: 28px 26px;
 display: flex;
 flex-direction: column;
 gap: 16px;
 box-shadow:
 0 30px 70px -20px rgba(0, 0, 0, 0.4),
 0 0 0 1px color-mix(in srgb, var(--inverse-accent) 8%, transparent);
 transition: transform 600ms var(--ease-lux), box-shadow 600ms var(--ease-lux);
 }
.review-card:hover {
 transform: translateY(-6px);
 box-shadow:
 0 40px 90px -20px rgba(0, 0, 0, 0.55),
 0 0 0 1px color-mix(in srgb, var(--brand) 30%, transparent);
 }
.review-card-header {
 display: flex;
 align-items: center;
 gap: 14px;
 }
.review-avatar {
 position: relative;
 width: 52px;
 height: 52px;
 border-radius: 50%;
 flex-shrink: 0;
 background: linear-gradient(135deg, var(--brand), var(--brand-deep));
 color: #FFFFFF;
 display: grid;
 place-items: center;
 font-family: 'Inter', sans-serif;
 font-weight: 700;
 font-size: 15px;
 letter-spacing: 0.04em;
 }
.google-mini-badge {
 position: absolute;
 bottom: -2px;
 right: -2px;
 width: 22px;
 height: 22px;
 background: #FFFFFF;
 border-radius: 50%;
 display: grid;
 place-items: center;
 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
 }
.google-mini-badge svg { width: 13px; height: 13px; }
.review-meta { flex: 1; min-width: 0; }
.review-name {
 font-family: 'Inter', sans-serif;
 font-weight: 600;
 font-size: 15px;
 color: var(--ink);
 margin-bottom: 2px;
 }
.review-date { font-size: 12px; color: var(--muted); }
.review-stars {
 display: flex;
 gap: 2px;
 color: #FBBF24;
 }
.review-stars svg { width: 18px; height: 18px; }
.review-text {
 font-family: 'Inter', sans-serif;
 font-size: 15px;
 line-height: 1.65;
 color: var(--ink);
 font-style: normal;
 flex: 1;
 }
.review-text em {
 font-style: italic;
 font-weight: 600;
 color: var(--brand-deep);
 }
.review-photos {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 8px;
 }
.review-photos img {
 width: 100%;
 aspect-ratio: 1 / 1;
 object-fit: cover;
 border-radius: 12px;
 background: var(--bg-soft);
 transition: transform 600ms var(--ease-lux);
 }
.review-photos img:hover { transform: scale(1.03); }
.review-link {
 font-size: 13px;
 font-weight: 600;
 color: var(--brand);
 transition: color 300ms;
 display: inline-flex;
 align-items: center;
 gap: 4px;
 }
.review-link:hover { color: var(--brand-deep); }

 /* === REVIEWS CTA === */
.reviews-cta {
 max-width: 1100px;
 margin: 40px auto 0;
 background: linear-gradient(135deg,
 color-mix(in srgb, var(--brand-deep) 40%, var(--inverse-bg)),
 color-mix(in srgb, var(--brand) 25%, var(--inverse-bg)));
 border: 1px solid color-mix(in srgb, var(--inverse-accent) 30%, transparent);
 border-radius: 22px;
 padding: clamp(24px, 3vw, 36px);
 position: relative;
 z-index: 1;
 overflow: hidden;
 }
.reviews-cta::before {
 content: '';
 position: absolute;
 top: -50%;
 right: -10%;
 width: 400px;
 height: 400px;
 background: radial-gradient(closest-side, color-mix(in srgb, var(--inverse-accent) 30%, transparent), transparent);
 pointer-events: none;
 }
.reviews-cta-content {
 position: relative;
 display: grid;
 grid-template-columns: 1fr;
 gap: 20px;
 align-items: center;
 }
 @media (min-width: 768px) {
.reviews-cta-content { grid-template-columns: 1fr auto; gap: 32px; }
 }
.reviews-cta-title {
 font-family: 'Fraunces', Georgia, serif;
 font-weight: 500;
 font-size: clamp(1.25rem, 2vw, 1.75rem);
 line-height: 1.2;
 letter-spacing: -0.025em;
 color: var(--inverse-text);
 margin-top: 4px;
 font-variation-settings: "opsz" 144, "SOFT" 30, "WONK" 0;
 }
.reviews-cta-button {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 16px 28px;
 background: #FFFFFF;
 color: var(--ink);
 font-weight: 700;
 font-size: 14px;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 border-radius: 999px;
 box-shadow: 0 20px 48px -12px rgba(0, 0, 0, 0.3);
 transition: all 400ms var(--ease-lux);
 white-space: nowrap;
 }
.reviews-cta-button:hover {
 transform: translateY(-2px);
 box-shadow: 0 28px 56px -12px rgba(0, 0, 0, 0.4);
 color: var(--brand-deep);
 }

 /* ═══════════════════════════════════════════════════════
 MOBILE LAYOUT GUARDS — defensive overrides for narrow phones
 Forces single/double column on small screens regardless of Tailwind state.
 ═══════════════════════════════════════════════════════ */
 @media (max-width: 640px) {
 /* Force services bento single column */
.bento { grid-template-columns: 1fr !important; }
.bento > * { grid-column: auto !important; grid-row: auto !important; }

 /* Force locations grid 1 column on very small phones */
 #locations > div >.grid { grid-template-columns: 1fr !important; }

 /* Force any Tailwind grid-cols-2 to single column if items are wide */
 section.grid.grid-cols-2:not(.allow-2col) { grid-template-columns: 1fr !important; }

 /* Trust signal row stays 2 cols (compact items) */
.trust-bar-inner { font-size: 11px; }

 /* Prevent horizontal overflow */
 body { overflow-x: hidden; }
 img, video { max-width: 100%; height: auto; }
 }
