/* Sticky conversion bar, project pages only, desktop and mobile.

   The site-wide .hp-stickybar is mobile-only and generic. A project page has a
   named subject and a price, so it gets its own bar that says which project it
   is and offers the two asks a reader actually has at that moment. Both
   buttons open the universal lead dialog; see inc/lead-modal.php.

   The bar is full-bleed with its inner row capped to the dossier column, so it
   lines up with .opi-pnav at the top of the same page. */

.opi-scta{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:var(--ink-950);
  border-top:1px solid rgba(255,255,255,.10);
  box-shadow:0 -8px 28px -14px rgba(0,0,0,.65);
  padding-bottom:env(safe-area-inset-bottom);
  transform:translateY(110%);
  transition:transform .26s var(--ease-out,cubic-bezier(.2,.7,.3,1));
  will-change:transform;
}
.opi-scta[data-show]{transform:none}
@media (prefers-reduced-motion:reduce){.opi-scta{transition:none}}

.opi-scta__in{
  width:min(var(--opi-col,100%),var(--dx-w,1200px));
  margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);
  min-height:64px;padding-block:10px;
}

.opi-scta__meta{min-width:0}
.opi-scta__name{
  margin:0;font-family:var(--font-display);font-size:1rem;line-height:1.2;
  font-weight:var(--weight-semibold);color:var(--text-inverse);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.opi-scta__price{
  margin:2px 0 0;font-family:var(--font-mono);font-size:var(--text-caption);
  line-height:1.3;color:rgba(255,255,255,.62);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.opi-scta__acts{display:flex;align-items:center;gap:var(--space-3);flex:0 0 auto}

.opi-scta__btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:0 var(--space-6);
  font-family:var(--font-body);font-size:var(--text-body-sm);font-weight:var(--weight-semibold);
  line-height:1;letter-spacing:-.01em;
  border-radius:var(--radius-sm);border:1px solid transparent;
  cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}
.opi-scta__btn--ghost{background:transparent;border-color:rgba(255,255,255,.28);color:var(--text-inverse)}
.opi-scta__btn--ghost:hover{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.06)}
.opi-scta__btn--solid{background:#D14A08;color:#FFFFFF}
.opi-scta__btn--solid:hover{background:#C9450A}
.opi-scta__btn:focus-visible{outline:2px solid #FFFFFF;outline-offset:2px}

/* Room for the bar so it never covers the last line of the footer. */
body.single-project{padding-bottom:76px}

/* One bar per page: the generic mobile bar stands down on project pages. */
body.single-project .hp-stickybar{display:none !important}

@media (max-width:860px){
  .opi-scta__in{gap:var(--space-4);padding-inline:var(--space-4)}
  .opi-scta__price{display:none}
}

@media (max-width:640px){
  .opi-scta__in{min-height:58px;gap:var(--space-3);padding-inline:var(--space-3)}
  /* The h1 is directly above in the reader's memory; the buttons matter more
     than repeating the name on a 360px screen. */
  .opi-scta__meta{display:none}
  .opi-scta__acts{flex:1;gap:var(--space-2)}
  .opi-scta__btn{flex:1;padding:0 var(--space-3);min-height:46px;font-size:.9375rem}
  body.single-project{padding-bottom:72px}
}