/* Offer banner, exit-intent card, sticky call to action. Built by brand/cro.py.
   One rule set for 23 pages. The banner sits above the nav and scrolls away; the sticky bar and
   the card are the only fixed things on the site. */

.cro-bar{background:var(--ink,#17151B);color:#FEFBF4}
.cro-bar-in{max-width:1200px;margin:0 auto;padding:11px 20px 11px 24px;display:flex;
  align-items:center;gap:14px;flex-wrap:nowrap}
.cro-tag{flex:none;background:var(--yellow,#F5D864);color:#17151B;border-radius:999px;
  padding:5px 12px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  white-space:nowrap}
.cro-line{margin:0;font-size:15px;line-height:1.35;flex:1 1 auto;min-width:0}
.cro-line b{font-weight:800}
.cro-fine{color:#CFC8C2}
.cro-count{display:inline-block;border:1px solid #4A454C;border-radius:999px;padding:2px 10px;
  font-size:12px;font-weight:700;color:#FEFBF4;white-space:nowrap}
.cro-bar-cta{flex:none;background:var(--primary,#2148D8);color:#fff;text-decoration:none;
  border-radius:10px;padding:10px 16px;font-size:14px;font-weight:700;white-space:nowrap}
.cro-bar-cta:hover{background:#1B3AB8}
.cro-x{flex:none;background:none;border:0;color:#CFC8C2;font-size:22px;line-height:1;
  cursor:pointer;padding:6px;min-width:36px;min-height:36px}
.cro-x:hover{color:#fff}
.cro-x-dark{color:#6A6469}
.cro-x-dark:hover{color:#17151B}

/* exit intent */
.cro-pop{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px;
  background:rgba(23,21,27,.52);backdrop-filter:blur(2px)}
.cro-pop[hidden]{display:none}
.cro-pop-card{position:relative;background:var(--canvas,#F6F2EF);border-radius:18px;
  max-width:520px;width:100%;padding:34px 34px 26px;box-shadow:0 24px 60px rgba(23,21,27,.28)}
.cro-pop-card .cro-x{position:absolute;top:12px;right:12px}
.cro-tag-dark{background:#17151B;color:#FEFBF4}
.cro-pop-card h2{font-size:30px;line-height:1.12;letter-spacing:-.02em;margin:14px 0 0;
  max-width:22ch}
.cro-pop-card p{margin:12px 0 0;font-size:15px;line-height:1.5;color:#625E65}
.cro-pop-fine{font-size:13px !important}
.cro-pop-acts{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
.cro-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--primary,#2148D8);
  color:#fff;text-decoration:none;border-radius:12px;padding:14px 20px;font-size:15px;
  font-weight:700;min-height:48px}
.cro-btn:hover{background:#1B3AB8}
.cro-btn-ghost{background:transparent;color:#17151B;border:1px solid #CFC6BF}
.cro-btn-ghost:hover{background:#EFE9E3;color:#17151B}
.cro-later{display:block;margin:14px auto 0;background:none;border:0;color:#625E65;
  font-size:13px;text-decoration:underline;cursor:pointer;padding:10px;min-height:44px}
.cro-btn-sm{padding:11px 16px;font-size:14px;min-height:44px}

/* sticky call to action */
.cro-sticky{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:110;
  display:flex;align-items:center;gap:16px;background:#fff;border:1px solid #E5DED8;
  border-radius:14px;box-shadow:0 12px 34px rgba(23,21,27,.14);padding:12px 14px 12px 20px;
  max-width:min(720px,calc(100vw - 32px))}
.cro-sticky[hidden]{display:none}
.cro-sticky p{margin:0;font-size:14px;font-weight:700;letter-spacing:-.01em}
.cro-sticky-acts{display:flex;gap:10px;flex:none}
.cro-sticky .cro-x{color:#6A6469;min-width:32px}

@media (max-width:860px){
  .cro-bar-in{gap:10px;padding:10px 12px 10px 16px}
  .cro-line{font-size:14px}
  .cro-fine{display:none}
  .cro-bar-cta{padding:9px 12px;font-size:13px}
  .cro-pop-card{padding:28px 22px 20px}
  .cro-pop-card h2{font-size:25px}
  .cro-sticky{left:12px;right:12px;transform:none;bottom:12px;padding:12px 46px 12px 12px;
    gap:10px;flex-wrap:wrap;justify-content:space-between;max-width:none}
  .cro-sticky .cro-x{position:absolute;top:6px;right:6px;min-width:34px;min-height:34px}
  .cro-sticky p{font-size:13px;flex:1 1 100%}
  .cro-sticky-acts{flex:1 1 auto}
  .cro-sticky-acts .cro-btn{flex:1 1 auto}
}

@media (max-width:520px){
  /* one action on a small screen: the primary, full width, nothing competing with it */
  .cro-sticky-acts .cro-btn-ghost{display:none}
  .cro-sticky-acts .cro-btn{flex:1 1 100%}
  .cro-bar-in{flex-wrap:wrap}
  .cro-line{flex:1 1 100%;order:3}
  .cro-bar-cta{order:2;margin-left:auto}
}

@media (prefers-reduced-motion:no-preference){
  .cro-pop-card{animation:croIn .18s ease-out}
  .cro-sticky{animation:croUp .22s ease-out}
}
@keyframes croIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes croUp{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
@media (max-width:860px) and (prefers-reduced-motion:no-preference){
  @keyframes croUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
}

/* the line under the booking calendar */
.cro-book-line{margin:18px 0 0;font-size:14px;line-height:1.5;color:#625E65;
  border-left:3px solid #F5D864;padding:10px 0 10px 14px;background:#FFFCFA}
.cro-book-line b{color:#17151B}
