/* Discovery (search + categories) – cohesive with frontpage theme */

:root{
  --brand-500:#06b6d4; --brand-600:#0284c7; --brand-700:#0369a1;
  --ink-900:#0f172a; --ink-700:#334155; --ink-500:#64748b; --ink-200:#e5e7eb; --ink-100:#f3f4f6;
}

.section-discovery .discover-shell{
  background:#fff; border:1px solid rgba(148,163,184,.26);
  border-radius:22px; box-shadow:0 24px 60px rgba(15,23,42,.08);
  padding:16px 16px 20px;
}

.discover-bar{ display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.search-wrap{
  position:relative; display:flex; align-items:center;
  background:#f8fafc; border:1px solid var(--ink-200); border-radius:14px; padding:8px 10px;
}
.search-wrap .icon-search{ width:18px; height:18px; color:#94a3b8; margin-right:8px; }
.search-wrap input{
  width:100%; border:0; background:transparent; outline:none; font-size:14px; color:var(--ink-900);
}

.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{
  border:1px solid var(--ink-200); background:#fff; color:var(--ink-700);
  font-weight:700; font-size:12px; padding:7px 10px; border-radius:999px; cursor:pointer;
}
.chip:hover{ background:var(--ink-100); }
.chip.active{ background:linear-gradient(135deg,var(--brand-500),var(--brand-700)); color:#fff; border-color:transparent; }

.discover-grid{ display:grid; grid-template-columns: 280px minmax(0,1fr); gap:16px; }
.discover-side{ display:flex; flex-direction:column; gap:12px; }
.side-card{
  background:#fff; border:1px solid var(--ink-200); border-radius:16px; box-shadow:0 16px 40px rgba(15,23,42,.06);
}
.side-card .side-title{ margin:0; padding:12px 14px; font-size:14px; font-weight:800; color:var(--ink-900); border-bottom:1px solid var(--ink-200); }
.cat-list{ list-style:none; margin:0; padding:10px; display:flex; flex-direction:column; gap:6px; }
.cat-link{
  width:100%; text-align:left; background:#fff; border:1px solid var(--ink-200); color:var(--ink-700);
  padding:9px 10px; border-radius:10px; font-weight:700; font-size:13px; cursor:pointer; display:flex; align-items:center; gap:8px;
}
.cat-link:hover{ background:var(--ink-100); color:var(--ink-900); }
.cat-dot{ width:7px; height:7px; border-radius:999px; background:linear-gradient(135deg,var(--brand-500),var(--brand-700)); }

.filter-row{ display:flex; flex-direction:column; gap:8px; padding:10px 12px 14px; color:var(--ink-700); font-size:13px; }
.filter-row label{ display:flex; align-items:center; gap:8px; }

.results-grid{
  display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:16px;
}
.results-empty{ border:1px dashed var(--ink-200); border-radius:12px; padding:16px; text-align:center; color:var(--ink-700); }

.card-coach{
  position:relative; overflow:hidden;
  background:#fff; border:1px solid var(--ink-200); border-radius:16px; box-shadow:0 18px 46px rgba(15,23,42,.06);
}
.card-coach .cover{
  height:84px; background:
    radial-gradient(90px 50px at 20% 30%, rgba(6,182,212,.25), transparent 60%),
    radial-gradient(120px 70px at 80% 70%, rgba(3,105,161,.25), transparent 60%),
    linear-gradient(135deg, rgba(2,132,199,.15), rgba(3,105,161,.15));
}
.card-coach .inner{ padding:12px 14px 14px; display:grid; grid-template-columns: 44px 1fr; gap:10px; }
.card-coach .avatar{
  width:44px; height:44px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; font-weight:800; color:#fff;
  background:linear-gradient(135deg,var(--brand-500),var(--brand-700)); box-shadow:0 8px 22px rgba(3,105,161,.35);
  margin-top:-22px; border:2px solid #fff;
}
.card-coach .name{ margin:0; font-size:15px; font-weight:800; color:var(--ink-900); }
.card-coach .meta{ margin:2px 0 6px; color:var(--ink-500); font-size:12px; }
.card-coach .tags{ display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 10px; }
.card-coach .tag{
  font-size:11px; font-weight:700; color:#0b1220; background:#f1f5f9; border:1px solid var(--ink-200);
  padding:4px 8px; border-radius:999px;
}
.card-coach .actions{ display:flex; gap:8px; }
.card-coach .btn-mini{
  display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border-radius:10px;
  border:1px solid var(--ink-200); background:#fff; color:var(--ink-900); text-decoration:none; font-size:12px; font-weight:700;
}
.card-coach .btn-mini:hover{ background:var(--ink-100); }
.card-coach .btn-cta{
  border-color:transparent; background:linear-gradient(135deg,var(--brand-500),var(--brand-700)); color:#fff;
  box-shadow:0 10px 26px rgba(3,105,161,.28);
}

/* Responsive */
@media (max-width: 1024px){
  .discover-grid{ grid-template-columns: 1fr; }
  .results-grid{ grid-template-columns: 1fr; }
}

/* --- Discovery (Search) section alignment fix ---------------------- */

/* Use one radius + one canvas so the two rounded shapes line up */
.section-search{
  --panel-radius: 26px;
}

/* Make the section canvas match the inner panel exactly */
.section-search::before{
  border-radius: var(--panel-radius);
  /* keep your existing gradients from earlier; this line only syncs radii */
}

/* Remove any stray backgrounds from the search partial’s outer container */
.section-search .discovery-wrap{
  position: relative;
  padding: 0px;            /* tiny breathing room between canvas and panel */
  background: transparent;  /* important: let the section canvas be the only bg */
}

/* The actual glass card that holds the search UI */
.section-search .discovery-panel{
  border-radius: var(--panel-radius);
  background: linear-gradient(140deg, rgba(255,255,255,.22), rgba(255,255,255,.10));
  border: 1px solid rgba(148,163,184,.55);
  box-shadow:
    0 30px 80px rgba(15,23,42,.20),
    inset 0 1px 0 rgba(255,255,255,.45);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  padding: 18px;            /* inner spacing for the content */
  margin: 0 auto;           /* center it */
}

/* If your partial sets its own background on a top block, neutralize it */
.section-search .discovery-panel [class*="surface"],
.section-search .discovery-panel [class*="card"]{
  background: transparent !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

/* Optional: align the white input “pill” to the glass panel edges */
.section-search .search-input,
.section-search .search-input *{
  border-radius: calc(var(--panel-radius) - 10px);
}

/* Tighten the section’s vertical rhythm so the two shapes look centered */
.section-search.section-block{
  padding-top: 28px;
  padding-bottom: 32px;
}