/* JayWhite public-site palette. Gold signals action; bronze is its readable light-surface counterpart.
   Admin has its own stylesheet. Photographs, supplied logos and illustrative tooth shades stay unchanged. */
body:not([data-page="/jw-v2/owner"]) {
  --jw-charcoal: #181818;
  --jw-raised: #242424;
  --jw-paper: #f5f3ee;
  --jw-card: #ffffff;
  --jw-gold: #e4bc7b;
  --jw-gold-hover: #f0d39f;
  --jw-bronze: #76531e;
  --ink: var(--jw-paper);
  --muted: #c9c3bb;
  --paper: var(--jw-charcoal);
  --soft: var(--jw-raised);
  --line: #666057;
  --lime: var(--jw-gold);
  --brand-orange: var(--jw-gold);
  --brand-start: var(--jw-gold);
  --brand-end: var(--jw-gold);
  --accent-text: var(--jw-gold);
  --focus-color: var(--jw-gold);
  --error-text: #ffb4ab;
  --success-text: #b7dfc4;
  --control-surface: #242424;
  --control-border: #8a8173;
  background: var(--paper);
  color: var(--ink);
}
body.interior-page main,
body:not([data-page="/jw-v2/owner"]) :is(.soft-section, .home-results, .design-note-panel) {
  --ink: var(--jw-raised);
  --muted: #625e56;
  --paper: var(--jw-card);
  --soft: var(--jw-paper);
  --line: #d6d0c6;
  --accent-text: var(--jw-bronze);
  --focus-color: var(--jw-bronze);
  --error-text: #a12e25;
  --success-text: #266043;
  --control-surface: var(--jw-card);
  --control-border: #8a8173;
  background: var(--jw-paper);
  color: var(--ink);
}
body:not([data-page="/jw-v2/owner"]) .home-results { box-shadow: 0 0 0 100vmax var(--jw-paper); }

/* Quiet brand watermark behind the treatment content. */
.shade-guide-interactive { position: relative; }
.shade-download {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 24px;
}
.shade-download .btn {
  min-height: 38px;
  min-width: 0;
  padding: 8px 16px;
  font-size: .75rem;
  line-height: 1.4;
}
body:not([data-page="/jw-v2/owner"]) .price-card .treatment-shade-label {
  display: block;
  margin-top: 9px;
  font-size: .95rem;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--muted);
}
body:not([data-page="/jw-v2/owner"]) .price-card:has(.treatment-shade-hover) {
  position: relative;
}
body:not([data-page="/jw-v2/owner"]) .price-card .treatment-shade-hover {
  position: absolute;
  top: 22px;
  left: 28px;
  margin: 0;
  font-size: .85rem;
  color: var(--accent-text);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  letter-spacing: .025em;
  opacity: 0;
  pointer-events: none;
}
body:not([data-page="/jw-v2/owner"]) .price-card .shade-range-dash {
  font-size: .7em;
}
body:not([data-page="/jw-v2/owner"]) .price-card .shade-range-word {
  margin-left: 3px;
}
body:not([data-page="/jw-v2/owner"]) .price-card:is(:hover, :focus-within) .treatment-shade-hover {
  opacity: 1;
}
body[data-page="/"] #treatments .section-head {
  display: block;
  text-align: center;
  margin-bottom: 42px;
}
body[data-page="/"] #treatments .treatment-invitation {
  max-width: none;
  margin: 0 0 20px;
  color: #765b34;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
}
body[data-page="/"] #treatments .treatment-title {
  max-width: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(2.8rem, 5.2vw, 5.5rem);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -.065em;
  color: #242424;
  text-wrap: balance;
}
@media (max-width: 700px) {
  body[data-page="/"] #treatments .section-head { margin-bottom: 30px; }
  body[data-page="/"] #treatments .treatment-invitation { font-size: .65rem; letter-spacing: .16em; }
}
body[data-page="/"] #treatments {
  position: relative;
  isolation: isolate;
  background-color: #f1ede4;
  background-image: none;
}
body[data-page="/"] #treatments::before,
body[data-page="/"] #treatments::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 12px;
  right: 2%;
  width: min(620px, 85vw);
  aspect-ratio: 1;
  background: #b39462;
  opacity: .13;
  -webkit-mask: url('/jw-v2/assets/watermark-tooth.svg?assetv=ac241798247dfad39cc8') center / contain no-repeat;
  mask: url('/jw-v2/assets/watermark-tooth.svg?assetv=ac241798247dfad39cc8') center / contain no-repeat;
  pointer-events: none;
}
body[data-page="/"] #treatments::after {
  -webkit-mask-image: url('/jw-v2/assets/watermark-shine.svg?assetv=ac241798247dfad39cc8');
  mask-image: url('/jw-v2/assets/watermark-shine.svg?assetv=ac241798247dfad39cc8');
  transform-origin: 70.53% 34.47%;
  transform: rotate(0deg);
}
@media (prefers-reduced-motion: no-preference) {
  body[data-page="/"] #treatments.watermark-visible::after {
    animation: watermark-spin 1.5s ease-in-out backwards !important;
  }
}
@keyframes watermark-spin {
  from { opacity: .13; transform: rotate(-360deg); }
  to { opacity: .13; transform: rotate(0deg); }
}
body:not([data-page="/jw-v2/owner"]) :is(.site-header, footer, .mobile-book) { background: var(--jw-charcoal); color: var(--jw-paper); border-color: #666057; }
body:not([data-page="/jw-v2/owner"]) :is(.benefits-banner, .cookie-banner, .booking-summary, dialog:not(.design-note-panel)) { background: var(--jw-raised); color: var(--jw-paper); border-color: #666057; }
body:not([data-page="/jw-v2/owner"]) :is(.panel, .price-card, .review, .shop-product, .choice) { background: var(--paper); color: var(--ink); border-color: var(--line); }
body:not([data-page="/jw-v2/owner"]) :is(.price-card.featured, .final-cta) {
  --ink: var(--jw-paper); --muted: #c9c3bb; --accent-text: var(--jw-gold); --focus-color: var(--jw-gold);
  background: var(--jw-raised); color: var(--ink); border-color: var(--jw-gold);
}
body:not([data-page="/jw-v2/owner"]) :is(.price-card, .review, .final-cta, .home-offer, .info-banner, .cookie-banner, .location-card) p { color: var(--muted); }
body:not([data-page="/jw-v2/owner"]) :is(.price-card .eyebrow, .price-card .deposit, .price small, .review-source-note, .gallery-controls, .section-note, .shade-note) { color: var(--muted); }
body:not([data-page="/jw-v2/owner"]) :is(.eyebrow, .review .eyebrow, .location-number, .steps article > span, .experience-steps summary > span, .experience-steps summary > b) { color: var(--accent-text); }
body[data-page="/"] :is(.soft-section .eyebrow, .home-results .eyebrow) { color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) #treatments .section-head .eyebrow { color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) .checks li::before { color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) :is(.home-offer, .info-banner) { background: var(--soft); color: var(--ink); border-color: var(--line); }
body:not([data-page="/jw-v2/owner"]) :is(.location-card, .studio-principles article, .studio-gift-note, .studio-approach) { border-color: var(--line); }
body:not([data-page="/jw-v2/owner"]) :is(.studio-kicker, .studio-number, .founder-copy .eyebrow, .experience-visual span) { color: var(--jw-gold); }
body:not([data-page="/jw-v2/owner"]) .benefits-banner-dots button[aria-current=true] span { background: var(--jw-gold); }
/* One solid primary action treatment replaces the moving orange gradient. */
body:not([data-page="/jw-v2/owner"]) .btn:not(.plain):not(.outline),
body[data-page="/"] .studio-hero .actions > .btn {
  background: var(--jw-gold); background-image: none; color: var(--jw-charcoal);
  border: 2px solid var(--jw-bronze); box-shadow: none;
}
body:not([data-page="/jw-v2/owner"]) .btn:not(.plain):not(.outline):is(:hover, :focus-visible, :active),
body[data-page="/"] .studio-hero .actions > .btn:is(:hover, :focus-visible, :active) {
  background: var(--jw-gold-hover); background-image: none; color: var(--jw-charcoal); border-color: var(--jw-bronze); box-shadow: none;
}
body:not([data-page="/jw-v2/owner"]) .btn:is(.plain, .outline) { background: transparent; color: var(--ink); border-color: var(--control-border); }
body:not([data-page="/jw-v2/owner"]) .btn:is(.plain, .outline):hover { background: var(--ink); color: var(--paper); }
body:not([data-page="/jw-v2/owner"]) .text-link { color: var(--ink); border-color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) :is(.text-link:hover, .faq-list summary:hover) { color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) :is(.site-header nav a:hover, footer a:hover) { color: var(--jw-gold); }
body:not([data-page="/jw-v2/owner"]) :is(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid var(--focus-color); outline-offset: 4px; }
/* Form boundaries and selected states remain identifiable without hue alone. */
body:not([data-page="/jw-v2/owner"]) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]), textarea, select) { background: var(--control-surface); color: var(--ink); border-color: var(--control-border); }
body:not([data-page="/jw-v2/owner"]) ::placeholder { color: var(--muted); opacity: 1; }
body:not([data-page="/jw-v2/owner"]) :is(input[type=checkbox], input[type=radio], input[type=range]) { accent-color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) .choice:has(input:checked) { border-color: var(--accent-text); background: var(--soft); }
body:not([data-page="/jw-v2/owner"]) :is(.slot[aria-pressed=true], .treatment-audience button[aria-pressed=true]) { background: var(--jw-gold); color: var(--jw-charcoal); border-color: var(--jw-bronze); }
body:not([data-page="/jw-v2/owner"]) :is(.error, [role=alert].error) { color: var(--error-text); }
body:not([data-page="/jw-v2/owner"]) .success-symbol { color: #163d28; background: #b7dfc4; }
body:not([data-page="/jw-v2/owner"]) .warning { background: #3b301d; color: #f0d39f; border-color: #e4bc7b; }
body:not([data-page="/jw-v2/owner"]) #toast { background: var(--jw-gold); color: var(--jw-charcoal); }
body:not([data-page="/jw-v2/owner"]) .design-note-launcher { background: var(--jw-charcoal); color: var(--jw-paper); border-color: var(--jw-gold); }
body:not([data-page="/jw-v2/owner"]) .preview-service-note { background: var(--jw-paper); color: var(--jw-raised); border-color: var(--jw-bronze); }
body:not([data-page="/jw-v2/owner"]) ::selection { background: var(--jw-gold); color: var(--jw-charcoal); }
/* Match the supplied logo's black field rather than exposing a rectangular matte. */
body:not([data-page="/jw-v2/owner"]) .site-header { background: #000000; border-color: #39362f; }
body:not([data-page="/jw-v2/owner"]) :is(.price-card.featured, .final-cta) { --paper: var(--jw-raised); }
/* Shade illustrations keep their real colors; accompanying labels need text contrast. */
body:not([data-page="/jw-v2/owner"]) .shade-guide-intro .eyebrow { color: var(--jw-bronze) !important; }
body:not([data-page="/jw-v2/owner"]) .shade-base > span { color: #625e56; }
body:not([data-page="/jw-v2/owner"]) .shade-guide-results .triple-result strong { color: var(--jw-bronze); }
body:not([data-page="/jw-v2/owner"]) .shade-guide-results .premium-result strong { color: #5d553f; }
body:not([data-page="/jw-v2/owner"]) :is(.booking-value, .booking-gift) { color: var(--accent-text); }
body:not([data-page="/jw-v2/owner"]) .site-header nav.open { background: var(--jw-raised); color: var(--jw-paper); }
body:not([data-page="/jw-v2/owner"]) .nav-cart-icon [data-cart-count] { background: var(--jw-gold); color: var(--jw-charcoal); }

/* Clear, compact results for the interactive shade guide. */
.shade-summary-heading { margin-top: 32px; }
.shade-summary-heading h4 { margin: 0 0 6px; font-size: 1.2rem; font-weight: 500; letter-spacing: -.025em; }
.shade-summary-heading p { font-size: .85rem; color: #625a50; }
.shade-guide .shade-guide-results { grid-template-columns: .8fr 1fr 1fr; gap: 16px; margin-top: 18px; }
.shade-guide .shade-guide-results > p, .shade-guide .shade-guide-results > div { border: 1px solid #d9cdbb; border-radius: 16px; padding: 24px; background: #fffdf8; }
.shade-guide .shade-guide-results .shade-start { display: flex; flex-direction: column; justify-content: center; grid-column: auto; background: #e9e1d4; }
.shade-guide .shade-guide-results span { font-size: .87rem; font-weight: 600; color: #30291f; }
.shade-guide .shade-guide-results strong { font-size: 2rem; font-weight: 500; letter-spacing: -.04em; line-height: 1.15; margin: 10px 0; }
.shade-guide .shade-guide-results small { font-size: .78rem; line-height: 1.5; color: #645b4f; }
.shade-guide .shade-result-caption { font-size: .72rem; color: #746858; margin-top: 18px; }
.shade-guide .shade-guide-results .triple-result { background: #fff7ed; }
.shade-guide .shade-guide-results .premium-result { background: #f5ecd9; }
.shade-guide .shade-recommendation { grid-template-columns: 1fr 1.2fr; padding: 22px 24px; gap: 24px; }
.shade-guide .shade-recommendation span { display: block; margin-bottom: 5px; font-size: .75rem; }
.shade-guide .shade-recommendation strong { font-size: 1.15rem; }
.shade-guide .shade-recommendation small { font-size: .85rem; line-height: 1.55; color: #eee5d9; }
.shade-guide .shade-guide-note { font-size: .75rem; line-height: 1.65; max-width: 850px; margin: 18px 0 0; color: #6c6357; }
@media (max-width: 650px) {
 .shade-guide .shade-guide-results { grid-template-columns: 1fr 1fr; gap: 10px; }
 .shade-guide .shade-guide-results > div { padding: 16px 12px; }
 .shade-guide .shade-guide-results .shade-start { grid-column: 1 / -1; padding: 16px; }
 .shade-guide .shade-guide-results strong { font-size: 1.6rem; }
 .shade-guide .shade-recommendation { grid-template-columns: 1fr; gap: 10px; padding: 18px; }
}

.shade-guide .shade-recommendation { grid-template-columns: .85fr 1.2fr auto; }
.shade-guide .shade-recommendation .btn { white-space: nowrap; padding: 11px 20px; font-size: .82rem; }
@media (max-width: 750px) {
 .shade-guide .shade-recommendation { grid-template-columns: 1fr; gap: 12px; }
 .shade-guide .shade-recommendation .btn { justify-self: start; }
}

.combined-approach-intro { max-width: none; text-align: left; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 60px; align-items: end; }
.combined-approach-intro > .eyebrow { grid-column: 1 / -1; }
.combined-approach-intro > p { max-width: 480px; line-height: 1.75; }
.combined-steps-heading { margin-bottom: 24px; }
.combined-steps-heading .eyebrow { font-size: .68rem; }
.combined-steps-heading h3 { font-size: 2rem; margin-top: 10px; }
@media (max-width: 700px) {
 .combined-approach-intro { grid-template-columns: 1fr; gap: 16px; }
 .combined-steps-heading { margin-bottom: 18px; }
}

/* Standalone light shade-guide section on the homepage. */
.home-shade-section { background: #fffdf8; color: #171513; padding: 64px 24px; }
.home-shade-section .shade-guide { max-width: 1224px; margin: 0 auto; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: hidden; }
@media (max-width: 700px) { .home-shade-section { padding: 40px 20px; } }

.google-review-ratings { display: flex; justify-content: space-between; align-items: center; gap: 32px; margin-bottom: 32px; }
.google-review-ratings h2 { font-size: 3.6rem; margin: 12px 0; }
.google-review-ratings h2 span { font-size: 1.6rem; color: #a87c3b; letter-spacing: .08em; vertical-align: middle; }
.google-review-ratings p { font-size: .9rem; }
.google-review-locations { display: flex; gap: 32px; }
.google-review-locations a { font-size: .85rem; text-decoration: none; }
.google-review-locations strong { display: block; margin-top: 6px; font-size: .95rem; }
.google-verified-reviews { grid-template-columns: repeat(4,1fr); gap: 18px; }
.google-verified-reviews .review { display: flex; flex-direction: column; padding: 26px; }
.google-verified-reviews blockquote { margin: 18px 0 24px; font-size: 1rem; line-height: 1.7; flex: 1; }
.google-verified-reviews .review-author small { display: block; font-size: .72rem; font-weight: 400; margin-top: 5px; color: #6a6155; }
.google-review-source { font-size: .7rem; margin-top: 18px; }
@media(max-width:900px){ .google-verified-reviews { grid-template-columns: repeat(2,1fr); } .google-review-ratings { align-items: flex-start; flex-direction: column; } }
@media(max-width:550px){ .google-verified-reviews { grid-template-columns: 1fr; } .google-review-locations { gap: 24px; flex-wrap: wrap; } }

.business-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; padding: 12px 0 40px; margin-bottom: 40px; border-bottom: 1px solid #d9cdbb; text-align: center; }
.business-stats > div + div { border-left: 1px solid #d9cdbb; }
.business-stats strong { display: block; font-size: clamp(2.7rem,5vw,4.5rem); font-weight: 500; line-height: 1.2; letter-spacing: -.05em; color: #211d17; }
.business-stats strong span { font-size: .55em; color: #a87c3b; }
.business-stats > div > span { display: block; margin-top: 10px; font-size: .85rem; color: #635a4f; }
@media(max-width:550px){.business-stats { gap: 10px; padding-bottom: 28px; margin-bottom: 28px; }.business-stats > div > span { font-size: .7rem; padding: 0 5px; }}

/* High-contrast brand colours for the homepage numbers. */
.business-stats { background: #171615; border: 1px solid #3b3327; border-radius: 20px; padding: 36px 24px; }
.business-stats > div + div { border-left-color: #4b4030; }
.business-stats strong, .business-stats strong span { color: #e4bc7b; }
.business-stats > div > span { color: #f3ece1; }
@media(max-width:550px) { .business-stats { padding: 26px 12px; } }

.google-review-carousel .google-verified-reviews { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 18px; scrollbar-width: none; padding: 8px 0; }
.google-review-carousel .google-verified-reviews::-webkit-scrollbar { display: none; }
.google-review-carousel .review { flex: 0 0 calc((100% - 18px) / 2); min-width: 0; scroll-snap-align: start; margin: 0; }
.review-carousel-controls { display: flex; justify-content: flex-end; gap: 10px; margin: 18px 0 30px; }
.review-carousel-controls .btn { min-width: 46px; min-height: 46px; padding: 8px 14px; font-size: 1.2rem; }
.google-review-carousel + .google-review-ratings { border-top: 0; padding-top: 0; margin-bottom: 0; }
@media(max-width:650px){ .google-review-carousel .review { flex-basis: 100%; } }

/* Review emblem over the homepage photograph. */
body[data-page="/"] .studio-hero .hero-art { position: relative; }
.hero-review-badge { position: absolute; top: 28px; right: 28px; z-index: 8; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 178px; min-height: 178px; padding: 20px 12px; border-radius: 50%; background: #15130ff2; border: 2px solid #e4bc7b; color: #fff7e8; box-shadow: 0 8px 32px #0005, 0 0 28px #e4bc7b40; text-align: center; text-decoration: none; }
.hero-review-badge .hero-review-stars { color: #e4bc7b; font-size: .86rem; letter-spacing: .12em; }
.hero-review-badge strong { font-size: 3.4rem; line-height: 1.15; font-weight: 500; letter-spacing: -.05em; color: #e4bc7b; }
.hero-review-badge > span:not(.hero-review-stars) { font-size: .8rem; font-weight: 600; }
.hero-review-badge small { margin-top: 7px; font-size: .56rem; color: #d9cbb4; }
@media(max-width:700px){ .hero-review-badge { top: 16px; right: 16px; width: 136px; min-height: 136px; padding: 14px 9px; }.hero-review-badge strong { font-size: 2.5rem; }.hero-review-badge .hero-review-stars { font-size: .7rem; }.hero-review-badge > span:not(.hero-review-stars) { font-size: .7rem; }.hero-review-badge small { font-size: .48rem; } }

.hero-review-badge { left: 28px; right: auto; }
@media(max-width:700px) { .hero-review-badge { left: 16px; right: auto; } }

/* Gold-edged starburst review emblem. */
.hero-review-badge { width: 200px; min-height: 200px; border: 0; border-radius: 0; background: transparent; box-shadow: none; isolation: isolate; filter: drop-shadow(0 6px 14px #0006); }
.hero-review-badge::before, .hero-review-badge::after { content: ""; position: absolute; inset: 0; z-index: -1; clip-path: polygon(50% 0%,60% 13%,75% 7%,78% 23%,93% 25%,87% 40%,100% 50%,87% 60%,93% 75%,78% 78%,75% 93%,60% 87%,50% 100%,40% 87%,25% 93%,22% 78%,7% 75%,13% 60%,0% 50%,13% 40%,7% 25%,22% 23%,25% 7%,40% 13%); }
.hero-review-badge::before { background: #e4bc7b; }
.hero-review-badge::after { inset: 3px; background: #17140f; }
@media(max-width:700px) { .hero-review-badge { width: 160px; min-height: 160px; } }

/* Compact rectangular review badge at the foot of the hero image. */
.hero-review-badge { top: auto; bottom: 28px; left: 28px; right: auto; width: auto; min-height: 0; padding: 16px 24px; border-radius: 10px; border: 1px solid #e4bc7b; background: #17140ff2; box-shadow: 0 6px 24px #0004; filter: none; display: grid; grid-template-columns: auto auto; gap: 3px 14px; text-align: left; }
.hero-review-badge::before, .hero-review-badge::after { content: none; }
.hero-review-badge strong { grid-column: 1; grid-row: 1 / 3; font-size: 2.6rem; }
.hero-review-badge .hero-review-stars { grid-column: 2; grid-row: 1; }
.hero-review-badge > span:not(.hero-review-stars) { grid-column: 2; grid-row: 2; }
@media(max-width:700px) { .hero-review-badge { top: auto; bottom: 16px; left: 16px; width: auto; min-height: 0; padding: 12px 18px; gap: 2px 12px; }.hero-review-badge strong { font-size: 2.2rem; } }

.banner-review-star { display: grid; place-items: center; flex: 0 0 40px; width: 40px; font-size: 2.3rem; color: #e4bc7b; line-height: 1; }
.home-benefits .banner-review-stars { display: inline; color: #e4bc7b; letter-spacing: .06em; }

.banner-google-icon { position: relative; display: block; flex: 0 0 40px; width: 40px; height: 40px; }
.banner-google-icon svg { display: block; width: 40px; height: 40px; }
.home-benefits .banner-google-icon > span { position: absolute; bottom: -2px; right: -3px; display: block; font-size: 16px; line-height: 1; color: #e4bc7b; text-shadow: 0 1px 2px #000; }

.banner-review-star { width: 40px; height: 40px; flex: 0 0 40px; }
.banner-review-star svg { display: block; width: 40px; height: 40px; }

.home-benefits .banner-review-star { display: grid; place-items: center; width: 72px; height: 72px; flex: 0 0 72px; font-family: Arial, Helvetica, sans-serif; font-size: 72px; font-weight: 400; line-height: 1; color: #e4bc7b; }
@media(max-width:560px) { .home-benefits .banner-review-star { width: 60px; height: 60px; flex-basis: 60px; font-size: 60px; } }

/* Four complete reviews, with a faded preview at either edge. */
.google-review-carousel { position: relative; }
.google-review-carousel .google-verified-reviews { padding: 8px 5%; scroll-padding-inline: 5%; mask-image: linear-gradient(to right,transparent,#000 5%,#000 95%,transparent); }
.google-review-carousel .review { flex: 0 0 calc((100% - 54px) / 4); padding: 22px 18px; }
@media(max-width:1000px){ .google-review-carousel .review { flex-basis: calc((100% - 18px) / 2); } }
@media(max-width:600px){ .google-review-carousel .review { flex-basis: 100%; } }

/* Expose more of the neighbouring review cards. */
.google-review-carousel .google-verified-reviews { padding-inline: 11%; scroll-padding-inline: 11%; mask-image: linear-gradient(to right,transparent,#000 11%,#000 89%,transparent); }
@media(max-width:600px){ .google-review-carousel .google-verified-reviews { padding-inline: 12%; scroll-padding-inline: 12%; } }

.google-review-carousel + .google-review-ratings { margin-top: 30px; }

#client-reviews.wrap { max-width: none; width: 100%; padding-left: clamp(20px,3vw,60px); padding-right: clamp(20px,3vw,60px); }
.google-reviews-heading { text-align: center; font-size: clamp(1.8rem,3vw,3rem); letter-spacing: .035em; margin: 0 0 36px; }
.google-review-carousel .review { min-height: 320px; padding: 30px 24px; }
.google-review-carousel .review blockquote { font-size: 1.08rem; line-height: 1.7; }
#client-reviews .google-review-ratings { max-width: 1224px; margin-left: auto; margin-right: auto; }
@media(max-width:650px){ .google-review-carousel .review { min-height: 280px; padding: 24px 20px; } }

.google-verified-reviews .review-author { font-size: 1rem; font-weight: 600; margin-bottom: 10px; }
.google-verified-reviews .google-stars { margin: 0; }

.google-review-inline-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 28px; }
.google-review-ratings .google-reviews-heading { margin: 0; text-align: left; font-size: clamp(1.8rem,3vw,2.8rem); }
.google-review-ratings .google-review-count { margin: 0; color: #9a6d2d; font-size: clamp(1.2rem,2vw,1.7rem); font-weight: 600; }
.google-review-ratings .google-review-count strong { font-size: clamp(2.2rem,3.8vw,3.4rem); line-height: 1; vertical-align: middle; }
/* Bring the homepage treatment cards and reviews closer together. */
body[data-page="/"] #treatments > .wrap.section { padding-bottom: 28px; }
body[data-page="/"] #client-reviews.section { padding-top: 20px; }

/* Soft gold feedback on review cards, with room for the glow. */
.google-review-carousel .google-verified-reviews { padding-block: 28px; margin-block: -20px; }
.google-review-carousel .review:focus-within { box-shadow: 0 0 20px 4px #e4bc7b85, 0 4px 28px 6px #c9934947; }
@media (hover: hover) and (pointer: fine) {
 .google-review-carousel .review:hover { box-shadow: 0 0 20px 4px #e4bc7b85, 0 4px 28px 6px #c9934947; }
}

.google-reviews-heading.reviews-top-heading { text-align: center; font-size: clamp(1.8rem,3vw,2.8rem); margin: 0 0 32px; }

/* Centred heading with a gold review total on the right. */
.reviews-heading-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin-bottom: 32px; }
.reviews-heading-row .reviews-top-heading { grid-column: 2; margin: 0; }
.reviews-count-badge { grid-column: 3; justify-self: end; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 28px; border-radius: 12px; background: linear-gradient(135deg,#f4d58c,#d9ad56); color: #282015; box-shadow: 0 6px 22px #b3946226; }
.reviews-count-badge strong { font-size: clamp(2.3rem,4vw,3.5rem); line-height: 1; font-weight: 600; font-variant-numeric: tabular-nums; }
.reviews-count-badge span { font-size: .9rem; font-weight: 600; white-space: nowrap; }
@media(max-width:700px) {
 .reviews-heading-row { grid-template-columns: 1fr auto; gap: 14px; }
 .reviews-heading-row .reviews-top-heading { grid-column: 1; font-size: clamp(1.3rem,5vw,1.8rem); }
 .reviews-count-badge { grid-column: 2; padding: 14px 16px; }
 .reviews-count-badge span { font-size: .75rem; }
}

.reviews-heading-row .reviews-heading-title { grid-column: 2; text-align: center; }
.reviews-heading-stars { margin: 12px 0 0; color: #d9ad56; font-size: clamp(1.2rem,2vw,1.6rem); letter-spacing: .18em; line-height: 1; }
@media(max-width:700px) {
 .reviews-heading-row .reviews-heading-title { grid-column: 1; }
}

/* Black review badge with a soft gold glow. */
.reviews-count-badge { width: 200px; min-height: 136px; padding: 22px 24px; justify-content: center; gap: 8px; border: 0; border-radius: 16px; background: #171615; color: #f3ece1; box-shadow: 0 0 24px 5px #e4bc7b4d, 0 8px 36px #c9934933; }
.reviews-count-badge strong { font-size: 3.7rem; color: #e4bc7b; letter-spacing: -.045em; }
.reviews-count-badge span { font-size: .9rem; line-height: 1.3; text-align: center; }
@media(max-width:700px) {
 .reviews-count-badge { width: 140px; min-height: 112px; padding: 18px 14px; border-radius: 12px; }
 .reviews-count-badge strong { font-size: 2.8rem; }
 .reviews-count-badge span { font-size: .75rem; }
}

.home-shade-section .shade-guide-interactive { border-radius: 24px; overflow: hidden; }
.home-shade-section .shade-guide-entrance { background: #eee7dbcc; border-radius: 24px; }

/* Frame the interactive shade guide after entering. */
.home-shade-section .shade-guide:not(.awaiting-entry) .shade-guide-content {
 padding: clamp(20px,3vw,36px);
 border: 1px solid #d9cdbb;
 border-radius: 24px;
 background: #f3ede3;
}
@media(max-width:700px) {
 .home-shade-section .shade-guide:not(.awaiting-entry) .shade-guide-content { padding: 20px 14px; }
}

/* Dark gallery between the light treatment and review sections. */
body[data-page="/"] #results.home-results {
 --ink: #f3ece1;
 --muted: #c9bfae;
 --paper: #171615;
 --soft: #24211d;
 --line: #494033;
 --accent-text: #e4bc7b;
 --control-border: #a58a61;
 --focus-color: #e4bc7b;
 color-scheme: dark;
 background: #171615;
 color: var(--ink);
 box-shadow: 0 0 0 100vmax #171615;
}
body[data-page="/"] #results .section-head h2 { color: #f3ece1; }
body[data-page="/"] #results .section-head h2 em { color: #e4bc7b; }
body[data-page="/"] #results .section-head p { color: #c9bfae; }
body[data-page="/"] #results .text-link { color: #e4bc7b; border-color: #a58a61; }
body[data-page="/"] #results .gallery-controls { color: #c9bfae; }
body[data-page="/"] #results .gallery-controls button { color: #f3ece1; border-color: #a58a61; }
body[data-page="/"] #results .gallery-controls button:hover { background: #342c21; color: #e4bc7b; }

/* Match the review carousel layout while keeping the gallery dark. */
body[data-page="/"] #results.home-results { max-width: none; width: 100%; padding-inline: clamp(20px,3vw,60px); }
#results .gallery-heading-row { text-align: center; margin-bottom: 32px; }
#results .gallery-heading-row h2 { font-size: clamp(1.8rem,3vw,2.8rem); color: #f3ece1; }
#results .gallery-heading-row em { color: #e4bc7b; }
#results .result-carousel { gap: 18px; padding: 8px 11%; scroll-padding-inline: 11%; mask-image: linear-gradient(to right,transparent,#000 11%,#000 89%,transparent); }
#results .result-carousel .result-card { flex: 0 0 calc((100% - 54px)/4); min-width: 0; }
#results .gallery-controls.review-carousel-controls { display: flex; flex-direction: row; justify-content: flex-end; gap: 10px; margin: 18px 0 30px; }
#results .gallery-footer { max-width: 1224px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#results .gallery-footer p { max-width: 650px; color: #c9bfae; font-size: .9rem; }
#results .gallery-footer .text-link { flex-shrink: 0; }
@media(max-width:1000px) { #results .result-carousel .result-card { flex-basis: calc((100% - 18px)/2); } }
@media(max-width:600px) {
 #results .result-carousel { padding-inline: 12%; scroll-padding-inline: 12%; }
 #results .result-carousel .result-card { flex-basis: 100%; }
 #results .gallery-footer { flex-direction: column; align-items: flex-start; }
}

/* Fill gallery cards without white letterboxing around the photos. */
body[data-page="/"] #results .result-card { background: #171615; border: 0; padding: 0; }
body[data-page="/"] #results .result-card > img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; background: transparent; }

/* Allow a continuous, gentle gallery glide without snapping each frame. */
body[data-page="/"] #results .result-carousel { scroll-snap-type: none; scroll-behavior: auto; }

.shade-guide-close { display: block; margin: 0 0 16px auto; min-height: 44px; padding: 8px 12px; border: 1px solid #baa993; border-radius: 8px; background: transparent; color: #51422c; font-size: .85rem; }
.shade-guide-close[hidden] { display: none; }

#home-result-track { touch-action: pan-x pan-y pinch-zoom; overscroll-behavior-x: contain; }

/* White experience chapter with readable dark copy. */
body[data-page="/"] #experience {
 --ink: #242424; --muted: #625e56; --paper: #fff; --soft: #f5f3ee;
 --line: #d6d0c6; --accent-text: #76531e; --focus-color: #76531e;
 background: #fff; color: #242424;
 box-shadow: 0 0 0 100vmax #fff; clip-path: inset(0 -100vmax);
}
body[data-page="/"] #experience .experience-steps details { border-color: #d6d0c6; }
body[data-page="/"] #experience .experience-steps details[open] { background: #f5f3ee; border-color: #b39462; }
body[data-page="/"] #experience :is(.combined-approach-intro > p,.experience-steps p,.step-note,.experience-action p) { color: #625e56; }
body[data-page="/"] #experience .text-link { color: #76531e; border-color: #b39462; }

/* Blend the whole logo container so its transformed/clipped image has no black box. */
body:not([data-page="/jw-v2/owner"]) .footer-brand > a:first-child { mix-blend-mode: screen; }
body:not([data-page="/jw-v2/owner"]) .footer-brand img { background: transparent; mix-blend-mode: normal; }
