/* ════════════════════════════════════════════════════════════════
   HALA preview wall (paywall) — presentation-layer gate.
   Non-members see the first N listings (incl. ≥1 Sofia's Pick when one
   exists); everything past the cut is BLURRED + non-interactive, with a
   join CTA. Nothing is removed from the DOM — the full catalog stays in
   the rendered source so Google still indexes it (the source-readable
   "leak" IS the paywall-SEO tradeoff). Members see everything, ungated.
   Pairs with paywall.js. Uses the house tokens from italyeat.css.
   ════════════════════════════════════════════════════════════════ */

/* a locked listing: blurred, dimmed, inert */
.hp-locked{
  position:relative;
  filter:blur(7px) saturate(.85);
  opacity:.55;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  transition:filter .3s ease,opacity .3s ease;
}
.hp-locked *{pointer-events:none!important}
/* hide the save ribbon on locked cards so non-members can't save walled items */
.hp-locked .hw-ribbon{display:none!important}

/* hard wall: the gated scope is hidden entirely (a join panel replaces it) */
.hp-hidden{display:none!important}

/* scroll wall (guides): the rest of the page is wrapped + clipped to a
   teaser sliver and faded out. Content stays in the DOM (clipped, not
   removed) so Google still indexes it — only humans hit the wall. */
.hp-gated.hp-clip{max-height:360px;overflow:hidden;position:relative;pointer-events:none;
  /* the real listings, blurred + faded — there, but out of reach (the "so close" hook) */
  filter:blur(6px) saturate(.9);
  -webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 94%);mask-image:linear-gradient(180deg,#000 30%,transparent 94%)}
.hp-gated.hp-clip *{pointer-events:none!important}
.hp-wallcard{max-width:560px;margin:clamp(-96px,-7vw,-52px) auto clamp(40px,7vw,84px);
  position:relative;z-index:2;             /* float over the fading listings behind it */
  border:1px solid var(--ie-terra,#B25238);border-radius:5px;background:var(--ie-paper,#F4EFE6);
  padding:clamp(28px,4.5vw,44px) clamp(22px,4vw,40px);text-align:left;box-shadow:0 14px 44px rgba(31,26,20,.12);
  animation:hp-rise .6s cubic-bezier(.2,.65,.3,1) both}
.hp-wallcard .hp-cta-k{font-family:var(--ie-fu,'IBM Plex Mono',monospace);font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ie-terra,#B25238);display:block;margin-bottom:12px}
.hp-wallcard h3{font-family:var(--ie-fd,'Fraunces',serif);font-weight:400;font-size:clamp(24px,3.2vw,36px);line-height:1.04;color:var(--ie-espresso,#1A1814);margin:0 0 12px}
.hp-wallcard p{font-family:var(--ie-fb,'Schibsted Grotesk',sans-serif);font-size:15px;line-height:1.6;color:var(--ie-ink-60,rgba(31,26,20,.62));max-width:48ch;margin:0 0 22px}
.hp-wallcard p em{font-family:var(--ie-fd,'Fraunces',serif);font-style:italic;color:var(--ie-espresso,#1A1814)}
.hp-wallcard .hp-cta-btns{display:flex;gap:12px;justify-content:flex-start;flex-wrap:wrap}
@keyframes hp-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* the join CTA — inserted right after the last free listing */
.hp-cta{
  position:relative;
  border:1px solid var(--ie-terra,#B25238);
  border-radius:4px;
  background:var(--ie-paper,#F5E9D5);
  padding:clamp(26px,4vw,40px) clamp(22px,4vw,40px);
  margin:8px 0 22px;
  text-align:center;
  box-shadow:0 10px 34px rgba(31,26,20,.10);
}
/* span the full width of grid / masonry / column layouts */
.ie-grid .hp-cta,.xi-grid .hp-cta{grid-column:1/-1}
.hp-cta-k{font-family:var(--ie-fu,'IBM Plex Mono',monospace);font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ie-terra,#B25238);display:block;margin-bottom:12px}
.hp-cta h3{font-family:var(--ie-fd,'Fraunces',serif);font-weight:400;font-size:clamp(24px,3vw,36px);line-height:1.05;color:var(--ie-espresso,#3F2A1A);margin:0 0 12px;max-width:22ch;margin-left:auto;margin-right:auto}
.hp-cta p{font-family:var(--ie-fb,'Schibsted Grotesk',sans-serif);font-size:15px;line-height:1.6;color:var(--ie-ink-60,rgba(31,26,20,.62));max-width:48ch;margin:0 auto 20px}
.hp-cta p em{font-family:var(--ie-fd,'Fraunces',serif);font-style:italic;color:var(--ie-espresso,#3F2A1A)}
.hp-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hp-cta-join{font-family:var(--ie-fb,sans-serif);font-size:14px;padding:13px 28px;border-radius:2px;text-decoration:none;border:1px solid var(--ie-terra,#B25238);background:var(--ie-terra,#B25238);color:var(--ie-paper,#F5E9D5);cursor:pointer;transition:background .25s ease,border-color .25s ease,transform .2s ease}
.hp-cta-join:hover{background:var(--ie-terra-deep,#8E3F2A);border-color:var(--ie-terra-deep,#8E3F2A);transform:translateY(-1px)}
.hp-cta-signin{font-family:var(--ie-fb,sans-serif);font-size:14px;padding:13px 24px;border-radius:2px;text-decoration:none;border:1px solid rgba(31,26,20,.2);background:transparent;color:var(--ie-espresso,#3F2A1A);cursor:pointer;transition:border-color .25s ease,color .25s ease}
.hp-cta-signin:hover{border-color:var(--ie-terra,#B25238);color:var(--ie-terra,#B25238)}
.hp-cta-trust{font-family:var(--ie-fu,monospace);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ie-ink-38,rgba(31,26,20,.4));margin-top:14px}

@media(prefers-reduced-motion:reduce){.hp-locked{transition:none}.hp-wallcard{animation:none}.hp-cta-join,.hp-cta-signin{transition:none}.hp-cta-join:hover{transform:none}}