/* Bike Island – Ex-Rental Bikes. Matches the model pages of bikeislandmallorca.com (tcr-card, size-range-row). */
.bim-exr-hide-title .sq-main-header,
.bim-exr-hide-title .entry-header,
.bim-exr-hide-title h1.entry-title,
.bim-exr-hide-title .page-header { display: none !important; }

.bim-exr, body.bim-exr-page {
	--exr-bg: #F2F4F7; --exr-card: #FFFFFF; --exr-ink: #1A1A1A; --exr-text: #404040; --exr-label: #333333; --exr-val: #111111;
	--exr-sub: #555555; --exr-muted: #7A838A; --exr-line: #EEEEEE; --exr-row: #F0F0F0; --exr-edge: #DDE3EA;
	--exr-navy: #2E447A; --exr-navy-d: #1A2B5C; --exr-teal: #16707F; --exr-teal-l: #5BC2CE; --exr-info: #E8F7FB; --exr-axis: #9AA7AD; --exr-sold: #A8442F;
	--exr-shadow: 0 2px 12px rgba(0,0,0,.08); --exr-shadow-s: 0 2px 8px rgba(0,0,0,.08);
	--exr-raise: 0 22px 54px rgba(16,28,58,.26), 0 5px 14px rgba(16,28,58,.12); --exr-lift: 36px;
	--exr-cond: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	--exr-sans: "Open Sans", Arial, sans-serif;
	--exr-display: "Bebas Kai", "Bebas Neue", "Arial Black", sans-serif;
}
.bim-exr {
	max-width: 1100px; margin: 0 auto; padding: 0 0 40px; color: var(--exr-text); font-family: var(--exr-sans); font-size: 16px; line-height: 1.75;
}
.bim-exr *, .bim-exr *::before, .bim-exr *::after { box-sizing: border-box; }
.bim-exr a { text-decoration: none; }
.bim-exr img { max-width: 100%; height: auto; display: block; }
.bim-exr :focus-visible { outline: 2px solid var(--exr-teal-l); outline-offset: 2px; }

.bim-exr-preview-bar { background: #1A1A1A; color: #EDEDED; font-family: var(--exr-cond); font-size: 14px; letter-spacing: .04em; padding: 8px 14px; border-radius: 0; margin: 16px 0 0; }

/* Breadcrumbs */
.bim-exr-crumbs { font-family: var(--exr-cond); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--exr-muted); padding-top: 20px; display: flex; flex-wrap: wrap; gap: 7px; line-height: 1.4; }
.bim-exr .bim-exr-crumbs a { color: var(--exr-navy); font-weight: 700; }
.bim-exr .bim-exr-crumbs a:hover { text-decoration: underline; }
.bim-exr-sep { opacity: .5; }

/* Titles (tcr-bike-h1 / tcr-bike-h2) */
.bim-exr-head { text-align: center; padding: 30px 0 24px; }
.bim-exr .bim-exr-h1 { font-family: var(--exr-cond); font-weight: 800; font-size: 32px; line-height: 1.15; color: var(--exr-ink); margin: 0; text-transform: none; letter-spacing: 0; text-wrap: balance; }
.bim-exr .bim-exr-sub { font-family: var(--exr-cond); font-weight: 400; font-size: 17.6px; line-height: 1.4; color: var(--exr-sub); margin: 8px 0 0; text-wrap: balance; }

/* Info box */
.bim-exr-info { background: var(--exr-info); border-left: 4px solid var(--exr-navy); border-radius: 0; padding: 18px 24px; font-size: 15px; color: var(--exr-text); line-height: 1.7; max-width: 720px; margin: 26px auto 0; }
.bim-exr-info strong { color: var(--exr-navy); }
.bim-exr-info ol { margin: 6px 0 0; padding-left: 20px; }
/* How buying works: the number and the step in bold, what it means under it — or, in a language that
   writes each step as one sentence (Czech), the first words in bold and the rest after them in the line. */
.bim-exr-info ol.bim-exr-how { margin: 8px 0 0; padding-left: 22px; }
.bim-exr-how li { margin: 0 0 7px; padding-left: 2px; }
.bim-exr-how li:last-child { margin-bottom: 0; }
.bim-exr-how li::marker { font-weight: 700; color: var(--exr-navy); }
.bim-exr .bim-exr-how b { display: block; font-weight: 700; color: var(--exr-navy); }
.bim-exr .bim-exr-how .is-run-on b { display: inline; }

/* Cards (tcr-card) */
.bim-exr-card { background: var(--exr-card); border-radius: 0; box-shadow: var(--exr-shadow); padding: 28px 28px 24px; min-width: 0; }
.bim-exr .bim-exr-card-title { font-family: var(--exr-cond); font-weight: 700; font-size: 17.6px; color: var(--exr-navy); text-transform: uppercase; letter-spacing: 1px; text-align: center; margin: 0 0 12px; padding: 0 0 12px; border-bottom: 1px solid var(--exr-line); line-height: 1.3; }
.bim-exr table.bim-exr-table { width: 100%; border-collapse: collapse; border: 0; margin: 0; background: none; }
.bim-exr .bim-exr-table td { font-size: 14.9px; padding: 6px 4px; border: 0; border-bottom: 1px solid var(--exr-row); vertical-align: top; line-height: 1.55; background: none; }
.bim-exr .bim-exr-table td:first-child { color: var(--exr-label); }
/* Free text lands in these cells (a delivery price written as "ab 25 EUR pro Rad", a frame size, a bike
   code), and nowrap pushed it straight out of the card at phone width. Amounts keep their shape:
   BIM_EXR_Money::format() and the delivery table join the number and the euro sign with a non-breaking
   space. "break-word" rather than "anywhere": with "anywhere" the table counted the column as one
   letter wide, squeezed it, and "189 €" broke into "189" and "€" in a card of the right width. */
.bim-exr .bim-exr-table td:last-child { color: var(--exr-val); font-weight: 600; text-align: right; white-space: normal; overflow-wrap: break-word; padding-left: 12px; }
.bim-exr .bim-exr-table--wrap td:last-child { white-space: normal; }
.bim-exr .bim-exr-table tr:last-child td { border-bottom: 0; }
.bim-exr .bim-exr-table s { color: var(--exr-muted); font-weight: 400; }
.bim-exr-table--small td { font-size: 14px !important; padding: 5px 2px !important; }
/* A model page is four parts, one under the other. The top (the photo, the name, the price) and the
   words about the shop lie flat, behind; the technical details and the enquiry form are raised panels
   in front of them, with a deep shadow, each rising over the edge of the part before it. */
/* The technical details: a raised panel across the width that rises out of the white top, its rows in
   two columns (one on a phone), with the shop's note about these very bikes under them. */
.bim-exr .bim-exr-specs { position: relative; max-width: 1030px; margin: calc(-1 * var(--exr-lift)) auto 0; padding: 30px 40px 30px; box-shadow: var(--exr-raise); }
.bim-exr-specs-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px; align-items: start; }
.bim-exr .bim-exr-note { margin: 20px 0 0; padding: 13px 18px; background: var(--exr-info); border-left: 3px solid var(--exr-navy); font-size: 14.9px; line-height: 1.6; color: var(--exr-text); }
@media (max-width: 700px) {
	.bim-exr-specs-cols { grid-template-columns: minmax(0, 1fr); }
	.bim-exr .bim-exr-specs-cols .bim-exr-table:not(:last-child) tr:last-child td { border-bottom: 1px solid var(--exr-row); }
}
/* About us and our bikes: plain text on the page itself, behind the panels, across the width — three
   short paragraphs side by side on a wide screen (one under the other on a narrower one); a new bike's
   single paragraph in the middle. */
.bim-exr-about { max-width: 1030px; margin: 0 auto; padding: 58px 40px 0; }
.bim-exr .bim-exr-about .bim-exr-card-title { border-bottom-color: #DCE2EA; margin-bottom: 16px; }
.bim-exr-about-text { max-width: 760px; margin: 0 auto; text-align: center; }
.bim-exr-about.is-cols .bim-exr-about-text { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 44px; max-width: none; text-align: left; }
.bim-exr .bim-exr-about p { font-size: 14.9px; line-height: 1.7; color: var(--exr-label); margin: 0; }
@media (max-width: 900px) {
	.bim-exr-about.is-cols .bim-exr-about-text { grid-template-columns: minmax(0, 1fr); row-gap: 10px; }
}
@media (max-width: 700px) {
	.bim-exr-about { padding: 44px 2px 0; }
}
.bim-exr-cnote { font-size: 13px; color: var(--exr-muted); text-align: center; margin: 12px 0 0; line-height: 1.5; }

/* CTA (tcr-cta-btn) */
.bim-exr .bim-exr-cta { display: inline-block; font-family: var(--exr-display); font-weight: 700; font-size: 26px; letter-spacing: 2px; color: #fff; text-transform: uppercase; padding: 16px 44px; border: 2px solid var(--exr-navy-d); border-radius: 0; cursor: pointer;
	background: var(--exr-navy-d) linear-gradient(135deg, rgba(50,80,160,.85) 0%, rgba(40,68,135,.8) 50%, rgba(25,45,100,.8) 100%);
	box-shadow: 0 0 12px rgba(35,60,120,.6); text-shadow: 1px 1px 3px rgba(0,0,0,.5); line-height: 1.1; transition: filter .15s, box-shadow .15s; }
.bim-exr .bim-exr-cta:hover { filter: brightness(1.12); box-shadow: 0 0 18px rgba(35,60,120,.75); color: #fff; }

/* Pills */
.bim-exr-pills { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; padding: 28px 0 6px; }
.bim-exr .bim-exr-pill { border: 1px solid var(--exr-edge); background: #fff; border-radius: 0; padding: 6px 16px; font-family: var(--exr-cond); font-weight: 600; font-size: 14px; text-transform: uppercase; letter-spacing: .04em; color: var(--exr-label); line-height: 1.4; transition: border-color .15s; }
.bim-exr .bim-exr-pill:hover { border-color: var(--exr-navy); }
.bim-exr .bim-exr-pill[aria-current="page"] { background: var(--exr-navy); border-color: var(--exr-navy); color: #fff; }
.bim-exr .bim-exr-pill.is-disabled { opacity: .4; }
.bim-exr-count { text-align: center; font-family: var(--exr-cond); font-size: 14px; color: var(--exr-muted); margin: 4px 0 18px; }

/* Pictures */
.bim-exr-pic { background: #fff; aspect-ratio: 1100 / 634; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; max-width: 100%; }
.bim-exr-pic img { width: 100%; height: 100%; object-fit: contain; }
.bim-exr-ph { width: 78%; height: auto; color: #C3CBD3; }
.bim-exr-band { background: #fff; margin-top: 16px; }
/* The top of a model page (breadcrumbs, photo, name) is white from edge to edge, as the photographs are
   cut out on white. The white is a shadow, clipped to the section's height, so it reaches the sides of
   the window without widening the page; upwards it closes the gap the theme leaves under its header
   (12 px, 92 px on a phone — bikeislandmallorca.com's own header CSS), except under the staff preview
   bar, which must stay readable. */
.bim-exr-hero { background: #fff; box-shadow: 0 0 0 100vmax #fff; clip-path: inset(-12px -100vmax 0 -100vmax); }
.bim-exr-preview-bar + .bim-exr-hero { clip-path: inset(0 -100vmax); }
@media (max-width: 768px) { .bim-exr-hero { clip-path: inset(-92px -100vmax 0 -100vmax); } }
.bim-exr-pic--hero { max-width: 1100px; margin: 0 auto; }
/* The top of a model's page: the breadcrumbs over the photo on the left; on the right, plainly, the
   name, the type and year and the short description in grey, the price new, the discount and the price
   drawn as on the catalogue cards (larger, under a hairline), and one navy button. On a phone the
   details follow the photo. Under it all, room for the technical details to rise into. */
.bim-exr-top { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 48px; align-items: center; padding: 14px 0 calc(40px + var(--exr-lift)); }
.bim-exr-top .bim-exr-band { margin: 0; }
.bim-exr-top-info { min-width: 0; }
.bim-exr .bim-exr-top-info .bim-exr-h1 { font-size: 34px; line-height: 1.1; text-align: left; margin: 0; }
.bim-exr .bim-exr-meta { font-family: var(--exr-cond); font-size: 15.5px; line-height: 1.4; color: var(--exr-muted); margin: 8px 0 0; }
.bim-exr .bim-exr-top-info .bim-exr-sub { font-size: 17.6px; text-align: left; margin: 2px 0 0; }
.bim-exr .bim-exr-cond { font-family: var(--exr-cond); font-size: 15.5px; line-height: 1.4; color: var(--exr-ink); margin: 10px 0 0; }
.bim-exr .bim-exr-cond b { color: var(--exr-navy); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; margin-right: 3px; }
.bim-exr-prices { margin: 24px 0 0; padding: 20px 0 0; border-top: 1px solid #E2E6EB; }
.bim-exr-prices .bim-exr-from { font-size: 13.5px; }
.bim-exr .bim-exr-prices .bim-exr-was { font-size: 26px; }
.bim-exr .bim-exr-prices .bim-exr-off b { font-size: 16px; padding: 6px 12px 5px; margin: 0 8px; }
.bim-exr-prices .bim-exr-price { font-size: 38px; line-height: 1; }
.bim-exr-prices .bim-exr-price.is-muted { font-size: 24px; }
.bim-exr .bim-exr-top-info .bim-exr-cnote { text-align: left; font-size: 12.5px; margin: 10px 0 0; }
/* One button, plain navy: no gradient, glow or shadowed letters up here, and in the condensed type of
   the rest of the panel, so it stays on one line in half of a narrower window in every language (the
   display face falls back to a wide Arial Black where the theme does not load it). */
.bim-exr .bim-exr-top-act { margin: 20px 0 0; }
.bim-exr .bim-exr-top-act .bim-exr-cta { display: block; text-align: center; font-family: var(--exr-cond); font-weight: 700; font-size: 19px; letter-spacing: 1.5px; line-height: 1.2; padding: 16px 20px 15px; background: var(--exr-navy); border-color: var(--exr-navy); box-shadow: none; text-shadow: none; text-wrap: balance; transition: background-color .15s, border-color .15s; }
.bim-exr .bim-exr-top-act .bim-exr-cta:hover { background: var(--exr-navy-d); border-color: var(--exr-navy-d); filter: none; box-shadow: none; }
/* A narrower window keeps the photo beside the details, in two equal halves; a phone puts them one
   under the other. */
@media (max-width: 960px) {
	.bim-exr-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
	.bim-exr .bim-exr-top-info .bim-exr-h1 { font-size: 28px; }
	.bim-exr .bim-exr-top-info .bim-exr-sub { font-size: 16.5px; }
	.bim-exr .bim-exr-prices .bim-exr-was { font-size: 22px; }
	.bim-exr .bim-exr-prices .bim-exr-off b { font-size: 15px; padding: 5px 10px 4px; margin: 0 5px; }
	.bim-exr-prices .bim-exr-price { font-size: 30px; }
	.bim-exr .bim-exr-top-act .bim-exr-cta { font-size: 17px; letter-spacing: 1.2px; padding: 15px 12px 14px; }
}
@media (max-width: 640px) {
	.bim-exr-top { grid-template-columns: minmax(0, 1fr); gap: 16px; padding-bottom: calc(30px + var(--exr-lift)); }
	.bim-exr .bim-exr-prices .bim-exr-was { font-size: 24px; }
	.bim-exr-prices .bim-exr-price { font-size: 34px; }
	.bim-exr .bim-exr-top-act .bim-exr-cta { font-size: 18px; letter-spacing: 1.4px; }
}
@media (max-width: 400px) {
	.bim-exr .bim-exr-prices .bim-exr-was { font-size: 22px; }
	.bim-exr .bim-exr-prices .bim-exr-off b { font-size: 15px; margin: 0 5px; }
	.bim-exr-prices .bim-exr-price { font-size: 30px; }
}

/* Catalog */
.bim-exr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; padding: 6px 0 20px; }
@media (max-width: 360px) { .bim-exr-grid { grid-template-columns: 1fr; } }
/* The whole card is the link. Hovered, it only casts a deeper shadow: it does not move. */
.bim-exr .bim-exr-mcard { background: #fff; border-radius: 0; box-shadow: var(--exr-shadow); overflow: hidden; display: flex; flex-direction: column; color: inherit; transition: box-shadow .2s; }
.bim-exr .bim-exr-mcard:hover, .bim-exr .bim-exr-mcard:focus-visible { box-shadow: 0 14px 36px rgba(16,28,58,.26), 0 3px 10px rgba(16,28,58,.12); }
.bim-exr-mcard.is-soldout { opacity: .7; }
/* A white margin all round the photograph, so the bike does not touch the edges of the card. */
.bim-exr-mcard .bim-exr-pic { padding: 28px 32px 22px; }
/* A new bike, sold next to the ex-rental ones, says so on its photograph. */
.bim-exr-newtag { position: absolute; top: 12px; left: 12px; padding: 6px 12px 5px; border-radius: 0; background: var(--exr-navy); color: #fff; font-family: var(--exr-cond); font-weight: 800; font-size: 13px; line-height: 1; letter-spacing: .1em; text-transform: uppercase; box-shadow: 0 2px 6px rgba(46,68,122,.3); }
.bim-exr-mbody { padding: 16px 22px 20px; display: flex; flex-direction: column; flex: 1; border-top: 1px solid var(--exr-line); }
.bim-exr-kick { font-family: var(--exr-cond); font-weight: 700; font-size: 13px; color: var(--exr-navy); text-transform: uppercase; letter-spacing: 1px; line-height: 1.4; }
.bim-exr .bim-exr-mname { font-family: var(--exr-cond); font-weight: 800; font-size: 22px; color: var(--exr-ink); margin: 4px 0 2px; line-height: 1.2; text-transform: none; letter-spacing: 0; }
.bim-exr-msub { font-family: var(--exr-cond); font-size: 15.5px; color: var(--exr-sub); line-height: 1.4; margin-bottom: 10px; }
.bim-exr-mcard .bim-exr-table { margin-bottom: 12px; }
/* The sizes follow their label on the left, not pushed to the right edge of the card. */
.bim-exr .bim-exr-mcard .bim-exr-table td:first-child { width: 1%; white-space: nowrap; }
.bim-exr .bim-exr-mcard .bim-exr-table td:last-child { text-align: left; padding-left: 14px !important; }
/* Price new at the bottom left, the ex-rental price at the bottom right, and between them the discount:
   a badge on an arrow that runs from the one price to the other. The labels share a line, and so do the
   two prices. */
.bim-exr-pricing { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 10px; row-gap: 5px; align-items: baseline; }
.bim-exr-pricing .bim-exr-from.is-new { grid-area: 1 / 1; }
.bim-exr-pricing .bim-exr-was { grid-area: 2 / 1; }
.bim-exr-pricing .bim-exr-off { grid-area: 2 / 2; align-self: center; }
.bim-exr-pricing .bim-exr-from.is-now { grid-area: 1 / 3; text-align: right; }
.bim-exr-pricing .bim-exr-price { grid-area: 2 / 3; text-align: right; }
.bim-exr-mfoot { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--exr-row); }
.bim-exr-off { display: flex; align-items: center; justify-content: center; min-width: 0; }
.bim-exr-off::before, .bim-exr-off::after { content: ""; flex: 1 1 0; min-width: 0; height: 10px; }
.bim-exr-off::before { background: linear-gradient(90deg, rgba(174,185,200,0), #AEB9C8) left center / 100% 1.5px no-repeat; }
.bim-exr-off::after { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='10' viewBox='0 0 7 10'%3E%3Cpath d='M1.2 1.2 5.6 5l-4.4 3.8' fill='none' stroke='%23AEB9C8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right center / 7px 10px no-repeat, linear-gradient(#AEB9C8, #AEB9C8) left center / calc(100% - 2px) 1.5px no-repeat; }
.bim-exr .bim-exr-off b { flex: none; margin: 0 6px; padding: 5px 10px 4px; border-radius: 0; background: var(--exr-teal); color: #fff; font-family: var(--exr-cond); font-weight: 800; font-size: 15px; line-height: 1; letter-spacing: .02em; white-space: nowrap; box-shadow: 0 2px 6px rgba(22,112,127,.28); }
.bim-exr-from { display: block; font-family: var(--exr-cond); font-size: 13px; color: var(--exr-muted); text-transform: uppercase; letter-spacing: .06em; line-height: 1; }
.bim-exr .bim-exr-was { font-family: var(--exr-cond); font-weight: 600; font-size: 19px; color: var(--exr-muted); line-height: 1.05; text-decoration: line-through; white-space: nowrap; }
.bim-exr-price { font-family: var(--exr-cond); font-weight: 800; font-size: 28px; color: var(--exr-ink); line-height: 1.05; white-space: nowrap; }
.bim-exr-price.is-muted { color: var(--exr-muted); font-size: 21px; line-height: 1.4; white-space: normal; }
.bim-exr-empty { text-align: center; background: #fff; border-radius: 0; box-shadow: var(--exr-shadow); padding: 40px 24px; margin: 26px auto 0; max-width: 720px; }
.bim-exr .bim-exr-empty h2 { font-family: var(--exr-cond); font-weight: 800; font-size: 24px; margin: 0 0 8px; color: var(--exr-ink); }
.bim-exr-empty .bim-exr-h1 { margin-bottom: 10px; }

/* Size chart (size-range-row), the first step of the enquiry form, in compact rows: the size with a
   radio circle, the rider heights it fits as a bar on a common axis, and the number in stock. Each size
   in stock is a row the customer clicks to choose it (the row is the label of a radio button); sold-out
   sizes are shown dimmed. No boxes: a hairline between the rows, a tint under the pointer and under the
   size chosen. */
.bim-exr-chart { margin: 0; }
.bim-exr-axis, .bim-exr .bim-exr-srow { display: grid; grid-template-columns: 60px minmax(0, 1fr) 88px; align-items: center; }
.bim-exr-axis { height: 18px; position: relative; }
.bim-exr-axis-t { position: relative; height: 100%; margin-right: 10px; }
.bim-exr-axis-t span { position: absolute; bottom: 4px; transform: translateX(-50%); font-size: 10.5px; font-weight: 600; color: var(--exr-sub); line-height: 1; }
.bim-exr-axis-t span.is-minor { display: none; }
.bim-exr .bim-exr-srow { --exr-rowbg: #fff; position: relative; width: 100%; min-height: 46px; margin: 0; padding: 0; background: var(--exr-rowbg); border: 0; border-radius: 0; box-shadow: none; color: inherit; font-family: var(--exr-sans); font-size: 15px; font-weight: 400; line-height: 1.25; text-transform: none; letter-spacing: normal; transition: background .15s; }
.bim-exr .bim-exr-srow + .bim-exr-srow { border-top: 1px solid #E6EAEF; }
.bim-exr label.bim-exr-srow { cursor: pointer; }
.bim-exr label.bim-exr-srow:hover { --exr-rowbg: #F4F6F9; }
.bim-exr-srow.is-disabled { opacity: .45; }
/* The radio button stays in the page for the keyboard, screen readers and the browser's "choose one"
   check; the row draws it as a circle before the size. */
.bim-exr .bim-exr-sradio { position: absolute; left: 12px; top: 14px; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; pointer-events: none; }
.bim-exr .bim-exr-srow:has(.bim-exr-sradio:checked) { --exr-rowbg: var(--exr-info); }
.bim-exr .bim-exr-srow:has(.bim-exr-sradio:focus-visible) { outline: 2px solid var(--exr-teal-l); outline-offset: -2px; }
.bim-exr-slab { display: flex; align-items: center; gap: 7px; padding-left: 10px; font-weight: 700; font-size: 15px; color: var(--exr-navy); white-space: nowrap; }
.bim-exr label.bim-exr-srow .bim-exr-slab::before { content: ""; flex: none; box-sizing: border-box; width: 16px; height: 16px; border: 1.5px solid #8D9AAD; border-radius: 50%; background: #fff; transition: border-color .15s; }
.bim-exr label.bim-exr-srow:hover .bim-exr-slab::before { border-color: var(--exr-navy); }
.bim-exr .bim-exr-sradio:checked ~ .bim-exr-slab::before { border: 5px solid var(--exr-navy); }
.bim-exr-srow.is-disabled .bim-exr-slab { padding-left: 33px; }
.bim-exr-track { position: relative; height: 44px; display: block; margin-right: 10px; }
.bim-exr-track i { position: absolute; top: 8px; bottom: 8px; width: 1px; background: #E3E8EE; }
.bim-exr-track i:not(.is-major) { display: none; }
.bim-exr-bar { position: absolute; top: 8px; height: 12px; background: var(--exr-navy); display: block; }
.bim-exr-cm { position: absolute; top: 24px; font-style: normal; font-size: 11px; font-weight: 600; color: var(--exr-teal); line-height: 1.1; white-space: nowrap; background: var(--exr-rowbg, #fff); padding: 0 2px; transition: background .15s; }
.bim-exr-cm.is-end { display: none; }
.bim-exr-cm.is-both { display: block; }
.bim-exr-cm.is-none { left: 4px; top: 16px; color: var(--exr-muted); font-weight: 400; }
.bim-exr-sav { text-align: right; padding-right: 6px; line-height: 1.2; }
.bim-exr-sav strong { display: block; font-family: var(--exr-cond); font-weight: 700; font-size: 13.5px; color: var(--exr-ink); white-space: nowrap; }
/* "✓ Selected" under the stock of the chosen size. */
.bim-exr-picked { display: none; margin-top: 2px; font-family: var(--exr-cond); font-weight: 700; font-size: 11px; color: var(--exr-navy); text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.bim-exr-picked::before { content: "\2713\00a0"; }
.bim-exr .bim-exr-sradio:checked ~ .bim-exr-sav .bim-exr-picked { display: block; }
.bim-exr-none { font-family: var(--exr-cond); font-weight: 700; font-size: 11.5px; color: var(--exr-sold); text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.bim-exr-chart.is-plain .bim-exr-track { height: 40px; }

/* ---------------------------------------------------------------------
 * The enquiry: a section of its own, so that nobody takes the form for
 * more information about the bike. A navy band across the whole window
 * opens it (why to ask now, and what asking brings); below the band the
 * form has a background of its own down to the footer, and the form
 * itself is a raised white panel, square-cornered like everything here,
 * that rises out of the band. Inside, three numbered steps — the size, the
 * delivery, the contact details — stand side by side on a wide screen and
 * one under the other on a phone, kept compact so the whole form fits on
 * a screen, and plain: space rather than lines between the steps, no boxes
 * round the choices, and boxes to type in drawn as a tint with a line under
 * it. Colour reaches the window's edges as a border image set out
 * sideways, which never widens the page and, unlike a clipped shadow, has
 * no lighter hairline at its edge.
 * ------------------------------------------------------------------ */
.bim-exr .bim-exr-h2 { font-family: var(--exr-cond); font-weight: 800; font-size: 26px; line-height: 1.2; color: var(--exr-ink); text-align: center; text-transform: none; letter-spacing: 0; margin: 46px 0 14px; }
.bim-exr--model { padding-bottom: 0; }
.bim-exr-enq { --exr-tint: #DFE5EE; --exr-rise: 48px; margin-top: 46px; }
/* The form takes the focus once the button has glided down to it (exrental.js): no ring around it all. */
.bim-exr-enq:focus { outline: none; }
.bim-exr-enq-band { background: var(--exr-navy); border-image: conic-gradient(var(--exr-navy) 0 0) fill 0 / / 0 100vw; padding: 40px 24px 38px; text-align: center; }
.bim-exr .bim-exr-enq-band .bim-exr-h2 { color: #fff; font-size: 25px; margin: 0; }
.bim-exr .bim-exr-enq-sub { font-family: var(--exr-cond); font-size: 15.5px; line-height: 1.45; color: rgba(255,255,255,.84); margin: 10px 0 0; }
.bim-exr-enq-body { background: linear-gradient(var(--exr-navy) 0 var(--exr-rise), var(--exr-tint) var(--exr-rise)); border-image: linear-gradient(var(--exr-navy) 0 var(--exr-rise), var(--exr-tint) var(--exr-rise)) fill 0 / / 0 100vw; padding: 0 0 48px; }
.bim-exr-enq-body > .bim-exr-info { margin: 0 auto 22px; box-shadow: var(--exr-shadow); }
.bim-exr-enq-body > .bim-exr-nothing { margin: 0 auto; }
.bim-exr .bim-exr-mail { color: var(--exr-navy); font-weight: 700; text-decoration: underline; }
.bim-exr-nothing { max-width: 720px; margin: 16px auto 0; background: #fff; border-radius: 0; box-shadow: var(--exr-shadow); padding: 26px 22px; text-align: center; font-size: 15px; line-height: 1.65; color: var(--exr-sub); }
.bim-exr-form.is-sending .bim-exr-cta { opacity: .6; cursor: progress; }

/* The form panel and its three steps */
.bim-exr-form { max-width: 1030px; margin: 0 auto; background: #fff; border-radius: 0; box-shadow: var(--exr-raise); padding: 28px 28px 24px; counter-reset: bim-exr-q; }
.bim-exr-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bim-exr-form > .bim-exr-info { max-width: none; margin: 0 0 20px; }
.bim-exr-fsteps { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.05fr) minmax(0, .75fr); align-items: stretch; }
.bim-exr .bim-exr-form fieldset.bim-exr-field { border: 0; margin: 0; padding: 0 22px; min-width: 0; }
.bim-exr .bim-exr-form fieldset.bim-exr-field:first-child { padding-left: 0; }
.bim-exr .bim-exr-form fieldset.bim-exr-field:last-child { padding-right: 0; }
/* A thin line between each two steps. */
.bim-exr .bim-exr-form fieldset.bim-exr-field + fieldset.bim-exr-field { border-left: 1px solid #D9DFE7; }
.bim-exr .bim-exr-form p.bim-exr-field { margin: 0 0 11px; }
.bim-exr .bim-exr-form fieldset > p.bim-exr-field:last-child { margin-bottom: 0; }
/* Each step opens with its number in a navy square. */
.bim-exr .bim-exr-field legend { counter-increment: bim-exr-q; position: relative; display: block; width: 100%; min-height: 26px; padding: 3px 0 10px 34px; margin: 0; font-family: var(--exr-cond); font-weight: 700; font-size: 15.5px; line-height: 1.3; text-transform: uppercase; letter-spacing: .04em; color: var(--exr-navy); }
.bim-exr .bim-exr-field legend::before { content: counter(bim-exr-q); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 0; background: var(--exr-navy); color: #fff; font-size: 14.5px; line-height: 26px; text-align: center; letter-spacing: 0; }
.bim-exr .bim-exr-field > label:not(.bim-exr-choice) { display: block; font-family: var(--exr-cond); font-weight: 700; font-size: 12.5px; line-height: 1.4; text-transform: uppercase; letter-spacing: .05em; color: var(--exr-label); padding: 0 0 4px; margin: 0; }
.bim-exr-field > small { display: block; margin-top: 4px; font-size: 12px; line-height: 1.45; color: var(--exr-muted); }
/* Delivery: one compact row per choice, its radio button in plain view and its price on the right; as
   in the size chart, a hairline between the rows and a tint under the one chosen. */
.bim-exr .bim-exr-choice { display: flex; gap: 9px; align-items: flex-start; background: #fff; border: 0; border-radius: 0; padding: 9px 8px; margin: 0; font-family: var(--exr-sans); font-weight: 600; font-size: 13.5px; line-height: 1.35; color: var(--exr-ink); text-transform: none; letter-spacing: normal; cursor: pointer; transition: background .15s; }
.bim-exr .bim-exr-choice + .bim-exr-choice { border-top: 1px solid #E6EAEF; }
.bim-exr .bim-exr-choice:hover { background: #F4F6F9; }
.bim-exr .bim-exr-choice input { width: 16px; height: 16px; margin: 1px 0 0; flex: 0 0 auto; accent-color: var(--exr-navy); cursor: pointer; }
.bim-exr .bim-exr-cname { flex: 1 1 auto; min-width: 0; }
.bim-exr .bim-exr-choice small { font-weight: 400; color: var(--exr-sub); }
.bim-exr .bim-exr-choice small.bim-exr-where { display: block; margin: 1px 0 0; font-size: 11.5px; line-height: 1.35; }
.bim-exr .bim-exr-choice small.bim-exr-cprice { flex: none; margin-left: auto; padding-left: 6px; font-weight: 700; font-size: 13px; color: var(--exr-navy); white-space: nowrap; }
.bim-exr .bim-exr-choice:has(input:checked) { background: var(--exr-info); }
/* "Not sure yet": the last choice, set a little apart from the shop's deliveries. */
.bim-exr .bim-exr-choice.is-undecided { margin-top: 8px; }
.bim-exr-form .bim-exr-cnote { margin: 10px 0 0; text-align: left; font-size: 12px; }
/* The address in four boxes: street and number, then postcode and town side by side, then country. It
   opens right under the delivery chosen (exrental.js), in the same tint, so the row and its address read
   as one and nobody misses it; its boxes are white on the tint, under a navy title. */
.bim-exr-address { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 0 8px; background: var(--exr-info); padding: 4px 8px 12px 33px; }
.bim-exr .bim-exr-address + .bim-exr-choice { border-top: 1px solid #E6EAEF; }
.bim-exr-form .bim-exr-address input[type="text"], .bim-exr-form .bim-exr-address input[type="text"]:focus { background: #fff; }
.bim-exr-address-title, .bim-exr-address .bim-exr-a-street, .bim-exr-address .bim-exr-a-country, .bim-exr-anote { grid-column: 1 / -1; }
.bim-exr .bim-exr-address-title { margin: 0 0 8px; font-family: var(--exr-cond); font-weight: 700; font-size: 13.5px; line-height: 1.4; text-transform: uppercase; letter-spacing: .05em; color: var(--exr-navy); }
.bim-exr .bim-exr-form .bim-exr-address p.bim-exr-field { margin: 0 0 7px; }
.bim-exr .bim-exr-form .bim-exr-address p.bim-exr-a-country { margin-bottom: 0; }
.bim-exr .bim-exr-address .bim-exr-field > label { font-size: 11px; color: var(--exr-sub); padding-bottom: 2px; }
.bim-exr-anote { display: block; margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--exr-muted); }
/* The address only once a delivery that is posted is chosen: picking the bike up in person, or not
   being sure yet, needs none. A browser without :has() always shows it, with a word on when to leave
   it empty. */
@keyframes bim-exr-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@supports selector(:has(*)) {
	.bim-exr-form .bim-exr-address { display: none; }
	.bim-exr-form fieldset:has(.bim-exr-choice input:checked:not([data-pickup]):not([data-undecided])) .bim-exr-address { display: grid; animation: bim-exr-open .3s ease-out; }
	.bim-exr-anote { display: none; }
}
/* Boxes to type in: a light tint with a line under it, no frame; the line turns navy under the one being
   filled in. */
.bim-exr-form input[type="text"],
.bim-exr-form input[type="email"],
.bim-exr-form input[type="tel"],
.bim-exr-form textarea { display: block; width: 100%; max-width: 100%; margin: 0; font-family: var(--exr-sans); font-size: 15px; line-height: 1.4; color: var(--exr-ink); background: #F2F4F8; border: 0; border-bottom: 1.5px solid #A9B5C4; border-radius: 0; padding: 9px 11px 8px; box-shadow: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.bim-exr-form input[type="text"]:hover,
.bim-exr-form input[type="email"]:hover,
.bim-exr-form input[type="tel"]:hover,
.bim-exr-form textarea:hover { border-bottom-color: #7D8BA0; }
.bim-exr-form input[type="text"]:focus,
.bim-exr-form input[type="email"]:focus,
.bim-exr-form input[type="tel"]:focus,
.bim-exr-form textarea:focus { outline: none; border-bottom-color: var(--exr-navy); background: #EAF0F8; box-shadow: inset 0 -1px 0 var(--exr-navy); }
.bim-exr-form ::placeholder { color: #8A94A3; opacity: 1; }
.bim-exr-form textarea { resize: vertical; }
.bim-exr-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.bim-exr-fsteps .bim-exr-grid2 { grid-template-columns: 1fr; }
/* Under the steps: the send button in the middle and, under it, small, what is done with the details.
   Room all round the button, so it stands on its own and nothing crowds it. Plain navy, as the button at
   the top of the page: no gradient, glow or shadowed letters in a plain form. */
.bim-exr-submit { display: flex; flex-direction: column; align-items: center; margin: 24px 0 0; padding: 34px 0 12px; text-align: center; }
.bim-exr .bim-exr-form .bim-exr-cta { flex: none; font-size: 21px; padding: 15px 46px; background: var(--exr-navy); border-color: var(--exr-navy); box-shadow: none; text-shadow: none; transition: background-color .15s, border-color .15s; }
.bim-exr .bim-exr-form .bim-exr-cta:hover { background: var(--exr-navy-d); border-color: var(--exr-navy-d); filter: none; box-shadow: none; }
.bim-exr .bim-exr-privacy { display: block; margin: 20px 0 0; font-size: 12px; line-height: 1.5; color: var(--exr-muted); }
/* Too narrow for three columns: the steps go one under the other, the thin line across between them. */
@media (max-width: 860px) {
	.bim-exr-fsteps { grid-template-columns: minmax(0, 1fr); }
	/* Under a step rather than over the next: a fieldset draws its top edge behind its legend. */
	.bim-exr .bim-exr-form fieldset.bim-exr-field { padding: 0 0 24px; margin: 0 0 24px; border-bottom: 1px solid #D9DFE7; }
	.bim-exr .bim-exr-form fieldset.bim-exr-field:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
	.bim-exr .bim-exr-form fieldset.bim-exr-field + fieldset.bim-exr-field { border-left: 0; }
	.bim-exr-fsteps .bim-exr-grid2 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.bim-exr-form { padding: 22px 16px 18px; }
	.bim-exr-fsteps .bim-exr-grid2 { grid-template-columns: 1fr; }
	/* 16px keeps a phone from zooming in on the box being filled in. */
	.bim-exr-form input[type="text"], .bim-exr-form input[type="email"], .bim-exr-form input[type="tel"], .bim-exr-form textarea { font-size: 16px; }
	.bim-exr-submit { align-items: stretch; margin-top: 22px; padding: 26px 0 8px; }
	.bim-exr .bim-exr-form .bim-exr-cta { width: 100%; font-size: 21px; padding: 15px 14px; }
	.bim-exr .bim-exr-privacy { margin-top: 16px; }
}

/* Said and done, or not: the answer the visitor gets after sending */
.bim-exr-info.is-good { background: #E8F6EF; border-left-color: #16805E; }
.bim-exr-info.is-good strong { display: block; color: #16805E; }
.bim-exr-info.is-bad { background: #FBEDEA; border-left-color: var(--exr-sold); }
.bim-exr-info.is-bad strong { display: block; color: var(--exr-sold); }
.bim-exr-info ul { margin: 4px 0 0; padding-left: 20px; }
.bim-exr-info li { margin: 2px 0; }

@media (max-width: 640px) {
	.bim-exr .bim-exr-h1 { font-size: 27px; }
	.bim-exr-enq { --exr-rise: 40px; margin-top: 36px; }
	.bim-exr-enq-band { padding: 32px 20px 30px; }
	.bim-exr .bim-exr-enq-band .bim-exr-h2 { font-size: 23px; }
	.bim-exr .bim-exr-enq-sub { font-size: 15px; }
	.bim-exr-enq-body { padding-bottom: 36px; }
	.bim-exr-card { padding: 22px 18px 18px; }
	.bim-exr { --exr-lift: 26px; }
	.bim-exr .bim-exr-specs { padding: 22px 18px 20px; }
	.bim-exr .bim-exr-cta { font-size: 23px; padding: 14px 26px; }
}
@media (prefers-reduced-motion: reduce) { .bim-exr * { transition: none !important; animation: none !important; } }