#fy-miami-yacht-rentals-neon{
  --fy-ink:#172033;
  --fy-muted:#526079;
  --fy-pink:#E45C9C;
  --fy-pink-deep:#C94386;
  --fy-pink-dark:#B83280;
  --fy-purple:#7C3AED;
  --fy-purple-deep:#5B21B6;
  --fy-purple-soft:#F3E8FF;
  --fy-blue:#2563EB;
  --fy-blue-deep:#1E40AF;
  --fy-blue-soft:#EFF6FF;
  --fy-border:#E6EAF3;
  --fy-white:#FFFFFF;
  --fy-warm:#FFF9FC;
  --fy-shadow:0 18px 46px rgba(23,32,51,.09),0 7px 22px rgba(228,92,156,.09);
  color:var(--fy-ink);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:
    radial-gradient(circle at 10% 3%,rgba(37,99,235,.075),transparent 24%),
    radial-gradient(circle at 90% 5%,rgba(124,58,237,.085),transparent 27%),
    linear-gradient(180deg,#fff 0%,var(--fy-warm) 56%,#fff 100%);
  padding:28px 16px;
}
#fy-miami-yacht-rentals-neon *{box-sizing:border-box}
#fy-miami-yacht-rentals-neon .fy-shell{max-width:1200px;margin:0 auto}
#fy-miami-yacht-rentals-neon .fy-frame{
  position:relative;
  /* Clips the gradient bar to the rounded corners. MUST be "clip", not
     "hidden": overflow:hidden makes this a scroll container, which kills
     position:sticky on the filter bar inside it. "clip" crops identically
     without creating one. The hidden line is the pre-Safari-16 fallback. */
  overflow:hidden;
  overflow:clip;
  padding:clamp(16px,2.4vw,26px);
  border:1px solid rgba(124,58,237,.16);
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:var(--fy-shadow);
}
#fy-miami-yacht-rentals-neon .fy-frame::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:5px;
  background:linear-gradient(90deg,var(--fy-pink),var(--fy-purple),var(--fy-blue),var(--fy-pink));
  background-size:200% 100%;
}
#fy-miami-yacht-rentals-neon .fy-intro{text-align:center}
#fy-miami-yacht-rentals-neon h2{
  margin:5px auto 10px;
  max-width:960px;
  font-size:clamp(27px,3.8vw,42px);
  font-weight:950;
  line-height:1.12;
  letter-spacing:-.03em;
  background:linear-gradient(90deg,var(--fy-pink-deep),var(--fy-purple),var(--fy-blue));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
#fy-miami-yacht-rentals-neon .fy-sub{
  max-width:930px;
  margin:0 auto 16px;
  color:var(--fy-muted);
  font-size:clamp(14px,1.8vw,16px);
  line-height:1.7;
}
#fy-miami-yacht-rentals-neon .fy-pricing-info{
  max-width:980px;
  margin:18px auto;
  padding:18px 20px;
  border:1px solid rgba(124,58,237,.18);
  border-left:5px solid var(--fy-pink);
  border-radius:18px;
  background:linear-gradient(120deg,#fff 0%,#fff5fa 52%,var(--fy-purple-soft) 100%);
  box-shadow:0 10px 26px rgba(91,33,182,.07);
  text-align:center;
}
#fy-miami-yacht-rentals-neon .fy-pricing-info h3{margin:0 0 7px;font-size:clamp(18px,2.4vw,23px)}
#fy-miami-yacht-rentals-neon .fy-pricing-info p{margin:0;color:var(--fy-muted);line-height:1.65}
#fy-miami-yacht-rentals-neon .fy-payment-highlight{
  display:block;
  margin:11px auto 0!important;
  padding:10px 13px;
  border:1px solid rgba(228,92,156,.24);
  border-radius:12px;
  background:#fff;
  color:var(--fy-ink)!important;
  font-weight:900;
}
#fy-miami-yacht-rentals-neon .fy-free-hour-note{margin-top:8px!important;font-size:12.5px}
#fy-miami-yacht-rentals-neon .fy-group-paths,
#fy-miami-yacht-rentals-neon .fy-collection-links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
  max-width:1040px;
  margin:14px auto;
  padding:10px;
  border:1px solid var(--fy-border);
  border-radius:16px;
  background:#fff;
  box-shadow:0 6px 18px rgba(23,32,51,.05);
}
#fy-miami-yacht-rentals-neon .fy-nav-label{color:var(--fy-ink);font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.055em}
#fy-miami-yacht-rentals-neon .fy-path-current,
#fy-miami-yacht-rentals-neon .fy-semantic-link{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:850;
  line-height:1.25;
  text-decoration:none;
}
#fy-miami-yacht-rentals-neon .fy-path-current{color:var(--fy-blue-deep);background:var(--fy-blue-soft);border:1px solid rgba(37,99,235,.18)}
#fy-miami-yacht-rentals-neon .fy-semantic-link{color:var(--fy-purple-deep);background:#fff;border:1px solid rgba(124,58,237,.22)}
#fy-miami-yacht-rentals-neon .fy-semantic-link:hover{background:var(--fy-purple-soft);border-color:rgba(124,58,237,.42)}
#fy-miami-yacht-rentals-neon .fy-inventory-panel{
  position:sticky;
  /* fleet.js measures any fixed header / admin bar and overrides this. */
  top:var(--fy-sticky-top,12px);
  z-index:20;
  margin:18px auto;
  padding:14px;
  border:1px solid var(--fy-border);
  border-radius:20px;
  background:rgba(255,255,255,.95);
  box-shadow:0 12px 30px rgba(23,32,51,.08);
  backdrop-filter:blur(14px);
  /* Paired with .is-tucked below: slides away on scroll-down, returns on
     scroll-up (fleet.js toggles the class). */
  transition:transform .28s ease,opacity .28s ease;
  will-change:transform;
}
/* Scrolling DOWN — lift the bar out of the way so the grid gets the screen.
   translateY is relative to its own height, so it always clears itself no
   matter how tall the filter row wraps on small screens. */
#fy-miami-yacht-rentals-neon .fy-inventory-panel.is-tucked{
  transform:translateY(calc(-100% - var(--fy-sticky-top,12px) - 20px));
  opacity:0;
  pointer-events:none;
}
/* Anyone who prefers less motion just gets the show/hide, no slide. */
@media(prefers-reduced-motion:reduce){
  #fy-miami-yacht-rentals-neon .fy-inventory-panel{transition:none}
}
#fy-miami-yacht-rentals-neon .fy-search-row{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(170px,.5fr) minmax(170px,.5fr);
  gap:10px;
  align-items:center;
  /* The app-shell makes .fy-search-row sticky+frosted on ordinary pages.
     Inside this panel that's a translucent layer INSIDE a translucent
     sticky panel — content behind ghosts through both and everything
     looks like it's bleeding together. The panel handles sticky; the row
     stays plain. */
  position:static;
  background:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  border-radius:0;
  padding-top:0;
  padding-bottom:0;
}
#fy-miami-yacht-rentals-neon .fy-search-wrap{position:relative}
#fy-miami-yacht-rentals-neon .fy-search-wrap::before{content:"🔎";position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:14px;pointer-events:none}
#fy-miami-yacht-rentals-neon .fy-search,
#fy-miami-yacht-rentals-neon .fy-sort{
  width:100%;
  min-height:44px;
  border:1.5px solid var(--fy-border);
  border-radius:999px;
  background:#fff;
  color:var(--fy-ink);
  font:inherit;
  font-size:14px;
  font-weight:800;
  box-shadow:0 5px 14px rgba(23,32,51,.045);
}
#fy-miami-yacht-rentals-neon .fy-search{padding:10px 14px 10px 40px}
/* The sort / size dropdowns are controls people actually use — dress them
   in the brand pink instead of leaving grey native widgets: pink text, a
   pink chevron drawn in (native arrows can't be recolored), a blush
   gradient, and a glow on hover/focus so they read as tappable. */
#fy-miami-yacht-rentals-neon .fy-sort{
  padding:10px 38px 10px 16px;
  cursor:pointer;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  color:var(--fy-pink-deep);
  font-weight:900;
  border-color:rgba(228,92,156,.35);
  background:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23E45C9C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
      no-repeat right 15px center/12px 8px,
    linear-gradient(180deg,#fff,#FFF7FB);
  box-shadow:0 5px 14px rgba(228,92,156,.12);
}
#fy-miami-yacht-rentals-neon .fy-sort:hover{
  border-color:var(--fy-pink);
  box-shadow:0 8px 20px rgba(228,92,156,.20);
}
#fy-miami-yacht-rentals-neon .fy-sort option{color:var(--fy-ink);font-weight:700}
#fy-miami-yacht-rentals-neon .fy-search:focus{outline:3px solid rgba(124,58,237,.16);border-color:var(--fy-purple)}
#fy-miami-yacht-rentals-neon .fy-sort:focus{outline:3px solid rgba(228,92,156,.20);border-color:var(--fy-pink)}
#fy-miami-yacht-rentals-neon .fy-result-count{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px 13px;
  border:1px solid rgba(124,58,237,.18);
  border-radius:999px;
  background:linear-gradient(180deg,#fff,var(--fy-purple-soft));
  color:var(--fy-purple-deep);
  font-size:12.5px;
  font-weight:950;
  text-align:center;
  white-space:nowrap;
}
#fy-miami-yacht-rentals-neon .fy-filter-label{margin:13px 0 8px;text-align:center;color:var(--fy-pink-deep);font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.09em}
/* Always a horizontally-scrolling strip, not just under some breakpoint —
   with 5 buttons plus growing, "wrap onto a second centered line" (the old
   behaviour above ~860px) read as broken: buttons crammed together with no
   way to tell more existed. One line, scrollable, at every width. */
#fy-miami-yacht-rentals-neon .fy-filter-row-wrap{position:relative;max-width:100%}
#fy-miami-yacht-rentals-neon .fy-filter-row{
  display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:8px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  padding:2px 2px 4px;
  /* No scroll-behavior:smooth here on purpose — tested and found it makes
     scrollLeft writes (this row has none itself, but plenty of other code
     on the page reads/sets scroll position) unreliable in at least one real
     browser engine. Native touch/trackpad scrolling doesn't need it to feel
     good; not worth the risk. */
}
#fy-miami-yacht-rentals-neon .fy-filter-row::-webkit-scrollbar{display:none}
/* The swipe hint: a chevron over a fade so the cut-off edge itself signals
   "more here" even before anyone notices the arrow. fleet.js hides this
   once you've scrolled to the end, and it never appears at all when every
   button already fits — an arrow with nowhere to go is worse than none. */
#fy-miami-yacht-rentals-neon .fy-filter-row-hint{
  position:absolute;top:0;right:0;bottom:4px;width:40px;
  display:flex;align-items:center;justify-content:flex-end;
  padding-right:2px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.95) 65%);
  color:var(--fy-purple-deep);font-size:20px;font-weight:900;
  opacity:0;transition:opacity .2s ease;
}
#fy-miami-yacht-rentals-neon .fy-filter-row-hint.is-visible{opacity:1}
#fy-miami-yacht-rentals-neon .fy-filter-button[hidden]{display:none}
/* Filter chips: idle text used to be the grey --fy-muted, which read as
   disabled. Idle = full-contrast ink on a blush border (clearly clickable),
   hover = blush fill, active = the brand pink→purple gradient with white
   text — the chosen filter is visible from across the room. */
#fy-miami-yacht-rentals-neon .fy-filter-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex:0 0 auto;
  min-height:36px;
  padding:7px 12px;
  border:1.5px solid rgba(228,92,156,.28);
  border-radius:999px;
  background:#fff;
  color:var(--fy-ink);
  font:inherit;
  font-size:12.5px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 4px 11px rgba(23,32,51,.045);
}
#fy-miami-yacht-rentals-neon .fy-filter-button:hover{border-color:var(--fy-pink);color:var(--fy-pink-deep);background:#FFF7FB;box-shadow:0 7px 16px rgba(228,92,156,.16)}
#fy-miami-yacht-rentals-neon .fy-filter-button.is-active,
#fy-miami-yacht-rentals-neon .fy-filter-button[aria-pressed="true"]{
  border-color:transparent;
  color:#fff;
  background:linear-gradient(105deg,var(--fy-pink),var(--fy-purple));
  box-shadow:0 8px 18px rgba(228,92,156,.30);
  text-shadow:0 1px 2px rgba(23,32,51,.18);
}

/* Wraps the plain filter row + the Saved button as two visually separate
   things: one is "slice the fleet", the other is "your own list" — stacking
   them with a divider says that at a glance instead of hiding Saved as a
   6th identical pill nobody noticed. */
#fy-miami-yacht-rentals-neon .fy-filter-bar{display:flex;flex-direction:column;align-items:center;gap:11px}
#fy-miami-yacht-rentals-neon .fy-legend{margin:7px auto 14px;max-width:940px;color:var(--fy-muted);font-size:12px;line-height:1.6;text-align:center}
#fy-miami-yacht-rentals-neon .fy-mobile-view-all{
  display:none;
  width:100%;
  margin:0 0 14px;
  padding:11px 14px;
  border:1px solid rgba(124,58,237,.28);
  border-radius:13px;
  background:linear-gradient(105deg,#fff,var(--fy-blue-soft),var(--fy-purple-soft));
  color:var(--fy-purple-deep);
  font:inherit;
  font-size:13px;
  font-weight:950;
  cursor:pointer;
}
#fy-miami-yacht-rentals-neon .fy-no-results{
  margin:16px auto;
  padding:18px;
  border:1px dashed rgba(124,58,237,.34);
  border-radius:16px;
  background:#fff;
  color:var(--fy-muted);
  text-align:center;
  font-weight:750;
}
#fy-miami-yacht-rentals-neon .fy-no-results strong{display:block;margin-bottom:4px;color:var(--fy-ink);font-size:17px}
#fy-miami-yacht-rentals-neon .fy-clear-filters{display:block;margin:10px auto 0;padding:9px 14px;border:0;border-radius:999px;background:linear-gradient(90deg,var(--fy-blue-deep),var(--fy-purple-deep));color:#fff;font:inherit;font-size:12px;font-weight:950;cursor:pointer;box-shadow:0 7px 18px rgba(91,33,182,.16)}
#fy-miami-yacht-rentals-neon .fy-clear-filters:hover{filter:brightness(1.05)}
#fy-miami-yacht-rentals-neon .fy-clear-filters:focus-visible{outline:3px solid rgba(37,99,235,.28);outline-offset:3px}
#fy-miami-yacht-rentals-neon .fy-grid{display:grid;grid-template-columns:1fr;gap:17px;align-items:stretch}
#fy-miami-yacht-rentals-neon .fy-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  height:100%;
  padding:12px;
  border:1px solid rgba(124,58,237,.15);
  border-radius:20px;
  background:linear-gradient(180deg,#fff 0%,#fffafd 100%);
  box-shadow:0 11px 28px rgba(23,32,51,.065),0 4px 12px rgba(228,92,156,.055);
}
#fy-miami-yacht-rentals-neon .fy-card[hidden]{display:none!important}
#fy-miami-yacht-rentals-neon .fy-card-media{position:relative;margin-bottom:10px}
#fy-miami-yacht-rentals-neon .fy-card-image{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  border:1px solid rgba(37,99,235,.12);
  border-radius:15px;
  background:#f8fafc;
  box-shadow:0 6px 16px rgba(23,32,51,.055);
}
#fy-miami-yacht-rentals-neon .fy-card-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* The whole photo is the button that opens this yacht's gallery. The cue
   chip stays visible so it's obvious the picture does something — on touch
   there's no hover to reveal it. */
#fy-miami-yacht-rentals-neon .fy-photo-open{
  position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;
  padding:10px;margin:0;border:0;background:transparent;cursor:zoom-in;
  -webkit-appearance:none;appearance:none;
}
/* Solid brand pill, not a translucent dark one. The old
   rgba(15,20,33,.62) fill let the photo show through and disappeared
   against dark hulls, evening shots and busy marina backgrounds, so the
   single most useful control on the card read as decoration. This is
   opaque, uses the brand pink→purple, and carries a white ring so it
   separates from ANY photo behind it. */
#fy-miami-yacht-rentals-neon .fy-photo-open__cue{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 13px;border-radius:999px;
  border:2px solid #fff;
  background:#C94386;
  color:#fff;font-size:12.5px;font-weight:900;letter-spacing:.01em;line-height:1;
  box-shadow:0 6px 18px rgba(23,32,51,.45);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}
#fy-miami-yacht-rentals-neon .fy-photo-open:hover .fy-photo-open__cue{
  background:#526079;transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(23,32,51,.5);
}
#fy-miami-yacht-rentals-neon .fy-photo-open:focus-visible{outline:3px solid #7C3AED;outline-offset:-3px;border-radius:15px}
#fy-miami-yacht-rentals-neon .fy-card-image:hover img{transform:scale(1.03)}
#fy-miami-yacht-rentals-neon .fy-card-image img{transition:transform .3s ease}
@media (prefers-reduced-motion:reduce){
  #fy-miami-yacht-rentals-neon .fy-card-image img{transition:none}
  #fy-miami-yacht-rentals-neon .fy-card-image:hover img{transform:none}
  #fy-miami-yacht-rentals-neon .fy-photo-open__cue{transition:none}
}
#fy-miami-yacht-rentals-neon .fy-badge-row{position:absolute;top:9px;left:9px;right:9px;display:flex;flex-wrap:wrap;gap:5px;pointer-events:none}
#fy-miami-yacht-rentals-neon .fy-badge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.70);
  border-radius:999px;
  background:rgba(255,255,255,.93);
  color:var(--fy-ink);
  font-size:10.5px;
  font-weight:900;
  box-shadow:0 5px 14px rgba(23,32,51,.12);
  backdrop-filter:blur(7px);
}
#fy-miami-yacht-rentals-neon .badge-pink{color:#9d174d;background:rgba(253,242,255,.95)}
#fy-miami-yacht-rentals-neon .badge-free{color:#075985;background:rgba(224,242,254,.95)}
#fy-miami-yacht-rentals-neon .badge-hot{color:#b91c1c;background:rgba(254,242,242,.95)}
#fy-miami-yacht-rentals-neon .badge-commercial{color:#312e81;background:rgba(238,242,255,.95)}
#fy-miami-yacht-rentals-neon .badge-size{color:#9f1239;background:rgba(255,241,247,.95)}
#fy-miami-yacht-rentals-neon .fy-card-title{margin:0 2px 3px;color:var(--fy-ink);font-size:clamp(18px,2vw,21px);font-weight:950;line-height:1.22;letter-spacing:-.015em;text-align:left}
/* Size · Brand · Model, sized to match the meta rows below the price.
   Must never be clipped: on a narrow card the three parts wrap onto two
   lines rather than overflowing (which hid everything after the size). */
#fy-miami-yacht-rentals-neon .fy-card-subtitle{
  display:block;
  margin:0 2px 8px;
  color:var(--fy-muted);
  font-size:12px;
  font-weight:850;
  line-height:1.4;
  text-align:left;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  overflow-wrap:anywhere;
  max-width:100%;
  max-height:none;
  -webkit-line-clamp:none;
}
#fy-miami-yacht-rentals-neon .fy-starting-price{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"label amount" "note note";
  align-items:end;
  gap:3px 8px;
  margin:0 0 9px;
  padding:10px 12px;
  border:1px solid rgba(124,58,237,.23);
  border-left:5px solid var(--fy-pink);
  border-radius:14px;
  background:linear-gradient(108deg,#fff 0%,#fff4f9 52%,var(--fy-purple-soft) 100%);
  box-shadow:0 7px 18px rgba(91,33,182,.065);
}
#fy-miami-yacht-rentals-neon .fy-starting-label{grid-area:label;color:var(--fy-purple-deep);font-size:11px;font-weight:950;letter-spacing:.06em;text-transform:uppercase;line-height:1.2}
/* The number itself never contains a space, so allowing wrapping here only
   ever breaks BEFORE the "per hour" unit — which is what we want on a
   narrow card. */
#fy-miami-yacht-rentals-neon .fy-starting-amount{grid-area:amount;color:var(--fy-pink-deep);font-size:clamp(24px,3vw,30px);font-weight:950;line-height:.95;letter-spacing:-.035em;white-space:normal}
#fy-miami-yacht-rentals-neon .fy-starting-unit{color:var(--fy-muted);font-size:12px;font-weight:800;letter-spacing:0;white-space:nowrap}
#fy-miami-yacht-rentals-neon .fy-starting-note{grid-area:note;color:var(--fy-muted);font-size:11px;font-weight:800;line-height:1.3}
#fy-miami-yacht-rentals-neon .fy-card-meta{
  display:grid;
  gap:6px;
  margin:0 0 9px;
  padding:9px 10px;
  border:1px solid rgba(37,99,235,.13);
  border-radius:13px;
  background:linear-gradient(180deg,#fff,var(--fy-blue-soft));
}
#fy-miami-yacht-rentals-neon .fy-meta-row{display:grid;grid-template-columns:92px minmax(0,1fr);gap:7px;align-items:start;color:var(--fy-muted);font-size:12px;line-height:1.4}
#fy-miami-yacht-rentals-neon .fy-meta-label{color:var(--fy-blue-deep);font-weight:850}
#fy-miami-yacht-rentals-neon .fy-meta-row strong{color:var(--fy-ink);font-weight:900}
#fy-miami-yacht-rentals-neon .fy-pricing-details{margin:0 0 9px}
#fy-miami-yacht-rentals-neon .fy-pricing-summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  gap:10px;
  align-items:center;
  min-height:58px;
  padding:10px 11px 10px 14px;
  border:2px solid rgba(37,99,235,.42);
  border-radius:14px;
  background:linear-gradient(105deg,#fff 0%,var(--fy-blue-soft) 52%,var(--fy-purple-soft) 100%);
  color:var(--fy-blue-deep);
  box-shadow:0 7px 18px rgba(37,99,235,.085);
  cursor:pointer;
  list-style:none;
}
#fy-miami-yacht-rentals-neon .fy-pricing-summary::-webkit-details-marker{display:none}
#fy-miami-yacht-rentals-neon .fy-pricing-summary:hover{border-color:rgba(124,58,237,.46);box-shadow:0 10px 22px rgba(91,33,182,.12)}
#fy-miami-yacht-rentals-neon .fy-pricing-summary:focus-visible{outline:3px solid rgba(124,58,237,.20);outline-offset:2px}
#fy-miami-yacht-rentals-neon .fy-summary-copy{display:block;min-width:0}
#fy-miami-yacht-rentals-neon .fy-summary-main{display:block;font-size:13px;font-weight:950;line-height:1.2}
#fy-miami-yacht-rentals-neon .fy-summary-sub{display:block;margin-top:3px;color:#60708b;font-size:10.5px;font-weight:750;line-height:1.25}
#fy-miami-yacht-rentals-neon .fy-when-open{display:none}
#fy-miami-yacht-rentals-neon .fy-summary-arrow{
  position:relative;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.60);
  border-radius:50%;
  background:linear-gradient(145deg,var(--fy-blue),var(--fy-purple));
  color:#fff;
  box-shadow:0 4px 11px rgba(91,33,182,.22);
}
#fy-miami-yacht-rentals-neon .fy-summary-arrow::before{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .18s ease}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-pricing-summary{color:#fff;border-color:transparent;background:linear-gradient(100deg,var(--fy-blue-deep),var(--fy-purple-deep));box-shadow:0 10px 24px rgba(91,33,182,.21)}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-summary-sub{color:rgba(255,255,255,.82)}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-when-closed{display:none}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-when-open{display:block}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-summary-arrow{color:var(--fy-purple-deep);background:#fff}
#fy-miami-yacht-rentals-neon .fy-pricing-details[open] .fy-summary-arrow::before{transform:translateY(2px) rotate(225deg)}
#fy-miami-yacht-rentals-neon .fy-price-panel{
  display:grid;
  gap:7px;
  margin-top:8px;
  padding:9px;
  border:1px solid rgba(124,58,237,.14);
  border-radius:14px;
  background:linear-gradient(180deg,#fff,#fbf8ff);
}
#fy-miami-yacht-rentals-neon .fy-price-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:9px 11px;
  border:1px solid rgba(37,99,235,.14);
  border-radius:12px;
  background:#fff;
  box-shadow:0 4px 12px rgba(23,32,51,.035);
}
#fy-miami-yacht-rentals-neon .fy-price-row.is-free-hour{border-color:rgba(14,165,233,.30);background:linear-gradient(100deg,#f0f9ff,#fff)}
#fy-miami-yacht-rentals-neon .fy-price-duration{color:var(--fy-ink);font-size:13.5px;font-weight:900;line-height:1.35}
#fy-miami-yacht-rentals-neon .fy-price-value{text-align:right;white-space:nowrap}
#fy-miami-yacht-rentals-neon .fy-price-number{display:block;color:var(--fy-pink-deep);font-size:18px;font-weight:950;line-height:1}
#fy-miami-yacht-rentals-neon .fy-price-total{display:block;margin-top:3px;color:#6b7280;font-size:9px;font-weight:850;letter-spacing:.065em;line-height:1;text-transform:uppercase}
#fy-miami-yacht-rentals-neon .fy-day-heading{padding:7px 9px;border:1px solid rgba(37,99,235,.17);border-radius:10px;background:var(--fy-blue-soft);color:var(--fy-blue-deep);font-size:10.5px;font-weight:950;letter-spacing:.055em;text-align:center;text-transform:uppercase}
#fy-miami-yacht-rentals-neon .fy-price-note{padding:8px 9px;border:1px solid rgba(124,58,237,.17);border-radius:10px;background:var(--fy-purple-soft);color:var(--fy-purple-deep);font-size:11px;font-weight:900;text-align:center}
#fy-miami-yacht-rentals-neon .fy-card-cta{margin-top:auto;padding-top:2px;display:grid;gap:8px}
#fy-miami-yacht-rentals-neon .fy-card-book{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:56px;
  padding:10px 13px;
  border:2px solid rgba(255,255,255,.9);
  border-radius:14px;
  background:linear-gradient(112deg,#172033 0%,#312e81 26%,var(--fy-purple) 58%,var(--fy-blue-deep) 100%);
  color:#fff;
  font:inherit;
  cursor:pointer;
  box-shadow:0 0 0 3px rgba(124,58,237,.12),0 10px 24px rgba(37,99,235,.26);
}
#fy-miami-yacht-rentals-neon .fy-card-book:hover{filter:saturate(1.08) brightness(1.06);box-shadow:0 0 0 4px rgba(124,58,237,.16),0 13px 30px rgba(37,99,235,.32)}
#fy-miami-yacht-rentals-neon .fy-card-book:focus-visible{outline:3px solid rgba(228,92,156,.4);outline-offset:3px}
#fy-miami-yacht-rentals-neon .fy-card-book-main{font-size:13.5px;font-weight:950;line-height:1.2;letter-spacing:.01em}
#fy-miami-yacht-rentals-neon .fy-card-book-sub{margin-top:3px;color:rgba(255,255,255,.82);font-size:9.5px;font-weight:800;line-height:1.2;letter-spacing:.035em;text-transform:uppercase}
#fy-miami-yacht-rentals-neon .fy-card-button{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:56px;
  padding:10px 13px;
  border:2px solid transparent;
  border-radius:14px;
  background:linear-gradient(105deg,var(--fy-pink-deep) 0%,var(--fy-pink-dark) 48%,var(--fy-purple) 100%);
  color:#fff;
  text-align:center;
  text-decoration:none;
  box-shadow:0 9px 22px rgba(184,50,128,.27);
}
#fy-miami-yacht-rentals-neon .fy-card-button:hover{filter:saturate(1.07) brightness(1.04);box-shadow:0 13px 28px rgba(91,33,182,.22),0 8px 20px rgba(184,50,128,.25)}
#fy-miami-yacht-rentals-neon .fy-card-button:focus-visible{outline:3px solid rgba(37,99,235,.28);outline-offset:3px}
#fy-miami-yacht-rentals-neon .fy-card-button-main{font-size:13px;font-weight:950;line-height:1.22;overflow-wrap:anywhere}
#fy-miami-yacht-rentals-neon .fy-card-button-sub{margin-top:3px;color:rgba(255,255,255,.84);font-size:9.5px;font-weight:800;line-height:1.2;letter-spacing:.035em;text-transform:uppercase}
#fy-miami-yacht-rentals-neon .fy-view-all-wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:9px;margin:28px auto 2px;text-align:center}
#fy-miami-yacht-rentals-neon .fy-view-all-wrap[hidden]{display:none!important}
#fy-miami-yacht-rentals-neon .fy-view-all-wrap::before{content:"";position:absolute;left:50%;top:45px;width:min(610px,98%);height:124px;transform:translate(-50%,-50%);border-radius:999px;background:radial-gradient(circle,rgba(124,58,237,.30) 0%,rgba(228,92,156,.20) 39%,rgba(37,99,235,.11) 58%,transparent 76%);filter:blur(18px);pointer-events:none}
#fy-miami-yacht-rentals-neon .fy-view-all{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) 36px;
  align-items:center;
  gap:10px;
  width:min(500px,100%);
  min-height:86px;
  padding:13px 15px 13px 24px;
  border:2px solid rgba(255,255,255,.96);
  border-radius:22px;
  background:linear-gradient(112deg,#172033 0%,#312e81 24%,var(--fy-purple) 52%,var(--fy-pink-deep) 77%,var(--fy-pink) 100%);
  background-size:220% 100%;
  color:#fff;
  font:inherit;
  cursor:pointer;
  box-shadow:0 0 0 4px rgba(124,58,237,.12),0 0 30px rgba(124,58,237,.36),0 0 50px rgba(228,92,156,.26),0 17px 34px rgba(23,32,51,.25);
  animation:fy-view-all-glow 2.6s ease-in-out infinite;
}
#fy-miami-yacht-rentals-neon .fy-view-all:hover{filter:saturate(1.06) brightness(1.04);box-shadow:0 0 0 5px rgba(124,58,237,.14),0 0 40px rgba(124,58,237,.46),0 0 66px rgba(228,92,156,.36),0 21px 40px rgba(23,32,51,.29)}
#fy-miami-yacht-rentals-neon .fy-view-all:focus-visible{outline:4px solid rgba(37,99,235,.28);outline-offset:4px}
#fy-miami-yacht-rentals-neon .fy-view-all-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;text-align:center;line-height:1.05}
#fy-miami-yacht-rentals-neon .fy-view-all-line-one{display:block;width:100%;color:#FFF1F7;font-size:clamp(15px,2vw,18px);font-weight:900;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 8px rgba(15,23,42,.30)}
#fy-miami-yacht-rentals-neon .fy-view-all-line-two{display:block;width:100%;color:#DBEAFE;font-size:clamp(19px,2.6vw,24px);font-weight:950;letter-spacing:-.015em;white-space:nowrap;text-shadow:0 2px 8px rgba(15,23,42,.30)}
#fy-miami-yacht-rentals-neon .fy-view-all-arrow{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.54);border-radius:50%;background:rgba(255,255,255,.15);font-size:20px;font-weight:950}
#fy-miami-yacht-rentals-neon .fy-view-all-note{position:relative;z-index:1;max-width:730px;margin:0;color:var(--fy-muted);font-size:12.5px;font-weight:800;line-height:1.5}
#fy-miami-yacht-rentals-neon .fy-bottom-cta{margin:22px auto 0;padding:18px;border:1px dashed rgba(124,58,237,.30);border-radius:19px;background:#fff;text-align:center;box-shadow:0 8px 22px rgba(23,32,51,.05)}
#fy-miami-yacht-rentals-neon .fy-bottom-cta p{max-width:800px;margin:0 auto 12px;color:var(--fy-muted);font-size:14px;line-height:1.6}
#fy-miami-yacht-rentals-neon .fy-bottom-cta strong{color:var(--fy-ink)}
#fy-miami-yacht-rentals-neon .fy-bottom-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:9px}
#fy-miami-yacht-rentals-neon .fy-help-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border-radius:999px;font-size:12.5px;font-weight:900;text-decoration:none;box-shadow:0 7px 18px rgba(23,32,51,.09)}
#fy-miami-yacht-rentals-neon .fy-help-whatsapp{background:#25D366;color:#062b12}
#fy-miami-yacht-rentals-neon .fy-help-call{background:var(--fy-ink);color:#fff}
#fy-miami-yacht-rentals-neon .fy-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@keyframes fy-view-all-glow{0%,100%{box-shadow:0 0 0 4px rgba(124,58,237,.12),0 0 26px rgba(124,58,237,.31),0 0 45px rgba(228,92,156,.22),0 17px 34px rgba(23,32,51,.25)}50%{box-shadow:0 0 0 5px rgba(124,58,237,.14),0 0 35px rgba(124,58,237,.42),0 0 58px rgba(228,92,156,.31),0 19px 38px rgba(23,32,51,.27)}}
@media(min-width:640px){#fy-miami-yacht-rentals-neon .fy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){#fy-miami-yacht-rentals-neon .fy-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#fy-miami-yacht-rentals-neon .fy-card:hover{border-color:rgba(124,58,237,.30);box-shadow:0 16px 36px rgba(23,32,51,.09),0 7px 18px rgba(228,92,156,.10)}}
@media(max-width:860px){
  /* Stays sticky on phones/tablets too — and stays SHORT. Three compact
     rows: search full-width, the two dropdowns side by side at half
     width each, then the filter chips and the Saved pill sharing one
     scrollable row. No standalone label rows eating screen height. */
  #fy-miami-yacht-rentals-neon .fy-search-row{grid-template-columns:1fr 1fr;gap:8px}
  #fy-miami-yacht-rentals-neon .fy-search-wrap{grid-column:1/-1}
  #fy-miami-yacht-rentals-neon .fy-sort{padding:10px 32px 10px 12px;font-size:13px;background-position:right 11px center,0 0}
  #fy-miami-yacht-rentals-neon .fy-result-count{width:100%}
  /* Fully OPAQUE while pinned on phones: at rgba .95 the bold buttons and
     "Clear filters" pill scrolling underneath ghost through the panel and
     everything reads as one bleeding mess. Solid white + clear breathing
     room between the three rows. */
  #fy-miami-yacht-rentals-neon .fy-inventory-panel{padding:10px;background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
  #fy-miami-yacht-rentals-neon .fy-filter-bar{margin-top:9px}
  /* The chips say what they are — the "Popular filters" heading is just
     height on a phone. */
  #fy-miami-yacht-rentals-neon .fy-filter-label{display:none}
  /* Chips + Saved on ONE row: chips scroll in the leftover space, the
     Saved pill stays pinned and always reachable on the right. Sizes are
     deliberately compact — at the desktop 12.5px/36px the chips overflow
     on phones; at 11px/30px all five fit a typical screen in one look.
     A hairline divider separates the scrolling chips from the pinned
     Saved pill so the two regions never look like one smeared row, and
     the "more chips this way" fade is narrowed so it stops sitting ON
     TOP of a chip's text right next to the pill. */
  #fy-miami-yacht-rentals-neon .fy-filter-bar{flex-direction:row;align-items:center;gap:8px}
  #fy-miami-yacht-rentals-neon .fy-filter-row-wrap{flex:1 1 auto;min-width:0;padding-right:8px;border-right:1px solid rgba(23,32,51,.10)}
  #fy-miami-yacht-rentals-neon .fy-filter-row{gap:6px}
  #fy-miami-yacht-rentals-neon .fy-filter-row-hint{width:22px;font-size:15px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 75%)}
  #fy-miami-yacht-rentals-neon .fy-filter-button{min-height:30px;padding:4px 9px;font-size:11px;gap:4px;box-shadow:none}
  /* .fy-filter-bar ancestor added for specificity: the pill's base rules
     come LATER in this file and would win a plain order tie. */
  #fy-miami-yacht-rentals-neon .fy-filter-bar .fy-saved-filter{flex:0 0 auto;min-height:30px;padding:5px 10px 5px 8px;font-size:11px;gap:5px}
  #fy-miami-yacht-rentals-neon .fy-filter-bar .fy-saved-filter__heart{font-size:13px}
  #fy-miami-yacht-rentals-neon .fy-filter-bar .fy-saved-count{min-width:17px;height:17px;padding:0 4px;font-size:10px}
}
@media(max-width:640px){
  #fy-miami-yacht-rentals-neon{padding:18px 9px}
  #fy-miami-yacht-rentals-neon .fy-frame{padding:11px}
  #fy-miami-yacht-rentals-neon .fy-group-paths,#fy-miami-yacht-rentals-neon .fy-collection-links{align-items:stretch}
  #fy-miami-yacht-rentals-neon .fy-nav-label{width:100%;text-align:center}
  #fy-miami-yacht-rentals-neon .fy-path-current,#fy-miami-yacht-rentals-neon .fy-semantic-link{flex:1 1 145px;justify-content:center;text-align:center;border-radius:12px}
  #fy-miami-yacht-rentals-neon .fy-mobile-view-all:not([hidden]){display:block}
  #fy-miami-yacht-rentals-neon .fy-card-title{text-align:center}
  #fy-miami-yacht-rentals-neon .fy-card-subtitle{text-align:center}
  #fy-miami-yacht-rentals-neon .fy-starting-price{grid-template-columns:1fr;grid-template-areas:"label" "amount" "note";text-align:center;align-items:center}
  #fy-miami-yacht-rentals-neon .fy-meta-row{grid-template-columns:1fr;gap:2px;text-align:center}
  #fy-miami-yacht-rentals-neon .fy-pricing-summary{grid-template-columns:minmax(0,1fr) 32px;padding:9px 9px 9px 11px}
  #fy-miami-yacht-rentals-neon .fy-summary-main{font-size:12.5px}
  #fy-miami-yacht-rentals-neon .fy-summary-sub{font-size:9.5px}
  #fy-miami-yacht-rentals-neon .fy-summary-arrow{width:32px;height:32px}
  #fy-miami-yacht-rentals-neon .fy-price-row{grid-template-columns:1fr;gap:5px;text-align:center}
  #fy-miami-yacht-rentals-neon .fy-price-value{text-align:center}
  #fy-miami-yacht-rentals-neon .fy-card-button{min-height:58px;padding:10px}
  #fy-miami-yacht-rentals-neon .fy-card-button-main{font-size:12.5px}
  #fy-miami-yacht-rentals-neon .fy-view-all{min-height:82px;padding:12px 11px 12px 14px;border-radius:19px}
  #fy-miami-yacht-rentals-neon .fy-view-all-line-one{font-size:14px}
  #fy-miami-yacht-rentals-neon .fy-view-all-line-two{font-size:19px}
  #fy-miami-yacht-rentals-neon .fy-view-all-arrow{width:30px;height:30px;font-size:18px}
  #fy-miami-yacht-rentals-neon .fy-bottom-actions{display:grid}
  #fy-miami-yacht-rentals-neon .fy-help-button{width:100%}
}
@media(max-width:360px){
  #fy-miami-yacht-rentals-neon .fy-summary-sub{display:none}
  #fy-miami-yacht-rentals-neon .fy-pricing-summary{min-height:50px}
  #fy-miami-yacht-rentals-neon .fy-view-all-line-one{font-size:13px}
  #fy-miami-yacht-rentals-neon .fy-view-all-line-two{font-size:17px}
}
@media(prefers-reduced-motion:reduce){
  #fy-miami-yacht-rentals-neon .fy-view-all{animation:none}
  #fy-miami-yacht-rentals-neon .fy-summary-arrow::before{transition:none}
  #fy-miami-yacht-rentals-neon *{scroll-behavior:auto!important}
}
/* ====================================================================
   Elementor + position:sticky
   Sticky dies if ANY ancestor is a scroll container (overflow other than
   visible/clip). Elementor sections, containers and widget wrappers ship
   with overflow:hidden in several presets, so any wrapper that actually
   contains this widget is opted back out. :has() covers modern browsers;
   fleet.js walks the ancestors as the fallback for the rest.
   ==================================================================== */
.elementor-widget-fy_yacht_fleet,
.elementor-widget-fy_yacht_fleet > .elementor-widget-container,
.elementor-widget-shortcode:has(.fy-fleet-root),
.elementor-widget-shortcode:has(.fy-fleet-root) > .elementor-widget-container,
.elementor-widget-wrap:has(.fy-fleet-root),
.elementor-column:has(.fy-fleet-root),
.elementor-container:has(.fy-fleet-root),
.elementor-section:has(.fy-fleet-root),
.e-con:has(.fy-fleet-root),
.e-con-inner:has(.fy-fleet-root),
.e-child:has(.fy-fleet-root){
  overflow:visible!important;
}

/* The sticky bar must also out-rank Elementor's own z-index stacking. */
#fy-miami-yacht-rentals-neon .fy-inventory-panel{
  z-index:30;
}
/* ====================================================================
   html/body overflow-x:hidden — the other silent sticky killer
   Themes set it to stop sideways scrolling, but it makes the document a
   scroll container and position:sticky then has nothing to stick to.
   overflow-x:clip blocks sideways scrolling exactly the same way WITHOUT
   creating that container. Scoped with :has() so it only applies on pages
   that actually contain the fleet widget; fleet.js does the same for
   browsers without :has().
   ==================================================================== */
html:has(.fy-fleet-root),
body:has(.fy-fleet-root){
  overflow-x:clip;
}

/* The auto-load sentinel: invisible, just a scroll tripwire. */
#fy-miami-yacht-rentals-neon .fy-autoload-sentinel{
  height:1px;
  margin:0;
  padding:0;
  pointer-events:none;
}
#fy-miami-yacht-rentals-neon .fy-autoload-status{
  margin:14px auto 0;
  text-align:center;
  color:var(--fy-muted);
  font-size:12.5px;
  font-weight:800;
}
#fy-miami-yacht-rentals-neon .fy-autoload-status[hidden]{display:none}
/* ====================================================================
   Card reveal on scroll + desktop hover lift
   The reveal exists mainly so auto-loaded yachts read as "more results
   arriving" rather than the page glitching. Cards already on screen at
   load are never animated - nobody should wait on choreography to read a
   price. No stagger, no scale, no parallax (layout shift hurts Core Web
   Vitals and makes tapping unreliable on phones).
   ==================================================================== */
#fy-miami-yacht-rentals-neon .fy-card{
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
/* Applied by JS only to cards that start below the fold. */
#fy-miami-yacht-rentals-neon .fy-card.fy-reveal{
  opacity:0;
  transform:translateY(10px);
  transition:none;
}
#fy-miami-yacht-rentals-neon .fy-card.fy-reveal.fy-in{
  opacity:1;
  transform:none;
  transition:opacity .18s ease,transform .18s ease;
}

/* Hover lift - pointer devices only, so a tap on mobile never sticks it. */
@media(min-width:1024px) and (hover:hover) and (pointer:fine){
  #fy-miami-yacht-rentals-neon .fy-card:hover{
    transform:translateY(-3px);
    box-shadow:0 20px 42px rgba(23,32,51,.11),0 9px 22px rgba(228,92,156,.13);
    border-color:rgba(124,58,237,.34);
  }
}

@media(prefers-reduced-motion:reduce){
  #fy-miami-yacht-rentals-neon .fy-card,
  #fy-miami-yacht-rentals-neon .fy-card.fy-reveal,
  #fy-miami-yacht-rentals-neon .fy-card.fy-reveal.fy-in{
    opacity:1;
    transform:none;
    transition:none;
  }
  #fy-miami-yacht-rentals-neon .fy-card:hover{transform:none}
}
/* ==================== [fy_yacht_details] tabbed section ====================
   Self-contained (literal hex, not the --fy-* vars, since product-page
   descriptions render outside the #fy-miami-yacht-rentals-neon grid scope
   those variables are declared on). Matches the same palette used inline
   by class-fy-woo.php's part_*() methods. */

.fy-dt{
  position:relative;
  margin:28px 0;
  padding:26px clamp(18px,3vw,32px) 30px;
  border:1px solid rgba(124,58,237,.16);
  border-radius:20px;
  background:linear-gradient(150deg,#ffffff 0%,#FFF5FA 55%,#F3E8FF 100%);
  box-shadow:0 14px 34px rgba(23,32,51,.08);
  overflow:hidden;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
.fy-dt::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:5px;
  background:linear-gradient(90deg,#E45C9C,#7C3AED,#2563EB,#E45C9C);
  background-size:200% 100%;
}
.fy-dt-kicker{
  display:inline-block;
  margin:0 0 10px;
  padding:6px 14px;
  border-radius:999px;
  background:#FBEAF0;
  color:#C94386;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.fy-dt-heading{
  margin:0 0 8px;
  font-size:clamp(22px,3.2vw,32px);
  font-weight:900;
  line-height:1.15;
  letter-spacing:-.02em;
  background:linear-gradient(90deg,#C94386,#7C3AED);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.fy-dt-sub{
  margin:0 0 20px;
  max-width:640px;
  color:#526079;
  font-size:14.5px;
  line-height:1.65;
}
.fy-dt-tabs{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  margin:0 0 18px;
  padding-bottom:6px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#7C3AED #F3E8FF;
}
.fy-dt-tabs::-webkit-scrollbar{height:6px}
.fy-dt-tabs::-webkit-scrollbar-thumb{background:#7C3AED;border-radius:999px}
.fy-dt-tabs::-webkit-scrollbar-track{background:#F3E8FF;border-radius:999px}
.fy-dt-tab{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 18px;
  border:1px solid rgba(124,58,237,.2);
  border-radius:999px;
  background:#ffffff;
  color:#172033;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
  cursor:pointer;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .1s ease;
}
.fy-dt-tab:hover{border-color:#7C3AED;background:#F9F5FF}
.fy-dt-tab--active{
  background:linear-gradient(90deg,#E45C9C,#7C3AED);
  border-color:transparent;
  color:#ffffff;
  box-shadow:0 6px 16px rgba(124,58,237,.28);
}
.fy-dt-panels{
  padding:22px clamp(16px,2.6vw,26px);
  border:1px solid rgba(124,58,237,.14);
  border-radius:16px;
  background:#ffffff;
}
.fy-dt-panel{animation:fyDtFade .18s ease}
.fy-dt-panel[hidden]{display:none}
@keyframes fyDtFade{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}

.fy-dt-panel table.shop_attributes,
.fy-dt-panel img{max-width:100%}

@media (max-width:782px){
  .fy-dt{
    width:100%;
    box-sizing:border-box;
    border-radius:16px;
    margin:22px 0;
  }
  .fy-dt-kicker{font-size:10px;padding:5px 12px}
  .fy-dt-heading{font-size:clamp(20px,5.5vw,26px)}
  .fy-dt-sub{font-size:13.5px}
  .fy-dt-tab{padding:9px 14px;font-size:13px}
  .fy-dt-panels{padding:16px}
}

@media (max-width:520px){
  .fy-dt{padding:18px 14px 20px}
  .fy-dt-tab{padding:8px 12px;font-size:12.5px;gap:4px}
  .fy-dt-heading{line-height:1.2}
}

/* ---------------------------------------------------------------------------
   Fleet grid photo popup.
   Rendered on <body> (so no page layout can clip it) and therefore NOT under
   the #fy-miami-yacht-rentals-neon scope the card styles use.
--------------------------------------------------------------------------- */
.fy-plb{
  position:fixed;inset:0;z-index:999999;
  display:flex;align-items:center;justify-content:center;padding:16px;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
.fy-plb[hidden]{display:none}
.fy-plb__backdrop{position:absolute;inset:0;background:rgba(15,20,33,.93);cursor:zoom-out}
.fy-plb__panel{
  position:relative;display:flex;flex-direction:column;gap:10px;
  width:min(1100px,100%);max-height:100%;
}
.fy-plb__head{display:flex;align-items:center;gap:12px}
.fy-plb__name{
  flex:1;min-width:0;color:#fff;font-size:clamp(15px,2.2vw,19px);font-weight:900;letter-spacing:-.01em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* button.fy-plb__close (not just .fy-plb__close): these are all
   <button type="button">, and Hello Elementor's reset.css styles
   [type="button"] with the same specificity as a single class selector —
   whichever loads later wins the tie, which was the theme, so every one of
   these rendered with the theme's default transparent/pink button instead
   of this. Tagging the selector with the element name breaks the tie in
   this rule's favor regardless of stylesheet load order. */
button.fy-plb__close{
  flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;
  border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;
  font-size:26px;line-height:1;cursor:pointer;
}
button.fy-plb__close:hover{background:rgba(255,255,255,.3)}
.fy-plb__stage{
  position:relative;display:flex;align-items:center;justify-content:center;
  min-height:220px;flex:1;
}
/* Shrink-wraps to the image's own rendered box (not the full stage width),
   so .fy-plb__nav — absolutely positioned within THIS, not the stage — sits
   right on the photo's edges. Without it, a portrait photo left the arrows
   stranded out in the empty letterboxed space beside it. */
.fy-plb__frame{position:relative;display:inline-flex;max-width:100%}
.fy-plb__img{
  max-width:100%;max-height:min(74vh,760px);
  border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.55);
  object-fit:contain;user-select:none;cursor:pointer;
}
.fy-plb__img[hidden]{display:none}
.fy-plb__status{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;
  max-width:min(420px,86vw);text-align:center;
  color:rgba(255,255,255,.9);font-size:14px;font-weight:700;line-height:1.45;
}
.fy-plb__status[hidden]{display:none}
button.fy-plb__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  display:grid;place-items:center;width:48px;height:48px;
  /* Solid, high-contrast disc + its own shadow + a light ring — the old
     rgba(255,255,255,.16) fill nearly vanished against a bright sky or
     white hull, which was the actual complaint. This reads clearly against
     any photo. */
  border:1.5px solid rgba(255,255,255,.55);border-radius:50%;
  background:rgba(17,20,28,.62);color:#fff;
  font-size:30px;line-height:1;cursor:pointer;backdrop-filter:blur(6px);
  box-shadow:0 6px 18px rgba(0,0,0,.4);
  transition:background .15s,transform .15s;
}
button.fy-plb__nav:hover{background:rgba(17,20,28,.82);transform:translateY(-50%) scale(1.06)}
.fy-plb__nav[hidden]{display:none}
.fy-plb__prev{left:10px}
.fy-plb__next{right:10px}
.fy-plb__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fy-plb__count{color:rgba(255,255,255,.82);font-size:12.5px;font-weight:800;letter-spacing:.04em}
/* Two lines, like the card's own button: what it does, then what you get
   on the other side. A single "See <yacht>" read as another photo link
   rather than the step that starts a booking. */
.fy-plb__cta{
  display:inline-flex;flex-direction:column;align-items:center;gap:2px;
  padding:10px 22px;border-radius:999px;text-align:center;line-height:1.25;
  background:linear-gradient(90deg,#C94386,#7C3AED);
  color:#fff!important;text-decoration:none;
  box-shadow:0 10px 24px rgba(124,58,237,.4);
}
.fy-plb__cta-main{font-size:14px;font-weight:900;letter-spacing:-.01em}
.fy-plb__cta-sub{font-size:11.5px;font-weight:700;opacity:.9}
.fy-plb__cta:hover{filter:brightness(1.08)}
.fy-plb__cta[hidden]{display:none}
@media (max-width:600px){
  .fy-plb{padding:10px}
  .fy-plb__img{max-height:64vh}
  button.fy-plb__nav{width:44px;height:44px;font-size:26px}
  .fy-plb__foot{justify-content:center}
  .fy-plb__cta{width:100%;justify-content:center}
}

/* While the photo popup is open, hide the site's Call/SMS/WhatsApp bar —
   it isn't part of this plugin (injected site-wide by another plugin), but
   it's pinned to the same bottom edge on phones as the popup's own
   prev/next arrows and CTA button, so the two would otherwise overlap. */
body.fy-plb-open #fy-mobile-contact-bar{display:none!important}

/* ---- Shortlist ("Saved") ------------------------------------------------ */
/* Card heart: top-right of the photo, opposite the badges (top-left), and
   above .fy-photo-open so tapping it saves instead of opening the gallery. */
/* Solid white disc with a dark heart — same reasoning as the camera pill:
   the old translucent dark fill vanished against dark hulls and evening
   photos. White reads against every photo, and the filled pink state below
   makes "saved" unmistakable at a glance. Slightly larger too: 38px clears
   the 36px minimum comfortable tap target with its border. */
#fy-miami-yacht-rentals-neon .fy-save-toggle{
  position:absolute;top:9px;right:9px;z-index:3;
  display:grid;place-items:center;width:38px;height:38px;padding:0;
  border:2px solid #fff;border-radius:50%;
  background:#C94386;color:#fff;cursor:pointer;
  font-size:19px;line-height:1;
  box-shadow:0 4px 14px rgba(23,32,51,.35);
  transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;
  -webkit-appearance:none;appearance:none;
}
#fy-miami-yacht-rentals-neon .fy-save-toggle:hover{
  background:#526079;color:#fff;transform:scale(1.09);
  box-shadow:0 8px 20px rgba(23,32,51,.5);
}
#fy-miami-yacht-rentals-neon .fy-save-toggle.is-saved{
  background:linear-gradient(135deg,#C94386,#7C3AED);color:#fff;border-color:#fff;
}
#fy-miami-yacht-rentals-neon .fy-save-toggle:focus-visible{outline:3px solid #7C3AED;outline-offset:2px}

/* The Saved filter itself: solid gradient pill (unlike the plain white
   filter buttons), heart + label + a round count badge, so it reads as
   "your list" rather than another way to slice the fleet. */
#fy-miami-yacht-rentals-neon .fy-saved-filter{
  display:inline-flex;align-items:center;gap:8px;
  min-height:40px;padding:8px 16px 8px 14px;
  border:2px solid transparent;border-radius:999px;
  background:linear-gradient(90deg,#C94386,#7C3AED);
  color:#fff;font:inherit;font-size:13px;font-weight:900;
  cursor:pointer;box-shadow:0 8px 20px rgba(124,58,237,.28);
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
  -webkit-appearance:none;appearance:none;
}
#fy-miami-yacht-rentals-neon .fy-saved-filter:hover{
  transform:translateY(-1px);filter:brightness(1.08);
  box-shadow:0 11px 26px rgba(124,58,237,.4);
}
#fy-miami-yacht-rentals-neon .fy-saved-filter__heart{font-size:16px;line-height:1}
#fy-miami-yacht-rentals-neon .fy-saved-count{
  display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;
  border-radius:999px;background:rgba(255,255,255,.28);
  font-size:11.5px;font-weight:900;
}
/* Pressed/active (the fleet is currently filtered to it): white pill with
   the gradient text/border instead of solid fill — the same visual
   language .fy-filter-button uses for its own active state, so "this
   filter is on" still means the same thing here as everywhere else. */
#fy-miami-yacht-rentals-neon .fy-saved-filter.is-active,
#fy-miami-yacht-rentals-neon .fy-saved-filter[aria-pressed="true"]{
  background:#fff;color:#7C3AED;border-color:#C94386;
}
#fy-miami-yacht-rentals-neon .fy-saved-filter.is-active .fy-saved-count,
#fy-miami-yacht-rentals-neon .fy-saved-filter[aria-pressed="true"] .fy-saved-count{
  background:linear-gradient(90deg,#C94386,#7C3AED);color:#fff;
}
#fy-miami-yacht-rentals-neon .fy-saved-filter:focus-visible{outline:3px solid #7C3AED;outline-offset:2px}
#fy-miami-yacht-rentals-neon .fy-saved-filter[hidden]{display:none}
@media (prefers-reduced-motion:reduce){
  #fy-miami-yacht-rentals-neon .fy-save-toggle{transition:none}
  #fy-miami-yacht-rentals-neon .fy-save-toggle:hover{transform:none}
}

/* Popup heart, in the header beside the yacht name. Same button.-prefix
   fix as .fy-plb__nav / .fy-plb__close above. */
button.fy-plb__save{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;
  padding:9px 15px;border:1px solid rgba(255,255,255,.35);border-radius:999px;
  background:rgba(255,255,255,.12);color:#fff;
  font-size:13px;font-weight:800;line-height:1;cursor:pointer;
  transition:background .2s ease;
}
button.fy-plb__save:hover{background:rgba(255,255,255,.26)}
button.fy-plb__save.is-saved{background:#C94386;border-color:#fff}
.fy-plb__save[hidden]{display:none}
@media (max-width:600px){
  button.fy-plb__save{padding:9px 12px}
  .fy-plb__save-text{display:none}
}

/* ---- Saved-yachts popup (fySavedPopupOpen in fleet.js) ------------------
   Reuses the .fy-plb overlay shell (backdrop/panel/head/close) the photo
   lightbox already defines, so this looks like the same family of popup
   rather than a one-off. Own classes only for the list content. */
.fy-svp__panel{width:min(560px,100%);max-height:min(80vh,720px)}
.fy-svp__body{overflow-y:auto;padding-right:2px}
.fy-svp__status{margin:24px 0;text-align:center;color:rgba(255,255,255,.85);font-size:14px;font-weight:700;line-height:1.5}
.fy-svp__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.fy-svp__item{
  display:flex;align-items:center;gap:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:8px;
}
.fy-svp__thumb{flex:0 0 auto;width:76px;height:60px;border-radius:9px;overflow:hidden;display:block;background:rgba(255,255,255,.08)}
.fy-svp__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.fy-svp__info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.fy-svp__title{color:#fff;font-size:14px;font-weight:800;text-decoration:none;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fy-svp__title:hover{text-decoration:underline}
.fy-svp__price{color:#F0ABC9;font-size:12.5px;font-weight:700}
button.fy-svp__remove{
  flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;
  border:1px solid rgba(255,255,255,.25);border-radius:50%;
  background:rgba(255,255,255,.08);color:#fff;font-size:14px;cursor:pointer;
}
button.fy-svp__remove:hover{background:rgba(220,38,38,.75);border-color:transparent}
@media(max-width:600px){
  .fy-svp__thumb{width:64px;height:50px}
}

/* ---- "Your Saved Yachts" (product pages) --------------------------------
   Rendered by FY_Fleet_Woo::output_saved_yachts() and filled in by
   fySavedSectionRender(). Sits OUTSIDE the #fy-miami-yacht-rentals-neon
   scope (it's on the product page, not the fleet grid), so these are
   standalone class selectors. */
.fy-saved-section{
  margin:34px 0;padding:24px;border-radius:20px;
  border:1px solid rgba(124,58,237,.16);
  background:linear-gradient(180deg,#fff,#fffafd);
  box-shadow:0 10px 28px rgba(23,32,51,.07);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
.fy-saved-section[hidden]{display:none}
.fy-saved-section__title{
  margin:0 0 6px;font-size:clamp(19px,2.5vw,25px);font-weight:950;letter-spacing:-.02em;
  background:linear-gradient(90deg,#C94386,#7C3AED,#2563EB);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.fy-saved-section__desc{margin:0 0 16px;color:#526079;font-size:14px;line-height:1.6;max-width:70ch}
.fy-saved-section__grid{
  list-style:none;margin:0 0 16px;padding:0;
  display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
}
.fy-saved-card{
  display:flex;flex-direction:column;
  border:1px solid #E6EAF3;border-radius:15px;background:#fff;overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.fy-saved-card:hover{transform:translateY(-2px);border-color:rgba(201,67,134,.4);box-shadow:0 12px 26px rgba(23,32,51,.12)}
.fy-saved-card__link{display:flex;flex-direction:column;text-decoration:none;color:inherit;flex:1}
.fy-saved-card__media{display:block;aspect-ratio:4/3;overflow:hidden;background:#F3F5F9}
.fy-saved-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.fy-saved-card__body{display:flex;flex-direction:column;gap:3px;padding:11px 13px}
.fy-saved-card__name{
  font-size:14px;font-weight:900;color:#172033;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.fy-saved-card__price{font-size:13px;font-weight:800;color:#C94386}
button.fy-saved-card__remove{
  margin:0;border:0;border-top:1px solid #E6EAF3;
  background:#fff;color:#8A94A6;
  padding:9px;font:inherit;font-size:11.5px;font-weight:800;cursor:pointer;
  transition:background .15s ease,color .15s ease;
}
button.fy-saved-card__remove:hover{background:#FFF1F7;color:#9D2463}
.fy-saved-section__browse{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:999px;text-decoration:none;
  background:#C94386;color:#fff;font-weight:900;font-size:14px;
  box-shadow:0 8px 20px rgba(201,67,134,.28);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.fy-saved-section__browse:hover{background:#526079;color:#fff;transform:translateY(-1px);box-shadow:0 11px 26px rgba(23,32,51,.3)}
.fy-saved-section__browse:focus-visible,
button.fy-saved-card__remove:focus-visible{outline:3px solid #7C3AED;outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  .fy-saved-card,.fy-saved-section__browse,button.fy-saved-card__remove{transition:none}
  .fy-saved-card:hover,.fy-saved-section__browse:hover{transform:none}
}