:root{
  --bg:#f6f7fb;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --line:rgba(15,23,42,.10);
  --brand:#0b3d91;
  --brand2:#0ea5e9;
  --radius:18px;
  --shadow:0 14px 40px rgba(2,6,23,.10);
  --shadow2:0 10px 25px rgba(2,6,23,.08);
}
html,body{height:100%;}
body{
  font-family:"Manrope",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(1200px 600px at 30% -10%, rgba(14,165,233,.14), transparent 55%),
    radial-gradient(1000px 540px at 80% 0%, rgba(11,61,145,.18), transparent 60%),
    var(--bg);
  color:var(--text);
}
a{color:var(--brand);text-decoration:none;}
a:hover{color:#082f6a}
.navbar{
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.72) !important;
  border-bottom:1px solid var(--line);
}
.brand-logo{width:34px;height:34px;border-radius:12px;box-shadow:var(--shadow2);}
.card-premium{
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow2);
  background: rgba(255,255,255,.90);
}
.hero{
  border-radius: calc(var(--radius) + 8px);
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72)),
    radial-gradient(900px 420px at 20% 0%, rgba(14,165,233,.18), transparent 55%),
    radial-gradient(820px 420px at 80% 0%, rgba(11,61,145,.18), transparent 55%);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.badge-soft{
  background: rgba(11,61,145,.10);
  border:1px solid rgba(11,61,145,.18);
  color:#082f6a;
}
.badge-instant{
  background: rgba(22,163,74,.12);
  border:1px solid rgba(22,163,74,.20);
  color:#166534;
}
.btn{border-radius:999px;font-weight:650;letter-spacing:.2px;}
.btn-primary{
  background: linear-gradient(135deg, var(--brand), #072a5f);
  border:none;
  box-shadow:0 10px 20px rgba(11,61,145,.22);
}
.btn-outline-primary{border-color:rgba(11,61,145,.35);color:#082f6a;}
.btn-outline-primary:hover{background:rgba(11,61,145,.08);}
.btn-success{
  background: linear-gradient(135deg, #16a34a, #15803d);
  border:none;
  box-shadow:0 10px 20px rgba(22,163,74,.18);
}
.form-control,.form-select{
  border-radius:14px;
  border-color: rgba(15,23,42,.12);
  background: rgba(255,255,255,.95);
}
.form-control:focus,.form-select:focus{
  border-color: rgba(14,165,233,.55);
  box-shadow:0 0 0 .25rem rgba(14,165,233,.15);
}
.pill{
  border-radius:999px;border:1px solid var(--line);
  padding:6px 10px;background:rgba(255,255,255,.78);
  color:var(--muted);font-size:.85rem;
}
.pills{display:flex;gap:8px;flex-wrap:wrap;}
.small-muted{color:var(--muted);font-size:.92rem;}

.yacht-card{position:relative;}
.yacht-card .cover{position:relative;overflow:hidden;}
.yacht-card .cover img{display:block;width:100%;height:220px;object-fit:cover;}
.yacht-card .cover:after{
  content:"";position:absolute;inset:0;
  background: linear-gradient(180deg, transparent 55%, rgba(2,6,23,.42));
  pointer-events:none;
}
.yacht-card .meta{
  position:absolute;left:14px;right:14px;bottom:12px;
  color:#fff;text-shadow:0 10px 30px rgba(0,0,0,.35);
  pointer-events:none;
}
.yacht-card .stretched-link{z-index:1;}
.yacht-card .actions{position:relative;z-index:2;}

.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:1030;
  background:rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  border-top:1px solid var(--line);
}
@media(min-width:992px){.sticky-cta{display:none;}}


/* =========================
   v1.1 Search premium cards
   ========================= */

.search-grid{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}
.search-card{ grid-column: span 12; }
@media (min-width: 768px){ .search-card{ grid-column: span 6; } }
@media (min-width: 992px){ .search-card{ grid-column: span 4; } }

.yacht-card{
  overflow:hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.yacht-card:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow);
  border-color: rgba(15,23,42,.14);
}

.yacht-card .cover{ border-bottom: 1px solid var(--line); }
.yacht-card .cover img{ height: 230px; object-fit: cover; }
.yacht-card .cover:after{
  background: linear-gradient(180deg, rgba(2,6,23,.06), rgba(2,6,23,.20));
}

.yacht-card .top-badges{
  position:absolute;
  top: 12px;
  left: 12px;
  right: 12px;
  display:flex;
  justify-content:space-between;
  gap: 8px;
  z-index: 3;
  pointer-events:none;
}
.yacht-card .top-badges .left,
.yacht-card .top-badges .right{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.badge-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .2px;
  font-size: .82rem;
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 20px rgba(2,6,23,.10);
  border: 1px solid rgba(255,255,255,.42);
  background: rgba(255,255,255,.72);
  color: #0f172a;
}
.badge-chip--instant{
  background: rgba(22,163,74,.14);
  border-color: rgba(22,163,74,.22);
  color: #166534;
}
.badge-chip--new{
  background: rgba(14,165,233,.16);
  border-color: rgba(14,165,233,.26);
  color: #075985;
}
.badge-chip--popular{
  background: rgba(11,61,145,.14);
  border-color: rgba(11,61,145,.22);
  color: #0b3d91;
}
.badge-chip--best{
  background: rgba(245,158,11,.16);
  border-color: rgba(245,158,11,.26);
  color: #92400e;
}

.yacht-card .body{ padding: 14px 14px 16px; }
.yacht-title{
  font-size: 1.07rem;
  line-height: 1.15;
  letter-spacing: -.2px;
  margin: 0;
  font-weight: 900;
  color: var(--text);
}
.yacht-sub{
  margin-top: 6px;
  color: var(--muted);
  font-size: .92rem;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.yacht-sub .dot{
  width:4px;height:4px;border-radius:999px;background:rgba(100,116,139,.55);
  display:inline-block;
}
.price-box{ text-align:right; min-width: 120px; }
.price-box .price{
  font-size: 1.05rem;
  font-weight: 950;
  letter-spacing: -.2px;
  color: var(--text);
}
.price-box .hint{ font-size: .82rem; color: var(--muted); }

.yacht-desc{
  margin-top: 10px;
  color: var(--muted);
  font-size: .93rem;
  line-height: 1.35;
  min-height: 44px;
}

.yacht-actions{
  margin-top: 12px;
  display:flex;
  gap:10px;
}
.yacht-actions .btn{ padding-top: 10px; padding-bottom: 10px; }

@media (max-width: 420px){
  .yacht-actions{ flex-direction: column; }
  .yacht-actions .btn{ width:100% !important; }
}

/* Panel filtros premium */
.filters-panel{
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 2px);
  box-shadow: var(--shadow2);
  background: rgba(255,255,255,.90);
}
