/* BI Bathrooms landing page (/bathrooms/), editorial layout */
.bi-bv { --bv-head: #161616; --bv-body: #595959; --bv-link: #9e8883; background: #fff; }
html:has(.bi-bv) { scroll-behavior: smooth; }

.bi-post.bi-bv h2, .bi-post.bi-bv h3 { font-family: inherit; text-transform: none; letter-spacing: 0; }
.bi-post.bi-bv h2 { font-size: 36px; line-height: 1.2; font-weight: 400; color: var(--bv-head); margin: 0 0 20px; }
.bi-post.bi-bv p { color: var(--bv-body); }
.bi-post.bi-bv p a { color: var(--bv-head); text-decoration: none; border-bottom: 1px solid var(--bv-link); }
.bi-post.bi-bv p a:hover { color: var(--bv-link); }
.bi-post.bi-bv a.bi-bv-link { display: inline-block; font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--bv-link); text-decoration: none; border-bottom: 2px solid var(--bv-link); padding-bottom: 1px; transition: color .15s, border-color .15s; }
.bi-post.bi-bv a.bi-bv-link:hover { color: var(--bv-head); border-color: var(--bv-head); }
.bi-bv-section { padding: 96px 0; }

/* hero */
.bi-bv-hero { position: relative; display: flex; flex-direction: column; min-height: min(88vh, 800px); overflow: hidden; background: #2a2724; color: #fff; }
.bi-bv-hero-media { position: absolute; inset: 0; z-index: 0; }
.bi-bv-hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.bi-bv-hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,17,15,.6) 0, rgba(18,17,15,0) 28%), linear-gradient(90deg, rgba(18,17,15,.62) 0, rgba(18,17,15,.25) 45%, rgba(18,17,15,0) 70%), linear-gradient(0deg, rgba(18,17,15,.7) 0, rgba(18,17,15,.2) 40%, rgba(18,17,15,0) 62%); }
.bi-bv-hero > .inteco-header-transparent-substitute { position: relative; z-index: 1; }
.bi-bv-hero-inner { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; width: 100%; padding-top: 24px; padding-bottom: 64px; }
.bi-bv-crumbs { display: flex; gap: 8px; font-size: 13px; color: rgba(255,255,255,.7); }
.bi-post .bi-bv-crumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.bi-post .bi-bv-crumbs a:hover { color: #fff; }
.bi-bv-hero-copy { margin-top: auto; padding-top: 80px; max-width: 760px; }
.bi-post.bi-bv .bi-bv-hero h1 { font-family: inherit; font-size: 58px; line-height: 1.08; font-weight: 300; letter-spacing: -.012em; color: #fff; margin: 0 0 20px; text-transform: none; }
.bi-post.bi-bv .bi-bv-hero-copy p { font-size: 19px; line-height: 1.6; color: rgba(255,255,255,.86); margin: 0 0 32px; max-width: 540px; }
.bi-bv-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.bi-post.bi-bv a.bi-bv-btn { display: inline-block; padding: 16px 30px; font-size: 15px; font-weight: 700; line-height: 1.2; color: var(--bv-head); background: #fff; border: 1px solid #fff; text-decoration: none; transition: background .15s, color .15s; }
.bi-post.bi-bv a.bi-bv-btn:hover { background: transparent; color: #fff; }
.bi-post.bi-bv a.bi-bv-hero-call { font-size: 15px; color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.5); }
.bi-post.bi-bv a.bi-bv-hero-call:hover { border-color: #fff; }
.bi-post.bi-bv .bi-bv-hero-credit { position: absolute; right: 24px; bottom: 66px; margin: 0; font-size: 12px; letter-spacing: .03em; color: rgba(255,255,255,.6); }

/* intro + first form */
.bi-bv-intro { padding: 104px 0 96px; }
.bi-bv-intro-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 96px; align-items: start; }
.bi-post.bi-bv .bi-bv-intro h2 { max-width: 560px; margin-bottom: 32px; }
.bi-post.bi-bv .bi-bv-lede { font-size: 22px; line-height: 1.6; font-weight: 300; color: var(--bv-head); margin: 0 0 28px; }
.bi-post.bi-bv .bi-bv-intro-copy p:not(.bi-bv-lede) { font-size: 16px; line-height: 1.8; margin: 0 0 16px; max-width: 620px; }

.bi-bv .bi-lead { margin: 0; border: 0; }
.bi-post.bi-bv .bi-lead .bi-lead-kicker:empty { display: none; }
.bi-bv-intro-form .bi-lead { display: block; background: var(--bi-stone); padding: 40px 40px 32px; }
.bi-post.bi-bv .bi-bv-intro-form .bi-lead-title { font-size: 26px; line-height: 1.25; font-weight: 400; color: var(--bv-head); margin: 0 0 10px; }
.bi-post.bi-bv .bi-bv-intro-form .bi-lead-text { font-size: 15px; line-height: 1.65; margin: 0 0 24px; }
.bi-bv-intro-form .bi-lead-fields { grid-template-columns: 1fr; gap: 10px; }
.bi-bv-intro-form .bi-lead-actions { flex-direction: column; align-items: stretch; }
.bi-bv-intro-form .bi-lead-submit { flex: none; }
.bi-post.bi-bv .bi-lead input[type="text"], .bi-post.bi-bv .bi-lead input[type="email"], .bi-post.bi-bv .bi-lead input[type="tel"] { background: #fff; border-color: #e2dbd1; }
.bi-post.bi-bv .bi-lead input[type="text"]:focus, .bi-post.bi-bv .bi-lead input[type="email"]:focus, .bi-post.bi-bv .bi-lead input[type="tel"]:focus { border-color: var(--bv-head); }
.bi-post.bi-bv .bi-lead input[type="submit"] { background: var(--bv-head); border-color: var(--bv-head); letter-spacing: .01em; }
.bi-post.bi-bv .bi-lead input[type="submit"]:hover { background: #000; border-color: #000; }
.bi-post.bi-bv .bi-lead .bi-lead-alt { font-size: 14px; color: var(--bv-body); }
.bi-post.bi-bv .bi-lead .bi-lead-alt a { color: var(--bv-head); border-bottom: 1px solid var(--bv-link); }

/* rooms index */
.bi-bv-rooms { padding-top: 24px; }
.bi-post.bi-bv .bi-bv-rooms h2 { margin-bottom: 40px; }
.bi-bv-index { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--bi-line); }
.bi-bv-index li { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 5fr) 260px; gap: 56px; align-items: center; margin: 0; padding: 36px 0; border-bottom: 1px solid var(--bi-line); }
.bi-post.bi-bv .bi-bv-index h3 { font-size: 28px; line-height: 1.25; font-weight: 300; color: var(--bv-head); margin: 0; }
.bi-post.bi-bv .bi-bv-index p { font-size: 16px; line-height: 1.75; margin: 0 0 14px; }
.bi-bv-index-img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--bi-stone); }
.bi-bv-index-img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.bi-bv-index li:hover .bi-bv-index-img img { transform: scale(1.04); }

/* shared two-column: heading left, content right */
.bi-bv-split { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 96px; align-items: start; }
.bi-post.bi-bv .bi-bv-split-head p { font-size: 16px; line-height: 1.8; margin: 0 0 22px; }

/* costs */
.bi-bv-costs { background: var(--bi-stone); }
.bi-post.bi-bv table.bi-bv-prices { width: 100%; margin: 0; border: 0; border-collapse: collapse; background: none; }
.bi-post.bi-bv .bi-bv-prices tr, .bi-post.bi-bv .bi-bv-prices tr:nth-child(odd), .bi-post.bi-bv .bi-bv-prices tr:nth-child(even) { background: none; }
.bi-bv-prices thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bi-post.bi-bv .bi-bv-prices th, .bi-post.bi-bv .bi-bv-prices td { padding: 28px 0; border: 0; border-bottom: 1px solid #ddd4c8; background: none; vertical-align: baseline; }
.bi-post.bi-bv .bi-bv-prices tbody tr:first-child th, .bi-post.bi-bv .bi-bv-prices tbody tr:first-child td { border-top: 1px solid #ddd4c8; }
.bi-post.bi-bv .bi-bv-prices th { text-align: left; font-size: 20px; line-height: 1.35; font-weight: 400; color: var(--bv-head); }
.bi-bv-prices th span { display: block; margin-top: 6px; font-size: 15px; line-height: 1.55; color: var(--bv-body); }
.bi-post.bi-bv .bi-bv-prices td { text-align: right; padding-left: 32px; white-space: nowrap; font-size: 22px; font-weight: 300; color: var(--bv-head); }
.bi-post.bi-bv .bi-bv-prices.is-guide td { width: 38%; white-space: normal; font-size: 19px; line-height: 1.35; }
.bi-post.bi-bv .bi-bv-note { font-size: 13px; line-height: 1.6; color: #8a857d; margin: 18px 0 0; }

/* process */
.bi-bv-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 56px; }
.bi-bv-steps li { margin: 0; padding-top: 24px; border-top: 1px solid var(--bi-line); }
.bi-post.bi-bv .bi-bv-steps h3 { font-size: 19px; line-height: 1.4; font-weight: 600; color: var(--bv-head); margin: 0 0 10px; }
.bi-post.bi-bv .bi-bv-steps p { font-size: 16px; line-height: 1.75; margin: 0; }

/* gallery */
.bi-bv-gallery { padding-top: 24px; }
.bi-bv-gallery-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 32px; margin-bottom: 36px; }
.bi-post.bi-bv .bi-bv-gallery-head h2 { margin: 0; }
.bi-bv-mosaic { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 36px 24px; }
.bi-bv-mosaic figure { grid-column: span 4; display: flex; flex-direction: column; margin: 0; }
.bi-bv-mosaic figure.is-tall { grid-column: 1 / span 7; grid-row: span 2; }
.bi-bv-mosaic figure:nth-child(2), .bi-bv-mosaic figure:nth-child(3) { grid-column: span 5; }
.bi-bv-mosaic figure > div { aspect-ratio: 3 / 2; overflow: hidden; background: var(--bi-stone); }
.bi-bv-mosaic figure.is-tall > div { flex: 1; aspect-ratio: auto; min-height: 0; position: relative; }
.bi-bv-mosaic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bi-bv-mosaic figure.is-tall img { position: absolute; inset: 0; }
.bi-bv-mosaic figcaption { margin-top: 12px; font-size: 13px; line-height: 1.4; color: #8a857d; }

/* brands */
.bi-bv-brands { text-align: center; padding-top: 72px; }
.bi-bv-brands .bi-wrap, .bi-bv-reading-grid { --bv-gutter: 48px; background: linear-gradient(var(--bi-line), var(--bi-line)) no-repeat center top / calc(100% - var(--bv-gutter)) 1px; }
.bi-bv-brands .bi-wrap { padding-top: 88px; }
.bi-post.bi-bv .bi-bv-brands h2 { margin-bottom: 32px; }
.bi-post.bi-bv .bi-bv-brandlist { max-width: 960px; margin: 0 auto 28px; font-size: 24px; line-height: 1.8; font-weight: 300; color: var(--bv-head); }
.bi-bv-brandlist span { color: #c9bfb3; }
.bi-post.bi-bv .bi-bv-brandnote { max-width: 560px; margin: 0 auto; font-size: 16px; line-height: 1.75; }

/* quote */
.bi-bv-quote { background: var(--bi-stone); padding: 104px 0; text-align: center; }
.bi-bv-quote figure { max-width: 880px; margin: 0 auto; }
.bi-post.bi-bv .bi-bv-quote blockquote { margin: 0 0 28px; padding: 0; border: 0; background: none; font-size: 30px; line-height: 1.45; font-weight: 300; font-style: normal; color: var(--bv-head); quotes: none; }
.bi-bv-quote blockquote::before, .bi-bv-quote blockquote::after { display: none; }
.bi-bv-quote figcaption { font-size: 15px; font-weight: 700; color: var(--bv-head); }
.bi-bv-quote figcaption span { font-weight: 400; color: #8a857d; margin-left: 6px; }

/* visit */
.bi-bv-visit-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 88px; align-items: center; }
.bi-bv-visit-photo { aspect-ratio: 5 / 4; overflow: hidden; background: var(--bi-stone); }
.bi-bv-visit-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bi-post.bi-bv .bi-bv-visit-copy > p { font-size: 16px; line-height: 1.8; margin: 0 0 28px; }
.bi-bv-visit-copy dl { margin: 0 0 28px; padding: 0; }
.bi-bv-visit-copy dl div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-top: 1px solid var(--bi-line); }
.bi-bv-visit-copy dl div:last-child { border-bottom: 1px solid var(--bi-line); }
.bi-bv-visit-copy dt { margin: 0; font-size: 15px; font-weight: 700; color: var(--bv-head); }
.bi-bv-visit-copy dd { margin: 0; font-size: 16px; line-height: 1.7; color: var(--bv-body); }
.bi-post.bi-bv .bi-bv-visit-copy dd a:not(.bi-bv-link) { color: var(--bv-head); text-decoration: none; border-bottom: 1px solid var(--bv-link); }
.bi-bv-visit-copy dd .bi-bv-link { margin-top: 8px; }
.bi-post.bi-bv .bi-bv-areas { font-size: 14px; line-height: 1.7; color: #8a857d; margin: 0; }

/* faq */
.bi-bv-faq { padding-top: 24px; }
.bi-bv-accordion details { border-bottom: 1px solid var(--bi-line); }
.bi-bv-accordion details:first-child { border-top: 1px solid var(--bi-line); }
.bi-bv-accordion summary { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 24px 0; cursor: pointer; list-style: none; }
.bi-bv-accordion summary::-webkit-details-marker { display: none; }
.bi-bv-accordion summary::after { content: "+"; flex: none; font-size: 26px; line-height: 1; font-weight: 300; color: var(--bv-link); }
.bi-bv-accordion details[open] summary::after { content: "\2212"; }
.bi-post.bi-bv .bi-bv-accordion h3 { font-size: 19px; line-height: 1.45; font-weight: 600; color: var(--bv-head); margin: 0; }
.bi-bv-accordion summary:hover h3 { color: var(--bv-link); }
.bi-bv-accordion details > div { padding: 0 56px 28px 0; }
.bi-post.bi-bv .bi-bv-accordion p { font-size: 16px; line-height: 1.8; margin: 0 0 14px; }

/* further reading */
.bi-bv-reading { padding: 24px 0 88px; }
.bi-bv-reading-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 96px; padding-top: 56px; }
.bi-post.bi-bv .bi-bv-reading h2 { font-size: 19px; line-height: 1.4; font-weight: 600; margin: 0 0 18px; }
.bi-bv-reading ul { list-style: none; margin: 0; padding: 0; }
.bi-bv-reading ul.is-two { columns: 2; column-gap: 48px; }
.bi-bv-reading li { margin: 0 0 12px; break-inside: avoid; }
.bi-post.bi-bv .bi-bv-reading a { font-size: 16px; line-height: 1.5; color: var(--bv-body); text-decoration: none; border-bottom: 1px solid var(--bi-line); transition: color .15s, border-color .15s; }
.bi-post.bi-bv .bi-bv-reading a:hover { color: var(--bv-head); border-color: var(--bv-link); }

/* closing form */
.bi-lead-band.bi-bv-band { background: var(--bi-stone); padding: 104px 0; }
.bi-post.bi-bv .bi-bv-band .bi-lead-title { font-size: 36px; line-height: 1.2; font-weight: 300; color: var(--bv-head); margin: 0 0 16px; }
.bi-post.bi-bv .bi-bv-band .bi-lead-text { font-size: 16px; line-height: 1.8; color: var(--bv-body); }
.bi-bv-band .bi-lead-form { background: #fff; padding: 36px 36px 28px; }

@media (max-width: 1100px) {
  .bi-post.bi-bv .bi-bv-hero h1 { font-size: 50px; }
  .bi-bv-intro-grid, .bi-bv-split, .bi-bv-reading-grid { gap: 56px; }
  .bi-bv-index li { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) 200px; gap: 32px; }
  .bi-post.bi-bv .bi-bv-index h3 { font-size: 24px; }
  .bi-bv-visit-grid { gap: 56px; }
}

@media (max-width: 900px) {
  .bi-post.bi-bv .bi-bv-hero h1 { font-size: 44px; }
  .bi-bv-intro-grid, .bi-bv-split, .bi-bv-visit-grid, .bi-bv-reading-grid { grid-template-columns: 1fr; gap: 40px; }
  .bi-bv-index li { grid-template-columns: minmax(0, 1fr) 180px; grid-template-rows: auto 1fr; gap: 12px 32px; align-items: start; }
  .bi-bv-index h3 { grid-column: 1; grid-row: 1; }
  .bi-bv-index-text { grid-column: 1; grid-row: 2; }
  .bi-bv-index-img { grid-column: 2; grid-row: 1 / span 2; }
}

@media (max-width: 760px) {
  .bi-bv-brands .bi-wrap, .bi-bv-reading-grid { --bv-gutter: 40px; }
  .bi-post.bi-bv h2 { font-size: 28px; }
  .bi-bv-section { padding: 64px 0; }
  .bi-bv-hero { min-height: 620px; }
  .bi-bv-hero-media img { object-position: 64% center; }
  .bi-bv-hero-media::after { background: linear-gradient(180deg, rgba(18,17,15,.6) 0, rgba(18,17,15,0) 22%), linear-gradient(0deg, rgba(18,17,15,.85) 0, rgba(18,17,15,.45) 45%, rgba(18,17,15,0) 72%); }
  .bi-bv-hero-inner { padding-bottom: 40px; }
  .bi-post.bi-bv .bi-bv-hero h1 { font-size: 36px; line-height: 1.12; }
  .bi-post.bi-bv .bi-bv-hero-copy p { font-size: 17px; margin-bottom: 26px; }
  .bi-post.bi-bv .bi-bv-hero-credit { display: none; }
  .bi-bv-intro { padding: 64px 0; }
  .bi-post.bi-bv .bi-bv-lede { font-size: 19px; }
  .bi-bv-intro-form .bi-lead { margin: 0 -20px; padding: 32px 20px 26px; }
  .bi-bv-rooms, .bi-bv-gallery, .bi-bv-faq { padding-top: 8px; }
  .bi-bv-index li { grid-template-columns: 1fr; grid-template-rows: none; gap: 14px; padding: 28px 0; }
  .bi-bv-index h3, .bi-bv-index-text, .bi-bv-index-img { grid-column: auto; grid-row: auto; }
  .bi-bv-index-img { order: -1; aspect-ratio: 16 / 10; }
  .bi-post.bi-bv .bi-bv-prices th { font-size: 17px; }
  .bi-bv-prices th span { font-size: 14px; }
  .bi-post.bi-bv .bi-bv-prices td { font-size: 17px; padding-left: 16px; }
  .bi-post.bi-bv .bi-bv-prices th, .bi-post.bi-bv .bi-bv-prices td { padding: 20px 0; }
  .bi-bv-steps { grid-template-columns: 1fr; gap: 28px; }
  .bi-bv-mosaic { grid-template-columns: 1fr 1fr; gap: 24px 12px; }
  .bi-bv-mosaic figure, .bi-bv-mosaic figure:nth-child(2), .bi-bv-mosaic figure:nth-child(3) { grid-column: span 1; }
  .bi-bv-mosaic figure.is-tall { grid-column: 1 / -1; grid-row: auto; }
  .bi-bv-mosaic figure.is-tall > div { flex: none; aspect-ratio: 4 / 3; }
  .bi-bv-mosaic figure:last-child { grid-column: 1 / -1; }
  .bi-bv-mosaic figure:last-child > div { aspect-ratio: 16 / 10; }
  .bi-post.bi-bv .bi-leadbar .bi-leadbar-cta { background: var(--bv-head); border-color: var(--bv-head); }
  .bi-bv-brands { padding-top: 40px; }
  .bi-bv-brands .bi-wrap { padding-top: 56px; }
  .bi-post.bi-bv .bi-bv-brandlist { font-size: 19px; }
  .bi-bv-quote { padding: 64px 0; }
  .bi-post.bi-bv .bi-bv-quote blockquote { font-size: 22px; }
  .bi-bv-visit-copy dl div { grid-template-columns: 1fr; gap: 4px; }
  .bi-post.bi-bv .bi-bv-accordion h3 { font-size: 17px; }
  .bi-bv-accordion details > div { padding-right: 0; }
  .bi-bv-reading ul.is-two { columns: 1; }
  .bi-lead-band.bi-bv-band { padding: 64px 0 88px; }
  .bi-post.bi-bv .bi-bv-band .bi-lead-title { font-size: 28px; }
  .bi-bv-band .bi-lead-form { padding: 26px 20px 22px; margin: 0 -20px; }
}