.bath-float { position: fixed; right: var(--space-5); bottom: max(var(--space-5), env(safe-area-inset-bottom)); z-index: var(--z-4); width: calc(var(--space-9) * 3 + var(--space-5)); background: var(--c-tint); border: var(--bd) solid var(--c-line); box-shadow: 0 var(--space-2) var(--space-5) var(--c-veil); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(var(--space-4)); transition: opacity var(--t-1) var(--ease), transform var(--t-1) var(--ease), visibility var(--t-1); }
.bath-float.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.bath-float[hidden] { display: none; }
.bath-float__link { display: grid; grid-template-columns: var(--space-9) minmax(0, 1fr); overflow: hidden; color: var(--c-accent); }
.bath-float picture { min-height: 100%; }
.bath-float img { height: 100%; object-fit: cover; }
.bath-float__copy { min-width: 0; text-align: left; }
.bath-float__text { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--space-2); }
.bath-float__eyebrow { grid-column: 1 / -1; }
.bath-float__symbol { grid-column: 1; grid-row: 2 / span 2; align-self: center; width: var(--space-6); height: var(--space-6); margin: var(--space-2) 0 var(--space-2) var(--space-3); fill: none; stroke: var(--c-accent-2); stroke-width: var(--ext-stroke); stroke-linecap: round; stroke-linejoin: round; }
.bath-float__eyebrow { padding: var(--space-1) var(--space-3); background: var(--c-accent-2); color: var(--c-bg); font-size: var(--fs-2); font-weight: var(--fw-medium); line-height: var(--lh-2); letter-spacing: var(--ls-1); white-space: nowrap; }
.bath-float strong { grid-column: 2; margin: var(--space-2) var(--space-3) 0 0; font-family: var(--ff-serif); font-size: var(--fs-5); font-weight: var(--fw-medium); line-height: var(--lh-2); white-space: nowrap; }
.bath-float__service { grid-column: 2; padding: 0 var(--space-3) var(--space-2) 0; font-size: var(--fs-2); line-height: var(--lh-2); }
.bath-float__close { position: absolute; top: calc(var(--space-3) * -1); right: calc(var(--space-3) * -1); display: flex; align-items: center; justify-content: center; width: var(--space-5); height: var(--space-5); padding: 0; border: var(--bd) solid var(--c-line); border-radius: var(--space-5); background: var(--c-bg); color: var(--c-accent); font-size: var(--fs-3); line-height: var(--lh-1); box-shadow: 0 var(--space-1) var(--space-2) var(--c-veil); cursor: pointer; }
.bath-float__link:is(:hover,:focus-visible) { background: var(--c-tint); color: var(--c-accent); }
.bath-float__close:is(:hover,:focus-visible) { background: var(--c-accent); color: var(--c-bg); }
@media (max-width: 768px) { .bath-float { width: calc(var(--space-9) * 2 + var(--space-6) + var(--space-5) + var(--space-3)); right: var(--space-4); bottom: max(var(--space-4), env(safe-area-inset-bottom)); } .bath-float__eyebrow { padding: var(--space-1) var(--space-2); font-size: var(--fs-1); } .bath-float strong { margin: var(--space-2) var(--space-2) 0 0; font-size: var(--fs-4); } .bath-float__service { padding: 0 var(--space-2) var(--space-2) 0; } .bath-float__symbol { width: var(--space-5); height: var(--space-5); margin-left: var(--space-2); } .bath-float__link { grid-template-columns: calc(var(--space-8) + var(--space-4)) minmax(0, 1fr); } }

@media (prefers-reduced-motion: reduce) { .bath-float { transition: none; transform: none; } }

.bath-float__link:is(:hover, :focus-visible) .bath-float__service { text-decoration: underline; text-underline-offset: var(--space-1); }
.bath-float__link:focus-visible { outline: var(--bd-2) solid var(--c-accent); outline-offset: calc(var(--bd-2) * -1); }
html:has(.bath-float.is-visible) { scroll-padding-bottom: calc(var(--space-9) + var(--space-5)); }