/* Bottles begin at rest. The physics canvas loads only near the footer. */
.footer { padding-bottom: 270px; overflow: hidden; }
.footer-columns { margin-top: 44px; }
.footer > .footer-columns { position: relative; z-index: 2; }
.footer-bottle-display {
  position: absolute;
  z-index: 1;
  right: var(--footer-play-right, clamp(310px, 23%, 430px));
  top: 0;
  bottom: 24px;
  left: var(--footer-play-left, clamp(310px, 23%, 430px));
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y;
  background: transparent;
}
.footer-bottle-display.is-dragging { cursor: grabbing; }
.footer-bottle-display:focus-visible { outline: 2px solid #aaa; outline-offset: -3px; }
.footer-bottle-display canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.footer-bottle-fallback { position: absolute; inset: 0; pointer-events: none; }
.footer-bottle-display.is-ready .footer-bottle-fallback { display: none; }
.footer-bottle-display .bottle-retry { z-index: 2; }
.footer-bottle {
  position: absolute;
  bottom: var(--bottom, -8px);
  left: var(--left);
  display: block;
  width: clamp(158px, 12vw, 238px);
  height: 274px;
  object-fit: contain;
  transform: translateX(-50%) rotate(var(--turn));
  transform-origin: 50% 85%;
  filter: brightness(.84) drop-shadow(0 12px 16px #000b);
}
.footer-bottle:nth-child(1) { --left: 19%; --turn: -9deg; }
.footer-bottle:nth-child(2) { --left: 29%; --turn: -3deg; }
.footer-bottle:nth-child(3) { --left: 40%; --turn: 5deg; }
.footer-bottle:nth-child(4) { --left: 50%; --turn: 0deg; }
.footer-bottle:nth-child(5) { --left: 61%; --turn: 7deg; }
.footer-bottle:nth-child(6) { --left: 72%; --turn: -5deg; }
.footer-bottle:nth-child(7) { --left: 82%; --turn: 9deg; }

.footer-social { width: max-content; min-width: 220px; text-align: left; align-items: flex-start; }
.footer-nav { text-align: right; align-items: flex-end; }
.footer-social a { white-space: nowrap; }
.footer-social a:focus-visible { outline: 2px solid #dce9ff; outline-offset: 5px; }
.footer .footer-label { margin:0; color:#929292; font-family:inherit; font-size:12px; font-weight:400; line-height:18px; text-transform:uppercase; letter-spacing:.08em; }
.footer-columns .footer-label { margin-bottom:17px; }
.footer-phone-row { display: flex; align-items: center; gap: 10px; }
.footer-columns .footer-phone-row a { font-size:clamp(24px,2.4vw,32px); line-height:1.12; letter-spacing:-.055em; }
.footer-social .footer-phone-row + a { margin-top: 22px; }
.footer-columns .footer-social > a { color:#a9a9a9; font-size:14px; font-weight:500; line-height:1.4; letter-spacing:0; }
.footer-columns .footer-social > a + a { margin-top:12px; }
.footer-columns .footer-social > a:hover { color:#fff; }
.footer-socials { position:absolute; z-index:2; left:24px; bottom:32px; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.footer-social-icons { display:flex; align-items:center; gap:10px; }
.footer-social-icon { display:grid; place-items:center; width:40px; height:40px; border:1px solid #777; border-radius:5px; background:#000; color:#fff; transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease; }
.footer-social-icon svg { display:block; width:20px; height:20px; }
.footer-social-icon:hover { background:#fff; color:#000; border-color:#fff; transform:scale(1.08); }
.footer-social-icon:is(a):focus-visible { outline:2px solid #fff; outline-offset:3px; }
.footer-contact-cta { position:absolute; z-index:2; right:24px; bottom:32px; display:flex; flex-direction:column; align-items:flex-end; gap:12px; text-align:right; }
.footer .footer-contact-open { padding:0; border:0; background:none; color:#fff; font:inherit; font-size:clamp(26px,2.8vw,38px); font-weight:650; line-height:1.1; letter-spacing:-.045em; text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:7px; white-space:nowrap; cursor:pointer; }
.footer .footer-contact-open:hover { color:#aaa; }
.footer .footer-contact-open:focus-visible { outline:2px solid #fff; outline-offset:7px; }
.footer-copy-phone { flex: none; display:grid; place-items:center; width:32px; height:32px; padding:6px; border:0; border-radius:5px; background:transparent; color:#fff; cursor:pointer; }
.footer-copy-phone svg { display:block; width:20px; height:20px; }
.footer-copy-phone:hover, .footer-copy-phone:focus-visible { background:#242424; }
.footer-copy-phone:focus-visible { outline:2px solid #fff; outline-offset:3px; }

@media (max-width: 900px) {
  .footer { padding-bottom: 300px; }
  .footer-bottle-display { top:0; right:0; bottom:24px; left:0; height:auto; }
  .footer-contact-cta { right:calc(var(--site-unit) * 2.35); }
  .footer-socials { left:calc(var(--site-unit) * 2.35); }
  .footer-bottle { width: 185px; height: 225px; }
  .footer-bottle:nth-child(1) { --left: 13%; }
  .footer-bottle:nth-child(2) { --left: 25%; }
  .footer-bottle:nth-child(3) { --left: 38%; }
  .footer-bottle:nth-child(4) { --left: 50%; }
  .footer-bottle:nth-child(5) { --left: 63%; }
  .footer-bottle:nth-child(6) { --left: 76%; }
  .footer-bottle:nth-child(7) { --left: 88%; }
}
@media (max-width: 600px) {
  .footer { padding-bottom: 275px; }
  .footer-bottle-display { bottom:105px; height:auto; }
  .footer-contact-cta { right:18px; bottom:28px; }
  .footer-socials { left:18px; bottom:28px; }
  .footer-bottle { width: 145px; height: 185px; }
  .footer-bottle:nth-child(n+5) { display: none; }
  .footer-bottle:nth-child(1) { --left: 18%; --turn: -8deg; }
  .footer-bottle:nth-child(2) { --left: 39%; --turn: -2deg; }
  .footer-bottle:nth-child(3) { --left: 61%; --turn: 3deg; }
  .footer-bottle:nth-child(4) { --left: 82%; --turn: 8deg; }
  .footer-social { min-width: 0; }
  .footer-columns .footer-phone-row a { font-size:20px; }
  .footer-columns .footer-social > a { font-size:13px; }
  .footer .footer-contact-open { font-size:27px; }
  .footer-phone-row { gap:6px; }
  .footer-copy-phone { width:28px; height:28px; padding:4px; }
}
@media (prefers-reduced-motion: reduce) {
  .footer-bottle-display { cursor: default; }
  .footer-social-icon { transition:none; }
  .footer-social-icon:hover { transform:none; }
}

.footer-bottle-hint { position:absolute; top:16px; left:12px; right:12px; color:#929292; font-size:12px; line-height:1.5; text-align:center; pointer-events:none; }
.footer-touch-hint { display:none; }
@media (hover:none) { .footer-pointer-hint { display:none; } .footer-touch-hint { display:inline; } }
@media (prefers-reduced-motion:reduce) { .footer-bottle-hint { display:none; } }
/* The contact rule and social tags share the same bottom edge. */
.footer .footer-contact-open { min-height:40px; line-height:1.1; display:flex; align-items:center; border-bottom:1.5px solid currentColor; text-decoration:none; }
@media(max-width:600px) {
  .footer-bottle:nth-child(1) { --left:20%; }
  .footer-bottle:nth-child(2) { --left:50%; }
  .footer-bottle:nth-child(3) { --left:80%; }
}

/* Mobile keeps the contact/navigation footer without a WebGL scene or reserved play area. */
@media (max-width:700px), (pointer:coarse) and (max-height:600px) {
  .footer-bottle-display { display:none; }
  .site .footer { padding-bottom:135px; }
}