/*
  Website standard: base styles for the live parts every Pro website template has (app/Controllers/WebsiteEngine.cfc).
  Loaded BEFORE the template's own CSS, so a template restyles any .rb-* class to get its own look.
  Theme variables (set by Website > Customize): --rb-brand, --rb-on-brand, --rb-font-heading, --rb-font-body.
*/
:root {
  --rb-brand: #c2410c;
  --rb-on-brand: #ffffff;
  --rb-font-heading: 'Playfair Display', Georgia, serif;
  --rb-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --rb-text: #1f2328;
  --rb-muted: #5b6470;
  --rb-line: #e7e5e4;
  --rb-surface: #ffffff;
  --rb-soft: #f6f5f3;
  --rb-radius: 10px;
  --rb-card: #ffffff;   /* cards, menus, popups, inputs, phone bar: dark templates set their own */
}

.rb-site { margin: 0; font-family: var(--rb-font-body); color: var(--rb-text); background: var(--rb-surface); -webkit-font-smoothing: antialiased; }
.rb-site *, .rb-site *::before, .rb-site *::after { box-sizing: border-box; }
.rb-site img { max-width: 100%; }
[hidden] { display: none !important; }

/* Buttons */
.rb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 20px; border-radius: 8px; border: 1px solid var(--rb-brand);
  background: var(--rb-brand); color: var(--rb-on-brand); font: 600 15px/1.2 var(--rb-font-body); text-decoration: none; cursor: pointer; transition: filter .15s, background .15s; white-space: nowrap; }
.rb-btn:hover { filter: brightness(.92); }
.rb-btn-outline { background: transparent; color: var(--rb-brand); }
.rb-btn-outline:hover { background: var(--rb-brand); color: var(--rb-on-brand); filter: none; }

/* Logo */
.rb-logo { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; min-width: 0; }
.rb-logo-img { height: 40px; width: auto; max-width: 160px; object-fit: contain; }
.rb-logo-mark { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; background: var(--rb-brand); color: var(--rb-on-brand); display: inline-flex; align-items: center; justify-content: center; font: 600 14px/1 var(--rb-font-body); letter-spacing: .02em; }
.rb-logo-name { font: 600 19px/1.15 var(--rb-font-heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Menu */
.rb-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 26px; }
.rb-menu a { color: var(--rb-muted); text-decoration: none; font-size: 15px; font-weight: 500; padding: 6px 0; border-bottom: 2px solid transparent; }
.rb-menu a:hover, .rb-menu a.is-active { color: var(--rb-text); border-bottom-color: var(--rb-brand); }
.rb-menu-toggle { display: none; background: none; border: 0; font-size: 22px; color: inherit; padding: 6px 8px; cursor: pointer; }
/* Services dropdown: one link per category page (opens on hover / focus; the arrow toggles it on touch) */
/* the Services link stays an ordinary inline link (same line as the others); the arrow sits beside it */
.rb-menu .rb-has-sub { position: relative; white-space: nowrap; }
.rb-sub-toggle { background: none; border: 0; padding: 0 2px 0 4px; margin: 0; color: inherit; opacity: .7; cursor: pointer; font-size: 10px; line-height: 1; vertical-align: middle; }
.rb-sub-toggle i { transition: transform .15s; }
.rb-submenu { display: none; position: absolute; left: -16px; top: 100%; z-index: 60; min-width: 210px; list-style: none; margin: 0; padding: 8px 0; background: var(--rb-card); border: 1px solid var(--rb-line); border-radius: var(--rb-radius); box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.rb-submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* keeps hover while moving down */
.rb-has-sub:hover > .rb-submenu, .rb-has-sub:focus-within > .rb-submenu, .rb-has-sub.is-sub-open > .rb-submenu { display: block; }
.rb-has-sub.is-sub-open .rb-sub-toggle i { transform: rotate(180deg); }
/* ul.rb-menu: stronger than a template's own ".header .rb-menu a" */
ul.rb-menu .rb-submenu a { display: block; padding: 9px 18px; border-bottom: 0; white-space: nowrap; }
ul.rb-menu .rb-submenu a:hover, ul.rb-menu .rb-submenu a.is-active { background: color-mix(in srgb, var(--rb-brand) 8%, transparent); border-bottom: 0; }
/* Alimie paints its header links white (over the hero photo); its drop-down is a white card, so its links get the
   card's text colour. Here and not in alimie.css so Pros' existing template copies get it too. Phones keep the dark menu. */
@media (min-width: 768px) {
  .al-header ul.rb-menu .rb-submenu a, .al-header ul.rb-menu .rb-submenu a:hover, .al-header ul.rb-menu .rb-submenu a.is-active { color: var(--rb-text); opacity: 1; }
}

/* Account */
.rb-account-login { color: var(--rb-muted); text-decoration: none; font-size: 15px; font-weight: 500; white-space: nowrap; }
.rb-account-login:hover { color: var(--rb-text); }
.rb-account { position: relative; }
.rb-account-btn { display: inline-flex; align-items: center; gap: 8px; background: none; border: 0; cursor: pointer; font: 500 15px var(--rb-font-body); color: inherit; padding: 4px; }
.rb-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--rb-soft); color: var(--rb-text); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; border: 1px solid var(--rb-line); }
.rb-account-menu { display: none; position: absolute; right: 0; top: calc(100% + 8px); min-width: 200px; background: var(--rb-card); border: 1px solid var(--rb-line); border-radius: var(--rb-radius); padding: 6px; z-index: 60; box-shadow: 0 10px 30px rgba(0,0,0,.08); }
.rb-account.is-open .rb-account-menu { display: block; }
.rb-account-menu a { display: block; padding: 9px 12px; border-radius: 6px; color: var(--rb-text); text-decoration: none; font-size: 14px; }
.rb-account-menu a:hover { background: var(--rb-soft); }

/* Empty live blocks (e.g. a menu with only Home, Client login switched off) take no space */
[data-rb-filled="0"] { display: none !important; }
.rb-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Category drop-down (data-rb-filter="select") */
.rb-cat-select-wrap { display: block; margin: 0 0 12px; }
.rb-cat-select { width: 100%; font: 400 14px var(--rb-font-body); padding: 9px 12px; border-radius: 8px; border: 1px solid var(--rb-line); background: var(--rb-card); color: var(--rb-text); }

/* Tabs */
.rb-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 18px; }
.rb-tab { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--rb-line); background: var(--rb-card); color: var(--rb-text); font-size: 14px; text-decoration: none; cursor: pointer; white-space: nowrap; }
.rb-tab:hover { border-color: var(--rb-brand); }
.rb-tab.is-active { background: var(--rb-brand); border-color: var(--rb-brand); color: var(--rb-on-brand); }
.rb-count { opacity: .7; font-size: 12px; }
.rb-tabs-sticky { position: sticky; top: var(--rb-sticky-top, 72px); z-index: 20; background: var(--rb-surface); padding: 10px 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.rb-tabs-sticky::-webkit-scrollbar { display: none; }

/* Portfolio */
.rb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); grid-auto-rows: 220px; grid-auto-flow: dense; gap: 10px; }
.rb-portfolio-featured .rb-grid { grid-template-columns: repeat(4, 1fr); }
.rb-portfolio-featured .rb-grid .rb-tile.is-lead { grid-column: span 2; grid-row: span 2; }
.rb-portfolio-featured.rb-featured-few .rb-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.rb-portfolio-featured.rb-featured-few .rb-grid .rb-tile.is-lead { grid-column: auto; grid-row: auto; }
.rb-tile { position: relative; display: block; overflow: hidden; border-radius: 8px; background: var(--rb-soft); cursor: zoom-in; }
.rb-tile img, .rb-tile video { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.rb-tile:hover img, .rb-tile:hover video { transform: scale(1.04); }
.rb-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 26px; text-shadow: 0 2px 10px rgba(0,0,0,.4); pointer-events: none; }
.rb-tile-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 10px; color: #fff; font-size: 13px; background: linear-gradient(transparent, rgba(0,0,0,.55)); opacity: 0; transition: opacity .2s; }
.rb-tile:hover .rb-tile-caption { opacity: 1; }
.rb-more { text-align: center; margin-top: 22px; }
.rb-more-auto { display: none !important; }
.rb-load-sentinel { height: 1px; }

/* Viewer */
.rb-viewer { position: fixed; inset: 0; z-index: 1000; background: rgba(10,10,12,.94); display: flex; align-items: center; justify-content: center; padding: 56px 64px; }
.rb-viewer-stage { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.rb-viewer-stage img, .rb-viewer-stage video { max-width: 100%; max-height: calc(100vh - 160px); border-radius: 6px; }
.rb-img-loading { filter: blur(3px); transition: filter .2s; }
.rb-viewer-stage img:not([src]), .ck-stage-figure img:not([src]) { visibility: hidden; }
.rb-viewer-stage figcaption { color: #e5e5e5; font-size: 14px; text-align: center; max-width: 640px; }
.rb-viewer-stage figcaption small { display: block; color: #a3a3a3; margin-top: 4px; }
.rb-viewer button { position: absolute; background: rgba(255,255,255,.1); color: #fff; border: 0; width: 44px; height: 44px; border-radius: 50%; font-size: 18px; cursor: pointer; }
.rb-viewer button:hover { background: rgba(255,255,255,.2); }
.rb-viewer-close { top: 14px; right: 14px; }
/* Viewer top bar, zoom and photo strip (photo store 3a): business + count, Download / Share, - 100% +, Photos, close */
.rb-viewer { padding: 64px 72px 96px; }
.rb-viewer.rb-strip-off { padding-bottom: 24px; }
.rb-viewer { overscroll-behavior: contain; touch-action: none; }
/* the viewer handles pinch / drag / swipe itself (rb-site.js); the strip still scrolls sideways */
.rb-viewer-strip { touch-action: pan-x; }
.rb-viewer-bar { position: absolute; top: 0; left: 0; right: 0; height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px 0 18px; z-index: 3; }
.rb-viewer-title { min-width: 0; display: flex; align-items: baseline; gap: 14px; color: #d4d4d4; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; overflow: hidden; }
.rb-viewer-brand { overflow: hidden; text-overflow: ellipsis; }
.rb-viewer-count { color: #a3a3a3; letter-spacing: .04em; }
.rb-viewer-tools { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.rb-viewer .rb-viewer-tools button, .rb-viewer .rb-viewer-tools .rb-photo-act { position: static; width: auto; min-width: 36px; height: 36px; padding: 0 10px; border-radius: 4px;
    border: 1px solid rgba(255,255,255,.22); background: transparent; color: #fff; font-size: 13px; transform: none; }
.rb-viewer .rb-viewer-tools button:hover, .rb-viewer .rb-viewer-tools .rb-photo-act:hover { background: rgba(255,255,255,.1); }
.rb-viewer .rb-viewer-tools button:disabled { opacity: .35; cursor: default; background: transparent; }
.rb-viewer .rb-viewer-photos[aria-pressed="true"] { background: rgba(255,255,255,.14); }
.rb-viewer .rb-vz-level { min-width: 58px; font-variant-numeric: tabular-nums; }
.rb-photo-actions.is-in-bar { position: static; }
.rb-photo-actions.is-in-bar .rb-photo-note { position: absolute; top: 60px; right: 12px; }
.rb-viewer .rb-viewer-prev, .rb-viewer .rb-viewer-next { width: 44px; height: 52px; border-radius: 4px; border: 1px solid rgba(255,255,255,.22); background: rgba(0,0,0,.25); z-index: 3; }
.rb-viewer-stage { overflow: hidden; }
.rb-viewer-stage img { transition: transform .18s ease; transform-origin: center; touch-action: none; }
.rb-viewer-stage img.is-zoomed { cursor: grab; transition: none; }
.rb-viewer-stage img.is-zoomed:active { cursor: grabbing; }
.rb-viewer-stage img, .rb-viewer-stage video { max-height: calc(100vh - 200px); }
.rb-viewer.rb-strip-off .rb-viewer-stage img, .rb-viewer.rb-strip-off .rb-viewer-stage video { max-height: calc(100vh - 128px); }
.rb-viewer.rb-zoomed .rb-viewer-stage figcaption { visibility: hidden; }
.rb-viewer-strip { position: absolute; left: 0; right: 0; bottom: 0; height: 76px; display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 0 16px;
    border-top: 1px solid rgba(255,255,255,.08); background: rgba(0,0,0,.3); z-index: 3; scrollbar-width: thin; }
.rb-viewer-strip:empty, .rb-viewer.rb-strip-off .rb-viewer-strip { display: none; }
/* the website chat bubble would sit on the strip: hidden while the viewer is open */
html.rb-viewer-open chatbox { display: none !important; }
.rb-viewer-strip::before, .rb-viewer-strip::after { content: ""; flex: 1 0 0; }
.rb-viewer .rb-viewer-strip button { position: static; flex: none; width: 46px; height: 46px; border-radius: 2px; padding: 0; border: 2px solid transparent; background: #262626 center / cover no-repeat;
    opacity: .55; font-size: 12px; transform: none; }
.rb-viewer .rb-viewer-strip button:hover { opacity: .85; }
.rb-viewer .rb-viewer-strip button.is-current { border-color: #fff; opacity: 1; }
/* Download / Share for the photo on show (rb-site.js photoActions) */
.rb-photo-actions { position: absolute; top: 14px; right: 66px; z-index: 2; display: flex; align-items: center; gap: 8px; }
.rb-photo-actions[hidden] { display: none; }
.rb-viewer .rb-photo-act, .rb-photo-act { position: static; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 0;
    background: rgba(255,255,255,.1); color: #fff; font-size: 17px; cursor: pointer; text-decoration: none; }
.rb-photo-act:hover { background: rgba(255,255,255,.2); }
.rb-photo-act[hidden] { display: none; }
.rb-photo-note { color: #fff; font-size: 13px; background: rgba(0,0,0,.55); padding: 4px 10px; border-radius: 999px; }
.rb-photo-note:empty { display: none; }
.rb-viewer-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.rb-viewer-next { right: 14px; top: 50%; transform: translateY(-50%); }

/* Book now: category chooser */
.rb-chooser { position: fixed; inset: 0; z-index: 1000; background: rgba(17, 24, 39, .5); display: flex; align-items: center; justify-content: center; padding: 20px; }
.rb-chooser-box { position: relative; width: 100%; max-width: 460px; background: var(--rb-card); border-radius: 14px; padding: 24px; box-shadow: 0 20px 50px rgba(0,0,0,.2); }
.rb-chooser-box h3 { font: 600 22px/1.25 var(--rb-font-heading); margin: 0 32px 4px 0; color: var(--rb-text); }
.rb-chooser-box p { margin: 0 0 16px; color: var(--rb-muted); font-size: 14px; }
.rb-chooser-close { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--rb-soft); color: var(--rb-text); cursor: pointer; font-size: 16px; }
.rb-chooser-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rb-chooser-list a { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid var(--rb-line); border-radius: 10px; color: var(--rb-text); text-decoration: none; transition: border-color .15s, background .15s; }
.rb-chooser-list a:hover, .rb-chooser-list a:focus { border-color: var(--rb-brand); background: var(--rb-soft); outline: none; }
.rb-chooser-name { font-weight: 600; font-size: 16px; }
.rb-chooser-meta { grid-row: 2; color: var(--rb-muted); font-size: 13px; }
.rb-chooser-list a i { grid-row: 1 / span 2; grid-column: 2; color: var(--rb-brand); }

/* Chat bubble (chatbox.css) on standard sites: name and status on two tidy lines */
.rb-site .chatbox-floating-icon .chatbox-user-status { padding-top: 2px !important; line-height: 1.3; }
.rb-site .chatbox-floating-icon .chatbox-heading { margin: 0; line-height: 1.3; }

/* Request a quote: quick message popup beside the button (bottom sheet on phones) */
/* Client login popup (rb-site.js): the /login card (clientAuth.css) over the page, a sheet from the top on phones */
html.rb-login-on { overflow: hidden; }
/* the website chat (layer 10000) waits behind the popup */
html.rb-login-on chatbox { display: none !important; }
.rb-login { position: fixed; inset: 0; z-index: 1002; display: flex; align-items: flex-start; justify-content: center; overflow-y: auto; padding: 64px 16px 32px; }
.rb-login[hidden] { display: none; }
.rb-login-backdrop { position: fixed; inset: 0; background: rgba(17, 24, 39, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .2s ease; }
.rb-login-box { position: relative; width: 440px; max-width: 100%; opacity: 0; transform: translateY(10px) scale(.98); transition: opacity .2s ease, transform .22s cubic-bezier(.2,.8,.3,1); }
.rb-login.is-open .rb-login-backdrop, .rb-login.is-open .rb-login-box { opacity: 1; }
.rb-login.is-open .rb-login-box { transform: none; }
.rb-login-close { position: absolute; top: 12px; right: 12px; z-index: 2; width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; color: #6b7280; cursor: pointer; font-size: 18px; display: inline-flex; align-items: center; justify-content: center; }
.rb-login-close:hover { background: #f3f4f6; color: #111827; }
.rb-login .rb-auth-head { padding-right: 56px; }
.rb-login-wait { height: 220px; background: #fff; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.rb-login-wait::after { content: ""; width: 26px; height: 26px; border: 3px solid #d1d5db; border-top-color: #6b7280; border-radius: 50%; animation: rb-login-spin .7s linear infinite; }
@keyframes rb-login-spin { to { transform: rotate(360deg); } }
@media (max-width: 480px) {
  .rb-login { padding: calc(12px + env(safe-area-inset-top)) 12px 24px; }
  .rb-login-close { top: 8px; right: 8px; }
  .rb-login .rb-auth-head { padding-right: 52px; }
}
.rb-quote { position: fixed; inset: 0; z-index: 1001; pointer-events: none; }
.rb-quote-backdrop { position: absolute; inset: 0; background: transparent; pointer-events: auto; }
.rb-quote-box { position: absolute; width: 360px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); overflow-y: auto; padding: 18px; background: var(--rb-card); color: var(--rb-text); border: 1px solid var(--rb-line); border-radius: 14px; box-shadow: 0 18px 48px rgba(0,0,0,.2), 0 2px 8px rgba(0,0,0,.08); pointer-events: auto;
  opacity: 0; transform: scale(.94) translateY(-4px); transition: opacity .18s ease, transform .2s cubic-bezier(.2,.8,.3,1.2); }
.rb-quote.is-open .rb-quote-box { opacity: 1; transform: none; }
.rb-quote-box h3 { font: 600 19px/1.25 var(--rb-font-heading); margin: 0 34px 2px 0; color: var(--rb-text); }
.rb-quote-for { margin: 0 34px 14px 0; color: var(--rb-muted); font-size: 13px; }
.rb-quote-close { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--rb-soft); color: var(--rb-text); cursor: pointer; font-size: 14px; }
.rb-quote-form { gap: 10px; }
.rb-quote-form label { font-size: 13px; gap: 4px; }
.rb-quote-form input, .rb-quote-form textarea { padding: 9px 11px; font-size: 14px; }
.rb-quote-form .rb-field-row { gap: 10px; }
.rb-quote .rb-quote-form .rb-btn { justify-self: stretch; }
.rb-quote-captcha { min-height: 78px; }
.rb-quote-captcha:empty { display: none; min-height: 0; }
.rb-quote-done { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 18px 0 8px; }
.rb-quote-done i { font-size: 34px; color: var(--rb-brand); }
.rb-quote-done strong { font: 600 18px var(--rb-font-heading); }
.rb-quote-done span { color: var(--rb-muted); font-size: 14px; }
@media (max-width: 767px) {
  .rb-quote-backdrop { background: rgba(17, 24, 39, .45); opacity: 0; transition: opacity .2s; }
  .rb-quote.is-open .rb-quote-backdrop { opacity: 1; }
  .rb-quote-box { left: 0 !important; right: 0; top: auto !important; bottom: 0; width: auto; max-width: none; max-height: 88vh; border-radius: 16px 16px 0 0; padding: 20px 16px calc(18px + env(safe-area-inset-bottom)); transform: translateY(100%); transition: opacity .2s, transform .28s cubic-bezier(.2,.8,.3,1); }
  .rb-quote-form .rb-field-row { grid-template-columns: 1fr; }
}

/* Services: compact cards, two per row on wide screens (thumbnail | title, price, description, bookable options, deposit) */
.rb-service-cat { margin: 0 0 40px; scroll-margin-top: calc(var(--rb-sticky-top, 72px) + 60px); }
.rb-service-cat-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--rb-line); padding-bottom: 10px; margin-bottom: 14px; }
.rb-cat-title { font: 600 26px/1.2 var(--rb-font-heading); margin: 0; }
.rb-cat-meta { margin: 2px 0 0; color: var(--rb-muted); font-size: 14px; }
.rb-cat-desc { color: var(--rb-muted); margin: 0 0 14px; max-width: 760px; line-height: 1.6; font-size: 15px; }
.rb-service-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 440px), 1fr)); gap: 14px; align-items: start; }
.rb-service { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-content: start; column-gap: 14px; row-gap: 6px; padding: 12px; border: 1px solid var(--rb-line); border-radius: var(--rb-radius); background: var(--rb-card); }
.rb-service.rb-service-noimg, .rb-service:not(:has(.rb-service-img)) { grid-template-columns: minmax(0, 1fr); }
.rb-service-img { position: relative; grid-row: 1 / span 3; align-self: start; aspect-ratio: 1 / 1; border-radius: calc(var(--rb-radius) - 4px); overflow: hidden; background: var(--rb-soft); }
.rb-service-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.rb-service-img.is-art img { object-fit: contain; padding: 12px; }
.rb-service-video { display: block; cursor: pointer; }
.rb-service-video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.rb-service-video .rb-play { inset: auto 6px 6px auto; width: 26px; height: 26px; border-radius: 50%; background: rgba(0,0,0,.55); font-size: 10px; text-shadow: none; }
.rb-service-video:hover .rb-play { background: var(--rb-brand); color: var(--rb-on-brand); }
/* logos: rb-site.js picks a backdrop that contrasts with the artwork */
.rb-service-img.is-light { background: #2b2d33; }
.rb-service-img.is-dark { background: #f3f3f3; }
/* the photo sits beside title, price and description; options and the button use the whole card width */
.rb-service-body { display: contents; }
.rb-service-top, .rb-service-meta, .rb-service-desc { grid-column: 2; min-width: 0; }
.rb-options, .rb-service-foot { grid-column: 1 / -1; }
/* one option: the button stays beside the photo, so the card is only as tall as the photo */
.rb-service:not(.rb-service-multi) .rb-service-img { grid-row: 1 / span 4; }
.rb-service:not(.rb-service-multi) .rb-service-foot { grid-column: 2; align-self: end; }
.rb-service-noimg > .rb-service-body > *, .rb-service:not(:has(.rb-service-img)) > .rb-service-body > * { grid-column: 1 / -1; }
.rb-service-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-top: 2px; }
.rb-service-title { font: 600 18px/1.3 var(--rb-font-heading); margin: 0; min-width: 0; }
.rb-service-top > .rb-price { font-size: 18px; }
.rb-service-from { color: var(--rb-muted); font-size: 13px; white-space: nowrap; }
.rb-service-from .rb-price { font-size: 17px; margin-left: 2px; }
.rb-service-meta { margin: -4px 0 0; color: var(--rb-muted); font-size: 13px; }
.rb-service-meta i, .rb-option-main small i { font-size: .9em; margin-right: 2px; }
.rb-service-desc { color: var(--rb-muted); font-size: 14px; line-height: 1.55; }
.rb-service-desc p { margin: 0; white-space: pre-line; }
.rb-clamp-text { display: block; }
[data-rb-clamp].is-clamped .rb-clamp-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rb-desc-more { display: inline-block; background: none; border: 0; padding: 0; margin-top: 2px; color: var(--rb-brand); font: 600 13px var(--rb-font-body); cursor: pointer; }
.rb-option-desc .rb-desc-more { font-size: 12px; }
.rb-desc-more:hover { text-decoration: underline; }
.rb-options { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; }
.rb-option { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--rb-line); border-radius: 8px; background: var(--rb-card); color: var(--rb-text); text-decoration: none; transition: border-color .15s; }
div.rb-option { grid-template-columns: minmax(0, 1fr) auto; }
a.rb-option:hover { border-color: var(--rb-brand); }
.rb-option-main { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; min-width: 0; }
.rb-option-name { font-weight: 600; font-size: 14px; }
.rb-option-main small { color: var(--rb-muted); font-size: 12px; }
.rb-option-desc { flex-basis: 100%; color: var(--rb-muted); font-size: 12px; line-height: 1.45; white-space: pre-line; }
.rb-option .rb-price { font-size: 14px; }
.rb-option-book { font-size: 12px; font-weight: 600; color: var(--rb-brand); border: 1px solid var(--rb-brand); border-radius: 999px; padding: 3px 10px; white-space: nowrap; transition: background .15s, color .15s; }
.rb-option-book i { font-size: 9px; margin-left: 3px; }
a.rb-option:hover .rb-option-book { background: var(--rb-brand); color: var(--rb-on-brand); }
.rb-price { font-weight: 600; white-space: nowrap; }
.rb-service-foot { padding-top: 2px; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rb-deposit { color: var(--rb-muted); font-size: 12px; }
.rb-deposit i { color: var(--rb-brand); margin-right: 3px; }
.rb-service-cta { margin-left: auto; }
/* a service's own Book / Request a quote: the same pill as the options' Book */
.rb-pill-btn { display: inline-flex; align-items: center; gap: 3px; font: 600 12px/1.4 var(--rb-font-body); color: var(--rb-brand); background: transparent; border: 1px solid var(--rb-brand); border-radius: 999px; padding: 3px 10px; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .15s, color .15s; }
.rb-pill-btn i { font-size: 9px; margin-left: 3px; }
.rb-pill-btn:hover { background: var(--rb-brand); color: var(--rb-on-brand); }
/* options that ask for a quote (Customize "Request a quote"): clickable even while bookings are off */
.rb-off-booking a.rb-option.rb-option-quote { grid-template-columns: minmax(0, 1fr) auto auto; pointer-events: auto; }
.rb-off-booking a.rb-option-quote .rb-option-book { display: inline; }
a.rb-option-quote:hover .rb-option-book { background: var(--rb-brand); color: var(--rb-on-brand); }
.rb-service-cta .rb-btn { padding: 6px 16px; font-size: 14px; }
/* options with their own Book links need no button; with bookings off the options are plain and the button asks for a quote */
.rb-service-multi .rb-service-cta { display: none; }
.rb-off-booking .rb-service-multi .rb-service-cta { display: inline; }
.rb-off-booking .rb-option-book { display: none; }
.rb-off-booking a.rb-option { grid-template-columns: minmax(0, 1fr) auto; pointer-events: none; }
/* the row can't be booked, but its description's More still opens */
.rb-off-booking a.rb-option .rb-desc-more { pointer-events: auto; }
.rb-services-preview { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.rb-service-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; border: 1px solid var(--rb-line); border-radius: var(--rb-radius); background: var(--rb-card); color: var(--rb-text); text-decoration: none; transition: border-color .15s, transform .15s; }
.rb-service-card:hover { border-color: var(--rb-brand); transform: translateY(-2px); }
.rb-service-card-body { display: flex; flex-direction: column; gap: 6px; padding: 18px; flex: 1; }
/* the category's photo or video on top of the card */
.rb-service-card-media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--rb-soft, rgba(0, 0, 0, .06)); }
.rb-service-card-media.is-empty { display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--rb-brand) 14%, var(--rb-card)); }
.rb-service-card-media.is-empty::after { content: attr(data-initial); font: 400 56px/1 var(--rb-font-heading); color: var(--rb-brand); opacity: .75; }
.rb-service-card-media img, .rb-service-card-media video { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.rb-service-card:hover .rb-service-card-media img, .rb-service-card:hover .rb-service-card-media video { transform: scale(1.04); }
.rb-service-card-title { font: 600 18px/1.3 var(--rb-font-body); }
.rb-service-card-meta { color: var(--rb-muted); font-size: 14px; }
.rb-service-card-link { color: var(--rb-brand); font-size: 14px; font-weight: 600; margin-top: 6px; }

/* Services page: each category's own page */
.rb-cat-more { margin-left: auto; align-self: center; color: var(--rb-brand); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.rb-cat-more:hover { text-decoration: underline; }

/* Category pages (/services/<category>): hero + the sections set in Customize */
.rb-cp-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 48px; align-items: center; }
.rb-cp-hero-inner.no-media, .rb-cp-hero-inner:not(:has(.rb-cp-hero-media > *)) { grid-template-columns: 1fr; }
.rb-cp-hero-media:empty { display: none; }
.rb-cp-hero-media img, .rb-cp-hero-media video { display: block; width: 100%; aspect-ratio: 4 / 3.3; object-fit: cover; border-radius: var(--rb-radius); }
.rb-cp-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }
.rb-cp-intro { margin: 14px 0 0; max-width: 560px; color: var(--rb-muted); font-size: 17px; line-height: 1.6; }
.rb-cp-section { padding: 56px 0; }
.rb-cp-section + .rb-cp-section { border-top: 1px solid var(--rb-line); }
.rb-cp-wrap { width: 100%; max-width: var(--rb-cp-wrap, 1160px); margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.rb-cp-title { font-family: var(--rb-font-heading); font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; margin: 0 0 24px; }
.rb-cp-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.rb-cp-head .rb-cp-title { margin: 0; }
.rb-cp-more { color: var(--rb-brand); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.rb-cp-more:hover { text-decoration: underline; }
.rb-cp-text p { line-height: 1.75; margin: 0 0 14px; max-width: 760px; }
.rb-cp-text p:last-child { margin-bottom: 0; }
.rb-cp-lead p { font-size: 19px; }
.rb-cp-photos .rb-grid, .rb-cp-row .rb-grid { grid-template-columns: repeat(4, 1fr); }
.rb-cp-row-1 .rb-grid { grid-template-columns: 1fr; }
.rb-cp-row-2 .rb-grid { grid-template-columns: repeat(2, 1fr); }
.rb-cp-row-3 .rb-grid, .rb-cp-row-5 .rb-grid, .rb-cp-row-6 .rb-grid { grid-template-columns: repeat(3, 1fr); }
.rb-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 32px; margin: 0; }
.rb-detail { padding: 14px 0; border-top: 1px solid var(--rb-line); }
.rb-detail dt { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--rb-muted); }
.rb-detail dd { margin: 4px 0 0; font-size: 17px; }
.rb-faqs { max-width: 860px; border-top: 1px solid var(--rb-line); }
.rb-faq { border-bottom: 1px solid var(--rb-line); }
.rb-faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; font-size: 17px; font-weight: 600; }
.rb-faq summary::-webkit-details-marker { display: none; }
.rb-faq summary i { flex: 0 0 auto; color: var(--rb-brand); font-size: 13px; transition: transform .2s; }
.rb-faq[open] summary i { transform: rotate(45deg); }
.rb-faq-a { padding: 0 0 18px; color: var(--rb-muted); }
.rb-faq-a p { margin: 0 0 10px; line-height: 1.7; }
.rb-cp-contact { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 32px; border: 1px solid var(--rb-line); border-radius: var(--rb-radius); background: var(--rb-card); }
.rb-cp-contact .rb-cp-text p { font-size: 17px; }
.rb-cp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.rb-cp-split.is-photo-left .rb-cp-photo { order: -1; }
.rb-cp-split.no-photo { grid-template-columns: 1fr; }
.rb-cp-photo { margin: 0; }
.rb-cp-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--rb-radius); }

/* About, reviews, details */
.rb-about p { line-height: 1.75; margin: 0 0 14px; }
/* the Public Image (Settings > Company) beside the About text */
.rb-about.has-photo { display: grid; grid-template-columns: minmax(120px, 180px) minmax(0, 1fr); gap: 26px; align-items: start; }
.rb-about-photo { margin: 0; }
.rb-about-photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--rb-radius); }
@media (max-width: 600px) {
  .rb-about.has-photo { grid-template-columns: 1fr; gap: 18px; }
  .rb-about-photo { max-width: 200px; }
}
.rb-reviews { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.rb-review { margin: 0; padding: 18px; border: 1px solid var(--rb-line); border-radius: var(--rb-radius); background: var(--rb-card); display: flex; flex-direction: column; }
.rb-stars { color: #d97706; font-size: 13px; letter-spacing: 2px; margin-bottom: 8px; }
.rb-review blockquote { margin: 0 0 14px; line-height: 1.6; font-size: 15px; }
.rb-review blockquote p { margin: 0; }
.rb-review [data-rb-clamp].is-clamped .rb-clamp-text { -webkit-line-clamp: 6; }
.rb-review figcaption { color: var(--rb-muted); font-size: 14px; font-weight: 500; }
/* reviewer: round photo (or initials) + name, at the bottom of the card */
.rb-review-who { display: flex; align-items: center; gap: 10px; margin-top: auto; }
.rb-review-avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--rb-brand) 14%, var(--rb-card)); color: var(--rb-brand); font: 600 14px/1 var(--rb-font-body); letter-spacing: .02em; }
.rb-review-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rb-review-name { color: var(--rb-text); font-weight: 600; }
.rb-hours, .rb-areas, .rb-contact-details { list-style: none; padding: 0; margin: 0; }
.rb-hours li { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; border-bottom: 1px solid var(--rb-line); font-size: 14px; }
.rb-areas li, .rb-contact-details li { padding: 5px 0; font-size: 15px; display: flex; gap: 10px; align-items: baseline; }
.rb-areas i, .rb-contact-details i { color: var(--rb-brand); width: 16px; }
.rb-contact-details a { color: inherit; }
.rb-social { list-style: none; display: flex; gap: 10px; padding: 0; margin: 0; }
.rb-social a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid currentColor; display: inline-flex; align-items: center; justify-content: center; color: inherit; text-decoration: none; opacity: .85; }
.rb-social a:hover { opacity: 1; background: var(--rb-brand); border-color: var(--rb-brand); color: var(--rb-on-brand); }
.rb-powered { color: inherit; opacity: .65; font-size: 12px; text-decoration: none; }
.rb-powered:hover { opacity: 1; }

/* Contact form */
.rb-contact-form { display: grid; gap: 14px; }
.rb-contact-form label { display: grid; gap: 6px; font-size: 14px; font-weight: 500; }
.rb-contact-form label small { font-weight: 400; color: var(--rb-muted); }
.rb-contact-form input, .rb-contact-form textarea { font: 400 15px var(--rb-font-body); padding: 11px 12px; border: 1px solid var(--rb-line); border-radius: 8px; background: var(--rb-card); color: var(--rb-text); width: 100%; }
.rb-contact-form input:focus, .rb-contact-form textarea:focus { outline: 2px solid var(--rb-brand); outline-offset: 0; border-color: transparent; }
.rb-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.rb-hp { position: absolute !important; left: -5000px !important; width: 1px; height: 1px; opacity: 0; }
.rb-form-msg { margin: 0; font-size: 14px; min-height: 1px; }
.rb-form-msg.is-error { color: #b42318; }
.rb-form-msg.is-ok { color: #067647; }
.rb-contact-form .rb-btn { justify-self: start; }

/* Phone bar */
.rb-mobile-bar { display: none; }
.rb-preview-chat { position: fixed; left: 16px; bottom: 16px; z-index: 50; display: flex; background: var(--rb-card); border-radius: 999px; padding: 4px; box-shadow: 0 6px 20px rgba(0,0,0,.15); }
.rb-preview-chat span { width: 40px; height: 40px; border-radius: 50%; background: var(--rb-brand); color: var(--rb-on-brand); display: inline-flex; align-items: center; justify-content: center; }

@media (max-width: 1100px) {
  .rb-account-name { display: none; }
  .rb-menu { gap: 18px; }
}
@media (max-width: 767px) {
  .rb-menu-toggle { display: inline-flex; }
  /* phones: the categories sit under Services in the menu, opened with the arrow */
  .rb-menu .rb-has-sub { display: flex; align-items: center; flex-wrap: wrap; white-space: normal; }
  .rb-menu .rb-has-sub > a { flex: 1; }
  .rb-sub-toggle { font-size: 14px; padding: 10px 6px 10px 14px; }
  .rb-submenu { position: static; width: 100%; min-width: 0; padding: 0 0 6px 14px; background: transparent; border: 0; box-shadow: none; }
  .rb-submenu::before { content: none; }
  .rb-has-sub:hover > .rb-submenu, .rb-has-sub:focus-within > .rb-submenu { display: none; }
  .rb-has-sub.is-sub-open > .rb-submenu { display: block; }
  ul.rb-menu .rb-submenu a { padding: 10px 0; white-space: normal; }
  ul.rb-menu .rb-submenu a:hover, ul.rb-menu .rb-submenu a.is-active { background: transparent; }
  .rb-cp-hero-inner { grid-template-columns: 1fr; gap: 24px; }
  .rb-cp-section { padding: 40px 0; }
  .rb-cp-wrap { padding: 0 16px; }
  .rb-cp-lead p { font-size: 17px; }
  .rb-cp-photos .rb-grid, .rb-cp-row .rb-grid { grid-template-columns: repeat(2, 1fr); }
  .rb-cp-row-1 .rb-grid { grid-template-columns: 1fr; }
  .rb-cp-split { grid-template-columns: 1fr; gap: 22px; }
  .rb-cp-split.is-photo-left .rb-cp-photo { order: 0; }
  .rb-cp-contact { padding: 22px; }
  .rb-cat-more { margin-left: 0; }
  .rb-menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; background: var(--rb-surface); border-bottom: 1px solid var(--rb-line); padding: 6px 16px 12px; z-index: 50; }
  .rb-menu.is-open { display: flex; }
  .rb-menu a { display: block; padding: 12px 0; border-bottom: 1px solid var(--rb-line); }
  .rb-menu li:last-child a { border-bottom: 0; }
  .rb-account-name { display: none; }
  .rb-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; gap: 6px; }
  .rb-portfolio-featured .rb-grid { grid-template-columns: repeat(2, 1fr); }
  .rb-field-row { grid-template-columns: 1fr; }
  .rb-service { grid-template-columns: 76px minmax(0, 1fr); column-gap: 12px; }
  .rb-service-img.is-art img { padding: 6px; }
  .rb-service-title, .rb-service-top > .rb-price { font-size: 16px; }
  .rb-service-top { flex-wrap: wrap; gap: 2px 10px; }
  .rb-cat-title { font-size: 22px; }
  .rb-option-book { border: 0; padding: 0 2px; font-size: 0; }
  .rb-option-book i { font-size: 13px; margin: 0; }
  /* every button (one option or several) sits under the text column, so all are the same size */
  .rb-service-multi .rb-service-foot { grid-column: 2; }
  .rb-service-noimg .rb-service-foot, .rb-service:not(:has(.rb-service-img)) .rb-service-foot { grid-column: 1 / -1; }
  .rb-service-cta { flex: 1; text-align: right; }
  .rb-service-cta .rb-btn { width: 100%; }
  .rb-viewer { padding: 64px 8px 92px; }
  .rb-viewer.rb-strip-off { padding-bottom: 16px; }
  .rb-viewer-prev, .rb-viewer-next { display: none; }
  .rb-viewer-brand { display: none; }
  .rb-viewer-bar { padding: 0 8px 0 12px; }
  .rb-viewer-tools { gap: 6px; }
  .rb-viewer .rb-viewer-tools button, .rb-viewer .rb-viewer-tools .rb-photo-act { min-width: 34px; height: 34px; padding: 0 8px; }
  .rb-viewer .rb-vz-level { min-width: 48px; }
  .rb-viewer-title { flex-shrink: 0; }

  .rb-site { padding-bottom: 68px; }
  .rb-mobile-bar { display: flex; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: var(--rb-card); border-top: 1px solid var(--rb-line); }
  .rb-bar-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 0; border-radius: 8px; border: 1px solid var(--rb-line); color: var(--rb-text); text-decoration: none; font: 600 15px var(--rb-font-body); background: var(--rb-card); }
  .rb-bar-primary { background: var(--rb-brand); border-color: var(--rb-brand); color: var(--rb-on-brand); }
  .rb-preview-chat { display: none; }
  .rb-chooser { align-items: flex-end; padding: 0; }
  .rb-chooser-box { max-width: none; border-radius: 16px 16px 0 0; padding: 20px 16px calc(20px + env(safe-area-inset-bottom)); }
  /* the bar's Message button opens the chat, so the floating chat button would only cover the page */
  .rb-site [id^="chat-floating-div-"] { display: none !important; }
}
@media (max-width: 480px) {
  /* viewer bar: room for the count on phones (tapping the percentage goes back to 100%) */
  .rb-viewer .rb-vz-out { display: none; }
  .rb-viewer-tools { gap: 4px; }
  .rb-viewer .rb-viewer-tools button, .rb-viewer .rb-viewer-tools .rb-photo-act { min-width: 32px; height: 32px; padding: 0 7px; font-size: 12px; }
}

/* Phones: About with the Public Image, as in Darien: the photo on the left (a third), the section's label,
   heading, text and link beside it. Works for any template whose About block sits in one container with its
   heading and link (Home and About pages); Darien's Home has its own rules (darien.css). */
@media (max-width: 767px) {
  :has(> div > .rb-about.has-photo):not(.dv-about-home > .dv-wrap) { display: grid; grid-template-columns: minmax(0, 34fr) minmax(0, 66fr); column-gap: 16px; align-items: start; align-content: start; }
  :has(> div > .rb-about.has-photo):not(.dv-about-home > .dv-wrap) > * { grid-column: 2; min-width: 0; }
  :has(> div > .rb-about.has-photo):not(.dv-about-home > .dv-wrap) > div:has(> .rb-about.has-photo),
  .rb-about.has-photo:not(.dv-about-home .rb-about) { display: contents; }
  .rb-about.has-photo:not(.dv-about-home .rb-about) > .rb-about-photo { grid-column: 1; grid-row: 1 / span 12; max-width: none; }
  .rb-about.has-photo:not(.dv-about-home .rb-about) > .rb-about-text { grid-column: 2; }
  :has(> div > .rb-about.has-photo):not(.dv-about-home > .dv-wrap) h2 { font-size: clamp(22px, 7vw, 28px); line-height: 1.15; }
  .rb-about.has-photo:not(.dv-about-home .rb-about) .rb-about-text p { font-size: 15px; line-height: 1.65; }
}

/* ===== Viewer, full screen: the photo uses the whole width between the top bar and the photo strip (the bottom
   edge when the strip is hidden), as large as it fits; the title moves into the top bar (rb-site.js) ===== */
.rb-viewer { padding: 0; }
.rb-viewer .rb-viewer-stage { position: absolute; top: 56px; bottom: 76px; left: 0; right: 0; margin: 0; max-width: none; max-height: none;
    display: flex; align-items: center; justify-content: center; overflow: hidden; }
.rb-viewer.rb-strip-off .rb-viewer-stage { bottom: 0; }
.rb-viewer .rb-viewer-stage img, .rb-viewer .rb-viewer-stage video { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 0; }
.rb-viewer .rb-viewer-stage figcaption { display: none; }
.rb-viewer-caption { color: #a3a3a3; text-transform: none; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; }
.rb-viewer-caption:empty { display: none; }
@media (max-width: 640px) {
  .rb-viewer-caption { display: none; }
}

/* ===== Same look as client galleries (collection-simple-gallery.css): a 72px photo strip, and Download / Share
   floating as a small bar just above it ===== */
.rb-viewer .rb-viewer-strip { height: 72px; }
.rb-viewer .rb-viewer-stage { bottom: 72px; }
.rb-viewer.rb-strip-off .rb-viewer-stage { bottom: 0; }
.rb-viewer .rb-photo-actions.is-floating { position: absolute; top: auto; right: auto; left: 50%; bottom: calc(72px + 10px); transform: translateX(-50%); z-index: 4;
    gap: 2px; padding: 2px 10px; border-radius: 999px; background: rgba(17,24,39,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.rb-viewer.rb-strip-off .rb-photo-actions.is-floating { bottom: max(14px, env(safe-area-inset-bottom)); }
.rb-viewer .rb-photo-actions.is-floating .rb-photo-act { width: 40px; height: 40px; min-width: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; font-size: 17px; }
.rb-viewer .rb-photo-actions.is-floating .rb-photo-act:hover { background: rgba(255,255,255,.12); }
.rb-viewer .rb-photo-actions.is-floating .rb-photo-note { position: absolute; bottom: 52px; left: 50%; transform: translateX(-50%); white-space: nowrap; }
/* a solid backdrop, like client galleries: nothing of the page shows through */
.rb-viewer { background: rgb(10,10,12); }
/* photo store (3b): the size of a photo for sale in the top bar; the bag in the floating bar turns green once in the cart */
.rb-viewer-size { color: #a3a3a3; text-transform: none; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.rb-viewer-size:empty { display: none; }
.rb-viewer .rb-photo-actions.is-floating .rb-photo-bag.is-in-cart, .rb-viewer .rb-photo-actions.is-floating .rb-photo-bag.is-in-cart:hover { background: #16a34a; }