/* /explore/: a filter bar that stays under the header, and every stay in full-width rows below it. */
:root{--head-h:98px;--head-main:68px;--ex-pad:clamp(16px,3vw,40px)}
@media(max-width:640px){:root{--head-h:92px;--head-main:62px}}
.ex{padding:0 0 12px}
.ex-w{max-width:1640px;margin-inline:auto;padding-inline:var(--ex-pad)}
.ex-top{display:flex;align-items:flex-end;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;padding-top:22px;padding-bottom:16px}
.ex-crumbs{font-size:13px;color:var(--foggy);display:flex;gap:8px;margin-bottom:6px}
.ex-crumbs a:hover{color:var(--rausch-600)}
.ex h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.02em;line-height:1.1}
.ex-sub{color:var(--foggy);font-size:15px;padding-bottom:4px}
.ex-sub b{color:var(--hof)}

/* the bar: sticks under the header, like the filter bar on the homepage */
.ex-bar{position:sticky;top:var(--head-main);z-index:40;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--bebe);border-bottom:1px solid var(--bebe)}
body:not(.rz-scrolled) .ex-bar{top:var(--head-h)}
.ex-bar-in{display:flex;align-items:center;gap:12px;min-height:64px;padding-block:9px}
.ex-qbox{flex:0 0 clamp(190px,18vw,260px);margin:0}
.ex-pillbar{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px}
.ex-pills-row{display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px;min-width:0}
.ex-pills-row::-webkit-scrollbar{display:none}
.ex-fp{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;border:1px solid var(--bebe);border-radius:9999px;padding:10px 15px;font-size:14px;font-weight:600;background:#fff;transition:border-color .15s,background .15s,color .15s}
.ex-fp small{font-size:11px;font-weight:600;opacity:.7;margin-right:6px;letter-spacing:.02em}
.ex-fp:hover{border-color:var(--hof)}
.ex-fp[aria-expanded="true"]{border-color:var(--hof);box-shadow:0 0 0 3px rgba(26,42,56,.07)}
.ex-fp.has{background:var(--hof);border-color:var(--hof);color:#fff}
.ex-chev{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--grey);transition:transform .15s}
.ex-fp.has .ex-chev{color:#c5d0d9}
.ex-fp[aria-expanded="true"] .ex-chev{transform:rotate(180deg)}
.ex-clear{flex:0 0 auto;font-size:13px;font-weight:600;color:var(--rausch-600);text-decoration:underline;padding:6px}
.ex-clear[hidden]{display:none}
.ex-sort{flex:0 0 auto;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--foggy)}
.ex-sort select{font:inherit;font-size:14px;font-weight:600;color:var(--hof);background:#fff;border:1px solid var(--bebe);border-radius:9999px;padding:9px 14px;cursor:pointer}
.ex-sort select:hover{border-color:var(--hof)}

/* the panel under the bar */
.ex-pop{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--bebe);box-shadow:0 18px 30px rgba(26,42,56,.12);max-height:min(540px,calc(100vh - 190px));overflow:auto;padding:18px 0 22px}
.ex-pop[hidden]{display:none}
.ex-ph{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.ex-ph h3{font-size:20px;font-weight:700;letter-spacing:-.02em}
.ex-ph .ex-find{margin:0 0 0 auto;min-width:250px}
.ex-ph .ex-find:only-child,.ex-ph h3+.ex-x{margin-left:auto}
.ex-find~.ex-x{margin-left:0}
.ex-x{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--faint);flex:none}
.ex-x:hover{background:var(--bebe)}
.ex-x svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.ex-find{display:flex;align-items:center;gap:8px;background:var(--faint);border:1px solid var(--bebe);border-radius:9999px;padding:0 14px;height:42px}
.ex-find:focus-within{background:#fff;border-color:var(--hof)}
.ex-find input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:14px;outline:none}
.ex-find svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--foggy);stroke-width:1.8;stroke-linecap:round}
.ex-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 14px;max-height:340px;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--grey) transparent}
.ex-opt{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border-radius:10px;font-size:14px;transition:background .12s}
.ex-opt:hover{background:var(--faint)}
.ex-opt i{flex:0 0 auto;width:17px;height:17px;border:1.5px solid var(--grey);border-radius:50%;display:inline-block;position:relative;transition:border-color .12s,background .12s}
.ex-opt.on i{border-color:var(--rausch);background:var(--rausch)}
.ex-opt.on i::after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.ex-opt.on{font-weight:700;background:var(--coral-wash)}
.ex-opt span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-opt em{font-style:normal;font-size:12px;color:var(--foggy);font-variant-numeric:tabular-nums}
.ex-none{color:var(--foggy);font-size:14px;padding:6px 8px}
.ex-pills{display:flex;flex-wrap:wrap;gap:8px}
.ex-pill{border:1px solid var(--bebe);border-radius:9999px;padding:8px 15px;font-size:14px;font-weight:600;background:#fff;transition:border-color .12s,background .12s,color .12s}
.ex-pill:hover{border-color:var(--hof)}
.ex-pill.on{background:var(--hof);border-color:var(--hof);color:#fff}
.ex-pill small{font-weight:500;color:var(--foggy);margin-left:4px}
.ex-pill.on small{color:#c5d0d9}
.ex-price{display:grid;gap:12px;max-width:520px}
.ex-price-row{display:flex;justify-content:space-between;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.ex-price-row small{display:block;font-size:11px;font-weight:600;color:var(--foggy);letter-spacing:.06em;text-transform:uppercase}
.ex-price input[type=range]{width:100%;accent-color:var(--rausch)}
.ex-scrim{position:fixed;inset:0;background:rgba(26,42,56,.35);z-index:30}
.ex-scrim[hidden]{display:none}

/* results: full width, five across so a set of 15 is always three whole rows */
.ex-res{padding-top:20px}
.ex-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.ex-chips:empty{display:none}
.ex-chip{display:inline-flex;align-items:center;gap:7px;background:var(--coral-wash);border:1px solid #f8b098;border-radius:9999px;padding:6px 8px 6px 14px;font-size:13.5px;font-weight:600}
.ex-chip button{width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--rausch-600)}
.ex-chip button:hover{background:#fff}
.ex-chip svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.ex-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.ex-skel{aspect-ratio:3/4;border-radius:20px;background:linear-gradient(100deg,#efe8df 30%,#f8f4ee 50%,#efe8df 70%);background-size:200% 100%;animation:exsk 1.3s infinite}
@keyframes exsk{to{background-position:-200% 0}}
.ex-empty{grid-column:1/-1;text-align:center;padding:64px 20px;background:#fff;border:1px dashed #e4d9cc;border-radius:20px}
.ex-empty h2{font-family:'Playfair Display',Georgia,serif;font-size:26px;margin-bottom:8px}
.ex-empty p{color:var(--foggy);margin-bottom:18px}
.ex-btn{display:inline-flex;align-items:center;gap:8px;background:var(--rausch);color:#fff;border-radius:9999px;padding:12px 24px;font-weight:700}
.ex-btn:hover{background:var(--rausch-600)}

/* show more */
.ex-more{display:flex;flex-direction:column;align-items:center;gap:10px;padding:34px 0 10px}
.ex-more p{color:var(--foggy);font-size:14px}
.ex-more p b{color:var(--hof)}
.ex-bar-prog{width:min(260px,70%);height:4px;background:var(--bebe);border-radius:4px;overflow:hidden}
.ex-bar-prog i{display:block;height:100%;background:var(--rausch);border-radius:4px}
.ex-showmore{background:#fff;border:1px solid var(--hof);border-radius:9999px;padding:14px 38px;font-weight:700;font-size:15px;margin-top:6px;transition:background .15s,color .15s}
.ex-showmore:hover{background:var(--hof);color:#fff}
.ex-showmore:disabled{opacity:.6;cursor:progress}

@media(max-width:1180px){.ex-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
@media(max-width:1000px){
  .ex-bar-in{flex-wrap:wrap;gap:8px;padding-block:8px;min-height:0}
  .ex-qbox{flex:1 1 0;min-width:0}
  .ex-sort{order:2}.ex-sort span{display:none}
  .ex-pillbar{order:3;flex:1 1 100%}
  /* panels become a sheet from the bottom */
  .ex-pop{position:fixed;left:0;right:0;top:auto;bottom:0;max-height:82vh;border-radius:22px 22px 0 0;border:0;padding:18px 0 calc(22px + env(safe-area-inset-bottom));z-index:90;box-shadow:0 -12px 40px rgba(26,42,56,.25)}
  .ex-scrim{z-index:85;background:rgba(26,42,56,.45)}
  .ex-ph .ex-find{min-width:0;flex:1 1 100%;order:3;margin:0}
  .ex-ph h3{margin-right:auto}
  .ex-list{grid-template-columns:1fr}
}
@media(max-width:700px){.ex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
@media(max-width:340px){.ex-grid{grid-template-columns:1fr}}

/* crawlable intro and links under the results */
.ex-about{margin-top:56px;margin-bottom:24px}
.ex-about{padding:0 var(--ex-pad)}
.ex-about h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(22px,2.4vw,30px);font-weight:600;letter-spacing:-.015em;margin-bottom:12px}
.ex-about>p{max-width:60em;color:#5f5148;line-height:1.7;margin-bottom:22px}
.ex-about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px 32px}
.ex-about h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--foggy);margin-bottom:10px}
.ex-about ul{list-style:none;display:grid;gap:7px;font-size:14.5px}
.ex-about a{color:var(--hof)}
.ex-about a:hover{color:var(--rausch-600);text-decoration:underline}

/* phones: the filters are one tight block with no sideways scrolling, and a sheet has a single scroll area */
@media(max-width:700px){
  .ex-bar{position:static!important}
  .ex-bar-in{gap:6px;padding-block:6px}
  .ex-qbox{height:36px}.ex-qbox input{font-size:13px}
  .ex-sort select{font-size:12.5px;padding:7px 10px}
  .ex-pillbar{display:block}
  .ex-pills-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;overflow:visible;padding:0}
  .ex-fp{min-width:0;justify-content:center;padding:7px 3px;font-size:11.5px;gap:3px;border-radius:10px;overflow:hidden;text-overflow:ellipsis}
  .ex-fp small,.ex-fp .ex-chev{display:none}
  .ex-clear{grid-column:1/-1;text-align:right;padding:0 4px;font-size:12px}
  .ex-pop{max-height:74vh;overflow:auto;padding-top:14px}
  .ex-list{grid-template-columns:1fr 1fr;max-height:none;overflow:visible;gap:0 8px}
  .ex-opt{padding:7px 8px;font-size:13px;gap:8px}
  .ex-opt em{font-size:11px}
  .ex-ph{margin-bottom:8px}.ex-ph h3{font-size:17px}
  .ex-pills{gap:6px}.ex-pill{padding:6px 12px;font-size:13px}
}